Tidwell J. Designing Interfaces (Second Edition)
Подождите немного. Документ загружается.
Index 543
social media
background information, 393
basic usage principles, 395–397
basic usage strategies, 394–395
emerging best practices, 393
social media patterns
Content Leaderboard, 397, 434–437
Conversation Starters, 395, 410–413
Editorial Mix, 395, 399–402
Inverted Nano-pyramid, 396, 413–415
News Box, 397, 430–434
Personal Voices, 395, 403–406
Recent Chatter, 438–440
Repost and Comment, 395, 407–409
Sharing Widget, 396, 426–429
Social Links, 395, 424–426
Specialized Streams, 396, 419–423
Timing Strategy, 395, 416–418
SolidSX Software Explorer application, 325
Songza website
Pagination pattern and, 224
Prominent “Done” Button pattern and, 257
Sortable Table pattern
about, 197, 290, 320–322
list display considerations, 195
organizational model for, 283
Tree Table pattern and, 235
sorting data, 289–291, 320–322
SourceForge website, 158
Southwest website, 259, 260
sparklines, defined, 332
Spatial Memory pattern
about, 17
Movable Panels pattern and, 169
navigation and, 287
Specialized Streams pattern
about, 419–423
Social Links pattern and, 425
social media principles and, 396
SPOT Adventures website
Data Brushing pattern and, 314, 315
Datatips pattern and, 299, 302
spotlight effect, 303–307
Spring-Loaded Modes pattern, 51
Stanford Web Credibility Project, 477
Stanza book reader, 456
Starbucks website
Diagonal Balance pattern and, 178
Editorial Mix pattern and, 401
Fat Menus pattern and, 107
Preview pattern and, 265
Recent Chatter pattern and, 439, 440
News Box pattern and, 431
News Stream pattern and, 36
Picture Manager pattern and, 40, 41
Richly Connected Apps pattern and, 472
showing one single thing, 27
social media principles and, 396
Shneiderman, Ben, 311, 340
Sierra Club website, 434
signage, navigation and, 78
Sign-in Tools pattern
about, 115–117
navigation considerations, 85
Spatial Memory pattern and, 17
signposts, defined, 77
similarity (Gestalt principle)
about, 139
Button Groups pattern and, 246
information graphics considerations, 283
page layout considerations, 134
Simon, Herbert, 11
Sitemap Footer pattern
about, 110–114
Accordion pattern and, 163
Bottom Navigation pattern and, 457
Fat Menus pattern and, 107
navigation considerations, 81, 85
Skins and Themes pattern
about, 498, 519–521
cultural references and, 495
skins versus themes, 520
Slate website
Fat Menus pattern and, 108
Sharing Widget pattern and, 426
Social Links pattern and, 424, 425
SlideShare website, 98, 99
Small Multiples pattern
about, 332–335
Multi-Y Graph pattern and, 331
repeated visual motifs and, 496
Smart Menu Items pattern
about, 245, 261–263
Cancelability pattern and, 270
Multi-Level Undo pattern and, 274
SmartMoney website, 336, 337
Smashing Magazine, 114
SMS messages, 427
Social Links pattern
about, 424–426
navigation considerations, 85
Sitemap Footer pattern and, 111
social media principles and, 395
544 Index
repeated visual motifs and, 496
showing lists of things, 28
timeline (information graphics), 294, 298
timestamps
Recent Chatter pattern and, 439
in URLs, 103
Timing Strategy pattern
about, 416–418
Editorial Mix pattern and, 400
social media principles and, 395
Specialized Streams pattern and, 420
Titled Sections pattern
about, 153–155
Accordion pattern and, 160, 161
Center Stage pattern and, 146
Collapsible Panels pattern and, 164
Dashboard pattern and, 46
desktop applications and, 497
Fat Menus pattern and, 107
form design and, 341
Module Tabs pattern and, 156
page layout considerations, 140
Thumbnail Grid pattern and, 210
Visual Framework pattern and, 143
Wizard pattern and, 56
tkdiff application, 125, 126
Tognazzini, Bruce, 184
toolbars
common renderings, 240
Dropdown Chooser pattern and, 380
tool tips
Annotated Scrollbar pattern and, 125
Datatips pattern and, 300
design suggestions for, 244
Multi-Level Help pattern and, 72
touch screens
Datatips pattern and, 299
design challenges, 442
Generous Borders pattern and, 465–466
Hover Tools pattern and, 250
Touch Tools pattern, 448, 454–456
Toyota navigation system, 184
Treemap pattern
about, 336–340
critical design steps, 337
Dynamic Queries pattern and, 310
interpreting, 338
organizational models for, 283
Tree Table pattern
about, 235–236
Alternative Views pattern and, 65
static indicators, 125
Stefaner, Moritz, 326
Stepwise navigational model, 82
Streamlined Branding pattern, 474–476
Streamlined Repetition pattern
about, 19
Macros pattern and, 278
Structured Format pattern
about, 356, 360–361
Forgiving Format pattern and, 358
form design and, 342, 352, 355
Input Hints pattern and, 365
Sumo Paint editor, 51, 52
surveys, 5
T
table of contents, 90
Target website, 121, 122, 227
Task Pane pattern, 256
Technology Review website
Content Leaderboard pattern and, 437
Recent Chatter pattern and, 439, 440
Technorati website, 428
TED website
browsing interface, 44
Contrasting Font Weights pattern and, 516
Visual Framework pattern and, 143, 144,
145
testing, usability, 343
Text Clear Button pattern, 467–468
themes versus skins, 520
Thumbnail-and-Text List pattern
about, 459–461
Grid of Equals pattern and, 150
list display considerations, 195
mobile device design and, 448
News Stream pattern and, 36
repeated visual motifs and, 496
Vertical Stack pattern and, 450
Thumbnail Grid pattern
about, 210–215
Alternative Views pattern and, 65
Carousel pattern and, 216
Dropdown Chooser pattern and, 382
Grid of Equals pattern and, 150
list display considerations, 195
mobile device design and, 448
One-Window Drilldown pattern and, 203,
204
Picture Manager pattern and, 40–45
Pyramid pattern and, 95
Index 545
U
UIM/X builder, 161
undo stacks, 273
University of Maryland, 340
University of Oregon, 331
unordered lists, constructing, 349
URLs
Autocompletion pattern and, 375
Deep-linked State pattern and, 102
Text Clear Button pattern and, 467
timestamps in, 103
usability testing, 343
user behavior. Seebehavioral patterns
utility navigation, 80, 115
UX Magazine
Dashboard pattern, 49
Palette/Canvas screen layout, 54
Wizard pattern, 58
V
Vancouver Olympics website, 425
van Duyne, Douglas K., xix
van Welie, Martijn, xix
verbs. Seeactions and commands
Vertical Stack pattern
about, 448, 449–451
mobile device design and, 445
viewports, defined, 297
Visual Basic language, 279, 280
Visual Complexity website, 327
visual design
angles and curves in, 492
basics of, 488
branding and, 478
color in, 488–489
cultural references in, 495
desktop applications and, 496–498
evoking reactions, 479–487, 488
images in, 494, 497
importance of, 477
positive affect and, 478
repeated visual motifs, 495
spaciousness and crowding in, 492
texture and rhythm in, 493
typography in, 490–492, 497
visual design patterns
Borders That Echo Fonts, 496, 497, 498,
510–512
Contrasting Font Weights, 498, 516–518
Corner Treatments, 496, 497, 498, 507–509
list display considerations, 197
organizational model for, 283
trellis plot, 335
Tufte, Edward
Overview Plus Detail pattern and, 296, 299
Small Multiples pattern and, 332, 335
TurboTax website, 182
TweetDeck application
about, 69
Many Workspaces pattern and, 68, 70
Twitter
background information, 393
Conversation Starters pattern and, 411
Editorial Mix pattern and, 399
Hover Tools pattern and, 249
Input Hints pattern and, 364, 367, 368
Inverted Nano-pyramid pattern and, 413,
414, 415
Many Workspaces pattern and, 68
News Stream pattern and, 28, 34, 35
Personal Recommendations pattern and, 23
Personal Voices pattern and, 402, 403, 404,
405
Repost and Comment pattern and, 408, 409
Richly Connected Apps pattern and, 471
Same-Page Error Messages pattern and,
389, 390
Sharing Widget pattern and, 426, 427
Sign-in Tools pattern and, 116
Social Links pattern and, 424–426
social media principles and, 395
Specialized Streams pattern and, 419–423
Timing Strategy pattern and, 416–418
Two-Panel Selector pattern
about, 198–201
Feature, Search, and Browse pattern and, 31
List Inlay pattern and, 207
News Stream pattern and, 35, 36, 38
One-Window Drilldown pattern and, 202,
203, 204
Picture Manager pattern and, 40–42
Sequence Map pattern and, 118
Settings Editor pattern and, 60
showing lists of things, 28
Wizard pattern and, 56
typography
borders and, 510
Borders That Echo Fonts pattern and,
510–512
Contrasting Font Weights pattern and,
516–518
visual design considerations, 490–492, 497
Do wnl oa d fr om W ow! e Bo ok < ww w.w ow eb oo k. co m>
546 Index
Social Links pattern and, 424, 425
Streamlined Branding pattern and, 476
Williamson, Christopher, 311
Windows operating systems
Action Panel pattern and, 255, 256
Breadcrumbs pattern and, 122
desktop applications and visual design, 496,
497
Diagonal Balance pattern and, 176
Module Tabs pattern and, 157
Settings Editor pattern and, 60
Skins and Themes pattern and, 520
Wired website
Content Leaderboard pattern and, 437
Sharing Widget pattern and, 428
Social Links pattern and, 424
Specialized Streams pattern and, 419, 421,
422
Timing Strategy pattern and, 417
Wizard pattern
about, 55–58
Changes in Midstream pattern and, 12
form design and, 357
navigation considerations, 82
providing tools to create things, 29
Responsive Enabling pattern and, 183
Sequence Map pattern and, 118
Settings Editor pattern and, 59
user motivation to learn and, 8
Word (Microsoft). SeeMicrosoft Office
applications
WordPress web service
Recent Chatter pattern and, 439
Skins and Themes pattern and, 520, 521
workspaces, defined, 69
Wroblewski, Luke, 261, 465
X
Xerox Star, 180
Y
Yahoo! Developer Network, 163
Yahoo! News
Recent Chatter pattern and, 439, 440
Thumbnail-and-Text List pattern and, 460
Yahoo! pattern library
about, xix
pagination patterns, 227
transition types, 128
Vote to Promote pattern, 396, 439
visual design patterns (continued)
Deep Background, 497, 498, 499–503
Few Hues, Many Values, 489, 504–506
Hairlines, 493, 498, 513–515
Skins and Themes, 495, 498, 519–521
Visual Framework pattern
about, 140, 142–145
Prominent “Done” Button pattern and, 258
visually impaired users, 497
Visual Studio, 379
Vlissides, John, xix
Vote to Promote pattern, 396, 439
W
Wall Street Journal website
Content Leaderboard pattern and, 434
Radial Table pattern and, 306, 307
Sitemap Footer pattern and, 113
Walmart website, 473
The Washington Post website
Data Spotlight pattern and, 305, 306
Vertical Stack pattern and, 450, 451
wayfinding, defined, 78
Weather.com website, 331, 357
Weather Underground website, 138
web browsers
Autocompletion pattern and, 378
Cancelability pattern and, 269
Deep Background pattern and, 499
form design and, 347, 349
information graphics considerations,
287–288
Many Workspaces pattern and, 68, 70
Multi-Level Help pattern and, 72–76
Skins and Themes pattern and, 519
Text Clear Button pattern and, 467
Tree Table pattern and, 236
WebMD website, 109
websites. See alsospecific websites
Carousel pattern and, 217
clickable site logos, 105
curved corner usage in, 507
Social Links pattern and, 424–426
Stanford Web Credibility Project, 477
Wee Places website, 314, 315
Welie.com, 45
Whole Foods website
Conversation Starters pattern and, 411, 412
Editorial Mix pattern and, 401, 402
News Box pattern and, 432, 433
Index 547
Specialized Streams pattern and, 422
Thumbnail-and-Text List pattern and, 460,
461
Thumbnail Grid pattern and, 212, 213
timestamps in URLs, 103
Timing Strategy pattern and, 417
Touch Tools pattern and, 455
Z
Zappos website
Personal Voices pattern and, 402, 403, 404
Thumbnail Grid pattern and, 214
zebra striping, 221, 224
Zillow website, 251
zooming
Data Brushing pattern and, 313
Local Zooming pattern and, 316–320
navigation considerations, 288
Overview Plus Detail pattern and, 296
Yahoo! website
Dashboard pattern and, 47
Input Hints pattern and, 368
Input Prompt pattern and, 369
Movable Panels pattern and, 168, 172
Password Strength Meter pattern and, 374
Same-Page Error Messages pattern and, 390
Settings Editor pattern and, 62
Wizard pattern and, 54, 57
Yelp website
collective intelligence and, 394
Recent Chatter pattern and, 439, 440
YouTube website
background information, 393
browsing interface, 42, 44
Collapsible Panels pattern and, 166, 167
Hover Tools pattern and, 252
News Box pattern and, 431
Pagination pattern and, 227
Repost and Comments pattern and, 406
Social Links pattern and, 424
About the Author
Jenifer Tidwell is a writer and consultant in interaction design, information architecture,
and pre-design analysis. She has been designing and building complex applications and
web interfaces for almost two decades. Her clients and past employers include Google,
The MathWorks, nonprofits, and startups. She was one of the first designers to write pat-
terns for user interface design, back in the late 1990s when the concept was first being
applied to software. She lives near Boston, Massachusetts, with her husband, her son,
and a small parrot.
Colophon
The animal on the cover of Designing Interfaces is a Mandarin duck (Aix galericulata), one
of the most beautiful of the duck species. Originating in China, these colorful birds can
be found in southeast Russia, northern China, Japan, southern England, and Siberia. The
males have diverse and colorful plumage, characterized by an iridescent crown, chestnut-
colored cheeks, and a white eye stripe that extends from their red bills to the back of their
heads. Females are less flamboyant in appearance and tend to be gray, white, brown, and
greenish-brown, with a white throat and foreneck.
These birds live in woodland areas near streams and lakes. Being omnivorous, they tend
to have a seasonal diet, eating acorns and grains in autumn; insects, land snails, and
aquatic plants in spring; and dew worms, grasshoppers, frogs, fish, and mollusks during
the summer months.
The mating ritual of Mandarin ducks begins with an elaborate and complex courtship
dance that involves shaking movements, mimed drinking gestures, and preening. Males
fight each other to win a female, but it is ultimately the female who decides her mate.
Mandarin ducklings instinctively follow their notoriously protective mothers, who will
feign injury to distract predators such as otters, raccoon dogs, mink, polecats, eagle owls,
and grass snakes.
Mandarin ducks are not an endangered species, but they are considered to be threatened.
Loggers continuously encroach upon their habitats, and hunters and poachers prize the
males for their plumage. Their meat is considered unpalatable by humans, and they are
generally not hunted for food.
The cover image is from Johnson’s Natural History. The cover font is Adobe ITC Garamond.
The text font is Adobe Minion Pro, and the heading and note font is Adobe Myriad Pro
Condensed.