Notes on “Design Hacking” by Everett McKay

Based on the deck from a presentation by Everett McKay to the Stanford Igniters, Nov. 14, 2013. See uxdesignedge.com for his summary and to download the deck. I’m focusing mainly on his discussion of UI design here.

Topic Intuitive UI Design   QuickTake An intuitive user interface is essentially a conversation between users and the technology to perform tasks. It’s built around user scenarios and effective human communication; it’s not built around mechanical features and requirements. Using effective communication as the standard of success for UI design greatly lessens the emphasis stakeholder subjectivity

Effective UI design should focus on user goals and scenarios instead of mechanical requirements

KEY CONCEPTS FOR AN EFFECTIVE UI

  • UI is a human conversation between users and the technology to perform tasks
  • UI should be evaluated by how well it communicates
  • User scenarios/stories should drive process (not requirements/features)
  • Focusing on effective communication lessens the influence of stakeholders’ subjectivity
  • Initial iterations usually fail–it’s unreasonable to expect to have correctly captured all user needs and scenarios. Investigate the discrepancies between the product team’s anticipated experience and the actual users’ experience to discover weaknesses in the UI
  • UI should feel like a natural, professional, friendly conversation
  • UI elements communicate via UI text, controls, icons/graphics, colors, animations/transitions, screen layout and comprehensible system feedback
  • UI interactions communicate via tone (attitude UI conveys towards user), respect (consideration for users’ feelings), politeness (good social behavior), forgiveness (preventing and recovering from mistakes), personality (users connect emotionally)

KEYS TO SUCCESS

  • Focus design decisions on concise communication presented in a friendly conversational tone
  • Think about how you would explain a task in person and use that to guide your UI design process
  • Avoid stand-in fake text–using real text can reveal design problems
  • UI should be self-explanatory
  • UI should focus on discoverability, visual affordances, consistency, predictability, efficiency, responsiveness, forgiveness, explorability

INTUITIVE UI DESIGN

  • Is inductive: designed to be self-explanatory while leading users through task steps so they don’t have to continually ponder new functionality/experiment to see how it works
  • First establish the main instruction for each task, then analyze the steps. The quality of the main instruction probably predicts the task’s chance of successful completion
  • Every user’s first question is, how do I use this? Explicitly answer that question in every step of the task sequence
  • If the task flow is still complex or unintuitive, the problem probably hasn’t been correctly defined
  • Once the task steps have been designed, you should be able to remove the main instruction and still understand how to perform the task sequence (though don’t actually remove the instruction!)
  • The goal of the text is to explain how to complete the task and eliminate the need for the user to have to consider how to use/experiment
  • Dashboards aren’t usually intuitive: users generally have one or two main tasks to accomplish but dashboards usually present all possible uses as equally weighted options
  • A successful UI prioritizes user tasks into clear hierarchies. Not every possible task has to be initially shown–better to create a “more” option and hide infrequently-performed tasks

Look to mobile: mobile apps are setting the UI/UX quality bar and raising user expectations. If a free app has great UI/UX, why doesn’t expensive software? Common users now know what good UI/UX is and there’s no going back!

Great UI/UX is often the difference between a successful product and an interesting product you look at once.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s