Bolo (बोलो)
Learn to speak Hindi
Bolo is a mobile concept for learning Hindi the way you actually use it: OUT LOUD!
Most language apps drill vocabulary and grammar but leave you unsure how a word should sound. Bolo flips that order and starts with pronunciation and phonetics — the sounds English speakers find hardest — so you build confidence speaking from your very first lesson.
This interactive prototype is best experienced on a larger screen.
Open prototype ↗ABOUT THE APP
Bolo teaches Hindi from the sound up. It walks learners through vowels, consonants, and the trickier combined and conjunct consonants, pairing each sound with a clear explanation of how to make it. A lip-shape diagram shows how the mouth moves for every vowel, an English "sounds like" hint anchors each new sound to something familiar, and a voice coach scores your pronunciation syllable by syllable.
Progress is built around a simple daily loop. Learners complete daily tasks and three quizzes per level, and need to pass at least two of the three to advance. When they get stuck, they can refer to the course up to twice per test for a hint — and holding a seven-day streak unlocks two extra look-ups. After the first five lessons, the Conversation Zone opens up, where learners practise real-life exchanges like ordering at a chai stall, and dedicated lessons cover speaking numbers in Hindi.
KEY FEATURES
- Phonetics-first lessons covering vowels, consonants, and conjunct consonants, with per-vowel lip-shape diagrams and mouth/tongue guidance
- Voice coach with syllable-level pronunciation feedback
- Daily tasks and quizzes with a pass-two-of-three progression and in-quiz course look-ups
- Streaks and rewards that grant extra help the more consistently you practise
- Conversation Zone for practising real scenarios, unlocked after five lessons
- Numbers lessons for counting in Hindi (एक, दो, तीन and beyond)
- Warm and engaging colour palette
HOW I BUILT IT
I designed and prototyped Bolo through a round-trip workflow across Claude Design, Figma, and Claude Code:
- Built a design system in Claude Design — establishing the colour palette, typography, and core components that give the app its look and feel.
- Created the basic app flows in Claude Design — laying out the main screens and the paths a learner moves through.
- Connected Claude Design to Figma and pulled the designs in, so I could refine them in a dedicated design tool.
- Refined the designs in Figma, then brought them back into Claude Code — turning the static screens into a working, clickable prototype.
- Expanded the experience with new flows — including an onboarding sequence and additional learner journeys — and iterated on details like illustrations, spacing, and component states until the prototype felt cohesive.
The result is an interactive prototype with three end-to-end flows: a first-launch onboarding intro, a new learner's first lesson, and the unlocked experience of a returning learner with the Conversation Zone and Numbers lessons available.