Academic Team Project · Language Learning App · UI Lead
Tallo
A language isn't learned. It's spoken.
A language-learning app designed by an eight-person team — needing one coherent brand and interface system across the final product concept.
UI lead — visual direction, the design system (tokens and component families), core flows, and prototyping. Research and synthesis were shared.
Shared design tokens and reusable component families kept the team's work visually consistent — a qualitative system outcome, not a measured one.
Self-initiated academic team project outside a formal course — outcomes are system- and usability-based; no launch is claimed.
The destination, first.
One system of tokens and components across live Voice Rooms, AI practice, and translation chat — below is how it was built, and what I owned.
A language learning app built on one belief — fluency comes from conversation.
Apps teach vocabulary but never get people talking — and exchange communities drift toward dating-app dynamics.
Tallo pairs live Voice Rooms and AI partners inside an avatar-only community: practice that's always available, always about language.
I owned the visual discipline — and shared the product.
My role and contribution
Owned
Primary ownershipThe visual direction, from moodboard to final screen — mine to set and protect.
Collaborated
Cross-functional, with the UX LeadTwo leads, one conversation — from the first interview to the final call.
designers, two leads.
↓
4
UX Team · led by the UX Lead
4
UI Team · my team
↓
One product.
People don't quit because language is difficult. They quit because they never actually speak.
Speaking Practice
Lessons train recognition — not the nerve to say words out loud.
Real-world Context
No course prepares them for the restaurant, the airport, the interview.
Safety
Exchange platforms drift toward dating. Serious learners drift away.
Motivation
Practice that depends on strangers' schedules is practice that stops.
Both leads sat inside the research — hearing hesitation in the room, not reading about it afterward — so pain points reached the visual work unfiltered.
- Method
- User interviews
- Sample
- n=12
- Phase
- Discovery research
- Method
- Moderated usability testing
- Sample
- n=6
- Phase
- Prototype evaluation
HelloTalk
Social but crowded — serious practice is hard to find.
Keep the energy — design for focus and safety.
Busuu
Rigid outlines — homework, not conversation.
Bring structure into live conversation.
Tandem
Slow matching; partners don't always show up.
Match on intent — back it up with AI.
Nobody served intermediate learners who want real speaking practice without the social noise. That gap became Tallo.
What we heard → what it became
"I want to speak — I'm just scared of being judged."
→Voice RoomsRaise-to-speak; join as audience first.
"Every exchange app ends up feeling like a dating app."
→Avatar-only communityLanguage, not looks — by design.
"Lessons never sound like real life."
→Scenario RoomsPractice by situation, not by chapter.
"I need to feel calm before I can open my mouth."
→A calm blue systemColor and tone as reassurance.
Language First
No likes, no feeds. Every screen exists to get people speaking.
Safe Community
Avatar-only profiles and audience controls — welcoming, never watchful.
AI Supports Humans
Practice with AI, perform with people. It rehearses, never replaces.
Design System — (06)
Brand decisions became product decisions.
The system started in a moodboard — every step after made the brand more usable.
Moodboard
Human
Conversational
OpenNot an exercise — a contract. The mood the research asked for: calm, safe, human.
Logo
Talk meets hello. A speech bubble folded into the last letter — the product's personality.
Color Tokens
--color-primary · #4A67A1--secondary-100 · #C6E2E9--secondary-400 · #9BA8B6--surface · #FFFFFF--alert-error--alert-warning--alert-successDelivered as system variables, not hex codes — contrast-checked, impossible to drift from.
Typography
Say it out loud.
Inter carries conversation — chat, captions, dense UI — chosen for readability at small sizes.
A geometric voice for moments, a quiet workhorse for conversation — readability was the brand decision.
One shared library
across the final concept.
Built once, governed weekly — shared tokens and reusable components kept the whole team speaking one visual and interaction language.
One direction in.
One product out.
Key Features
Four chapters — every one assembled from the system.
Voice Rooms
Live, topic-based audio rooms with native speakers — join on your own terms.
Raise-to-speak. Lurk first, leap when ready.
Control over exposure turns listeners into speakers.
Scenario Room
AI role-play for conversations people actually need — restaurants, airports, interviews.
Brief first, then talk — prepared, not frozen.
Situations, not lessons, keep practice worth repeating.
AI Partner
A voice-first partner that's there at 2am when no human is. Rehearsal, never replacement.
One mic, voice bubbles, replay — talk, not transcription.
"Practicing with AI first really eased my nerves."
Translation Chat
Long-press any message to translate, hear it aloud, or memorize it — without leaving the chat.
"The translator is a lifesaver when I'm just starting out."
Brand Workshops
Insights shaped into moodboard, logo, and palette — with my team.
Weekly Design Direction
Keeping four UI designers aligned around one visual language through weekly reviews of work-in-progress screens.
Component Governance
Propose, review, merge — one change reaches all four UI designers.
Visual QA
Spacing, tokens, states — checked before handoff.
A loop the UX team ran — with both leads inside it.
"Testers hovered over the mic — wanting to speak, not daring to."
Raise-to-speak became the default — join as audience, unmute by invitation. Opt-in, not exposure.
"The translation menu was discovered late — some never long-pressed at all."
Added a first-chat hint and surfaced translate as a visible affordance on received messages.
"Scenario briefings were read once, then skipped — too much text before talking."
Split the briefing into a Useful Phrases tab — reference during conversation, not homework before it.
"The AI Voice Room gave me the confidence to speak up, not just listen in."
From System to Product — (10)
The final design system.
Brand became tokens. Tokens became components. Components became this.
MatchingA partner chosen by intent, not photos.Scenario BriefingPreparation before conversation — phrases in hand.Voice RoomSpeaking, live, on your terms.ChatConversation that survives the language gap.ScenariosReal situations — restaurants, airports, interviews.
Host ControlsSafety, built into the room itself.We didn't design screens and hope they'd match. We built a language eight designers could speak. Clear shared rules helped the team maintain a more consistent interface language.
Limits — and where it goes next
A non-launched student concept — the outcomes here are system- and usability-based, not market-proven.
Type scaling, screen readers, motion — in every critique, not a final check.
Difficulty and coaching that adapt per learner — the tokens already allow it.
An ongoing usability loop with the community itself.
