Charla

Speak Spanish every day with Charla! Practice real conversations, get instant pronunciation feedback, and build confidence with AI-powered scenarios and progress tracking.

Comment

Inspiration

After maintaining a 1,800-day streak on a popular language learning app, I realized something surprising, I still couldn’t hold a conversation in Spanish. I could recognize words, but I couldn't speak confidently. Charla was born out of that frustration so we created a tool to help people actually speak Spanish through real conversation practice and spaced repitition, not just memorization.

What it does

Charla is a browser-based Spanish learning app that helps users build real-world speaking skills through:

  • Daily Vocabulary Practice with pronunciation feedback
  • AI-Powered Conversations in real-life scenarios
  • Spaced Repetition and confidence tracking
  • Gamification with streaks, achievements, and flashcards

Each day, users learn a new word, say it out loud, use it in a sentence, and practice dynamic conversations with AI building confidence, one word at a time.

How we built it

Charla was built with:

Vite + Netlify for fast frontend development and deployment Supabase for user authentication and database management ElevenLabs & OpenAI APIs for natural language generation and voice feedback Web Speech API for real-time speech recognition and pronunciation scoring

The architecture is modular and extensible, designed for quick iteration and future features like user-generated scenarios and analytics.

Challenges we ran into

Speech Recognition Reliability Browser APIs were inconsistent across platforms, often returning incomplete results. We built fallback logic, retry options, and robust state management to ensure a seamless user experience.

Real-Time Pronunciation Feedback With no advanced cloud scoring available, we built a custom feedback system using Levenshtein distance, phonetic mapping, and Spanish-specific tweaks to provide clear, actionable feedback.

Recording UX Flow Managing the start/stop/redo states of speech recognition was tricky, especially with async delays. We separated UI state from async recognition logic to give users fast, clear feedback at all times.

Conversational AI Context We wanted AI responses to feel dynamic and personal, not robotic. We integrated user context (like name and tone) into prompts to generate more relevant and engaging replies.

Accomplishments that we're proud of

Built a functional AI conversation engine that provides live, interactive Spanish speaking practice Designed a complete daily learning loop with example sentences, feedback, and user-generated speech Delivered a smooth, responsive UI with zero native dependencies — everything works in-browser Created an experience that’s fun, effective, and encourages consistent use

What we learned

How to integrate ElevenLabs, OpenAI, and browser speech APIs to deliver real-time, interactive conversation practice How to create intuitive UX flows for audio recording and feedback How to deploy efficiently with Netlify and manage authentication + data via Supabase Most importantly, how to turn a personal pain point into something helpful for others

What's next for Charla

Mobile optimization or app with push reminders for daily reminders Enhance the pronunciation and grammar correction feedback Leaderboard + social accountability for more motivation Would also like to expand into other languages

Built With

  • bolt
  • elevenlabs
  • netlify
  • supabase
  • vite
Share this project:

Updates