Chat app Blab

Designing and building with AI a language-practice chat app.

Blab chat app cover with a tilted phone mockup and Blab logo on an orange background.
Focus
Product Design
Prototype
Flutter MVP
Build
AI-assisted

Concept

Blab is a language-learning app where you chat with an AI companion in your target language. It adapts to your level, corrects mistakes inline, and keeps you talking — no textbook exercises, just conversation.

I designed and built the full product on Flutter with Claude Code.

Branding

The visual identity — wordmark, colour palette, and type — was designed in Figma and exported directly into the Flutter codebase.

Wordmark
Colour palette
Orange
#D4694A
Light blue
#D6E2E7
Cream
#EFEBE2
Ink
#1F3340
Stone
#9A9490
Typeface — Roboto
Teach what you speak Display · 26px
New chat Title · 22px
Learning language Subhead · 17px
I'm having coffee and chatting with you Body · 15px
LEARNING Overline · 11px
Message bubbles
காலை! எப்படி இருக்கீங்க?
Good morning! How are you?
9:30
நான் நன்றாக இருக்கிறேன், நன்றி!
I'm good, thanks!
9:31 ✓✓

Screens

Sign up flow

New users pick their target language and level, then jump straight into their first conversation. No onboarding maze.

Messaging flow

The core loop: send a message, get a reply from the AI, tap any word for an inline translation or grammar note. Corrections appear as subtle suggestions — never interruptions.

Settings

Switch language partner, adjust difficulty, or update your profile — all in one place.

I have more to say

about the project and the process

Contact
arrow right

Read the next case study

Zalando Design System cover

Zalando Design System

Designing clear, consistent iconography to improve warehouse app efficiency

Read more
arrow right