AI Chess Tutor
The Story
I always wanted to implement an AI-based chess tutor because I like playing chess, although to be honest, I actually suck at it. I didn't find the existing tutors or big apps useful enough for my needs, so I decided to build my own approach.
This application was built using Antigravity by Google. I like to work with it, though sometimes it just runs away. Still, I found the end result to be quite fun to play, which is why I'm sharing it here.
How It Works
AI Chess Tutor is an interactive chess learning application where you play against an AI opponent powered by Stockfish while receiving real-time coaching feedback from a Large Language Model (LLM).
Typical Game Flow
- Choose Your Personality: Select from three unique AI coaching personalities, each with their own teaching style and character
- Play Chess: Make your moves on the board while the Stockfish engine plays against you
- Get Real-Time Feedback: After each move exchange, your AI tutor analyzes the position and provides personalized feedback based on:
- Move quality and alternatives
- Position evaluation changes
- Opening theory (when applicable)
- Tactical and strategic considerations
- Chat with Your Tutor: Ask questions anytime using the integrated chat feature - your tutor will answer in character
- Post-Game Analysis: When the game ends, review a comprehensive analysis showing your mistakes and learning opportunities
Screenshot placeholder: Main game interface with board, evaluation bar, and chat
Features
Core Features
- Stockfish Engine: Powerful chess engine for move analysis and opponent play
- Opening Database: Comprehensive database of chess openings with metadata and theory
- Real-Time Evaluation: Live position evaluation with visual evaluation bar
- Move Analysis: Detailed feedback on every move you make
- Interactive Chat: Ask your AI tutor questions and get personalized answers
- Post-Game Analysis: Review all your mistakes and missed opportunities after each game
- Multi-Language Support: Available in English, German, French, and Italian
AI Personalities
Choose from three distinct coaching personalities, each offering a unique learning experience:
🥃 Drunk Russian GM
"Ach... life is pain, my boy"
A bitter, fatalistic, but brilliant Grandmaster who has seen it all. Expect brutally honest feedback delivered with dark humor and existential commentary. This personality combines deep chess knowledge with a Dostoevsky-like atmosphere.
Screenshot placeholder: Game with Drunk Russian GM personality
🎧 Hype Streamer
"BRO! THAT MOVE WAS INSANE!"
An energetic, loud, and entertaining chess streamer who makes every game exciting. Expect dramatic reactions, Gen-Z slang, and over-the-top commentary that keeps you engaged and motivated.
Screenshot placeholder: Game with Hype Streamer personality
👨🏫 Professional Coach
"Let's analyze the structure of this position"
A strict, analytical, and straightforward chess coach focused on your improvement. Expect objective analysis, clear explanations based on chess principles, and professional teaching methods.
Screenshot placeholder: Game with Professional Coach personality
Setup
Prerequisites
- Node.js 18+ installed
- A free Google Gemini API key
Getting Your Gemini API Key
- Visit Google AI Studio
- Sign in with your Google account
- Click "Create API Key"
- Copy your API key
API Key Configuration
You have two options for providing your Gemini API key:
Option 1: Browser Storage (Recommended for trying it out)
- Run the application
- When prompted, enter your API key in the modal dialog
- The key will be stored in your browser's localStorage
Screenshot placeholder: API key input modal
Option 2: Environment Variable (Recommended for local development)
- Create a
.envfile in the project root - Add your API key:
NEXT_PUBLIC_GEMINI_API_KEY=your_api_key_here - The application will automatically use this key
Note
You can update your API key anytime by clicking the key icon in the bottom-right corner of the application.
Credits
- Opening collection originally by ragizaki/ChessOpeningsRecommender
- Chess engine: Stockfish
- LLM: Google Gemini
Getting Started
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.
Learn More
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
Deploy on Vercel
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.