Recreating Super Mario Bros. with Flutter & Flame | Step-by-Step Tutorial | Part One 🍄 🎮 🔥

Flame is a 2D game engine built on top of Flutter, and today, I will be demonstrating how to remake one of the most memorable video games to ever bless a console, Super Mario Bros for the NES.

The focus for this tutorial will be about creating maps in Tiled.io, the small Mario player, the Goomba enemy, the Brick Block, The Mystery Block, and the pause feature.

Let me know in the comments what you think about making games with Flutter and Flame.

CHAPTERS
0:00 - Intro
1:19 - Shout Outs
2:01 - Game Premise
3:15 - Setup
7:12 - Create Map in Tiled.io
9:58 - Import Map in Flutter
12:17 - Use CameraComponent for Viewing Map
15:55 - Create Level Component
20:34 - Add Platforms in Tiled.io
21:54 - Add Platforms in Flutter
26:52 - Add Mario in Tiled.io
28:00 - Add Mario in Flutter
34:42 - Add Gravity and Collisions to Mario
46:16 - Add Movement to Mario
55:49 - Add Jump Ability to Mario
59:47 - Update Mario's Animation
1:03:01 - Add Goomba in Tiled.io
1:02:43 - Add Goomba in Flutter
1:06:22 - Add Movement to Goomba
1:09:01 - Apply Collision Detection to Goomba
1:11:49 - Create Game Block Class
1:18:06 - Add Blocks in Tiled.io
1:20:28 - Add Mystery Block in Flutter
1:23:22 - Add Brick Block in Flutter
1:25:59 - Add Pause Feature
1:28:09 - Outro

View Source Code For This Project Here : 👇
https://github.com/trey-a-hope/SuperM...

Download the Flame Package Here : 👇
https://pub.dev/packages/flame

Download the Flame Audio Package Here : 👇
https://pub.dev/packages/flame_audio

Download the Flame Tiled Package Here : 👇
https://pub.dev/packages/flame_tiled

Follow DevKage YouTube Channel Here : 👇
   / @devkage  

Learn More About the Flame Engine Here : 👇
https://flame-engine.org/

Download the Tile Editor - Tiled.io Here : 👇
https://www.mapeditor.org/

View Apps That I Have Developed In Flutter Here : 👇
Android:
https://play.google.com/store/apps/de...

Apple:
https://apps.apple.com/us/developer/t...

Connect With Me:

Linkedin:
  / trey-hope.  .

GitHub:
https://github.com/trey-a-hope

➡️ ➡️ SUBSCRIBE:

Thank you for watching!

#treycodes
#flutter
#flame
#gamedevelopment
#mario