AEA12, Crafting Intuitive Web Pages

AEA12, Crafting Intuitive Web Pages Picture

When the page works, your user knows exactly what to do. Everything makes sense and they accomplish their goal, pleased with your site. Yet, often pages don’t work and users get flustered and confused. Turns out that intuitive web pages abide by a set of curiously unintuitive properties. Learn how to merge interaction design, visual design, information architecture, and other skills together to assemble pages that delight your users.

Jared Spool
The Curious Properties of Intuitive Web Pages
@jmspool

Talking about Intuitive Web Pages

Mainframe computers. Don’t push the big red button! Developed by engineers for engineers.

  • Highly Skilled
  • Highly Trained
  • Focused on the Tool

Things started to change in 1981 - IBM Displaywriter. Created for office workers.

  • Not skilled
  • Might not be trained
  • Focused on the work

Theory: The world was divided into two groups - Experts and Novices.

  • Experts - Fonzi, MacGyver
  • Novices - Everyone Else, Zombies

Hyatt Regency - Elevators had no buttons. Used the key card to assign you an elevator. Incredibly efficient for the elevator. 500 UX people couldn’t figure it out. Easy to use, once you know how. That’s the definition of unintuitive.

A Theory of Unintuitive Design

When something is unintuitive, it changes our focus from our original goal to just getting the unintuitive thing to work.

Magic Escalator of Acquired Knowledge. MEoAK

We are interested in two points on the escalator.

  • Current Knowledge
  • Target Knowledge
  • The Gap, the difference between current and target knowledge. This is where we need to do design.

Socially Transmitted Functionality. Things you only know by learning about it from someone else.

  • Keyboard Shortcuts
  • Pull to refresh

Simplifying is when we bring down target knowledge to current knowledge.

Accuweather vs Umbrella Today

Intuitive Design: What I know matches what I need to know.

When the knowledge gap is large and the task is required, our users despise us. When voluntary they avoid it.

Intuitive Design is how we give our users new superpowers.

The disaster known as redesigns

  • Large “Big Box” retailer spent $100,000,000 to redesign website. Launch day: 20% loss in revenues.
  • Large law firm. Redesigned intranet to use MS Sharepoint instead of static HTML. The entire law firm was shut down for three weeks.
  • One of the Top 20 Websites hired a top design firm for a complete UX overhaul. Pageviews decreased on 40% on launch day.
  • United merged with Continental, flipped the switch on website launch. Result: Complaints out the whazoo!

Experienced customers have high current knowledge. When you flip the switch, it goes away. Users are unhappy, of course. Even with training and support tools, they are unhappy.

Amazon doesn’t so big redesigns. They incrementally change / update. Little piece by little piece. You are bringing down

We’ll be successful if, the day it goes live, nobody notices.

All Users Are Equal?

Billion Dollar Website

  • 1.6% Conversion Rate. Out of every 1 million visitors, 16,000 buy something.
  • 20% of users generate 80% of revenue.
  • Out of 16K buyers, 3200 are top buyers.
  • If we are making it intuitive for our users, we want to make it intuitive for our most valuable users. The top spenders should have the most intuitive experience.

Don’t make me feel stupid

We make users feel stupid by the links we use, the choices users have to make, the trivia questions that we make users answer.

Minimum Advertised Price protects the local retailer. Online version makes the user add to cart to see pricing.

Terms and Conditions. Lawyers don’t create intuitive terms and conditions. Copy is just as important as design. Lawyers have to understand that this stuff has to be easy too.

Tool Time vs Goal Time - Sign up (tool time) vs Goal time (using the actual product).

Better Ways Forward

  • Walgreens
  • Amazon One Click
  • Intuit W9 Importer

Customer Journey Map. Useful for mapping in real time the frustration of the user.

Aspirational Experience vs Current experience. The difference between the current experience and aspirational experience is innovation.

Designing for the intuitive

  • To understand current knowledge - watch users.
  • To understand target knowledge - usability tests.
  • Paper Prototyping helps you get to the knowledge gap.

⇠ Next Article Previous Article ⇢

About The Author

G. Brad Hopkins's avatar
  • G. Brad Hopkins
  • About Me: I bought my first computer - an Apple Performa 6320 - when I was in college and have been building websites ever since. These days I spend most of my time writing code and helping to bring interesting projects to life.
  • @gbradhopkins