Go in order — no need to finish at once
This isn't an exam. Stop whenever you like — your progress is stored in your own browser.
0 / 63
You now know 0 UI patterns
Stored in this browser (LocalStorage). Nothing is uploaded.
The UI you see every day
0 / 10You have already seen these words in every app, you just did not know the names. Learn them and you can describe 80% of any interface.
Actually designing an app
0 / 14From recognising to choosing. This level is about picking the right one out of several workable options.
Understanding UX patterns
0 / 12These are not components, they are ways of doing things. Learn them and your interface goes from usable to comfortable.
Beyond the learning path
"What's the difference?" is the single most common question indie developers ask. These 8 deserve their own page.
Toast vs Snackbar
The action is done and I want to acknowledge it. Which one?
Dialog vs Bottom Sheet
I need to bring up a layer on top of the current screen. Which one?
Tabs vs Segmented Control
I have a set of options to switch between. Tabs or Segmented Control?
Switch vs Checkbox
I need the user to make a selection. Which control?
Skeleton vs Spinner
Data is loading. How should I show it?
Tooltip vs Popover
I need a small layer floating out from something. Which one?
Pagination vs Infinite Scroll
My list is long. Paginate or infinite scroll?
Button vs CTA
I need to add a button. A regular Button or a CTA?
What this path covers
- The UI you see every day —— You have already seen these words in every app, you just did not know the names. Learn them and you can describe 80% of any interface.
- Actually designing an app —— From recognising to choosing. This level is about picking the right one out of several workable options.
- Understanding UX patterns —— These are not components, they are ways of doing things. Learn them and your interface goes from usable to comfortable.