Designing the Moment: Web Interface Design Concepts in Action

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