You are previewing Designing the Moment: Web Interface Design Concepts in Action.
O'Reilly logo
Designing the Moment: Web Interface Design Concepts in Action

Book Description

The trick to great design is knowing how to think through each decision so that users don't have to. In Designing the Moment: Web Interface Design Concepts in Action, Robert Hoekman, Jr., author of Designing the Obvious, presents over 30 stories that illustrate how to put good design principles to work on real-world web application interfaces to make them obvious and compelling. From the first impression to the last, Hoekman takes a think out loud approach to interface design to show us how to look critically at design decisions to ensure that human beings, the kind that make mistakes and do things we don't expect, can walk away from our software feeling productive, respected, and smart.

Table of Contents

  1. Copyright
    1. Dedication
  2. Acknowledgments
  3. Author Biography
  4. Introduction
    1. Navigating a Moment
    2. The Design of Interactions
      1. Postcards from the real world
      2. Making decisions, out loud
      3. Starting the conversation
    3. And just so you don’t need to take notes
  5. I. Getting Oriented
    1. 1. Designing the First Impression
      1. Discovering the Layout
        1. An ‘Automattic’ jump
      2. Guiding the Eye
        1. Applying the Gutenberg Diagram
        2. Use color to draw attention
    2. 2. Showing Your Personality
      1. Unifying a Design to Form a Positive Impression
        1. Using characters
    3. 3. Zen and the Art of Navigation
      1. Telling the Software What to Do
        1. Everybody wants to direct
        2. Avoid Login syndrome
        3. Say what you do and do what I say
    4. 4. All Links Are Not Created Equal
      1. Using Ambient Signifiers As Navigational Clues
        1. Showing signs of age on the Web
    5. 5. Getting Your Head Out of the Tag Cloud
      1. Justifying Innovation
        1. When to just say no
        2. If you’re not part of the solution . . .
  6. II. Learning
    1. 6. Surfacing the Trigger Words
      1. Why Welcome Messages Are Useless
      2. Designing for Scannability
        1. Call-to-action phrases
    2. 7. Labeling the Interface
      1. Stop Labeling Your Assumptions
    3. 8. Beyond Words and Onto Video
      1. A Moving Picture Is Worth 10,000 Words
        1. Using video to communicate problems
        2. Using video to communicate ideas
          1. Protocast
      2. The Ridiculously Simple Art of Protocasting
  7. III. Searching
    1. 9. Making Suggestions
      1. Using Auto-complete as a Poka-yoke Device
        1. The pitfalls
        2. The right solution at the right time
    2. 10. Getting Through the Results
      1. Trusting the Standards That Actually Work Well
        1. Offering a way back to the results
    3. 11. Refining Your Search
      1. Keeping Advanced Simple
        1. Progressive disclosure in action
        2. Encouraging interaction
  8. IV. Diving In
    1. 12. Standardizing Playback Controls
      1. The Mystery of Programming the VCR
        1. But wait—there’s something better
        2. Learning from the best and improving the rest
    2. 13. Nailing Form Layout
      1. Designing Forms That Flow
      2. Perfecting OK/Cancel
        1. Primary and secondary actions
        2. It matters
    3. 14. Conquering the Wizard
      1. Set Clear Expectations
        1. Establish limits
    4. 15. Going the Extra Mile with Inline Validation
      1. Communicating Errors and Giving Kudos
        1. Updating information in real time
    5. 16. Simplifying Long Forms
      1. Clear Expectations
    6. 17. Getting Them Signed In
      1. Improving on Standards, Again
        1. User name vs. a user’s name
        2. Above and beyond
    7. 18. Counting Characters
      1. Reaching Your Limits
        1. Poka-yoke in editing
        2. A little extra warning
  9. V. Participating
    1. 19. Building Profiles
      1. Progressive Enhancements
        1. From data to dashboard
        2. The blank slate
    2. 20. Editing
      1. The Right Tools at the Right Time
        1. Hiding the advanced stuff
        2. Cleaning up
    3. 21. Making Social Connections
      1. Friends vs. Followers
        1. Not present at time of photo
    4. 22. Designing the Obvious Blog
      1. Three Ways to a Better Blog
        1. The solutions
        2. Follow not the fool
    5. 23. Inviting Discussion
      1. Letting Your Customers Speak
        1. A question of trust
        2. Using your otaku
        3. Flagging the offenders
        4. Get out of the way
    6. 24. Getting a Good Rating
      1. Clarity Over Efficiency
        1. Credit where it’s due
  10. VI. Managing Information
    1. 25. Making RSS Meaningful
      1. Deciphering the Options
    2. 26. Tagging It
      1. Taxonomies, Folksonomies, and Anomalies
        1. Eliminating the language barrier
        2. Explaining new ideas
        3. Making suggestions
        4. Searching, searching, searching
        5. The future of tagging
    3. 27. Getting Reorganized with Drag-and-Drop
      1. The Three States of an Interaction
        1. Invitation
        2. Manipulation
        3. Completion
        4. Feeling complete
        5. Justifying the functionality
    4. 28. Managing Interruption with System Notifications
      1. Designing for Change
        1. Notification areas
      2. Reusable Interface Elements
  11. VII. Moving On
    1. 29. Signing Off
      1. Complicating the Very Simple
      2. Compelling Users to Return
        1. Reusing the space
        2. Getting the message out
    2. 30. Dusting Off Dusty Users
      1. Turning the Inactive into the Devoted
        1. Making it personal
        2. Surveys
        3. A chance to talk back
        4. Don’t overdo it
    3. 31. Letting Them Go
      1. Losing Gracefully
        1. Tying up loose ends
        2. Gone, but (possibly) not lost
  12. The Keys to Great Design
    1. Communication Above All Else
    2. It’s Easier To Do It Right
      1. Final note