Tauseef FayyazA to Z
Glossary
Every concept in this sheet, plus the smaller terms it uses. Select a concept to open its card.
B
- Breakpoints
- The screen widths at which a layout changes, for example from one column to two.
C
- Colour palette
- A planned set of colours: neutrals for text and surfaces, one primary colour for actions, and semantic colours for success, warning and error, each in several shades.
D
- Design roles
- The usual jobs around design: product designers own flows and screens, UX researchers run studies, content designers own words, and design engineers build interfaces and prototypes in code.
- Double Diamond
- A model of the design process in two phases that each widen then narrow: discover and define the right problem, then develop and deliver the right solution.
G
- Gestalt principles
- Rules describing how people perceive groups: proximity, similarity, common region, continuity and closure.
I
- Icon usage
- Using symbols to aid recognition, from one consistent set with the same stroke, size and style.
L
- Layout grid
- Columns separated by gutters inside outer margins, used to align content.
- Line length and line height
- Line length is the number of characters per line; line height is the vertical space per line.
P
- Problem statement
- One or two sentences naming who is struggling, with what, and why it matters, without naming a solution.
- Prototype
- A version of a design people can interact with, from linked paper sketches to realistic Figma or code prototypes.
- Proximity
- The principle that items placed close together are seen as related.
S
- Spacing scale
- A fixed set of distances, often multiples of 4 or 8 pixels (4, 8, 12, 16, 24, 32, 48, 64), used for all padding and gaps.
- System Usability Scale
- A standard ten-question questionnaire about perceived usability, scored from 0 to 100.
T
- Task success rate
- The share of participants who complete a given task, often reported with time on task and error count.
- Type scale
- A small fixed set of font sizes, such as 12, 14, 16, 20, 24, 32 and 40, each clearly different from the next.
U
- UX and UI
- User experience (UX) is how well someone gets a job done with a product, end to end.
V
- Visual hierarchy
- The order in which the eye reads a screen, controlled by size, weight, colour, contrast, position and space.
W
- Wireframe
- A simple layout of a screen in grey boxes and placeholder text, showing structure and content priority without visual styling.