AI Math App is an interactive, web-based learning application that combines Computer Vision with basic arithmetic. By utilizing your device's webcam, the app detects hand gestures in real-time, allowing users to answer math questions simply by raising their fingers!
This project was developed as a Final Project for the Introduction to Artificial Intelligence course.
- 🖐️ AI Hand Tracking Quiz: Answer dynamic addition problems by raising the correct number of fingers in front of your camera. Real-time feedback included!
- ⌨️ Practice Mode: A classic, typing-based math practice area for users who prefer not to use a camera.
- 📖 Learning Modules: Educational cards explaining the core concepts behind the app, including Computer Vision, Vector Analysis, and MediaPipe's Finger Detection Algorithms.
- 🏆 Leaderboard System: An auto-saving leaderboard that tracks and ranks the highest scores based on both AI and Practice quizzes.
- 🔒 Privacy First: All image processing is done locally in your browser. No video data is sent to any server.
- Frontend Framework: React.js
- Styling: Tailwind CSS
- AI / Computer Vision: Google MediaPipe (Hands)
- Icons: Lucide React
Follow these instructions to get a copy of the project up and running on your local machine.
Make sure you have Node.js and npm installed on your machine.
-
Clone the repository:
git clone https://github.com/D14M0NDS4N/AI-Math-App.git
-
Navigate into the project directory: cd ai-math-master
-
Install the dependencies: npm install
-
Start the development server: npm run dev
-
Open your browser and visit http://localhost:3030 (or the port provided in your terminal).