ivanmuller / movie-guess-game

🎬 A game to guess the movie title from real scene shots

📽 Movie Guess Game

A game to guess movies from different shot scenes, with score, countdown time and lifes.

This is a work in progress...

Project URL

▶ How to play

• Once the movie is being shown, you have 20 seconds to write the right answer.
• An autossugest field will help you.
• Your score is based on the time left, so the fast you are, the points you earn.
• At half time, you will get a new picture of the same movie.
• You have 3 lifes to accumulate points.
• TIP 1: just use your keyboard. Auto-focus will help you to be faster.

🧱 How it works

• Thanks to TMDB, I generate a set of movies and save them in a database. This is our Set to Play.
• The Set is basically a group of 500 movies from 1980 to 2022, sorted by vote average. This will be updated every week automatically.
• From that Set, the app is picking a random movie and showing two backdrops of it.

Ideas of new features to add

• Modal styles improvements
• Game Over with stats and optional saving of name
• Share results
• Leaderboard
• More Sets with different difficulty level
• A TV Series version

Stack

• Framework: Next.js
• Main Language: Typescript
• Database: PlanetScale
• ORM: Prisma
• Styling: Chakra-UI
• State Management: Zustand
• Automation: GitHub Actions
• Deployment: Vercel

Run it locally

1. Clone or download the main folder structure.
2. Run npm install.
3. Configure Prisma with Planetscale.
4. Run npm run dev.
5. Run /api/generateIds