没有合适的资源?快使用搜索试试~ 我知道了~
首页苹果用户界面设计指南
苹果用户界面设计指南
需积分: 15 4 下载量 159 浏览量
更新于2024-07-24
收藏 28.2MB PDF 举报
"苹果UI设计规范.pdf"
Apple的人机交互指南是苹果公司为开发者和设计师提供的官方设计标准,旨在确保其软件产品(包括iOS、macOS等)提供一致且优质的用户体验。这份指南详细阐述了苹果对用户界面设计的期望,包括但不限于图标、布局、颜色、字体、交互和动画等方面。
在用户体验部分,苹果强调了以下关键概念:
1. **清晰性(Clarity)**:设计应该直观,易于理解,让用户快速识别并理解功能。这意味着避免使用模糊的图形和语言,确保文字易读,功能一目了然。
2. **深度(Depth)**:通过层次结构和视觉效果,如阴影和过渡,来表现3D空间感,增强用户对屏幕内容层级的理解。
3. **动效(Motion)**:动效应有意义且优雅,用来传达状态变化、引导用户注意和增强交互体验。例如,滑动解锁或页面过渡。
4. **自适应性(Adaptivity)**:设计应当适应不同的设备、屏幕尺寸和方向,确保在iPhone、iPad和Mac上都能提供良好的体验。
5. **易用性(Usability)**:考虑所有用户的需求,包括无障碍功能,确保视觉障碍、听力障碍或其他身体条件的用户也能方便地使用产品。
关于界面元素,苹果提供了以下指导原则:
- **图标设计**:图标应简洁、符号化,且与功能紧密结合。苹果推荐使用系统提供的图标,以保持整体风格一致。
- **按钮和控件**:按钮的文字应该明确,控件的形状和行为要直观。例如,开关按钮的外观应该清晰反映其当前状态。
- **布局**:遵循网格系统,保持内容对齐,确保视觉平衡。使用适当的间距和边距,使界面不显得拥挤。
- **颜色**:颜色应该有目的性,用于区分元素、表达状态或引导用户。苹果提供了系统的颜色方案,鼓励使用这些预设的颜色。
- **字体**:Apple的默认字体是San Francisco,它在各种尺寸下都具有良好的可读性。字体大小和行高应该适中,确保阅读舒适。
- **触摸反馈**:触摸操作应该有明确的响应,比如按钮按下时的视觉变化,以确认用户操作已被接收。
- **导航**:清晰的导航结构可以帮助用户在应用内轻松移动。底部标签栏、侧滑菜单和分页控制器是常见的导航模式。
最后,苹果UI设计规范还提醒开发者尊重其知识产权,未经许可不得擅自复制或商业使用苹果的商标和图像,包括特定的键盘图标。
苹果UI设计规范是一份详尽的指南,旨在帮助开发者和设计师创建出符合苹果设计哲学、提供卓越用户体验的产品。遵循这些规则,可以确保你的应用在苹果生态系统中脱颖而出,赢得用户的喜爱。
Figure 15-4 Toggle controls in the iCal bottom bar clearly indicate their current state 253
Figure 15-5 A capsule-style toolbar control used as a segmented control 255
Figure 15-6 Capsule-style toolbar controls in a toolbar 256
Figure 15-7 Examples of push buttons in different types of windows 259
Figure 15-8 A push button label can include an ellipsis 260
Figure 15-9 OK and Cancel buttons 261
Figure 15-10 Icon button examples 262
Figure 15-11 Example relationships of the icon, button, and hit-target dimensions in an icon
button 263
Figure 15-12 Recessed scope buttons used to define the scope of a look-up 264
Figure 15-13 Round rectangle scope buttons used to save, change, and set scoping criteria 264
Figure 15-14 Gradient buttons used to add and remove items in a list 266
Figure 15-15 Gradient buttons can behave in different ways 267
Figure 15-16 Help button in a preferences pane 268
Figure 15-17 Bevel buttons in an inspector window 269
Figure 15-18 Bevel button examples 270
Figure 15-19 Examples of round buttons 271
Figure 15-20 Radio buttons offer mutually exclusive choices 272
Figure 15-21 A radio button can change the state of an application 273
Figure 15-22 Radio button label alignment 274
Figure 15-23 Checkboxes provide on-off choices to the user 275
Figure 15-24 Checkboxes can be indented to show a dependent relationship 276
Figure 15-25 Checkbox label alignment 277
Figure 15-26 Segmented controls can be used as radio buttons 278
Figure 15-27 Segmented controls can contain icons or text 279
Figure 15-28 Bevel and icon buttons can include pop-up menus 280
Figure 15-29 Pop-up menus provide users with menu functionality in a control 281
Figure 15-30 An open pop-up menu 282
Figure 15-31 A pop-up menu with an introductory label and menu-item text 283
Figure 15-32 Pop-up menus stacked vertically 284
Figure 15-33 An Action menu in the Finder toolbar 284
Figure 15-34 An Action menu can be below a list view or source list 285
Figure 15-35 A combo box allows users to select from a list or supply their own item 287
Figure 15-36 A combo box with the list open 287
Figure 15-37 A combo box with an introductory label and list-item text 288
Figure 15-38 A path control displays the path of the current item 289
Figure 15-39 A path control can accommodate a large number of locations 290
Figure 15-40 Color wells in an inspector window 291
Figure 15-41 An image well in a preferences pane 292
Figure 15-42 Textual and graphical date pickers in a preferences pane 293
Figure 15-43 A textual date-picker control 293
Figure 15-44 A graphical date-picker control 294
Figure 15-45 A command pop-down menu in the Colors window 294
Figure 15-46 An open command pop-down menu 295
Figure 15-47 A command pop-down menu 295
Figure 15-48 Sliders allow users to choose from a continuous range of values 296
16
2008-06-09 | © 1992, 2001-2003, 2008 Apple Inc. All Rights Reserved.
FIGURES AND TABLES
Figure 15-49 A circular slider 297
Figure 15-50 A linear slider without tick marks should display a round thumb 298
Figure 15-51 Examples of different types of sliders 299
Figure 15-52 Stepper controls in a panel 300
Figure 15-53 A regular-size stepper control 301
Figure 15-54 A placard 301
Figure 15-55 A determinate progress bar provides feedback on a process with a known duration
303
Figure 15-56 The active and inactive appearance of a determinate progress bar 304
Figure 15-57 An indeterminate progress bar provides feedback on a process of unknown duration
304
Figure 15-58 The active and inactive appearance of an indeterminate progress bar 305
Figure 15-59 An asynchronous progress indicator provides feedback on a process 306
Figure 15-60 A regular-size asynchronous progress indicator 306
Figure 15-61 A continuous capacity indicator shows a fine-grained representation of current
capacity 307
Figure 15-62 A discrete capacity indicator shows a medium-grained representation of current
capacity 308
Figure 15-63 A continuous capacity indicator displaying values in three different ranges 309
Figure 15-64 A discrete capacity indicator displaying values in three different ranges 309
Figure 15-65 A rating indicator shows the user-assigned rating for an item 310
Figure 15-66 Rating indicators showing different ratings 310
Figure 15-67 A relevance indicator shows the relevance of each item in a list 311
Figure 15-68 Relevance indicator states 312
Figure 15-69 Static text fields provide information to users 313
Figure 15-70 A text input field allows the user to supply information 314
Figure 15-71 A regular-size text input field in various states 315
Figure 15-72 A token field control in use 316
Figure 15-73 A token field control can display a contextual menu 317
Figure 15-74 A search field in a toolbar 318
Figure 15-75 A regular-size search field 319
Figure 15-76 A disclosure triangle can reveal more dialog contents 321
Figure 15-77 Disclosure triangles 322
Figure 15-78 A disclosure button expands a Save dialog 323
Figure 15-79 A list view in a window 324
Figure 15-80 A list view with disclosure triangles 325
Figure 15-81 A column view is useful for displaying a hierarchy of objects 326
Figure 15-82 The pointer changes when it hovers over a splitter 327
Figure 15-83 A window can have multiple split views 328
Figure 15-84 A tab view allows switching among multiple panes in a window 329
Figure 15-85 Tab panes inset from the edge of a window 331
Figure 15-86 Tab panes edge to edge 331
Figure 15-87 Acceptable, but not recommended, usage of a pop-up menu to switch among
panes 332
Figure 15-88 Separators divide controls into subgroups or categories 333
Figure 15-89 Separators 334
17
2008-06-09 | © 1992, 2001-2003, 2008 Apple Inc. All Rights Reserved.
FIGURES AND TABLES
Figure 15-90 Group boxes can organize controls in a window 335
Chapter 16
Layout Guidelines 337
Figure 16-1 Preferences window example 338
Figure 16-2 Example center-equalization in a preferences window 338
Figure 16-3 Example label and control alignment in a preferences window 339
Figure 16-4 Example layout of a preferences window 340
Figure 16-5 Tabbed window example 341
Figure 16-6 Example of center-equalization in a tabbed window 341
Figure 16-7 Example of alignment of labels and controls in a tabbed window 342
Figure 16-8 Example of layout of a tabbed window 343
Figure 16-9 A standard alert example 343
Figure 16-10 Layout dimensions for a standard alert 344
Figure 16-11 Example of a panel with small controls 345
Figure 16-12 Center-equalization in a panel with small controls 345
Figure 16-13 Alignment of labels and controls in a panel with small controls 346
Figure 16-14 Layout dimensions for a panel with small controls 347
Figure 16-15 Example of a panel with mini controls 348
Figure 16-16 Layout dimensions for a panel with mini controls 349
Figure 16-17 Example of grouping with white space 350
Figure 16-18 Layout dimensions using white space 350
Figure 16-19 Example of grouping with separators 351
Figure 16-20 Layout dimensions using separators 351
Figure 16-21 Example of grouping with group boxes 352
Figure 16-22 Layout dimensions using group boxes 352
Figure 16-23 Layout specifications for a bottom bar with regular-size controls 353
Figure 16-24 Layout specifications for a bottom bar with small controls 354
Appendix A
Keyboard Shortcuts Quick Reference 355
Table A-1 Keyboard shortcuts 356
18
2008-06-09 | © 1992, 2001-2003, 2008 Apple Inc. All Rights Reserved.
FIGURES AND TABLES
Apple has the world’s most advanced operating system, Mac OS X, which combines a powerful core foundation
with a compelling user interface called Aqua. With advanced features and an aesthetically refined use of
color, transparency, and animation, Mac OS X makes computing even easier for new users, while providing
the productivity that professional users have come to expect of the Macintosh. The user interface features,
behaviors, and appearances deliver a well-organized and cohesive user experience available to all applications
developed for Mac OS X.
These guidelines are designed to assist you in developing products that provide Mac OS X users with a
consistent visual and behavioral experience across applications and the operating system. Following the
guidelines is to your advantage because:
■ Users will learn your application faster if the interface looks and behaves like applications they’re already
familiar with.
■ Users can accomplish their tasks quickly, because well-designed applications don’t get in the user’s way.
■ Users with special needs will find your product more accessible.
■ Your application will have the same modern, elegant appearance as other Mac OS X applications.
■ Your application will be easier to document, because an intuitive interface and standard behaviors don’t
require as much explanation.
■ Customer support calls will be reduced (for the reasons cited above).
■ Your application will be easier to localize, because Apple has worked through many localization issues
in the Aqua design process.
■ Media reviews of your product will be more positive; reviewers easily target software that doesn’t look
or behave the way “true” Macintosh applications do.
The implementation of Apple’s human interface principles make the Macintosh what it is: intuitive, friendly,
elegant, and powerful.
What Are the Apple Human Interface Guidelines?
This document is the primary user interface documentation for Mac OS X. It provides specific details about
designing for Aqua compliance in Mac OS X version 10.5, although some of the information may apply to
previous versions of Mac OS X.
Aqua is the overall appearance and behavior of Mac OS X. Aqua defines the standard appearance of specific
user interface components such as windows, menus, and controls, and is also characterized by the anti-aliased
appearance of text and graphics, shadowing, transparency, and careful use of color. Aqua delivers standardized
consistent behaviors and promotes clear communication of status through animated notifications, visual
effects, and more. Designing for Aqua compliance will ensure you provide the best possible user experience
for your customers.
What Are the Apple Human Interface Guidelines? 19
2008-06-09 | © 1992, 2001-2003, 2008 Apple Inc. All Rights Reserved.
INTRODUCTION
Introduction to Apple Human Interface
Guidelines
Aqua is available to Cocoa, Carbon, and Java software. For Cocoa and Carbon application development,
Interface Builder is the best way to begin building an Aqua-compliant graphical user interface. If you are
porting an existing Mac OS 9 application to Mac OS X, see the Carbon Porting Guide. Java developers can use
the Swing toolkit, which includes an Aqua look and feel in Mac OS X.
Who Should Read This Document?
Anyone building applications for Mac OS X should read and become familiar with the contents of this
document. This document combines information on the mechanics of designing a great user interface with
fundamental software design principles and information on leveraging Mac OS X technologies.
Organization of This Document
The document is divided into three main parts, each of which contains several chapters:
■ The first part, “Application Design Fundamentals” (page 23) describes the fundamental design principles
to keep in mind while designing an application.
■ The second part, “The Macintosh Experience” (page 59) discusses many of the Mac OS X technologies
that users are accustomed to using. You can take advantage of these technologies to streamline your
development process and ensure that your application is well-behaved in the context of the operating
system as a whole.
■ The third part, “The Aqua Interface” (page 93) describes the Mac OS X Aqua user interface. It explains
the specific user interface components available to you and includes extensive guidelines on how to use
and implement them in your application.
Supplementary information is provided in the following locations:
■ A listing of the recommended and reserved keyboard shortcuts for Mac OS X, in “Keyboard Shortcuts
Quick Reference” (page 355).
■ A summary of the changes made to this document in its various incarnations appears in “Document
Revision History” (page 371).
■ A listing of the terms used in this document, along with their definitions, is provided in the “Glossary” (page
363).
Conventions Used in This Document
Throughout this document, certain conventions are used to provide additional information:
Some of the example images include visual cues to note whether a particular implementation is appropriate
or not:
■
indicates an example of the correct way to use an interface element.
20
Who Should Read This Document?
2008-06-09 | © 1992, 2001-2003, 2008 Apple Inc. All Rights Reserved.
INTRODUCTION
Introduction to Apple Human Interface Guidelines
剩余385页未读,继续阅读
Ace物华
- 粉丝: 1
- 资源: 4
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- JHU荣誉单变量微积分课程教案介绍
- Naruto爱好者必备CLI测试应用
- Android应用显示Ignaz-Taschner-Gymnasium取消课程概览
- ASP学生信息档案管理系统毕业设计及完整源码
- Java商城源码解析:酒店管理系统快速开发指南
- 构建可解析文本框:.NET 3.5中实现文本解析与验证
- Java语言打造任天堂红白机模拟器—nes4j解析
- 基于Hadoop和Hive的网络流量分析工具介绍
- Unity实现帝国象棋:从游戏到复刻
- WordPress文档嵌入插件:无需浏览器插件即可上传和显示文档
- Android开源项目精选:优秀项目篇
- 黑色设计商务酷站模板 - 网站构建新选择
- Rollup插件去除JS文件横幅:横扫许可证头
- AngularDart中Hammock服务的使用与REST API集成
- 开源AVR编程器:高效、低成本的微控制器编程解决方案
- Anya Keller 图片组合的开发部署记录
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功