Journal tags: whitneyhess



Whitney Hess: Design Principles — The Philosophy of UX

The second speaker at this mornings An Event Apart in Boston is Whitney Hess. Here goes with the liveblogging…

Whitney’s talk is about design principles. As a consultant, she spends a lot of time talking about UX and inevitably, the talk turns to deliverables and process but really we should be establishing a philosophy about how to treat people, in the same way that visual design is about establishing a philosophy about how make an impact. Visual design has principles to achieve that: contrast, emphasis, balance, proportion, rhythm, movement, texture, harmony and unity.

Why have these principles? It’s about establishing a basis for your design decisions, leading to consistency. It’s about having a shared vision and they allow for an objective evaluation of the outcome.

But good design doesn’t necessarily equate to a good experience. The Apple G4 Cube was beautifully designed but it was limited in where and how it could be used.

Good design can equal good experience. That’s why Whitney does what she does. But she needs our help. She’s going to propose a set of design principles that she feels are universally applicable.

  1. Stay out of people’s way. The Tumblr homepage does this. You can find out more about Tumblr further down the page, but it doesn’t assume that’s what you want to have thrust in your face. Instead the primary content is all about getting started with Tumblr straight away.
  2. Create a hierarchy that matches people’s needs. This is about prioritisation. uses different font sizes to match the hierarchy of importance on its “ways to save” page. Give the most crucial elements the greatest prominence. Use hierarchy to help people process information.
  3. Limit distractions. Don’t put pregnancy test kits next to condoms. On the web, Wanderfly does this right: one single path, completely self-contained. Multi-tasking is a myth. Let people focus on one task. Design for consecutive tasks, not concurrent.
  4. Provide strong information scent. Quora does a great job at this with its suggested search options. It’s actively helping you choose the right one. People don’t like to guess haphazardly, they like to follow their nose.
  5. Provide signposts and cues. Labelling is important. The Neiman Marcus e-commerce site does this right. It’s always clear where you are: the navigation is highlighted. You’d think that in 2011 this would be standard but you’d be surprised. Never let people get lost, especially on the web where there’s a limitless number of paths. Show people where they came from and where they’re going.
  6. Provide context. A sign that says “Back in 30 minutes” isn’t helpful if you’re in a hurry—you don’t know when the sign was put up. On the web, AirBnB provides everything you need to know on a listing page, all in one place. It’s self-contained and everything is communicated up-front.
  7. Use constraints appropriately. Preventing error is a lot better than recovering from it. If you know there are restrictions ahead of time, stop people from going down that route in the first place.
  8. Make actions reversible. (illustrated with a misspelled Glee tattoo) Remember The Milk provides an “undo?” link with almost every action. There’s no such thing as perfect design; people will make errors, so you should have a contingency plan. Undo is probably the most powerful control you can provide to people.
  9. Provide feedback. How do you know when you’re asthma inhaler is empty? You don’t. You won’t find out until the worst moment. On the web, loading indicators provide useful feedback. Tell people that a task is underway. Design is a conversation, not a monologue.
  10. Make a good first impression. Vimeo has one of the best first-time user experiences: “Welcome. You’re new, aren’t you?” Establish the rules, set expectations about the relationship you’re about to initiate on your site.

The basis for all of these principles are Aristotle’s modes of persuasion: logos, ethos and pathos—the rhetorical triangle.

Are universal principles enough? Probably not. Every company is different. Some companies publicly share their principles. Take Google’s “Ten Principles That Contribute to a Googley User Experience” as an example, or Facebook’s design principle …or Windows design principles for a good laugh. Look beyond the tech world too, like Charles and Ray Eames or Burning Man’s design principles.

So what are your company’s principles? Without principles, we don’t know what we’re trying to achieve. Here are some guiding ideas:

  1. Research available principles from elsewhere.
  2. Gather, list and print out the business goals and user needs.
  3. Brainstorm with key collaborators.
  4. Narrow down to no more than 10, preferably 7.
  5. Make sure they don’t overlap.
  6. Make them peppy.

Use the design principles at kickoff meetings, when your prioritising features, brainstorming sessions, design critiques, stakeholder presentations, resolving conflict, postmortems and web metric analysis: evaluating the success of the feature or product.

Remember, user experience is the establishment of a philosophy of how to treat people. Help people make their lives better.

DIY UX: Give Your Users an Upgrade (Without Calling In a Pro)

The wonderful Whitney Hess is speaking about DIY UX at An Event Apart in Boston.

We are all user experience designers. Our users are suffering. Let’s help them. Whitney says we can be bumbling DIY hobbyists or we can be professionals.

Meet the founders of Iridesco, based in New York. They make a product called Harvest, a time-tracking, invoicing and billing tool. Their customers have really nice things to say about them. They handle their own help and support. They tried using Get Satisfaction but they saw that not as many people used it. Instead, they use labels in Gmail to tag feature requests and issues. They built a tool for themselves to handle this: Kaizen. They don’t just take feedback at face value, they want to get to the underlying problems.

We don’t just want to patch; we want to address the core problem.

When customers ask for a feature, Iridesco get in touch to try to find out what the customer’s workflow is. That gets to the heart of the problem. For more on design research, read Mike Kuniavsky’s Observing the User Experience.

Iridesco also use web analytics:

We don’t believe in data-driven design, but data doesn’t lie.

(Whitney adds: sometimes it does …data tells you what people are doing but it doesn’t tell you why)

Once glance at Google Analytics shows that people mostly log at the beginning of the week and then there’s a drop-off at the weekend …as you’d expect for a time-tracking tool. But they also noticed fewer visits in the middle of the month. They also use Crazy Egg to find out where people are clicking. Google Website Optimizer lets you do A/B testing. For example, green and blue buttons tested much better than muted grey buttons. They resulted in a 10% improvement in conversion rates.

Meet Matthew Marco. He’s a visual designer working for the House of Representatives. He also uses a lot of the same tools as Iridesco. He worked on which leads to about 600 websites. His biggest impact was on their search infrastructure. He created a big-ass table of search queries. It took thirty minutes a week over the course of nine months, on his own initiative. What he found was staggering: the top search results had no document titles; searches were case-sensitive. He sent a memo …a fairly harsh memo. He blogged it.

One day he noticed three times the number of queries that he normally saw. This was when people had started talking about bailouts. Two days later, the server crashed. Even though he was low down on the totem pole and shouldn’t even had access to the search logs, he was the only one who saw this coming.

For more on web analytics, read Web Analytics: An Hour a Day by Avinash Kaushik.

Usability testing; how well does your stuff really work? Shawn from Iridesco tests prototypes on his wife. This goes against the accepted wisdom on user testing but he knows that his wife will be honest. He doesn’t tell her what the prototype is supposed to do; he doesn’t ask what do you think? He asks what are your general feelings about this? and then lets her talk. The worst feedback you can get is it looks good. You want harshness.

You need to have humility and listen. Users aren’t always right but you need to hear them.

For more on usability testing, read The Handbook of Usability Testing by Jeffrey Rubin and Dana Chisnell.

Experiment and iterate. This is the web; you can be nimble. Risk is okay as long as you are always testing. Here’s the Iridesco process for a new feature:

  1. Sketch
  2. Photoshop
  3. Test
  4. Static HTML prototype
  5. Test again
  6. Working prototype
  7. Test again
  8. Tweak
  9. Launch quietly
  10. Get Feedback
  11. Tweak
  12. Get Feedback
  13. Tweak
  14. Get Feedback
  15. Tweak…

Iterate constantly. You need a culture of experimentation.

Meet Roz Duffy. She works at Comcast interactive media on Her team—the front-end team—has no access to the user experience professionals in other parts of the company. She starting organising design events like Refresh Philly in the company lounge. Her team started gaining new skills because designers were coming into their space; they came to see the value in sketching (just as Jason was saying earlier today). She also puts a bunch of books on her desk (about design, IA, etc.) and encourages her team to borrow them.

We aren’t always working on the most interesting stuff but we always want to work smarter.

Read Sketching User Experiences by Bill Buxton.

To summarise: Always be listening. Ask questions. Use data and anecdotes. Test your designs; try to break them. Complete the feedback loop. Never stop trying to make things better.

Make your users happy and they will thank you …just check out the @harvest feedback on Twitter.