Log In
Or create an account ->
Imperial Library
Home
About
News
Upload
Forum
Help
Login/SignUp
Index
Designing Interfaces, Second Edition
Introduction to the Second Edition
Changes in the Second Edition
Preface
Small Interface Pieces, Loosely Joined
About Patterns in General
Other Pattern Collections
About the Patterns in This Book
Audience
How This Book Is Organized
Comments and Questions
Safari® Books Online
Acknowledgments
1. What Users Do
A Means to an End
The Basics of User Research
Users’ Motivation to Learn
The Patterns
Safe Exploration
Instant Gratification
Satisficing
Changes in Midstream
Deferred Choices
Incremental Construction
Habituation
Microbreaks
Spatial Memory
Prospective Memory
Streamlined Repetition
Keyboard Only
Other People’s Advice
Personal Recommendations
2. Organizing the Content: Information Architecture and Application Structure
The Big Picture
Show One Single Thing
Show One Single Thing
Show a List of Things
Provide Tools to Create a Thing
Facilitate a Single Task
The Patterns
Feature, Search, and Browse
What
Use when
Why
How
Examples
News Stream
What
Use when
Why
How
Examples
Picture Manager
What
Use when
Why
How
The Thumbnail Grid
The single-item view
The browsing interface
Examples
In other libraries
Dashboard
What
Use when
Why
How
Examples
In other libraries
Canvas Plus Palette
What
Use when
Why
How
Examples
In other libraries
Wizard
What
Use when
Why
How
“Chunking” the task
Physical structure
Examples
In other libraries
Settings Editor
What
Use when
Why
How
Examples
Alternative Views
What
Use when
Why
How
Examples
In other libraries
Many Workspaces
What
Use when
Why
How
Examples
Multi-Level Help
What
Use when
Why
How
Examples
3. Getting Around: Navigation, Signposts, and Wayfinding
Staying Found
The Cost of Navigation
Keep Distances Short
Keep Distances Short
Navigational Models
Design Conventions for Websites
The Patterns
Clear Entry Points
What
Use when
Why
How
Examples
In other libraries
Menu Page
What
Use when
Why
How
Examples
In other libraries
Pyramid
What
Use when
Why
How
Examples
Modal Panel
What
Use when
Why
How
Examples
In other libraries
Deep-linked State
What
Use when
Why
How
Examples
Escape Hatch
What
Use when
Why
How
Examples
In other libraries
Fat Menus
What
Use when
Why
How
Examples
Sitemap Footer
What
Use when
Why
How
Examples
In other libraries
Sign-in Tools
What
Use when
Why
How
Examples
Sequence Map
What
Use when
Why
How
Examples
In other libraries
Breadcrumbs
What
Use when
Why
How
Examples
In other libraries
Annotated Scrollbar
What
Use when
Why
How
Examples
In other libraries
Animated Transition
What
Use when
Why
How
In other libraries
4. Organizing the Page: Layout of Page Elements
The Basics of Page Layout
Visual Hierarchy: What’s Important? What’s Related?
Visual Hierarchy: What’s Important? What’s Related?
How to make things look important
How to show relationships among page elements
Visual Flow: What Should I Look at Next?
Using Dynamic Displays
The Patterns
Visual Framework
What
Use when
Why
How
Examples
Center Stage
What
Use when
Why
How
Examples
In other libraries
Grid of Equals
What
Use when
Why
How
Examples
In other libraries
Titled Sections
What
Use when
Why
How
Examples
In other libraries
Module Tabs
What
Use when
Why
How
Examples
In other libraries
Accordion
What
Use when
Why
How
Examples
In other libraries
Collapsible Panels
What
Use when
Why
How
Examples
In other libraries
Movable Panels
What
Use when
Why
How
Examples
In other libraries
Right/Left Alignment
What
Use when
Why
How
Examples
In other libraries
Diagonal Balance
What
Use when
Why
How
Examples
Responsive Disclosure
What
Use when
Why
How
Examples
In other libraries
Responsive Enabling
What
Use when
Why
How
Examples
In other libraries
Liquid Layout
What
Use when
Why
How
Examples
In other libraries
5. Lists of Things
Use Cases for Lists
Back to Information Architecture
Some Solutions
The Patterns
Two-Panel Selector
What
Use when
Why
How
Examples
In other libraries
One-Window Drilldown
What
Use when
Why
How
Examples
In other libraries
List Inlay
What
Use when
Why
How
Examples
In other libraries
Thumbnail Grid
What
Use when
Why
How
Examples
In other libraries
Carousel
What
Use when
Why
How
Examples
In other libraries
Row Striping
What
Use when
Why
How
Examples
In other libraries
Pagination
What
Use when
Why
How
Examples
In other libraries
Jump to Item
What
Use when
Why
How
Examples
Alphabet Scroller
What
Use when
Why
How
Examples
Cascading Lists
What
Use when
Why
How
Examples
In other libraries
Tree Table
What
Use when
Why
How
Examples
In other libraries
New-Item Row
What
Use when
Why
How
Examples
In other libraries
6. Doing Things: Actions and Commands
Pushing the Boundaries
The Patterns
Button Groups
What
Use when
Why
How
Examples
In other libraries
Hover Tools
What
Use when
Why
How
Examples
In other libraries
Action Panel
What
Use when
Why
How
Putting the Action Panel on the UI
Structuring the actions
Labeling the actions
Examples
In other libraries
Prominent “Done” Button
What
Use when
Why
How
Examples
In other libraries
Smart Menu Items
What
Use when
Why
How
Examples
Preview
What
Use when
Why
How
Examples
In other libraries
Progress Indicator
What
Use when
Why
How
Examples
In other libraries
Cancelability
What
Use when
Why
How
Examples
Multi-Level Undo
What
Use when
Why
How
Undoable operations
Design an undo stack
Presentation
Examples
In other libraries
Command History
What
Use when
Why
How
Examples
Macros
What
Why
How
Defining the macro
Running the macro
Examples
7. Showing Complex Data: Trees, Charts, and Other Information Graphics
The Basics of Information Graphics
Organizational Models: How Is This Data Organized?
Organizational Models: How Is This Data Organized?
Preattentive Variables: What’s Related to What?
Navigation and Browsing: How Can I Explore This Data?
Sorting and Rearranging: Can I Rearrange This Data to See It Differently?
Searching and Filtering: How Can I See Only the Data That I Need?
The Actual Data: What Are the Specific Data Values?
The Patterns
Overview Plus Detail
What
Use when
Why
How
Examples
In other libraries
Datatips
What
Use when
Why
How
Examples
In other libraries
Data Spotlight
What
Use when
Why
How
Examples
Dynamic Queries
What
Use when
Why
How
Examples
In other libraries
Data Brushing
What
Use when
Why
How
Examples
In other libraries
Local Zooming
What
Use when
Why
How
Examples
In other libraries
Sortable Table
What
Use when
Why
How
Examples
In other libraries
Radial Table
What
Use when
Why
How
Examples
In other libraries
Multi-Y Graph
What
Use when
Why
How
Examples
In other libraries
Small Multiples
What
Use when
Why
How
Examples
In other libraries
Treemap
What
Use when
Why
How
Examples
In other libraries
8. Getting Input from Users: Forms and Controls
The Basics of Form Design
Control Choice
Lists of Items
Lists of Items
Text
Numbers
Dates or Times
The Patterns
Forgiving Format
What
Use when
Why
How
Examples
In other libraries
Structured Format
What
Use when
Why
How
Examples
In other libraries
Fill-in-the-Blanks
What
Use when
Why
How
Examples
In other libraries
Input Hints
What
Use when
Why
How
Examples
In other libraries
Input Prompt
What
Use when
Why
How
Examples
In other libraries
Password Strength Meter
What
Use when
Why
How
Examples
In other libraries
Autocompletion
What
Use when
Why
How
Examples
In other libraries
Dropdown Chooser
What
Use when
Why
How
Examples
In other libraries
List Builder
What
Use when
Why
How
Examples
In other libraries
Good Defaults
What
Use when
Why
How
Examples
In other libraries
Same-Page Error Messages
What
Use when
Why
How
Examples
In other libraries
9. Using Social Media
What This Chapter Does Not Cover
The Basics of Social Media
The Patterns
Editorial Mix
What
Use when
Why
How
Examples
Personal Voices
What
Use when
Why
How
Examples
Repost and Comment
What
Use when
Why
How
Examples
Conversation Starters
What
Use when
Why
How
Examples
Inverted Nano-pyramid
What
Use when
Why
How
Examples
Timing Strategy
What
Use when
Why
How
Examples
Specialized Streams
What
Use when
Why
How
Examples
Social Links
What
Use when
Why
How
Examples
Sharing Widget
What
Use when
Why
How
Examples
In other libraries
News Box
What
Use when
Why
How
Examples
Content Leaderboard
What
Use when
Why
How
Examples
Recent Chatter
What
Use when
Why
How
Examples
10. Going Mobile
The Challenges of Mobile Design
How to Approach a Mobile Design
How to Approach a Mobile Design
1. What do users in a mobile context actually need?
2. Strip the site or app down to its essence
3. If you can, use the device’s hardware
4. Linearize your content
5. Optimize the most common interaction sequences
Some Worthy Examples
The Patterns
Vertical Stack
What
Use when
Why
How
Examples
Filmstrip
What
Use when
Why
How
Examples
Touch Tools
What
Use when
Why
How
Examples
Bottom Navigation
What
Use when
Why
How
Examples
Thumbnail-and-Text List
What
Use when
Why
How
Examples
Infinite List
What
Use when
Why
How
Examples
Generous Borders
What
Use when
Why
How
Examples
Text Clear Button
What
Use when
Why
How
Examples
Loading Indicators
What
Use when
Why
How
Examples
Richly Connected Apps
What
Use when
Why
How
Examples
Streamlined Branding
What
Use when
Why
How
Examples
11. Making It Look Good: Visual Style and Aesthetics
Same Content, Different Styles
The Basics of Visual Design
Color
Color
Typography
Spaciousness and Crowding
Angles and Curves
Texture and Rhythm
Images
Cultural References
Repeated Visual Motifs
What This Means for Desktop Applications
The Patterns
Deep Background
What
Use when
Why
How
Examples
Few Hues, Many Values
What
Use when
Why
How
Examples
In other libraries
Corner Treatments
What
Use when
Why
How
Examples
In other libraries
Borders That Echo Fonts
What
Use when
Why
How
Examples
Hairlines
What
Use when
How
Examples
Contrasting Font Weights
What
Use when
Why
How
Examples
Skins and Themes
What
Use when
Why
How
Examples
In other libraries
A. References
Websites
Books
Index
About the Author
Colophon
← Prev
Back
Next →
← Prev
Back
Next →