Mitlesen
The problem
Mitlesen's flashcards screen carries a lot of information. It shows how many cards are due, which ones are coming up next, and how your words are progressing through the five mastery levels — all in one view, before you tap into a session.
That density is the point. But it had started to feel cluttered. The mastery progress didn't stand out enough. The cards lacked visual hierarchy. New users opening the screen had to read it carefully to understand what was going on, and the "Start Review" button — the actual reason you're on the screen — wasn't drawing the eye it deserved.
It was time for a refresh.
What I used
The whole redesign happened in two tools, end to end:
- Claude Design generated visual variations of the screen from a single screenshot. I asked for five, picked the one that worked best for Mitlesen's existing style, and exported it as a working spec.
- Claude Code implemented the new design directly in the Kotlin Multiplatform codebase that powers the Android and iOS apps. After writing the code, it launched the Android emulator on its own, navigated to the flashcards screen, and verified the redesign was live.
No Figma, no third-party prototyping tool, no separate design hand-off.
What changed
The new screen carries the same information as before, but with much better clarity:
- Cleaner cards. Softer borders, more generous spacing, and a clearer rhythm between the "Up Next" section and the mastery distribution below it.
- Two "Up Next" cards instead of three. The mastery distribution — arguably the more important indicator of your progress — now stays visible above the fold, no scrolling needed.
- A more confident CTA. The "Start Review" button has a subtle drop shadow that lifts it off the page, so the most-used action on the screen is also the most obvious one.
- Same mastery colors. The saturated palette across the five levels is unchanged — only the surface around it has evolved.
See it in action
For the full walkthrough — the design prompts, the iteration loop, and the moment Claude Code took over the emulator to verify its own work — the video at the top of this post is the unedited version.
If there's a feature you'd like to see in Mitlesen, drop a comment on YouTube. I read every one.
— Hani