UX Terminology
UX Design Styles
Company Design Systems
WCAG Standards
Companies by Micro-interactions
100

The mental effort required to use a product.

Cognitive Load

100

A clean, clutter-free design emphasizing simplicity, whitespace, and essential elements.

Minimalism

100

image 1

Slack

100

What does "WCAG" stand for?

Web Content Accessibility Guidelines (WCAG)

100

This app’s signature swipe-right action includes a haptic feedback "click" when successfully liking someone.

Tinder

200

The ideal process or user flow that occurs when everything goes as planned, without any errors or exceptions.

Happy Path

200

Raw, unpolished design with harsh contrasts, plain typography, and minimal decoration.

Brutalism

200

image 2

Duolingo

200

This WCAG success criterion advises against using _____ as the sole method for conveying information.

Color

200

This app subtly vibrates your phone when your driver arrives.

Uber

300

UX tricks that manipulate users into taking unwanted actions.

Dark Patterns

300

A frosted-glass effect with blurred transparency, often seen in modern UI designs.

Glassmorphism

300

image 3

spotify

300

This accessibility feature allows users to navigate a website using voice commands.

Voice Control

300

This app’s signature animation is a heart that bursts when you double-click something.

Instagram

400

The more stimuli (or choices) users face, the longer it will take them to make a decision

Hick’s Law

400

A UI layout using modular, tile-based card designs for information grouping.

Bento / Grid

400

image 4

wealthsimple

400

What is minimum color contrast ratio for normal-sized text according to WCAG AA?

4.5:1

400

When you pull down to refresh on this app, the loading spinner is replaced by a bouncing bird.

Twitter / X

500

This law states that the time required to reach a target is a function of the distance to and size of the target.

Fitts' Law
500

Designs that mimic real-world objects with textures, shadows, and depth (e.g., Apple’s old Notes app with a leather texture).

Skeuomorphism

500

image 5

ticketmaster

500

Developers can use these labels to provide additional context for screen readers when native HTML elements aren’t sufficient.

ARIA labels (Accessible Rich Internet Applications)

500

This app subtly changes the color of its navigation bar as you scroll down a long feed to indicate depth.

Pinterest