UI & UX, indexed.
A growing reference of the patterns and principles behind interfaces — explained for everyone, with live demos you can click and play with.
Entries
- uidisclosurenavigation
Accordion
An accordion is a vertically stacked list of headers, each of which expands to reveal a panel of related content when clicked, hiding the others to keep the surface compact.
- uxmotortargeting
Fitts' Law
The time it takes to click or tap a target is determined by two things: how large the target is and how far away it is. Bigger and closer is always faster.
- uxdecision-makingcognitive-load
Hick's Law
Hick's Law says the more options you put in front of someone, the longer they take to choose. The slowdown isn't linear — doubling the options doesn't double the time — but each additional choice still adds friction. The practical implication: fewer choices, faster decisions.
- uxmental-modelconvention
Jakob's Law
Users spend most of their time on other websites. They arrive at yours already knowing how the web works — and they expect your site to behave the same way.
- uxmemorychunking
Miller's Law
The average person can hold about seven items — give or take two — in working memory at one time. Grouping information into chunks of seven or fewer makes it easier to scan, recall, and act on.
- uioverlaydialog
Modal
A modal — also called a dialog — is a temporary surface that appears on top of the page and prevents the user from interacting with anything else until they deal with it. Modals are used for tasks that genuinely can't be ignored: confirming a destructive action, completing a critical form, or viewing a piece of content in full focus.
- uxcomplexityreveal
Progressive Disclosure
A strategy of showing only what users need right now and hiding everything else until they ask for it — keeping interfaces simple without removing power.
- uiloadingplaceholder
Skeleton Loader
A placeholder that mimics the shape and layout of content before it arrives, giving users a sense of what is coming without a blank screen or a spinning indicator.
- uinotificationfeedback
Toast
A small message that appears briefly at the edge of the screen to confirm that something happened, then disappears on its own — no click required to dismiss it.
- uioverlaydisclosure
Tooltip
A small label that appears next to an element when you hover over it or move keyboard focus onto it. Tooltips are most often used to explain icons, abbreviations, or anything whose meaning isn't obvious from looking at it.