An Event Apart: Properties of Intuitive Web Pages

by Luke Wroblewski April 2, 2012

At An Event Apart in Seattle WA 2012, Jared Spool walked through what makes a design intuitive, why some users need different treatment, and the role of design. Here are my notes from his The Curious Properties of Intuitive Web Pages presentation:

  • Early computers required engineers to be operated and managed. Then personal computers that could be used by anyone emerged.
  • Around this time the theory of novice and expert computer users emerged. Experts knew how to fix problems when they came up. Novices were people who were new to things but would gradually become experts over time. But this theory doesn’t hold up.
  • Example: a new elevator system that doesn’t require buttons. Everyone that was an expert elevator user couldn’t use these easily the first time. Over time though, they found them easy.
  • It's not novelty that causes problems with intuitiveness, its not simplicity. Intuitive is personal –based on what people currently know and their previous experiences.
  • When something is unintuitive it steals the focus of the user from what they actually want to do. It gets in the way of a task. An intuitive design is when the user is focused on their objective or task.
  • Intuitive is something you learn. For example, once you learn how one scrollbar works, you expect the same elsewhere.
  • An intuitive design is invisible. Good design is invisible. It is like air conditioning –you don’t notice it until something is wrong.

Current vs. Acquired Knowledge

  • Magic Escalator of Acquired Knowledge: when you are at the bottom, you have no knowledge of how something works and when you are t the top, you know everything about how it works (usually only the engineers who built something are here).
  • There are two points on this continuum we care about. Current knowledge (what the users already know), target knowledge (what they need to know), the knowledge gap is the space in between (what we need to design for).
  • A design is intuitive when current knowledge is equal to target knowledge. A design is unintuitive when there is a gap between current & target knowledge.
  • We can reduce target knowledge until it meets current knowledge by simplifying the design. We can move current knowledge to target knowledge through training. These are our two options for design.
  • Socially transmitted functionality: someone has to show you how to do something. You’re unlikely to discover it on your own.
  • A design is intuitive when the knowledge gap is really small. In other words, it’s easy for people to bridge from current knowledge to target knowledge.
  • When people encounter situations where knowledge gap is large and they have to use things –people despise these experiences. If the knowledge gap is large but use is voluntary, people avoid these things. When knowledge gap gets smaller, people either tolerate or are cautious about using things.
  • If knowledge gap is small, people will love the service. That’s the opportunity for you and your competitors.
  • Intuitive design is how we give our users super powers. This enables them to do new things.

Redesigns

  • Redesigns can be a disaster. A major retailer launched a 100M redesign and saw conversion drop 20%. A law firm had to shut down. Doctor’s offices and airlines experience significant delays. Their site was no longer intuitive for their most important users.
  • Redesigns can increase the gap between current and target knowledge. People know how to use things and we switch things up on them.
  • An average conversion rate for large (billion dollar) Web sites is 1.6%. 20% of the users spend 80% of the revenue on a site. Out of every 1 million visitors, 16,000 are buyers, and 320 are the top buyers.
  • It’s the top buyers/users that are most effected by redesigns. They know how things work and we change it on them. This is the source of redesign disasters.
  • Little changes to a site over time are often a better approach than major redesigns. “We’ll be successful if the day we go live, no one notices.”

Design Skills

  • The “gap” between current knowledge and target knowledge is where design happens.
  • Unconscious incompetence: when you don’t know that your design decisions are causing problems.
  • Conscious incompetence: you realize you don’t know what you are doing.
  • Conscious competence: you know what you need to do and are actively learning/doing it.
  • Unconscious competence: you know what you are doing.
  • Visual design: clear communication using visual elements. Type, grid, etc communicates what you need to do next.
  • Interaction design: the movement through the site, the flow of tasks.
  • Information architecture: how we organize the content and information on a site.
  • Information design: display and layering of visual information.
  • Copywriting: the selection of words, tone of voice, and content on a site.
  • Editing & curating: what do we keep in a design, and what do we remove? Mobile first can help you apply constraints that focus on what matters.
  • User research: studying your users to understand target and current knowledge.
  • We have a number of techniques for uncovering knowledge.
  • Field studies: observe people using your products in their natural environment. Helps identify current knowledge.
  • Usability studies: help identify target knowledge and the gap.
  • Paper prototyping: quick way to learn where target and current knowledge sit.
  • Design process management: really just a fancy name for iterating. You can gradually phase design options and ideas out to your customers to learn what works.
  • Amazon’s latest navigation design has been rolling out over the past 14 months.
  • Intuitive design is only possible in small, short iterations.