了解iOS人机界面设计准则 优化产品使用体验

针对智能手机横屏、竖屏应用情境，移动应用终端可以撷取传感器状态判定装置方向对应变化显示内容。Apple

Apple针对iOS应用程序开发者释出的iOS8人机界面准则(Human Interface Guidelines)，清楚阐释了App设计应与操作系统的UI要求规范一致，不仅可以提升终端产品用户一致性的体验，透过规范良好的设计要求，还可避免开发者做出使用经验不佳的产品，与iOS系统一样提供极致操作体验，除了是每个开发者必读的参考文件外，也是从事移动产品设计、应用程序开发、系统平台开发必须参照的重要文件。

iOS 8针对操作人机界面进行各项优化与设计改善，不仅成功为新款iPhone、iPad创造优异的市场反馈，也呼应了智能手机因应大屏化趋势的系统、软件人机界面可改善的操作设计方案。

iOS人机界面准则的参考价值

由于篇幅有限，本文不会针对整份Human Interface Guidelines进行完整检视，仅挑出与移动设备、智能手机与手机大屏化设计趋势相关的设计准则进行讨论，需要检视Human Interface Guidelines完整全文的读者，均可上Apple Developer Library(https://developer.apple.com/library/)查阅完整内容。

首先，Apple建议移动设备设计者必须以Deference、Clarity与Depth三大重点着手。Deference是指人机界面设计应该要能让用户理解其应用功能与进行互动，并需要能让用户专心操作而不分心；Clarity为界面布局与文字，各种大小文字必须均能清晰阅读、图示醒目，尤其避免多余的修饰，才能突出重点，并很好地凸显产品的设计理念；Depth则是对视觉的层次与高度互动操作，可以赋予人机界面更有趣、直觉的操作体验(User Experience)，同时可让用户在操作过程中持续感到惊喜。

关注核心应用  衔接系统生态系的UI风格设计

不管是建立一个全新移动应用、或是延续旧有设计的产品升级，产品开发者都必须重新检视整体人机界面布局与设计改善。改善方式可以尝试去除UI元素，先关注应用的核心功能，先试图以更直接、强调内容或物件的相关性(relevance)进行画面布局。

而在Apple系统平台投放的应用产品，则必须尽量依循iOS的系统UI风格或是UI元件，让终端使用者能有统一的视觉感受与操作体验，是产品设计最基本的要求。

尤其是在多装置、多屏显示尺寸大小差异的产品兼容要求下，目前Apple的iOS装置屏幕分辨率，就有一般分辨率与Retina视网膜屏幕两大规格差异，针对手机或平板，又有不同的长宽比例，对设计者而言，在进行产品开发时，必须注意应用软件投放在不同屏幕设备时，必须维持一致的界面布局与视觉风格。即产品必须能保证UI可适应不同设备、操作模式，才能让终端使用者在不同情境，均能愉快体验产品设计。

应更关注内容应用  核心搭配GUI完美呈现

Apple的Human Interface Guidelines也建议，针对移动设备应用App或服务设计，可以朝以内容为核心(Defer to Content)来整合使用界面与内容布局，反而不要过度强调美观的使用界面，或是充斥大量操作动画效果，因为内容才是移动应用的核心。

将设计聚焦内容应用的设计方法很多，Human Interface Guidelines举天气的应用内容为例，建议类似天气的应用内容，可以将天气图片以全屏幕显示呈现，让终端使用者透过GPS或3G定位，即可直接在操作时，先让用户看到当前的天气状态，不仅可让用户减少大量操作、提升产品体验外，也可充分利用移动设备有限屏幕呈现重要内容，再搭配天气应用的附加功能，如不同时段的气温、降雨状态等参考数据。

扁平化设计风格成主流

在iOS7？8时，即已开始将拟物化的设计去除，取而代之的是更扁平化的设计风格。所谓的扁平化设计，为将UI元素(UI elements)、面板的渐层、阴影美术处理尽量去除，因为这些拟物概念的美术处理，会让操作界面元素显得厚重，甚至过度拟物也会导致用户操作分心，以至于抢去聚焦内容的设计目标。

iOS8的扁平化设计建议，可用半透明底板(如iOS8的控制中心UI效果)处理效果，应用在短暂提示的信息呈现用途上，可让操作暂时聚焦在提示内容，跳出提示后，又可回复到原始操作情境与内容上。

另一个设计重点为Provide Clarity，即应时时关注聚焦应用的重点在于内容本身，核心呈现的也是内容。让内容能更清晰呈现与互动操作的方法，如采行大量留白Use plenty of negative space设计，留白可以让重要内容与功能变得更醒目，也可营造平静、安宁视觉感受，并可让应用产品在界面上能更聚焦与提供高效率操作情境。

另一种手法为以颜色简化UI(Let color simplify the UI)方法操作，对终端应用来说以主题色彩来进行设计，例如记事本应用中使用黄色，让重要的区域可以更为醒目，或是在应用中设计统一的视觉风格。

善用系统字体 提高内容可读性

增加产品内容呈现品质方面，Apple也建议终端开发可透过使用系统字体，来确保内容的易读性(Ensure legibility by using the system fonts)。iOS的系统字体可自动调整行间距、行高，能让阅读应用中的文字更清晰易读。

另一个重点建议为使用无边框的按钮(Embrace borderless buttons)，在缺省情境下，导航栏上的按钮都可以采无边框设计，无边框按钮可搭配颜色或操作指引标题呈现按钮功能，按钮被启动或作用时，按钮可呈现高亮或浅色状态，回应用户操作状态。

对手机或是平板电脑，可使用的屏幕空间有限时，就必须善用深度，来呈现内容的层次(Use Depth to Communicate)。以iOS8系统UI为例，iOS经常需在不同数据层级间展示内容，用不同深度的层级，表达内容分组与位置，同时也能説明使用者在屏幕上的物件间的交互关系。

如可透过在主屏幕上方的半透明设计背景层，区分目前检视数据夹数据，并暂时盖掉其余部分内容。如备忘录应用程序，当用户检视备忘录里的某个纪录项目时，其他待办项目可以暂时先收起置于屏下缘。

明确的操作层级结构 提升产品使用效率

在iOS8系统附加的应用中，日历应用有较明显的操作层级观念，当用户切换年、月、日检视模式时，系统会以互动动画让用户有一种层级切换跳跃的纵深感，用户在进行滚动年份的视图切换时，用户可实时看到今天日期、及其他日历的任务项目，而当用户在月份视图操作情境时，点击年份视图按钮月份，可随即缩小该年份视图中的对应位置。

由于所开发的应用，会因为因应多屏尺寸、比例的适应性的品质，直接左右产品使用体验。因此在iOS应用解析(iOS App Anatomy)，也可善用UIKit framework中定义的系统组件，为终端应用取得更好的多屏兼容设计。

UIKit提供的UI元件大致分成Bars、内容视图、控制按钮、临时视图等。Bars为包含导航信息、可协助用户进行浏览或启动特定操作的控制钮设计；内容视图为包含应用的内容主体与产品所需的某些操作行为，如滚动、插入、删除、排序等操作行为；控制按钮为展示信息或用户操作？控制动作；临时视图为短暂时间呈现信息，是给用户的重要信息或额外选择的设计应用。

除了UI元件定义外，UIKit也定义了物件实现的功能，如针对手势识别、绘图、协助工具与系统的打印功能支持等。在iOS Human Interface Guidelines中亦针对App的Adaptivity and Layout、Build In Adaptivity App针对不同分辨率屏幕的自动布局设计等，或定义不同的显示环境(display environment)概念，都值得产品开发者或系统建构者深入理解并善用其设计概念方法，师法Apple iDevice设计准则，持续追求产品的极致使用体验感受。