An interactive language learning application for children that uses AI to generate stories, process handwritten responses, and provide feedback on language learning progress.

CaligraphME helps children learn new languages by:

1. Generating engaging stories in their target language
2. Presenting sentences in their comfortable language
3. Allowing them to write responses on a canvas
4. Using AI to analyze their handwriting and compare translations
5. Providing feedback and rewards for progress

CaligraphME/
├── frontend/          # React + Vite + TypeScript
├── backend/           # Node.js + TypeScript + Express
├── shared/            # Shared types and utilities
└── docs/              # Documentation

• React 18 - UI framework
• Vite - Build tool and dev server
• TypeScript - Type safety
• Canvas API - Handwriting input
• SVG - Image format for handwriting

• Node.js - Runtime
• Express - Web framework
• TypeScript - Type safety
• Supabase - Database, authentication, and storage
• Gemini API - Story generation and translation
• ElevenLabs - Voice synthesization and narration

• Generates age-appropriate stories
• Organizes content into sentences
• Supports multiple languages
• Difficulty levels

• Converts handwritten canvas to text
• Uses Amazon Rekognition
• Returns confidence scores

CaligraphME uses a unique dual grading system that evaluates two separate aspects:

✍️ Handwriting Quality (40%)

• Legibility - How readable is the writing?
• OCR Confidence - Text clarity
• Penmanship - Letter formation, spacing, consistency

🌍 Translation Accuracy (60%)

• Semantic Accuracy - Does the meaning match?
• Grammar - Correct sentence structure
• Vocabulary - Appropriate word choice
• Spelling - Correct spelling and accents

This separation provides:

• Specific, actionable feedback for each skill
• Fair evaluation (good translation, messy handwriting? We see both!)
• Targeted practice recommendations
• Independent progress tracking

Students receive detailed feedback for both areas and earn points based on performance in each category, with bonus points for excellence in both!

See GRADING_SYSTEM.md for detailed information.

• Tracks student points
• Achievement badges
• Progress visualization
• Separate tracking for handwriting and translation skills

• Node.js 18+ and npm
• Supabase account
• AWS account (for Rekognition)
• Google Cloud account (for Gemini API)

# Install dependencies for all packages
npm install

# Install frontend dependencies
cd frontend
npm install

# Install backend dependencies
cd ../backend
npm install

See .env.example files in frontend and backend directories.

# Run both frontend and backend concurrently
npm run dev

# Run frontend only
cd frontend
npm run dev

# Run backend only
cd backend
npm run dev

🚧 Currently in skeleton/template phase - Implementation in progress

• User accounts and authentication
• Progress tracking and curriculum
• Payment integration (Visa)
• Parent dashboard
• Multi-language support expansion
• Offline mode

TBD