Duration: 21:18

394 views

13

Download the full code for free: https://ko-fi.com/s/abe25c5e70
Give the game a try 👉 https://meteor-dash.vercel.app/
Github repo: https://github.com/KoushikJit/meteor-dash.git

Welcome back to our series on building a gesture-controlled game using Google’s MediaPipe.js library on Next.js! 🎮🖐️ In this third video, we introduce obstacles to our game by creating infinite falling meteors or boulders that players need to avoid.

Previous episode here 👉 https://youtu.be/Vg9NWFK_ee4?si=5RgLnfk3KSkgGRcc
Here is the link to the complete tutorial 👉 https://www.youtube.com/playlist?list=PLhiuRfXhpqSbEApUrmq04ATAuwlxdWwSl

This guide will help you make a cool computer vision project on Next.js that will make you stand out as you learn to create AI apps.

Don’t forget to like, and subscribe to stay updated with the latest videos in this series. Hit the bell icon 🔔 to get notified whenever a new episode drops!

Find other cool Next.js + AI projects here 👉 https://youtube.com/playlist?list=PLhiuRfXhpqSbwM0rCuv7-mrCUSiIVyzAz&si=RinnIxuHdvQLnpzD

Episode 3: Creating Infinite Falling Obstacles
In this episode, we’ll cover:
1. Make the Meteors/Boulders: Create obstacles using Next.js components and style them to look like meteors or boulders.
2. Random Spawning: Have the obstacles appear randomly on the screen.
3. Falling Animation: Add logic to make the obstacles fall from the top of the screen continuously.
4. Gesture Control: Use MediaPipe.js to start and stop the falling obstacles when hands are detected on or off the screen.

Connect with Me:
- [LinkedIn](https://www.linkedin.com/in/koushik-sarkar-iimc/)
- [GitHub](https://github.com/KoushikJit)

Enjoy the video, and happy coding! 🎉