Generador ELE Interactivo

AI-native ELE lesson generator creating tailored Spanish practice in seconds. Adaptive learning, interactive exercises, and built-in monetization.

Comment

Inspiration

As an online Spanish teacher conducting one-on-one lessons, I experienced firsthand the beauty and the exhaustion of personalizing education. Individual tutoring creates deep connections, but it requires countless hours of lesson prep. With a full schedule, I struggled to find extra tailored practice material for my students. Generic exercises missed their specific needs, leaving a gap between live classes and independent study. I was inspired to create an AI-powered tool that generates hyper-customized Spanish lessons on demand—allowing students to practice targeted grammar and vocabulary without multiplying teacher workload.

What it does

GENERADOR ELE INTERACTIVO is an AI-native educational platform designed to generate hyper-personalized Spanish (ELE) lessons on demand. Built for language students and teachers, the app instantly creates interactive, multi-modal learning modules from any user topic or grammatical prompt.Each generated lesson delivers:Pedagogical Rule Tables & Structure: Precise morphological charts and explanations (including regular and irregular verb forms or indirect object structures for verbs like gustar).Interactive Flashcards & Vocabulary: Contextual glossaries and dynamic transformation flashcards focused on practical application rather than abstract definitions.Leveled Audio & Dictation: Multi-voice dialogue audio and leveled dictation exercises with full player controls (play/pause, seek slider) tailored to CEFR levels (A1 to B2).Self-Assessment Exercises & Free Writing: Dynamic practice activities (fill-in-the-blanks, multiple choice) featuring virtual Spanish accent keyboards ($á, é, í, ó, ú, ñ, ü$), real-time progress bars, and achievement badges.Persistent Study History & Glossaries: A cloud-backed "Continue Learning" dashboard and personal vocabulary glossary where users can review past lessons without consuming extra credits.

How we built it

The application is built as an AI-native EdTech platform powered by Google's Gemini models and deployed on Vercel:Frontend & UI: Developed in React (TypeScript) with Vite and Tailwind CSS to deliver an adaptive interface featuring custom accent keyboards, audio playback, interactive flashcards, and step-by-step exercises.AI Core: Integrated with Gemini 1.5 Flash via Google AI Studio. Custom master prompts dictate the lesson structure, enforcing specific rules for grammar tables, vocabulary glossary generation, contextual reading passages, and leveled dictation exercises.Authentication & Database: Connected to Firebase Authentication and Firestore to handle user profiles, track lesson history, store glossary items, and manage credit limits.Monetization & Payments: Integrated with Stripe/Lemon Squeezy payment links to manage a credit paywall system. User Prompt + Pedagogical System Instructions + Gemini 3.6 Flash = Interactive ELE Lesson

Challenges we ran into

Building a full-stack AI application presented significant technical and design challenges: Database & Authentication Disconnects: Connecting frontend authentication to backend Firestore documents was one of the biggest technical hurdles. Early on, user accounts registered in Auth failed to write initial credit balances to Firestore, causing credit resets and progress loss. Unifying environment variables and refactoring client-side database writes resolved the persistence issues. Grammatical Accuracy & AI Hallucinations: AI models can confuse similar verb tenses (e.g., generating Pretérito Indefinido conjugation tables when Pretérito Imperfecto was requested). I had to refine system instructions to enforce strict linguistic checking before rendering tables or exercises. UX Simplicity: Early iterations overloaded users with options. Based on student and teacher feedback, I simplified the dashboard into a clean interface focused on "Practice on Demand" and a "Continue Learning" section.

Accomplishments that we're proud of

Zero-to-One Full-Stack AI Prototype: Built a complete, responsive full-stack EdTech application using Google AI Studio, React, TypeScript, Tailwind CSS, and Firebase without a traditional coding background.Strict Pedagogical Rigor & Precision: Engineered master system prompts in Gemini to eliminate language hallucinations—ensuring accurate verb tense tables (e.g., distinguishing Pretérito Imperfecto from Pretérito Indefinido) and native Mexican Spanish ($es\text{-}MX$) audio output.Seamless Mobile & Web UX: Redesigned the entire interface based on real student feedback into a minimal "Practice on Demand" hero layout with a single "Continue Learning" card, profile dropdowns, and virtual accent keyboards.Monetization & Cloud Persistence: Successfully migrated from browser local storage to Firebase Authentication and Firestore, linking user credits to cloud profiles and implementing Stripe paywalls for credit top-ups.Real-World Validation: Shared the platform with real online Spanish students and teachers who use it daily for 1-on-1 class prep and independent study.

What we learned

This project expanded my technical skill set and changed my approach to building software: Google AI Studio & Full-Stack Prototyping: I discovered Google AI Studio and realized how fast an entire AI-native application can be built using system instructions, structured JSON outputs, and Gemini models. Prompt Engineering & System Instructions: I learned that prompt structure directly dictates output quality. Designing detailed system instructions was essential to prevent language "hallucinations" and ensure pedagogical accuracy across grammar, vocabulary, reading, and listening. API Integration & Cloud Services: I gained practical experience connecting frontend components to Gemini APIs, managing environment variables, and setting up cloud services. User Authentication & Database Management: Moving from local storage to persistent cloud databases (Firebase Auth and Firestore) taught me how to handle user sessions, synch progress across devices, and manage credit-based monetization securely.

What's next for Generador ELE Interactivo

CEFR Placement Diagnostic & Structured Mastery Path: Developing a dynamic, multi-question diagnostic exam that evaluates students' current level (A1–B2) and auto-generates a personalized learning roadmap. This feature will use cumulative "anchored learning" where vocabulary and grammar from earlier lessons are automatically recycled into future modules. Expanded Multi-Language Support: Extending the AI generation engine to support English (ESL) learning, allowing users to toggle their target language with a single switch. Continuous Pedagogical & AI Optimization: Refining system prompts with newer Gemini models (such as Gemini 2.5/3.5 Flash) to decrease response latency for instant dictionary lookups.

Built With

Share this project:

Updates