Brain Potential: Brain vs Artificial Intelligence

An interactive educational game that explores the differences and similarities between human intelligence (the brain) and artificial intelligence (Large Language Models).

Live Demo: https://brain-potential.vercel.app

About

Players test their knowledge through a drag-and-drop quiz format where they categorize statements as either "Brain" or "AI" properties. The game includes 32 challenges covering facts about neural networks, LLM parameters, learning methods, and real-world use cases.

Features

• Drag-and-Drop Gameplay - Drag challenge cards to either the Brain or LLM drop zone
• Three Difficulty Levels - Easy (6 questions), Medium (10 questions), Hard (32 questions)
• Category Filters - Play with all challenges, facts only, or use cases only
• Hint System - One hint per game reveals the category type
• Educational Feedback - Learn the correct answer with explanations after each question
• Score Summary - View your final score with performance-based feedback

Tech Stack

• React 19
• TypeScript
• Vite
• Tailwind CSS

Getting Started

Prerequisites: Node.js

1. Install dependencies:

   npm install

2. Set your Gemini API key in .env.local:

   GEMINI_API_KEY=your_api_key_here
   

3. Run the development server:

   npm run dev

Project Structure

├── App.tsx                 # Main app component with game state
├── constants.ts            # 32 challenge questions with metadata
├── types.ts                # TypeScript type definitions
├── components/
│   ├── WelcomeScreen.tsx   # Difficulty and category selection
│   ├── GameScreen.tsx      # Main game UI
│   ├── ChallengeCard.tsx   # Draggable challenge cards
│   ├── DropZone.tsx        # Brain/LLM drop targets
│   ├── FeedbackModal.tsx   # Answer feedback popup
│   ├── SummaryScreen.tsx   # Final score display
│   └── Icons.tsx           # SVG icons

License

Copyright aibyml.com