EXECUTIVE SUMMARY
UX design shapes the journey: how a site is structured and how easily users reach their goal. UI design shapes the surface: the buttons, type, colour and spacing users travel through. One decides what happens, the other what it looks and feels like. On business websites they’re usually done by the same people, and results come from the two aligned.
KEY INSIGHTS
- UX = experience and journeys; UI = the visual interface itself.
- A site can succeed at one and fail at the other; both failures cost conversions.
- “UI/UX designer” job titles usually mean one person doing both, which is normal.
- Judge agencies on both: journey thinking and interface craft.
The one-sentence difference
UX (user experience) design plans how the whole thing works for the user; UI (user interface) design creates the visual layer they interact with. If a website were a house, UX is the floor plan and how you move through it; UI is the fixtures, finishes and door handles. We’ve covered what UX design involves in depth, so this article stays on the comparison.
UX vs UI, side by side
| UX design | UI design | |
|---|---|---|
| Question it answers | Can users get what they came for? | Is the interface clear and appealing? |
| Works on | Structure, journeys, flows, forms | Buttons, type, colour, spacing, states |
| Outputs | Sitemaps, wireframes, prototypes | Mockups, component styles, design systems |
| Failure looks like | Lost, confused, abandoned tasks | Dated, untrustworthy, hard to read |
| Measured by | Task completion, conversion rate | Clarity, consistency, brand fit |
Three examples of the difference
The contact form
UX decision: ask four fields instead of eleven, and put the form on every page. UI decision: make the fields comfortable to tap, label them clearly, and give the submit button the visual weight the page’s most important action deserves.
The navigation
UX decision: which pages exist, what they’re called, what goes in the menu versus the footer. UI decision: how the menu looks, its hover and open states, and how it collapses on smaller screens.
The product page
UX decision: answer delivery and returns questions before the buyer asks, put reviews where doubt happens. UI decision: the gallery layout, price typography and the visual hierarchy that makes “Add to basket” unmissable. Ecommerce lives or dies on both, as our ecommerce design service is built around.
Great UI on a bad structure is a beautiful maze. Great UX in a dated interface is good advice from someone you don’t trust.
How they work together in practice
On real projects the disciplines interleave: journey decisions constrain the interface, and interface realities push back on journeys. That’s why the split into separate specialists mostly happens on large product teams; for business websites, one team doing both, in the same room, produces tighter results. It’s how we work at Web Design Manchester: the person structuring your journeys is the person styling your buttons, so nothing gets lost in translation.
When you’re evaluating an agency, test for both halves. Ask how they’d structure your site and why (UX), and look at whether their live work is crisp, consistent and readable (UI). An agency strong in only one will show it, and our guide to choosing a web design agency gives you the full checklist.
Frequently asked questions
What does a “UI/UX designer” job title mean?
One person covering both disciplines, which is standard outside large product companies. The title order doesn’t mean much; the portfolio does.
Which should I invest in first?
If forced to sequence: fix UX first, because structure problems waste every visitor. But on a website build they’re not separate purchases; a competent web designer delivers both in one process.
Is UI design just “making it pretty”?
No. UI carries hierarchy, affordance (what looks clickable), feedback and trust. Visitors judge credibility in a blink, and that judgement lands almost entirely on the UI.
