Carmen in Madrid: A Telenovela

Inspiration

Traditional language textbooks often lack the emotional hooks required for long-term retention. Carmen en Madrid was born from the "Comprehensible Input" philosophy, leveraging the dramatic, formulaic nature of telenovelas to cement vocabulary through "binge-able" narratives.

I wanted to move away from dry exercises toward a Modern Chic" travel aesthetic inspired by The New Yorker’s editorial illustrations and my own initial illustration, specifically targeting Millennial and Gen Z learners who value style and storytelling. I wanted to create a soap, like Eastenders or Days of Our Lives, that keeps people coming back year after year.

What it does

This application is an immersive, narrative-driven Spanish learning experience. Users follow Carmen, a stylish woman in her 20s, through the first episode of a season full of mystery and betrayal in Madrid. This initial episode sets the scene and introduces a potential love interest, Mateo. The interface mimics a physical journal resting on a white desk, featuring 3D page-turning animations. Beyond reading, users can:

• Listen to high-emotion, character-specific dialogue.
• Practice pronunciation with real-time AI coaching.
• Explore Cultural Deep Dives into iconic Madrid locations like Atocha Station and chat with Mateo to learn all about his favourite hotspots.

How we built it

I utilised a sophisticated AI Tech Stack to create a seamless experience:

• NotebookLM: Serves as the "Series Bible," maintaining plot logic and generating interactive study guides.
• Google Gemini & AI Studio: Powers the bilingual scripting and the multimodal pronunciation coach that analyzes user audio.
• ElevenLabs: Provides expressive, ultra-realistic voices (Mateo and Julia) to enhance emotional immersion.
• Nano Banana: Generates consistent "New Yorker" style scene art, ensuring Carmen maintains her signature look across all episodes.
• Frontend: Built with React and TypeScript, featuring a "Smart Lookahead" audio preloader and IndexedDB caching for efficiency.

Challenges we ran into

A major hurdle was ensuring narrative and visual consistency across 10 distinct episodes. We solved this by using NotebookLM to track the beats of the story and crafting precise Character Consistency Prompts for the AI image generation. Additionally, balancing high-fidelity audio with API reliability led us to build a dual-engine architecture that falls back from ElevenLabs to Gemini's native speech engine when necessary. The Elevenlabs API and the custom character voice IDs are built into the AI Studio app.

Accomplishments that we're proud of

I successfully blended a 'slow living" UI aesthetic with high-tech AI functionality. I'm particularly proud of the gamified learning progression, where successfully pronounced words are automatically saved to a persistent "My Dictionary," turning a passive story into an active vocabulary builder.

The visual identity, featuring Aperol Spritzes, linen sets, and urban Madrid backdrops, successfully creates a "premium" feel unique to the language-learning market.

What we learned

We discovered that emotional context is the most powerful tool for language acquisition; learners remember words better when they are tied to a character's "shock" or a "secret". We also learned how to leverage multimodal AI models not just as chatbots, but as integrated educational tools that can listen, analyse, and provide targeted feedback on human speech.

What's next for Carmen in Madrid: A Telenovela

The journey is just beginning. We plan to:

• Expand the Narrative: Fully develop the "mystery and betrayal" storyline for the next episodes.
• Premium Anki Decks: Release a curated series of flashcards featuring episode-specific art and ElevenLabs audio.
• Enhanced Interactivity: Deepen the Cultural Deep Dive sections with more interactive quizzes and historical insights into Madrid's hidden gems.

Built With

• elevenlabs
• gemini
• notebooklm