UI design vs UX design: what's the difference?
UX design shapes how a product works; UI design shapes how it looks and responds. Here's how they differ, how they overlap and which one your project needs.
Quick answer
UX (user experience) design shapes how a product works: what it does, how it's structured and whether people can complete their tasks easily. UI (user interface) design shapes how it looks and responds: layout, typography, colour, components and interaction details. UX comes first in principle, but in practice they overlap and are often done by the same product designers.
What UX design covers
UX design is concerned with whether a product is useful and usable. Typical work includes:
- User research: interviews, analytics review and observing how people actually work
- Information architecture: how content and features are organised and named
- User flows: the steps people take to complete each task
- Wireframes and prototypes: testing structure before visual design
- Usability testing: watching real users attempt real tasks
What UI design covers
UI design turns structure into an interface people can see and use. Typical work includes:
- Visual layout, spacing and hierarchy
- Typography and colour, including contrast for accessibility
- Components such as buttons, forms, tables and navigation, and all their states
- Interaction details: feedback, transitions and microinteractions
- Design systems: reusable, documented components and tokens
Side by side
| UX design | UI design | |
|---|---|---|
| Main question | Does this work for people? | Is this clear, consistent and pleasant to use? |
| Typical outputs | Research findings, flows, wireframes, prototypes | Final screens, components, design system |
| Measured by | Task success, drop-off, support requests | Consistency, accessibility, visual clarity |
| Common tools | Research tools, whiteboards, Figma prototypes | Figma, design tokens, component libraries |
Where they overlap
The line is blurry in practice. A confusing button label is a UX problem and a UI problem. A layout that hides a key action affects both. That's why many teams hire product designers who work across both, and why a good UI designer still thinks about flows and a good UX designer still cares how things look.
Product design is a broader role again, adding business goals and product strategy. See product design vs UX design.
Which does your project need?
If people can't find things, abandon tasks halfway or keep contacting support with the same question, start with UX. If the product works well but looks dated or inconsistent, UI work may be enough. New products need both. When briefing an agency, saying which problem you have saves everyone time; our guide on choosing a UI/UX design agency covers the rest.
Need UX, UI or both?
We'll help you work out which, and design it. See our UI/UX design service.
Common questions.
UX design decides how a product works: structure, flows and whether people can complete their tasks. UI design decides how it looks and responds: layout, type, colour, components and interaction details.