AI Trainer — Supervised Learning & Data Quality

🧠 Overview

AI Trainer puts you in the role of a data labeler training a neural network from scratch. You draw bounding boxes around objects, type labels, and watch as the AI learns—or fails—based on the quality of your data. This game illustrates the fundamental principle of machine learning: garbage in, garbage out.

🎮 How to Play

📋 The Workflow

1. Draw a bounding box around the main object in each image
2. Type the correct label (e.g., "cat", "dog", "chair")
3. Submit — your label trains the neural network
4. Watch the AI's confidence evolve in real-time
5. Test phase — the AI predicts on unseen images

🎯 Goal

Achieve 90%+ test accuracy to win each level. Poor labeling leads to an unreliable AI.

🏷️ Labeling Mechanics

Correct Label ✅

• Boosts AI confidence for that category (+15%)
• Green flash feedback
• AI becomes more reliable

Wrong Label ❌

• Boosts confidence for the wrong category (+12%)
• Decreases confidence for the correct category (-8%)
• Adds to the mislabel log (fixable later)
• Red flash feedback
• AI becomes less reliable

🔧 Correction System

🔍 Mislabels Are Costly to Fix

• After training, you can review mislabeled images
• Each correction costs double (requires two confirmations)
• Fixing mistakes is harder than getting it right the first time

Why This Matters

This mechanic illustrates a core ML concept:

Fixing bad data is more expensive than producing high-quality data from the start.

🧬 Neural Network Visualization

Real-time Feedback

• Input layer (left) → receives image features
• Hidden layer (middle) → processes patterns
• Output layer (right) → shows category predictions
• Node glow → indicates confidence levels
• Connection thickness → represents learned weights

Confidence Bars

• Each category shows a percentage
• AI's prediction is the category with highest confidence
• Color coding: Green (high), Yellow (medium), Gray (low)

📊 Levels

Level	Categories	Training Images	Test Images	Challenge
1	Cat, Dog, Chair	8	2	Basic labeling
2	Cat, Dog, Chair, Bird, Car	10	3	More categories, blurry images
3	Cat, Dog, Chair, Bird, Car	10	4	Adversarial images (occluders, similar distractors, size manipulation)

🎯 Difficulty Mechanics

Level 2: Blurry Images

• Images have a blur filter applied
• Makes labeling harder—requires more careful attention

Level 3: Adversarial Examples

• Similar-looking distractors placed near the main object
• Occluders partially block the object
• Main object size reduced
• Color/hue shifts to confuse pattern recognition

💡 Strategies

Beginner Tips

1. Label carefully — one mistake costs more than one right answer
2. Watch the confidence bars — see how your labels affect the AI
3. Use the correction system only when necessary
4. Pay attention to categories — don't confuse similar objects

Advanced Tactics

1. Consistency matters — label similar objects with identical terms
2. Clear bounding boxes — include the entire object, not parts
3. Fix mislabels if you want to pass Level 3
4. Quality over quantity — accurate labels beat many labels

🔍 Educational Themes

"Garbage In, Garbage Out"

The game illustrates:

• Data quality is more important than data quantity
• Labeling errors compound—the AI learns wrong patterns
• Bias can be introduced through inconsistent labeling
• Correcting errors is harder than preventing them

Discussion Questions

1. Why does data quality matter?
2. How does bias enter AI systems?
3. What is inter-rater reliability?
4. Why is fixing mistakes harder than getting it right?

✨ Features

• Real-time neural network visualization — see learning happen
• Bounding box drawing — interactive labeling
• 3 difficulty levels with increasing complexity
• Mislabel correction system with double-cost mechanic
• Test phase — evaluate AI on unseen data
• Confidence tracking — real-time feedback on AI learning
• Adversarial examples — Level 3 includes tricky cases
• Teacher toolbox — discussion prompts and activity ideas
• Visual feedback — green/red flashes, confidence bars, glow effects
• Responsive design — works on desktop and tablet

🎮 Controls

Action	Input
Draw bounding box	Click and drag on image
Type label	Text input field
Submit label	Click Submit or press Enter
Clear box	Click Clear Box or press Esc
Fix mislabels	Click Fix Mistakes (after testing)
Confirm correction	Submit twice (double-cost)

🏆 Win Conditions

Level 1

• Test accuracy ≥ 90% to advance to Level 2
• Accuracy < 70% → Game Over (with option to fix mislabels)

Level 2

• Test accuracy ≥ 90% to advance to Level 3
• Accuracy < 70% → Game Over

Level 3

• Test accuracy ≥ 90% → Complete the game! 🏆
• Accuracy < 70% → Game Over

📚 Teacher Toolbox

💬 Discussion Questions

• "Garbage in, garbage out" — Why does data quality matter?
• Bias in AI — What happens when training data doesn't represent reality?
• Inter-rater reliability — Why does consistency between labelers matter?

📋 Classroom Activity

Have students label the same set of images independently, then compare their labels. Discuss:

• Where did they disagree?
• Why did disagreements happen?
• How would these disagreements affect an AI trained on their labels?

🔑 Core Lesson

Data quality is the foundation of AI. A model trained on inaccurate data will be inaccurate — and fixing bad data is harder than getting it right the first time.

🔧 Technical Details

• Pure HTML/CSS/JavaScript — No dependencies
• Canvas rendering — Neural network visualization
• Real-time confidence tracking
• Responsive design — Works on all screen sizes
• Touch support — Draw boxes on tablets

🏫 Educational Value

Machine Learning Concepts

• Supervised learning — Labeled training data
• Neural networks — Input → Hidden → Output layers
• Confidence scores — AI uncertainty
• Data quality — Garbage in, garbage out
• Bias — From inconsistent labeling
• Adversarial examples — Data that confuses AI

Critical Thinking Skills

• Attention to detail — Careful labeling
• Consistency — Using same terms for same objects
• Consequence awareness — Understanding impact of errors
• System thinking — How data quality affects AI outcomes