Design By Medium

The Art of Designing for User Experience

What user experience design involves: understanding people, mapping flows, making things usable and testing them, and how visual design supports each step.

On this page
  1. More than how it looks
  2. Start by understanding people
  3. Map the flow
  4. Usability in everyday terms
  5. Where visual design fits
  6. Prototype and test
  7. Keep improving
  8. Working with others

More than how it looks

When people talk about user experience, they mean the whole of what it is like to use something: finding it, understanding it, getting a task done and feeling reasonably good, or at least not frustrated, afterward. A screen can be beautiful and still be a poor experience if people cannot work out what to do. Equally, a plain-looking tool can be a pleasure if it does what a person needs with little effort.

Graphic designers meet user experience whenever their work is something people must operate, such as a website, an app, a kiosk or a form. Understanding the basics helps visual choices serve the person using the thing.

Start by understanding people

Good experience design begins with questions. Who will use this? What are they trying to do? In what situation, with what knowledge and with what patience? The answers come from design research: talking with people, observing them, looking at how current tools are used and reading support questions. Even a handful of short conversations tends to reveal assumptions that were wrong.

Designers often summarize findings as short descriptions of typical users, sometimes called personas, but these are only useful if grounded in real observation. Treat invented, generic personas with caution.

Map the flow

A flow is the path a person takes to reach a goal: for example, from discovering a service to completing a purchase or booking. Sketching the flow as a sequence of steps shows where the experience is long, confusing or repetitive. Typical questions include:

  • What does the person need to know at each step?
  • Which steps could be removed or combined?
  • What happens when something goes wrong?
  • How does someone return after being interrupted?

Flows also show where structure matters. The way pages and screens connect is the subject of website navigation, and the detail of data entry is covered in form design. Thinking in flows prevents you from perfecting individual screens while the journey between them is awkward.

Usability in everyday terms

Usability is the practical side: can people accomplish what they set out to do, how quickly, how many mistakes do they make and how easily do they recover? Several broad principles help:

  • Make the next step obvious, with clear labels and one primary action per screen.
  • Use familiar patterns. People bring expectations from other products, and surprising them costs effort.
  • Give feedback. When someone presses a button, something visible should confirm it.
  • Prevent errors where possible and explain them kindly when they happen.
  • Keep consistent, so that the same thing looks and behaves the same way everywhere.

That last point connects to design consistency, which makes a product learnable.

Where visual design fits

Visual design is one of the main ways an experience is communicated. It is not decoration added at the end. Some examples of the connection:

  • Visual hierarchy tells people what to look at first, guiding attention through a task.
  • Clear grouping and generous white space reduce clutter and make scanning easier.
  • Strong color contrast and readable type determine whether people can read the interface at all, a core part of accessible design.
  • A distinct, well-placed call to action makes the primary step easy to find.
  • Emotional tone, from friendly to serious, shapes trust, a theme explored in emotional design.

Good visual choices make usability visible. Poor ones, such as low contrast or ambiguous icons, create friction that no amount of polish can hide.

Prototype and test

You do not need a finished product to learn whether a design works. Rough sketches, clickable mockups and simple prototypes let you test ideas cheaply. Ask a few people to attempt realistic tasks while you observe, and resist helping. Note where they pause, misread or take the wrong path. Ask them to think aloud if they are comfortable doing so.

Small tests often reveal the biggest problems. Because individual opinions vary and small samples cannot give precise statistics, look for patterns across several people rather than reacting to one comment. When feedback arrives, the habits discussed in design feedback apply: separate what people did from what they said they would do, and treat suggestions as clues to underlying problems.

Keep improving

Release is rarely the end. Real use shows new problems: unexpected paths, device quirks, missing content. Collect support questions and observe behavior where analytics and privacy practices allow, then revise. Treat the design as something that evolves, and revisit assumptions as audiences and technology change.

Working with others

Experience design is usually shared work among designers, writers, developers and the people who run the service. Clear communication and a shared understanding of the user’s goal prevent teams from optimizing parts at the expense of the whole. A visual designer who understands flows and testing is better placed to propose changes that matter.

The common thread is attention to the person on the other side of the screen. If you keep asking what they are trying to do and whether the design helps them do it, most other decisions become clearer.

The complete guide to design by medium

The Art of Designing for Web
Read the guide

Keep exploring

Guides from other topics

All topics →

What Makes A Good Logo

A plain-language look at the qualities of an effective logo: clarity, distinctiveness, fit, flexibility and longevity, and how to judge a mark against them.

Logo Design 5 min read