Apple Human Interface Guidelines
`
`User Experience
`
`2009-08-20
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`OpenGL is a registered trademark of Silicon
`Graphics, Inc.
`PowerPC and and the PowerPC logo are
`trademarks of International Business Machines
`Corporation, used under license therefrom.
`Even though Apple has reviewed this document,
`APPLE MAKES NO WARRANTY OR REPRESENTATION,
`EITHER EXPRESS OR IMPLIED, WITH RESPECT TO
`THIS DOCUMENT, ITS QUALITY, ACCURACY,
`MERCHANTABILITY, OR FITNESS FOR A PARTICULAR
`PURPOSE. AS A RESULT, THIS DOCUMENT IS
`PROVIDED “AS IS,” AND YOU, THE READER, ARE
`ASSUMING THE ENTIRE RISK AS TO ITS QUALITY
`AND ACCURACY.
`IN NO EVENT WILL APPLE BE LIABLE FOR DIRECT,
`INDIRECT, SPECIAL, INCIDENTAL, OR
`CONSEQUENTIAL DAMAGES RESULTING FROM ANY
`DEFECT OR INACCURACY IN THIS DOCUMENT, even
`if advised of the possibility of such damages.
`THE WARRANTY AND REMEDIES SET FORTH ABOVE
`ARE EXCLUSIVE AND IN LIEU OF ALL OTHERS, ORAL
`OR WRITTEN, EXPRESS OR IMPLIED. No Apple
`dealer, agent, or employee is authorized to make
`any modification, extension, or addition to this
`warranty.
`Some states do not allow the exclusion or limitation
`of implied warranties or liability for incidental or
`consequential damages, so the above limitation or
`exclusion may not apply to you. This warranty gives
`you specific legal rights, and you may also have
`other rights which vary from state to state.
`
`Apple Inc.
`© 1992, 2001-2003, 2009 Apple Inc.
`All rights reserved.
`
`No part of this publication may be reproduced,
`stored in a retrieval system, or transmitted, in
`any form or by any means, mechanical,
`electronic, photocopying, recording, or
`otherwise, without prior written permission of
`Apple Inc., with the following exceptions: Any
`person is hereby authorized to store
`documentation on a single computer for
`personal use only and to print copies of
`documentation for personal use provided that
`the documentation contains Apple’s copyright
`notice.
`The Apple logo is a trademark of Apple Inc.
`No licenses, express or implied, are granted
`with respect to any of the technology described
`in this document. Apple retains all intellectual
`property rights associated with the technology
`described in this document. This document is
`intended to assist application developers to
`develop applications only for Apple-labeled
`computers.
`Apple Inc.
`1 Infinite Loop
`Cupertino, CA 95014
`408-996-1010
`
`.Mac is a registered service mark of Apple Inc.
`iDisk is a registered service mark of Apple Inc.
`Apple, the Apple logo, Aperture, AppleScript,
`Aqua, Bonjour, Carbon, Chicago, Cocoa, Cover
`Flow, eMac, Exposé, Finder, FireWire, Geneva,
`iBook, iCal, iChat, iPhoto, iPod, iTunes, Keychain,
`Keynote, Leopard, Logic, Mac, Mac OS,
`Macintosh, Numbers, Objective-C, Pages,
`Quartz, QuickDraw, QuickTime, Safari, Spaces,
`Spotlight, Tiger, Time Machine, Velocity Engine,
`and Xcode are trademarks of Apple Inc.,
`registered in the United States and other
`countries.
`iWeb and Multi-Touch are trademarks of Apple
`Inc.
`Helvetica is a registered trademark of
`Heidelberger Druckmaschinen AG, available
`from Linotype Library GmbH.
`Intel and Intel Core are registered trademarks
`of Intel Corportation or its subsidiaries in the
`United States and other countries.
`Java is a registered trademark of Oracle and/or
`its affiliates.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`Contents
`
`Introduction
`
`Introduction to Apple Human Interface Guidelines 19
`
`What Are the Apple Human Interface Guidelines? 19
`Who Should Read This Document? 20
`Organization of This Document 20
`Conventions Used in This Document 20
`See Also 21
`
`Part I
`
`Application Design Fundamentals 23
`
`Chapter 1
`
`The Design Process 25
`
`Involving Users in the Design Process 25
`Know Your Audience 25
`Analyze User Tasks 26
`Build Prototypes 26
`Observe Users 26
`Guidelines for Conducting User Observations 27
`Making Design Decisions 28
`Avoid Feature Cascade 29
`Apply the 80 Percent Solution 29
`
`Chapter 2
`
`Characteristics of Great Software 31
`
`High Performance 31
`Ease of Use 32
`Attractive Appearance 34
`Reliability 34
`Adaptability 36
`Interoperability 37
`Mobility 37
`
`Chapter 3
`
`Human Interface Design 39
`
`Human Interface Design Principles 39
`Metaphors 39
`Reflect the User’s Mental Model 39
`Explicit and Implied Actions 41
`Direct Manipulation 41
`User Control 42
`Feedback and Communication 42
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`3
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`Consistency 43
`WYSIWYG (What You See Is What You Get) 44
`Forgiveness 44
`Perceived Stability 45
`Aesthetic Integrity 45
`Modelessness 46
`Managing Complexity in Your Software 46
`Keep Your Users in Mind 47
`Worldwide Compatibility 47
`Universal Accessibility 49
`Extending the Interface 51
`Build on the Existing Interface 51
`Don’t Assign New Behaviors to Existing Objects 51
`Create a New Interface Element Cautiously 52
`
`Chapter 4
`
`Prioritizing Design Decisions 53
`
`Meet Minimum Requirements 53
`Deliver the Features Users Expect 55
`Differentiate Your Application 56
`
`Part II
`
`The Macintosh Experience 59
`
`Chapter 5
`
`The Mac OS X Environment 61
`
`The Always-On Environment 61
`Disk Size and Usage Information 61
`Displays 61
`The Dock 62
`Conveying Information in the Dock 62
`Clicking in the Dock 62
`The Finder 63
`File Formats and Filename Extensions 64
`Internationalization 64
`Multiple User Issues 65
`Resource Management 66
`Threads 66
`
`Chapter 6
`
`Using Mac OS X Technologies 67
`
`Address Book 67
`Animation 68
`Automator 70
`Bonjour 71
`Colors 71
`
`4
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`Dashboard 72
`High-Level Design Guidelines for Widgets 72
`User-Interface Design Guidelines for Widgets 73
`Fonts 74
`Preferences 75
`Printing 76
`Security 76
`Services 77
`Speech 78
`Spotlight 78
`User Assistance 81
`Apple Help 81
`Help Tags 82
`
`Chapter 7
`
`Software Installation and Software Updates 85
`
`Packaging 85
`Identify System Requirements 85
`Bundle Your Software 85
`Installation 86
`Use Internet-Enabled Disk Images 86
`Drag-and-Drop Installation 86
`Installation Packages 87
`General Installer Guidelines 87
`Setup Assistants 88
`Updating Installed Applications 90
`
`Part III
`
`The Aqua Interface 95
`
`Chapter 8
`
`User Input 97
`
`The Mouse and Other Pointing Devices 97
`Clicking 97
`Double-Clicking 98
`Pressing and Holding 98
`Dragging 98
`The Trackpad 98
`The Keyboard 99
`The Functions of Specific Keys 100
`Keyboard Shortcuts 106
`Keyboard Focus and Navigation 110
`Type-Ahead and Key-Repeat 111
`Selecting 112
`Selection Methods 112
`Selections in Text 115
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`5
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`Selections in Spreadsheets 116
`Selections in Graphics 117
`Editing Text 117
`Inserting Text 117
`Deleting Text 117
`Replacing a Selection 118
`Intelligent Cut and Paste 118
`Editing Text Fields 119
`Entering Passwords 120
`
`Chapter 9
`
`Drag and Drop 121
`
`Drag-and-Drop Overview 121
`Drag-and-Drop Semantics 121
`Move Versus Copy 122
`When to Check the Option Key State 122
`Selection Feedback 122
`Single-Gesture Selection and Dragging 123
`Background Selections 123
`Drag Feedback 123
`Destination Feedback 123
`Windows 124
`Text 124
`Lists 124
`Multiple Dragged Items 125
`Automatic Scrolling 125
`Using the Trash as a Destination 125
`Drop Feedback 125
`Finder Icons 125
`Graphics 126
`Text 126
`Transferring a Selection 126
`Feedback for an Invalid Drop 126
`Clippings 127
`
`Chapter 10
`
`Text 129
`
`Fonts 129
`Style 130
`Inserting Spaces Between Sentences 131
`Using the Ellipsis Character 131
`Using the Colon Character 132
`Labels for Interface Elements 135
`Capitalization of Interface Element Labels and Text 136
`Using Contractions in the Interface 137
`Using Abbreviations and Acronyms in the Interface 137
`
`6
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`Developer Terms and User Terms 138
`
`Chapter 11
`
`Icons 139
`
`Icon Genres and Families 139
`Application Icons 140
`User Application Icons 140
`Viewer, Player, and Accessory Icons 142
`Utility Icons 142
`Document Icons 142
`Toolbar Icons 143
`Icons for Plug-ins, Hardware, and Removable Media 144
`Icon Perspectives and Materials 145
`Creating Icons 147
`Tips for Designing Icons 147
`A Suggested Process for Creating Icons 148
`Creating Icons for Mac OS X v10.5 and Later 149
`Scaling Your Artwork 151
`Designing Toolbar Icons 152
`Designing Icons for Icon Buttons 153
`Designing Icons for Capsule-Style Toolbar Controls 154
`Designing Icons for Rectangular-Style Toolbar Controls 154
`System-Provided Images 155
`System-Provided Images for Use in Controls 156
`System-Provided Images for Use as Standalone Buttons 157
`System-Provided Images for Use as Toolbar Items 158
`System-Provided Images that Indicate Privileges 160
`A System-Provided Drag Image 160
`
`Chapter 12
`
`Pointers 161
`
`Standard Pointers 161
`Designing Your Own Pointers 163
`
`Chapter 13
`
`Menus 165
`
`Menu Behavior 165
`Designing the Elements of Menus 167
`Titling Menus 167
`Naming Menu Items 167
`Using Icons in Menus 169
`Using Symbols in Menus 170
`Toggled Menu Items 172
`Grouping Items in Menus 173
`Hierarchical Menus (Submenus) 174
`The Menu Bar and Its Menus 175
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`7
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`The Apple Menu 177
`The Application Menu 177
`The File Menu 179
`The Edit Menu 181
`The Format Menu 183
`The View Menu 184
`Application-Specific Menus 186
`The Window Menu 186
`The Help Menu 187
`Menu Bar Extras 188
`Contextual Menus 188
`Dock Menus 190
`
`Chapter 14
`
`Windows 191
`
`Types of Windows 191
`Window Appearance 192
`Window Elements 194
`The Title Bar 197
`Toolbars 200
`Scope Bars 205
`Source Lists 208
`Bottom Bars 212
`Drawers 214
`Window Behavior 216
`Opening Windows 216
`Naming New Windows 217
`Positioning Windows 218
`Moving Windows 220
`Resizing and Zooming Windows 220
`Minimizing and Expanding Windows 221
`Closing Windows 221
`Window Layering 222
`Scrolling Windows 225
`Panels 227
`Inspector Windows 229
`Transparent Panels 230
`Fonts Window and Colors Window 234
`About Windows 234
`Dialogs 235
`Types of Dialogs and When to Use Them 235
`Dialog Appearance and Behavior 240
`Find Windows 243
`Preferences Windows 243
`The Open Dialog 245
`Dialogs for Saving, Closing, and Quitting 246
`
`8
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`The Choose Dialog 251
`The Print Dialog 253
`
`Chapter 15
`
`Controls 255
`
`Window-Frame Controls 255
`Determining the State of a Window-Frame Control from its Appearance 256
`Rectangular-Style Toolbar Controls 257
`Capsule-Style Toolbar Controls 261
`Legacy Toolbar Controls 264
`Buttons 265
`Push Buttons 265
`Icon Buttons 269
`Scope Buttons 271
`Gradient Buttons 273
`The Help Button 276
`Bevel Buttons 277
`Round Buttons 279
`Selection Controls 280
`Radio Buttons 280
`Checkboxes 283
`Segmented Controls 286
`Icon Buttons and Bevel Buttons with Pop-Up Menus 288
`Pop-Up Menus 289
`Action Menus 293
`Combination Boxes 295
`Path Controls 298
`Color Wells 300
`Image Wells 300
`Date Pickers 301
`Command Pop-Down Menus 303
`Sliders 305
`The Stepper Control (Little Arrows) 309
`Placards 310
`Indicators 310
`Progress Indicators 311
`Level Indicators 316
`Text Controls 321
`Static Text Fields 321
`Text Input Fields 322
`Token Fields 325
`Search Fields 326
`Scrolling Lists 328
`View Controls 329
`Disclosure Triangles 329
`Disclosure Buttons 331
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`9
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`CONTENTS
`
`List Views 333
`Column Views 334
`Split Views 336
`Tab Views 338
`Grouping Controls 341
`Separators 342
`Group Boxes 344
`
`Chapter 16
`
`Layout Guidelines 347
`
`Positioning Regular-Size Controls in a Window Body 347
`A Simple Preferences Window 347
`A Tabbed Window 350
`A Standard Alert 353
`A Dialog with a List View 354
`Positioning Small and Mini Controls in a Window Body 356
`Layout Example for Small Controls 356
`Layout Example for Mini Controls 359
`Grouping Controls in a Window Body 361
`Grouping with White Space 361
`Grouping with Separators 362
`Grouping with Group Boxes 363
`Positioning Text and Controls in a Bottom Bar 365
`
`Appendix A
`
`Keyboard Shortcuts Quick Reference 367
`
`Glossary 375
`
`Document Revision History 383
`
`Index 387
`
`10
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`Figures and Tables
`
`Chapter 4
`
`Prioritizing Design Decisions 53
`
`Figure 4-1
`
`Prioritizing design decisions in three layers 53
`
`Chapter 6
`
`Using Mac OS X Technologies 67
`
`Figure 6-1
`Figure 6-2
`Figure 6-3
`Figure 6-4
`Figure 6-5
`Figure 6-6
`Figure 6-7
`Figure 6-8
`Figure 6-9
`Figure 6-10
`Figure 6-11
`Figure 6-12
`
`A people-picker window as used in Mail 67
`Animation allows items in a stack to emerge smoothly 68
`Colors window 71
`Dashboard widgets 72
`Fonts window 74
`Minimal Fonts window 74
`Typography inspector 75
`Print options available in Mac OS X 76
`The Spotlight icon and search field 79
`Spotlight search in a contextual menu 79
`A Spotlight results window 80
`A help tag 82
`
`Chapter 7
`
`Software Installation and Software Updates 85
`
`Figure 7-1
`Figure 7-2
`Figure 7-3
`Figure 7-4
`Figure 7-5
`
`Examples of assistant icons 88
`A setup assistant window 89
`An application-update preferences window 91
`An alert to describe the availability of a free application update 92
`An alert to describe the availability of a for-purchase upgrade 93
`
`Chapter 8
`
`User Input 97
`
`Figure 8-1
`Figure 8-2
`Figure 8-3
`Figure 8-4
`Figure 8-5
`Figure 8-6
`Figure 8-7
`Figure 8-8
`Table 8-1
`Table 8-2
`Table 8-3
`Table 8-4
`
`Keyboard focus for a text field 110
`Keyboard focus for a scrolling list 110
`Primary highlight color on child item; secondary color on parent 111
`Selection of a single item 112
`Selection of a range 113
`Shift-clicking in the addition model and the fixed-point model 113
`Discontinuous selection 114
`Discontinuous selection within an array 114
`103
`Moving the insertion point with the arrow keys
`104
`Extending text selection with the Shift and arrow keys
`Keyboard shortcuts reserved by the operating system 107
`Key combinations reserved for international systems 108
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`11
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Table 8-5
`
`Table 8-6
`
`Recommended keyboard shortcuts using Shift to complement other commands
`109
`Example of using Option to modify a shortcut already using Command 109
`
`Chapter 9
`
`Drag and Drop 121
`
`Table 9-1
`
`Common drag-and-drop operations and results 122
`
`Chapter 10
`
`Text 129
`
`Figure 10-1
`Figure 10-2
`Figure 10-3
`Figure 10-4
`
`Figure 10-5
`Figure 10-6
`Figure 10-7
`Figure 10-8
`
`Table 10-1
`Table 10-2
`Table 10-3
`
`Don't use a colon in the title of a group box 133
`Use a colon in text that precedes a control on the same line 133
`Use a colon in text that precedes the first control in a vertical list of controls 134
`Use a colon in text that precedes the first control in a horizontal list of controls
`134
`Use a colon in introductory text that appears above a control 134
`Use a colon in checkbox or radio button text that introduces a second control 134
`A colon is recommended in a sentence that is completed by a control's value 135
`A colon is optional if the text following the control forms a substantial part of the
`sentence 135
`Carbon constants and Cocoa methods for system fonts 130
`Proper capitalization of onscreen elements 136
`Translating developer terms into user terms 138
`
`Chapter 11
`
`Icons 139
`
`Figure 11-1
`
`Figure 11-2
`
`Figure 11-3
`Figure 11-4
`Figure 11-5
`Figure 11-6
`Figure 11-7
`Figure 11-8
`Figure 11-9
`Figure 11-10
`Figure 11-11
`Figure 11-12
`Figure 11-13
`Figure 11-14
`Figure 11-15
`Figure 11-16
`Figure 11-17
`Figure 11-18
`
`Application icons of different genres—user applications and utilities—shown as
`they can appear in the Dock 139
`Two icon genres: User application icons in top row; utility icons in bottom row
`140
`An icon family: The iTunes application icon and its associated icons 140
`The TextEdit application icon makes it obvious what this application is for 141
`The Preview application icon: An example of a tool element 141
`The Stickies application icon: Effective without the addition of a tool 141
`The icons for QuickTime Player, DVD Player, and Calculator 142
`Discriminating use of color in the Activity Monitor and System Profiler icons 142
`Icons for the Preview application and a Preview document 143
`Incorrect and correct badging of a document icon 143
`Keynote toolbar icons portray objects and tasks in a simple, streamlined way 143
`A plug-in icon 144
`Icons for external (top row) and internal hardware devices 144
`Icons for removable media 145
`Perspective for application icons: Sitting on a desk in front of you 145
`Perspective for flat utility icons 146
`Perspective for three-dimensional objects 146
`Perspective for toolbar icons 146
`
`12
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Figure 11-19
`Figure 11-20
`Figure 11-21
`
`Figure 11-22
`
`Figure 11-23
`Figure 11-24
`Figure 11-25
`
`Figure 11-26
`
`Figure 11-27
`Figure 11-28
`Figure 11-29
`Table 11-1
`Table 11-2
`Table 11-3
`Table 11-4
`Table 11-5
`Table 11-6
`
`Materials: Transparency used to convey meaning 147
`A 512 x 512 pixel icon should not be a scaled-up 128 x 128 pixel icon 149
`An icon with black edges can include an inner glow to look good in Cover Flow
`150
`Areas of high alpha levels at the lower edge of an icon can get clipped in Cover
`Flow 151
`Three ways to represent toolbar items 152
`When possible, use familiar symbols and images to represent toolbar items 153
`Images inside capsule-style toolbar controls should appear balanced and
`coordinated 153
`The circled icons appear elsewhere in the interface; they retain their perspective
`when used in a toolbar 154
`Standard images as used in the Finder toolbar 155
`The free-standing images can be used as borderless buttons 158
`An image that represents multiple documents in transit between locations 160
`Template images that represent common tasks 156
`Free-standing images that represent common actions 158
`Images that represent system entities 159
`Images that represent common preferences categories 159
`Images that represent standard toolbar items 160
`Images that represent categories of user permissions 160
`
`Chapter 12
`
`Pointers 161
`
`Figure 12-1
`Table 12-1
`
`Spinning wait cursor 163
`Standard pointers in Mac OS X 161
`
`Chapter 13
`
`Menus 165
`
`Figure 13-1
`Figure 13-2
`Figure 13-3
`Figure 13-4
`Figure 13-5
`Figure 13-6
`Figure 13-7
`Figure 13-8
`Figure 13-9
`Figure 13-10
`Figure 13-11
`Figure 13-12
`Figure 13-13
`Figure 13-14
`Figure 13-15
`Figure 13-16
`Figure 13-17
`
`Menu bar, Dock, and contextual menus 165
`Scrolling menu 166
`Menu elements 167
`Dynamic menu items 168
`Icons in the Finder Go menu 169
`Icons in the Safari History menu 170
`Symbols in menus 171
`Don’t use arbitrary symbols in menus 171
`Avoid ambiguous toggled menu items 173
`Grouping items in menus 174
`A hierarchical menu 175
`The menu bar displayed when the Finder is active 176
`A menu title is undimmed, even when all items are unavailable 176
`The Apple menu 177
`The Mail application menu 178
`The File menu 179
`The Edit menu 181
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`13
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Figure 13-18
`Figure 13-19
`Figure 13-20
`Figure 13-21
`Figure 13-22
`Figure 13-23
`Figure 13-24
`
`Figure 13-25
`Table 13-1
`
`A Format menu 183
`A View menu 185
`Finder toolbar customization window 185
`Application-specific menus in Safari 186
`A Window menu 186
`A Help menu 187
`A contextual menu for an icon in the Finder and for a text selection in a document
`189
`The customized iTunes Dock menu 190
`Acceptable characters for use in menus 170
`
`Chapter 14
`
`Windows 191
`
`Figure 14-1
`Figure 14-2
`Figure 14-3
`Figure 14-4
`Figure 14-5
`Figure 14-6
`Figure 14-7
`Figure 14-8
`Figure 14-9
`Figure 14-10
`Figure 14-11
`
`Figure 14-12
`
`Figure 14-13
`Figure 14-14
`Figure 14-15
`Figure 14-16
`Figure 14-17
`Figure 14-18
`Figure 14-19
`Figure 14-20
`Figure 14-21
`Figure 14-22
`Figure 14-23
`
`Figure 14-24
`Figure 14-25
`
`Figure 14-26
`Figure 14-27
`Figure 14-28
`Figure 14-29
`
`Types of windows in Mac OS X 192
`Toolbars and bottom bars are optional window parts 193
`A brushed metal window designed for Tiger changes its look for Leopard 194
`Standard window parts displayed in a document window 195
`A bottom bar in an application window 196
`A scope bar in an application window 197
`Title bar buttons for standard windows 198
`The close button in its unsaved changes state 199
`A proxy icon being dragged to another application 199
`Proxy icons in windows with saved and unsaved changes 200
`A document path pop-up menu, opened by Command-clicking the proxy icon
`200
`Many Tiger applications automatically receive the Leopard look when running in
`Mac OS X v10.5 and later 201
`Many standard icons are available for use in window-frame controls 202
`The RSS pane of the Mail preferences window 202
`The toolbar control 203
`Three options for arranging toolbar items 204
`Toolbar items arranged by functionality 204
`Two styles for toolbar items 205
`A scope bar supports find operations within a window 206
`A scope bar can display filter rows for refining a search 207
`A scope bar can act as a filter 208
`Source lists help users navigate and select collections of objects or data 209
`A source list may support selection in a window, not in the application as a whole
`210
`A source list can contain disclosure triangles 211
`A bottom bar contains controls that affect the window-body contents or
`organization 212
`A bottom bar and its controls can be regular-size or small 213
`Controls in bottom bars can contain system-provided or custom images 214
`An open drawer next to its parent window 215
`The System Preferences window in its default state 217
`
`14
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Figure 14-30
`Figure 14-31
`Figure 14-32
`Figure 14-33
`
`Figure 14-34
`Figure 14-35
`Figure 14-36
`Figure 14-37
`Figure 14-38
`Figure 14-39
`Figure 14-40
`Figure 14-41
`Figure 14-42
`
`Figure 14-43
`
`Figure 14-44
`Figure 14-45
`Figure 14-46
`
`Figure 14-47
`Figure 14-48
`Figure 14-49
`Figure 14-50
`Figure 14-51
`Figure 14-52
`Figure 14-53
`Figure 14-54
`Figure 14-55
`Figure 14-56
`Figure 14-57
`Figure 14-58
`Figure 14-59
`Figure 14-60
`
`Figure 14-61
`Figure 14-62
`Figure 14-63
`Figure 14-64
`
`Appropriate titles for a series of unnamed windows 218
`Examples of correct and incorrect window titles 218
`Placement of a new nondocument window 219
`Appropriate placement of a new window on a system with multiple monitors (the
`user moved the first window to span the screens) 220
`Main, key, and inactive windows 223
`An inactive window with controls that support click-through 224
`The Delete button on the inactive window does not support click-through 225
`The elements of a scroll bar 226
`Examples of standard panels 228
`Panel controls 229
`An inspector window 230
`An example of a transparent panel 231
`A transparent panel allows users to make adjustments without distracting them
`from the main window 232
`A transparent panel can be appropriate for tasks that focus on highly visual content
`233
`The Fonts window and Colors window provided by Mac OS X 234
`Example of an About window 234
`The Save Changes alert: An example of using a sheet to display a document-modal
`dialog 236
`A standard alert 238
`A customized alert showing the caution icon badged with an application icon 239
`A poorly written alert message 239
`An improved alert message 239
`A well-written alert message 240
`Position of buttons at the bottom of a dialog 241
`A Find window 243
`An example of a preferences window 244
`An Open dialog 245
`A customized Open dialog 246
`The minimal (collapsed) Save dialog 247
`The expanded Save dialog 248
`A Save Changes alert for an application that is not document-based 250
`The Review Changes (application-modal) alert that appears when the user quits
`with more than one unsaved document open 250
`Alert for confirming replacing a file 251
`A Choose dialog 252
`A Print dialog (a sheet attached to a document window) 253
`The Page Setup dialog 254
`
`Chapter 15
`
`Controls 255
`
`Figure 15-1
`Figure 15-2
`Figure 15-3
`
`Variations of the rectangular-style toolbar control 257
`Rectangular-style toolbar controls in a toolbar 258
`Rectangular-style toolbar controls in a bottom bar 258
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`15
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Figure 15-4
`Figure 15-5
`Figure 15-6
`Figure 15-7
`Figure 15-8
`Figure 15-9
`Figure 15-10
`Figure 15-11
`
`Figure 15-12
`Figure 15-13
`Figure 15-14
`Figure 15-15
`Figure 15-16
`Figure 15-17
`Figure 15-18
`Figure 15-19
`Figure 15-20
`Figure 15-21
`Figure 15-22
`Figure 15-23
`Figure 15-24
`Figure 15-25
`Figure 15-26
`Figure 15-27
`Figure 15-28
`Figure 15-29
`Figure 15-30
`Figure 15-31
`Figure 15-32
`Figure 15-33
`Figure 15-34
`Figure 15-35
`Figure 15-36
`Figure 15-37
`Figure 15-38
`Figure 15-39
`Figure 15-40
`Figure 15-41
`Figure 15-42
`Figure 15-43
`Figure 15-44
`Figure 15-45
`Figure 15-46
`Figure 15-47
`Figure 15-48
`
`Toggle controls in the iCal bottom bar clearly indicate their current state 260
`A capsule-style toolbar control used as a segmented control 262
`Capsule-style toolbar controls in a toolbar 263
`Examples of push buttons in different types of windows 266
`A push button label can include an ellipsis 268
`OK and Cancel buttons
`268
`Icon button examples 269
`Example relationships of the icon, button, and hit-target dimensions in an icon
`button 270
`Recessed scope buttons used to define the scope of a look-up 272
`Round rectangle scope buttons used to save, change, and set scoping criteria 272
`Gradient buttons used to add and remove items in a list 274
`Gradient buttons can behave in different ways 275
`Help button in a preferences pane 276
`Bevel buttons in an inspector window 277
`Bevel button examples 278
`Examples of round buttons 279
`Radio buttons offer mutually exclusive choices 280
`A radio button can change the state of an application 281
`Radio button label alignment 282
`Checkboxes provide on-off choices to the user 283
`Checkboxes can be indented to show a dependent relationship 284
`Checkbox label alignment 285
`Segmented controls can be used as radio buttons 286
`Segmented controls can contain icons or text 287
`Bevel and icon buttons can include pop-up menus 289
`Pop-up menus provide users with menu functionality in a control 290
`An open pop-up menu 291
`A pop-up menu with an introductory label and menu-item text 292
`Pop-up menus stacked vertically 293
`An Action menu in the Finder toolbar 293
`An Action menu can be below a list view or source list 294
`A combo box allows users to select from a list or supply their own item 296
`A combo box with the list open 296
`A combo box with an introductory label and list-item text 297
`A path control displays the path of the current item 298
`A path control can accommodate a large number of locations 299
`Color wells in an inspector window 300
`An image well in a preferences pane 301
`Textual and graphical date pickers in a preferences pane 302
`A textual date-picker control 302
`A graphical date-picker control 303
`A command pop-down menu in the Colors window 303
`An open command pop-down menu 304
`A command pop-down menu 304
`Sliders allow users to choose from a continuous range of values 305
`
`16
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Figure 15-49
`Figure 15-50
`Figure 15-51
`Figure 15-52
`Figure 15-53
`Figure 15-54
`Figure 15-55
`
`Figure 15-56
`Figure 15-57
`
`Figure 15-58
`Figure 15-59
`Figure 15-60
`Figure 15-61
`
`Figure 15-62
`
`Figure 15-63
`Figure 15-64
`Figure 15-65
`Figure 15-66
`Figure 15-67
`Figure 15-68
`Figure 15-69
`Figure 15-70
`Figure 15-71
`Figure 15-72
`Figure 15-73
`Figure 15-74
`Figure 15-75
`Figure 15-76
`Figure 15-77
`Figure 15-78
`Figure 15-79
`Figure 15-80
`Figure 15-81
`Figure 15-82
`Figure 15-83
`Figure 15-84
`Figure 15-85
`Figure 15-86
`Figure 15-87
`
`Figure 15-88
`Figure 15-89
`
`A circular slider 306
`A linear slider without tick marks should display a round thumb 307
`Examples of different types of sliders 307
`Stepper controls in a panel 309
`A regular-size stepper control 310
`A placard 310
`A determinate progress bar provides feedback on a process with a known duration
`312
`The active and inactive appearance of a determinate progress bar 313
`An indeterminate progress bar provides feedback on a process of unknown duration
`313
`The active and inactive appearance of an indeterminate progress bar 314
`An asynchronous progress indicator provides feedback on a process 315
`A regular-size asynchronous progress indicator 315
`A continuous capacity indicator shows a fine-grained representation of current
`capacity 316
`A discrete capacity indicator shows a medium-grained representation of current
`capacity 317
`A continuous capacity indicator displaying values in three different ranges 318
`A discrete capacity indicator displaying values in three different ranges 318
`A rating indicator shows the user-assigned rating for an item 319
`Rating indicators showing different ratings 319
`A relevance indicator shows the relevance of each item in a list 320
`Relevance indicator states 321
`Static text fields provide information to users 322
`A text input field allows the user to supply information 323
`A regular-size text input field in various states 324
`A token field control in use 325
`A token field control can display a contextual menu 326
`A search field in a toolbar 327
`A regular-size search field 328
`A disclosure triangle can reveal more dialog contents 330
`Disclosure triangles 331
`A disclosure button expands a Save dialog 332
`A list view in a window 333
`A list view with disclosure triangles 334
`A column view is useful for displaying a hierarchy of objects 335
`The pointer changes when it hovers over a splitter 336
`A window can have multiple split views 337
`A tab view allows switching among multiple panes in a window 338
`Tab panes inset from the edge of a window 340
`Tab panes edge to edge 340
`Acceptable, but not recommended, usage of a pop-up menu to switch among
`panes 341
`Separators divide controls into subgroups or categories 342
`Separators 343
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`17
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`FIGURES AND TABLES
`
`Figure 15-90
`Table 15-1
`
`Group boxes can organize controls in a window 344
`Window-frame control appearances, based on window state and control state 256
`
`Chapter 16
`
`Layout Guidelines 347
`
`Figure 16-1
`Figure 16-2
`Figure 16-3
`Figure 16-4
`Figure 16-5
`Figure 16-6
`Figure 16-7
`Figure 16-8
`Figure 16-9
`Figure 16-10
`Figure 16-11
`Figure 16-12
`Figure 16-13
`Figure 16-14
`Figure 16-15
`Figure 16-16
`Figure 16-17
`Figure 16-18
`Figure 16-19
`Figure 16-20
`Figure 16-21
`Figure 16-22
`Figure 16-23
`Figure 16-24
`Figure 16-25
`Figure 16-26
`
`Preferences window example 348
`Example center-equalization in a preferences window 348
`Example label and control alignment in a preferences window 349
`Example layout of a preferences window 350
`Tabbed window example 351
`Example of center-equalization in a tabbed window 351
`Example of alignment of labels and controls in a tabbed window 352
`Example of layout of a tabbed window 353
`A standard alert example 353
`Layout of a standard alert 354
`Example layout of a list view in a dialog without an icon 355
`Example layout of a list view in a dialog with an icon 355
`Example of a panel with small controls 356
`Center-equalization in a panel with small controls 357
`Alignment of labels and controls in a panel with small controls 358
`Layout of a panel with small controls 359
`Example of a panel with mini controls 360
`Layout of a panel with mini controls 361
`Example of grouping with white space 362
`Example layout using white space 362
`Example of grouping with separators 363
`Example layout using separators 363
`Example of grouping with group boxes 364
`Example layout using group boxes 364
`Layout specifications for a bottom bar with regular-size controls 365
`Layout specifications for a bottom bar with small controls 366
`
`Appendix A
`
`Keyboard Shortcuts Quick Reference 367
`
`Table A-1
`
`Keyboard shortcuts 368
`
`18
`
`2009-08-20 | © 1992, 2001-2003, 2009 Apple Inc. All Rights Reserved.
`
`MemoryWeb Ex. 2021
`Apple v. MemoryWeb – IPR2022-00033
`
`

`

`INTRODUCTION
`
`Introduction to Apple Human Interface
`Guidelines
`
`Apple has the world’s most advanced operating system, Mac OS X, which combines a powerful core foundation
`wit