《iOS Human Interface Guidelines》——Design Principles

设计原则



整体美学


整体美学并不是测量一个app插图的美丽程度或者表述它的风格;而是表示一个app的外表和行为与其功能整合来传达一种连贯的信息的程度。




人们关心一个app是否提供了它承诺的功能,但同时也受到app的外表和行为的很大——有时是潜意识的——影响。比如说,一个帮助人们完成严肃任务的app会通过将装饰性的元素做的精妙且不引人注目和使用标准控件以及可预见的行为来将注意力集中到任务上来。这个app传达了一个关于其目的和身份的清晰的、统一的信息来帮助人们信任它。但如果这个app通过在干扰的、轻浮的、随意的UI中展现任务来传递混乱的信号,人们就会对app的可靠性和可信度产生疑问。


另一方面,在鼓励沉浸式体验的app中——比如游戏——人们会期待迷人的外表,这会带来愉悦、轻松的感受并鼓励探索。人们不会期待在游戏中完成严肃的或生产性的任务,但是他们会期待游戏的外表和行为与其目的相整合。




一致性


一致性让人们可以在一个app的不同部分的UI间或不同app之间传递他们的知识和技能。一个一致性的app不是盲目的复制其他app,也不是在文本上停滞不前;而是关注标准和典型的人们所期望的东西并提供一种内在的一致体验。




思考这些问题来确定一个iOS app是否遵循了一致性的原则:

  • app是否和iOS的标准一致?它是否正确地使用了系统提供的控制器、视图和图标?它是否以用户所期待的方式包含了设备的特性?
  • app其自身是否一致?文本是否使用了同样的术语和风格?同样的图标是否总是表示同样的事情?人们是否能预测在不同地方执行相同操作时产生的结果?自定义的UI元素在整个app中的外表和行为是否一致?
  • 同样的,app是否和其早期的版本一致?术语和意义是否保持一致?基本的概念和基础的功能是否在本质上没有改变?



直接操控

当人们直接操控屏幕上的对象而不是使用单独的控件来操控它们时,他们会更加专注于他们的任务,也会更容易理解他们的动作所带来的结果。



使用多点触控界面,人们可以通过捏来直接展开或收缩一个图像或内容区域。在游戏中,玩家通过屏幕上的对象来直接移动或互动——比如说,一个游戏也许会展示一个用户能够通过旋转打开的锁。

在iOS app中,人们会在这些时候体验直接操控:
  • 旋转或移动设备来影响屏幕上的物体
  • 使用手势来操控屏幕上的物体
  • 能够看见他们的动作有即时的、可见的结果



反馈


反馈可以确认人们的动作,给他们展示结果,并更新他们任务的进展。




内置的iOS app为每一个用户动作提供了可感知的反馈。列表元素和控制器会在人们点击时简短的高亮并且——在操作持续几秒钟后——控制器会显示进展。


精细的动画会给予人们有意义的反馈来帮助弄清楚他们动作的结果。比如说,列表会在添加一行时显示动画来帮助人们看到变化。


声音也可以给人们有用的反馈,但这不应该是唯一的反馈机制,因为人们不会永远听到他们设备的声音。




象征


当一个app中虚拟的对象和操作象征着熟悉的经验时——无论这些经验是基于现实世界还是数字世界——用户会很快理解如何使用app。


一个app最好使用那些不会局限于他们所基于的对象或操作的象征来支持使用或经验。


iOS app有着非常大适用范围的象征,因为人们在直接和屏幕交互。iOS中的象征包括:

  • 移动分层视图来露出他们下方的内容
  • 在游戏中拖拽、轻拂或猛击物体
  • 点击开关、滑动滚动条和旋转选取器
  • 轻拂来在书或杂志中切换页面



用户控制

人——而不是app——才应该发起和控制操作。app可以建议一个操作过程或者警告危险的后果,但app从用户手中夺走决定权通常是错误的。最好的app会在给予人们他们想要的能力和帮助人们避免不想要的结果中找到准确的平衡。



当行为和控制是相似的且可预测的时,用户会感到更多的对一个app的控制力。而当操作是简单和直接的时,用户会很容易的理解并记住它们。

人们期望在一个操作开始前有充足的机会取消它,并且他们期望在执行一个潜在的破坏性操作时得到一次确认他们目的的机会。最后,人们期望可以温和地停止一个正在进行的操作。




本文翻译自 苹果官方开发文档

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Introduction Introduction 9 At a Glance 9 Great iOS Apps Embrace the Platform and HI Design Principles 9 Great App Design Begins with Some Clear Definitions 10 A Great User Experience Is Rooted in Your Attention to Detail 10 People Expect to Find iOS Technologies in the Apps They Use 10 All Apps Need at Least Some Custom Artwork 11 Chapter 1 Platform Characteristics 13 The Display Is Paramount, Regardless of Its Size 13 Device Orientation Can Change 14 Apps Respond to Gestures, Not Clicks 14 People Interact with One App at a Time 15 Preferences Are Available in Settings 16 Onscreen User Help Is Minimal 16 Most iOS Apps Have a Single Window 17 Two Types of Software Run in iOS 17 Safari on iOS Provides the Web Interface 18 Chapter 2 Human Interface Principles 21 Aesthetic Integrity 21 Consistency 21 Direct Manipulation 22 Feedback 22 Metaphors 22 User Control 23 Chapter 3 App Design Strategies 25 Create an Application Definition Statement 25 1. List All the Features You Think Users Might Like 25 2. Determine Who Your Users Are 26 3. Filter the Feature List Through the Audience Definition 26 4. Don’t Stop There 26 Design the App for the Device 27 Embrace iOS UI Paradigms 27 Ensure that Universal Apps Run Well on Both iPhone and iPad 28 Reconsider Web-Based Designs 28 Tailor Customization to the Task 29 Prototype and Iterate 31 Chapter 4 Case Studies: Transitioning to iOS 33 From Mail on the Desktop to Mail on iPhone 33 From Keynote on the Desktop to Keynote on iPad 35 From Mail on iPhone to Mail on iPad 38 From a Desktop Browser to Safari on iOS 41 Chapter 5 User Experience Guidelines 47 Focus on the Primary Task 47 Elevate the Content that People Care About 48 Think Top Down 48 Give People a Logical Path to Follow 48 Make Usage Easy and Obvious 49 Use User-Centric Terminology 50 Minimize the Effort Required for User Input 50 Downplay File-Handling Operations 50 Enable Collaboration and Connectedness 51 De-emphasize Settings 52 Brand Appropriately 53 Make Search Quick and Rewarding 53 Entice and Inform with a Well-Written Description 54 Be Succinct 55 Use UI Elements Consistently 55 Consider Adding Physicality and Realism 56 Delight People with Stunning Graphics 57 Handle Orientation Changes 58 Make Targets Fingertip-Size 60 Use Subtle Animation to Communicate 61 Support Gestures Appropriately 62 Ask People to Save Only When Necessary 63 Make Modal Tasks Occasional and Simple 63 Start Instantly 64 Always Be Prepared to Stop 65 Don’t Quit Programmatically 65 If Necessary, Display a License Agreement or Disclaimer 65 For iPad: Enhance Interactivity (Don’t Just Add Features) 66 For iPad: Reduce Full-Screen Transitions 66 For iPad: Restrain Your Information Hierarchy 67 For iPad: Consider Using Popovers for Some Modal Tasks 69 For iPad: Migrate Toolbar Content to the Top 70 Chapter 6 iOS Technology Usage Guidelines 73 iCloud Storage 73 Multitasking 74 Notification Center 76 Printing 80 iAd Rich Media Ads 81 Quick Look Document Preview 87 Sound 88 Understand User Expectations 88 Define the Audio Behavior of Your App 89 Manage Audio Interruptions 93 Handle Media Remote Control Events, if Appropriate 94 VoiceOver and Accessibility 95 Edit Menu 96 Undo and Redo 98 Keyboards and Input Views 99 Location Services 99 Chapter 7 iOS UI Element Usage Guidelines 101 Bars 101 The Status Bar 101 Navigation Bar 102 Toolbar 105 Tab Bar 106 Content Views 108 Popover (iPad Only) 108 Split View (iPad Only) 111 Table View 113 Text View 121 Web View 122 Container View Controller 123 Alerts, Action Sheets, and Modal Views 123 Alert 123 Action Sheet 127 Modal View 130 Controls 133 Activity Indicator 133 Date and Time Picker 133 Detail Disclosure Button 134 Info Button 135 Label 135 Network Activity Indicator 136 Page Indicator 136 Picker 137 5 2011-10-12 | . 2011 Apple Inc. All Rights Reserved. CONTENTS Progress View 138 Rounded Rectangle Button 139 Scope Bar 139 Search Bar 140 Segmented Control 141 Slider 142 Stepper 143 Switch 143 Text Field 144 System-Provided Buttons and Icons 145 Standard Buttons for Use in Toolbars and Navigation Bars 145 Standard Icons for Use in Tab Bars 148 Standard Buttons for Use in Table Rows and Other UI Elements 149 Chapter 8 Custom Icon and Image Creation Guidelines 151 Tips for Designing Great Icons and Images 152 Tips for Creating Great Artwork for the Retina Display 153 Tips for Creating Resizable Images 154 Application Icons 155 Launch Images 157 Small Icons 159 Document Icons 160 Document Icon Specifications for iPhone 160 Document Icon Specifications for iPad 161 Web Clip Icons 163 Icons for Navigation Bars, Toolbars, and Tab Bars 164 Newsstand Icons 166 Document Revision History 169

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值