UX is not short for "makes it look nice." User experience design is the discipline of shaping how software feels to use - and that encompasses far more than visual design. Getting this distinction right matters because teams that conflate UX with UI invest in the wrong things and ship products with the wrong problems.
The TL;DR
- UX design includes interaction design, information architecture, content design, user research, and visual design - UI is one component of a larger system.
- The five dimensions of UX (words, visuals, physical space, time, and behavior) provide a practical framework for evaluating experience quality.
- Nielsen's 10 usability heuristics are the most widely used framework for evaluating UX quality - know them and you can audit almost any interface.
- Good UX is measurable through task completion rates, error rates, satisfaction scores, and time-on-task.
- Most UX problems trace back to a small number of recurring failure patterns.
UX vs. UI: Why the Distinction Matters
The terms are used interchangeably in casual conversation and incorrectly on most job boards. They are not the same thing.
UI (User Interface) design is concerned with the visual presentation of interactive elements - how buttons, forms, menus, icons, and typography are designed and arranged on screen. It answers the question: what does this look like?
UX (User Experience) design is concerned with the totality of a user's experience with a product - how interactions are structured, how information is organized, how errors are handled, how workflows are sequenced, and how users feel throughout. It answers the question: what is it like to use this?
A product can have a beautiful UI with terrible UX. Polished visual design layered over confusing workflows, poor information architecture, and non-recoverable errors is still a frustrating product to use. The visual quality insulates it slightly from negative first impressions, but it does not compensate for the underlying experience problems.
The reverse is also true but less common: products with minimal visual polish but exceptional workflow design can be deeply satisfying to use. Developer tools often operate in this space - they are not visually elaborate, but they are precisely structured around how their users work.
Understanding the distinction matters for investment decisions. A team that diagnoses "our product is hard to use" as a UI problem will commission a visual refresh. If the actual problem is structural - confusing navigation, unclear information hierarchy, missing feedback - the visual refresh will not fix anything.
The Five Dimensions of UX Design
Information architect Peter Morville's user experience honeycomb identified several attributes that define quality UX: usable, useful, desirable, findable, accessible, credible, and valuable. A more compact model that maps well to software design is the five dimensions of UX articulated by Gillian Crampton Smith and expanded upon in UX literature:
Dimension 1: Words
The language used in a product - button labels, navigation items, error messages, help text, headings, empty states - is part of the UX. Words communicate what the product does, guide user decisions, and set expectations for what happens next.
Poor word choices create confusion at every level. A button labeled "Submit" tells users nothing about what will happen next. A button labeled "Send invite" tells them exactly what to expect. A section labeled "Workspaces" may mean nothing to a new user; a section labeled "Projects" is immediately understood.
Content design - sometimes called UX writing - is a discipline in its own right precisely because words are consequential to experience quality. Teams that treat copy as a final step to be filled in after design is complete consistently produce confusing interfaces.
Dimension 2: Visual Design
Visual design in the UX context is not aesthetics for its own sake. It is the use of visual elements to communicate structure, hierarchy, and meaning.
Typography that establishes a clear visual hierarchy tells users what to read in what order. Color that is applied with semantic intent - primary blue for default actions, orange for warnings, red for errors - gives users pattern recognition they can use across the product. Consistent iconography creates a visual vocabulary users learn once and apply everywhere.
The measure of effective visual design in UX is not whether it looks impressive. It is whether it makes the interface easier to understand and use.
Dimension 3: Physical Space
Physical space in software UX refers to how layout and spatial organization communicate relationships between elements and guide attention.
Proximity is the primary tool: elements that are close together are perceived as related; elements that are far apart are perceived as distinct. A form label that is positioned above the correct input field is unambiguous. A form label with ambiguous proximity to two adjacent fields creates confusion.
White space is also a structural element, not merely decoration. Generous white space around a primary action button draws attention to it. Dense white space in a data-heavy dashboard creates visual groupings that make complex information scannable.
Dimension 4: Time
The time dimension encompasses how a user's experience unfolds across sessions - through onboarding, through repeated use, through feature discovery over time. It also encompasses the temporal behavior of the interface itself: animations, transitions, loading states, and feedback timing.
Animations and transitions serve UX purposes when they are used to communicate cause-and-effect relationships, indicate that a process is occurring, or provide continuity across state changes. They undermine UX when they introduce delay, obscure the relationship between actions and outcomes, or occur inconsistently.
The onboarding arc - how a product introduces itself over the first session, first week, and first month of use - is a design challenge that operates entirely in the time dimension. A product that reveals capabilities gradually as users are ready for them produces a different experience than one that presents everything at once.
Dimension 5: Behavior
The behavior dimension encompasses how the interface responds to user actions. This includes hover states, click feedback, keyboard interactions, drag-and-drop behavior, and the full range of interactive responses that make an interface feel alive and responsive.
Behavior is where UX most directly intersects with engineering. An animation that was designed to provide satisfying feedback can become jarring if implemented with the wrong easing curve. A tooltip that was designed to appear on hover can become frustrating if it has a 500ms delay that makes it feel sluggish. The design intent and the implemented behavior must align.
Nielsen's 10 Usability Heuristics: A Framework for Evaluation
Jakob Nielsen's 10 usability heuristics, developed through decades of usability research at the Nielsen Norman Group, are the most widely used framework for evaluating the usability quality of an interface. They provide a structured basis for heuristic evaluation - a method where evaluators examine an interface against established principles rather than observing users directly.
1. Visibility of system status
The system should always keep users informed about what is going on through appropriate, timely feedback. Loading indicators, progress bars, submission confirmations, and status indicators all serve this heuristic.
Violation example: A button that, when clicked, produces no visible feedback for 3 seconds before a result appears.
2. Match between system and the real world
The system should speak the user's language - using words, phrases, and concepts familiar to the user, rather than system-oriented terms. Information should appear in a natural and logical order.
Violation example: An interface that refers to "sessions" when users think of them as "meetings," or "entities" when users think of them as "people."
3. User control and freedom
Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Undo and redo are the most common implementations of this heuristic.
Violation example: A delete action that cannot be undone, with no confirmation dialog.
4. Consistency and standards
Users should not have to wonder whether different words, situations, or actions mean the same thing. Platform conventions should be followed unless there is a strong reason to deviate.
Violation example: Pressing Enter to submit a form in most sections, but clicking a button in others.
5. Error prevention
Even better than good error messages is a careful design that prevents problems from occurring in the first place. Confirm options before users commit to irreversible actions.
Violation example: A file upload field that accepts any file type silently, then fails at processing time with an error that could have been prevented by validating the format on selection.
6. Recognition rather than recall
Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another.
Violation example: A multi-step form that requires users to remember a value entered in step 1 to complete step 3, without any display of the earlier value.
7. Flexibility and efficiency of use
Accelerators - unseen by the novice user - may often speed up the interaction for the expert user. Allow users to tailor frequent actions.
Violation example: An app with no keyboard shortcuts that forces power users to navigate entirely by mouse.
8. Aesthetic and minimalist design
Dialogues should not contain irrelevant or rarely needed information. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
Violation example: A dashboard that displays 20 metrics by default when most users only need 4.
9. Help users recognize, diagnose, and recover from errors
Error messages should be expressed in plain language (no error codes), precisely indicate the problem, and constructively suggest a solution.
Violation example: "Error 500: Internal server error." With no context, no cause, and no recovery path.
10. Help and documentation
Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, and not too large.
Violation example: Help documentation that is organized by feature name rather than by the task a user is trying to accomplish.
How to Evaluate UX Quality
Using these frameworks, UX quality can be evaluated through several methods:
Heuristic evaluation: A structured review of an interface against Nielsen's 10 heuristics. Ideally conducted by 3-5 evaluators who compare findings - this method is fast and surfaces a significant proportion of usability problems without user recruitment.
Task completion rate: The percentage of users who successfully complete a given task without assistance. A task with a completion rate below 80% has a significant usability problem.
Time-on-task: How long it takes users to complete a task. Consistently high time-on-task indicates friction in the flow. Trending increases over time may indicate that the product is becoming harder to use as it gains features.
Error rate: The frequency with which users make errors during task completion. High error rates point to unclear affordances, poor labeling, or insufficient feedback.
System Usability Scale (SUS): A standardized 10-question questionnaire that produces a usability score on a 0-100 scale. Scores above 68 are considered above average. SUS is widely used for benchmarking and for tracking improvement over time.
Applying This to Your Product
Understanding these foundations gives you a basis for evaluating your own product rather than relying entirely on intuition. Run a heuristic evaluation against Nielsen's 10 principles. Measure task completion rates for your three most critical flows. Look at where users make errors and what those errors reveal about labeling or feedback gaps.
If your UX/UI design needs a structured assessment - not just a visual refresh but an evaluation of whether your product's experience is actually working - that is the kind of engagement we run. Our UX redesign process starts with this evaluation and uses it to prioritize what to fix first. Contact us to talk through what an assessment would cover for your product.
