AI 2048
2048 Game
Score
280
Best
280
Moves
48
8
2
4
16
16
2
32
2
4
4
4
16
2
↑ 31.3%
↓ 24.0%
← 15.8%
→ 28.9%
AI is playing. Watch it learn!
Neural Network Weight Visualization
• Each rectangle shows a weight matrix between layers
• Gray = neutral/small weights, Blue = positive, Red = negative
• Colors develop as the AI learns stronger connections
• Brighter colors = recently changed weights during training
• Bottom bars show the AI's move probabilities
AI Performance
Total Games:
0
Highest Tile:
0
Win Rate:
0.0%
Avg Moves:
0
Exploration Rate:
90.0%
Weight Changes:
No changes yet
The AI uses reinforcement learning to improve its strategy.
Rewards are based on merges, score increases, and survival.
About This Project
Inspired by Gabriele Cirulli's viral 2048 game and the subsequent AI solutions that achieved superhuman performance, this is my personal attempt at creating a learning AI from scratch. When Cirulli released 2048 in 2014, it captivated millions and soon became a benchmark for AI researchers to test reinforcement learning algorithms. This project is my learning experience in implementing these techniques, featuring real-time visualization of the neural network's weights and decision-making process as it learns to master Cirulli's elegant puzzle game.
Features
- •Manual and AI Modes: Play yourself or watch the AI learn
- •Reinforcement Learning: The AI improves its strategy through experience
- •Neural Network Visualization: See weight changes in real-time as the AI trains
- •Performance Metrics: Track games played, win rate, average score, and more
- •Speed Control: Adjust AI play speed from slow to instant
- •Glassmorphic UI: Modern design with backdrop blur effects
How the AI Works
The AI uses a deep Q-learning network with:
- •Input: 16 neurons (4x4 grid state)
- •Hidden Layers: 3 layers (256, 128, 64 neurons)
- •Output: 4 neurons (up, down, left, right actions)
The reward system encourages:
- •Tile merges and score increases
- •Maintaining empty cells
- •Achieving higher tiles
- •Survival (avoiding game over)
Technical Details
- •Built with React and TypeScript
- •TensorFlow.js for neural network implementation
- •Canvas API for weight visualization
- •Tailwind CSS with glassmorphic design
- •Real-time training without blocking the UI
The neural network visualization shows:
- •Weight matrices between layers as heatmaps
- •Blue for positive weights, red for negative
- •Brighter colors indicate recently changed weights
- •Move probability bars at the bottom