藍(lán)藍(lán)設(shè)計(jì)( www.alimai.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)

如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

來(lái)源：莫貝網(wǎng)

譯者注：本文譯自蘋(píng)果官方人機(jī)界面指南 iOS Human Interface Guidelines (2015年10 月21日)，由騰訊ISUX設(shè)計(jì)師翻譯整理，非發(fā)文者一人之作。譯文首發(fā)于ISUX博客，如在閱讀過(guò)程中發(fā)現(xiàn)錯(cuò)誤與疏漏之處，歡迎不吝指出。后續(xù)章節(jié)會(huì)陸續(xù)更新，敬請(qǐng)期待。
文章索引

• 1.1 為iOS而設(shè)計(jì)（Designing for iOS）
• 1.1.1 設(shè)計(jì)跟隨內(nèi)容 (Defer to Content)
• 1.1.2 保證清晰 （Provide Clarity）
• 1.1.3 用深度層次來(lái)進(jìn)行交流 （Use Depth to Communicate）
• 1.2 iOS應(yīng)用解析 （iOS App Anatomy）
• 1.3 適應(yīng)性和布局（Adaptivity and Layout）
• 1.3.1 為自適應(yīng)而開(kāi)發(fā)（Build In Adaptivity）
  
• 1.3.2 在不同環(huán)境提供良好體驗(yàn)（Provide a Great Experience in Each Environment）
• 1.3.3 使用布局來(lái)溝通（Use Layout to Communicate）
• 1.4 啟動(dòng)與停止（Starting and Stopping）
• 1.4.1 即時(shí)啟動(dòng)（Start Instantly）
• 1.4.2 時(shí)刻準(zhǔn)備好停止（Always Be Prepared to Stop）
• 1.5 導(dǎo)航（Navigation）
• 1.6 模態(tài)情境（Modal Contexts）
• 1.7 交互性與反饋（Interactivity and Feedback）
• 1.7.1 可交互元素吸引用戶(hù)點(diǎn)擊（Interactive Elements Invite Touch）
• 1.7.2 用戶(hù)所知道的標(biāo)準(zhǔn)手勢(shì)（Users Know the Standard Gestures）
• 1.7.3 反饋有助于理解（Feedback Aids Understanding）
• 1.7.4 輸入信息的方式要簡(jiǎn)單（Inputting Information Should Be Easy）
• 1.8 動(dòng)畫(huà)（Animation）
• 1.9 品牌推廣（Branding）
• 1.10 顏色與字體（Color and Typography）
• 1.10.1 色彩有助于增進(jìn)溝通（Color Enhances Communication）
• 1.10.2 優(yōu)秀的排版提供清晰的傳達(dá)（Great Typography Enables Clear Communication）
• 1.11 圖標(biāo)和圖形（Icons and Graphics）
• 1.11.1 應(yīng)用圖標(biāo)（The App Icon）
• 1.11.2 小圖標(biāo)（Small Icons）
• 1.11.3 圖形（Graphics）
• 1.12 術(shù)語(yǔ)和措辭（Terminology and Wording）
• 1.13 與iOS的整合（Integrating with iOS）
• 1.13.1 正確使用標(biāo)準(zhǔn)UI元素（Use Standard UI Elements Correctly）
• 1.13.2 弱化文件和文檔處理（Downplay File and Document Handing）
• 1.13.3 必要時(shí)提供可配置選項(xiàng)（Be Configurable If Necessary）
• 1.13.4 充分利用iOS技術(shù)（Take Advantage of iOS Technologies）

1.1 為iOS而設(shè)計(jì)（Designing for iOS）

iOS 表現(xiàn)了以下三大設(shè)計(jì)原則：

• 遵從（Deference）：UI應(yīng)該有助于用戶(hù)更好地理解內(nèi)容并與之交互，并且不會(huì)分散用戶(hù)對(duì)內(nèi)容本身的注意力。
• 清晰（Clarity）：各種尺寸的文字清晰易讀；圖標(biāo)應(yīng)該醒目，去除多余的修飾，突出重點(diǎn)，以功能驅(qū)動(dòng)設(shè)計(jì)。
• 深度（Depth）：視覺(jué)的層次感和生動(dòng)的交互動(dòng)畫(huà)會(huì)賦予UI新的活力，有助于用戶(hù)更好地理解并讓用戶(hù)在使用過(guò)程中感到愉悅。

無(wú)論你是重新設(shè)計(jì)現(xiàn)有的應(yīng)用，還是重新開(kāi)發(fā)一個(gè)新應(yīng)用，請(qǐng)基于下列方法進(jìn)行設(shè)計(jì)考慮：

• 首先，去除掉UI元素讓?xiě)?yīng)用的核心功能突顯出來(lái)，并明確之間的相關(guān)性。
• 然后，使用iOS的主題來(lái)定義UI并進(jìn)行用戶(hù)體驗(yàn)設(shè)計(jì)。完善細(xì)節(jié)設(shè)計(jì)，以及適當(dāng)合理的修飾。
• 最后，保證你設(shè)計(jì)的UI可以適配各種設(shè)備和各種操作模式，使得用戶(hù)在不同場(chǎng)景下都可以享受你的應(yīng)用。

在整個(gè)設(shè)計(jì)過(guò)程中，時(shí)刻準(zhǔn)備著推翻先例，質(zhì)疑各種假設(shè)，并以?xún)?nèi)容和功能視為重點(diǎn)來(lái)驅(qū)動(dòng)每個(gè)細(xì)節(jié)的設(shè)計(jì)。

1.1.1 設(shè)計(jì)跟隨內(nèi)容 (Defer to Content)

盡管清新美觀的UI和流暢的動(dòng)態(tài)效果都是iOS體驗(yàn)的亮點(diǎn)，但內(nèi)容始終是iOS的核心。

這里有一些方法可以確保你的設(shè)計(jì)既可以提升功能體驗(yàn)，又可以關(guān)注內(nèi)容本身。

充分利用整個(gè)屏幕。系統(tǒng)天氣應(yīng)用是這個(gè)方法的絕佳范例：用漂亮的全屏天氣圖片呈現(xiàn)現(xiàn)在的天氣，直觀地向用戶(hù)傳遞了最重要的信息，同時(shí)也留出空間呈現(xiàn)了每個(gè)時(shí)段的天氣數(shù)據(jù)。

重新考慮（盡量減少）擬物化設(shè)計(jì)的使用。遮罩、漸變和陰影有時(shí)會(huì)讓UI元素顯得很厚重，導(dǎo)致影響到了對(duì)內(nèi)容的關(guān)注。相反，應(yīng)該以?xún)?nèi)容為核心，讓用戶(hù)界面成為內(nèi)容的支撐。

用半透明UI元素樣式來(lái)暗示背后的內(nèi)容。半透明的控件元素（比如控制中心）可以提供了上下文的使用場(chǎng)景，幫助用戶(hù)看到更多可用的內(nèi)容，并可以起到短暫的提示作用。在iOS中，半透明的控件元素只讓它遮擋住的地方變得模糊——看上去像蒙著一層米紙——它并沒(méi)有遮擋屏幕剩余的部分。

1.1.2 保證清晰 （Provide Clarity）

確保你的應(yīng)用始終是以?xún)?nèi)容為核心的另一個(gè)方法是保證清晰度。這里有幾種方法可以讓最重要的內(nèi)容和功能清晰可見(jiàn)，且易于交互。

使用大量留白。留白可以使重要的內(nèi)容和功能更加醒目、更易理解。留白還可以傳達(dá)一種平靜和安寧的心理感受，它可以使一個(gè)應(yīng)用看起來(lái)更加聚焦和。

 

讓顏色簡(jiǎn)化UI。使用一個(gè)主題色——比如Notes中用了黃色——高亮了重要區(qū)塊的信息并巧妙地用樣式暗示可交互性。同時(shí)，也讓?xiě)?yīng)用有了一致的視覺(jué)主題。內(nèi)置的應(yīng)用使用了同系列的系統(tǒng)顏色，這樣一來(lái)，無(wú)論在深色或淺色背景上看起來(lái)都很干凈，純粹。

 

通過(guò)使用系統(tǒng)字體確保易讀性。iOS的系統(tǒng)字體(San Francisco)使用動(dòng)態(tài)類(lèi)型(Dynamic Type)來(lái)自動(dòng)調(diào)整字間距和行間距，使文本在任何尺寸大小下都清晰易讀。無(wú)論你是使用系統(tǒng)字體還是自定義字體，一定要采用動(dòng)態(tài)類(lèi)型，這樣一來(lái)當(dāng)用戶(hù)選擇 不同字體尺寸時(shí)，你的應(yīng)用才可以及時(shí)做出響應(yīng)。

使用無(wú)邊框的按鈕。默認(rèn)情況下，所有的欄(bar)上的按鈕都是無(wú)邊框的。在內(nèi)容區(qū)域，通過(guò)文案、顏色以及操作指引標(biāo)題來(lái)表明該無(wú)邊框按鈕的可交互性。當(dāng)它被激活時(shí)，按鈕可以顯示較窄的邊框或淺色背景作為操作響應(yīng)。

1.1.3 用深度層次來(lái)進(jìn)行交流 （Use Depth to Communicate）

iOS經(jīng)常在不同的視圖層級(jí)上展現(xiàn)內(nèi)容，用以表達(dá)層次結(jié)構(gòu)和位置，這樣可以幫助用戶(hù)了解屏幕上對(duì)象之間的關(guān)系。

對(duì)于支持3D觸控的設(shè)備，輕壓（Peek）、重壓（Pop），以及快捷操作（Quick Actions）能讓用戶(hù)在不離開(kāi)當(dāng)前界面的情景下預(yù)覽其他重要內(nèi)容。

通過(guò)使用一個(gè)在主屏幕上方的半透明背景浮層，這樣文件夾就能清楚地把內(nèi)容和屏幕上其他內(nèi)容區(qū)分開(kāi)來(lái)。

如圖所示，備忘錄（Reminders）以不同的層級(jí)展示內(nèi)容條目。用戶(hù)在使用備忘錄里的某個(gè)條目時(shí)，其他條目會(huì)被集中收起在屏幕下方。

日歷具有較深的層級(jí)，當(dāng)用戶(hù)在翻閱年、月、日時(shí)，增強(qiáng)的轉(zhuǎn)場(chǎng)動(dòng)畫(huà)效果給用戶(hù)一種層級(jí)縱深感。在滾動(dòng)年份視圖時(shí)，用戶(hù)可以即時(shí)看到今天的日期以及其他日歷任務(wù)。

當(dāng)用戶(hù)選擇了某個(gè)月份，年份視圖會(huì)局部放大該月份，過(guò)渡到月份視圖。今天的日期依然處于高亮狀態(tài)，年份會(huì)顯示在返回按鈕處，這樣用戶(hù)可以清楚地知道他們?cè)谀膬?，他們從哪里進(jìn)來(lái)以及如何返回。

類(lèi)似的過(guò)渡動(dòng)畫(huà)也出現(xiàn)在用戶(hù)選擇某個(gè)日期時(shí)：月份視圖從所選位置分開(kāi)，將所在的周日期推向內(nèi)容區(qū)頂端并顯示以小時(shí)為單位的當(dāng)天時(shí)間軸視圖。這些交互動(dòng)畫(huà)增強(qiáng)了年、月、日之間的層級(jí)關(guān)系以及用戶(hù)的感知。

 

1.2 iOS應(yīng)用解析 （iOS App Anatomy）

幾乎所有的iOS應(yīng)用都應(yīng)用了UIKit framework中定義的組件。了解這些基本組件的名稱(chēng)、作用和功能可以幫助你在應(yīng)用的界面設(shè)計(jì)過(guò)程中做出更好的決策。

UIKit提供的UI組件可以大致分為以下4種類(lèi)型：

• 欄（Bars）：包含了上下文信息來(lái)指引用戶(hù)他們所在的位置，以及控件來(lái)幫助用戶(hù)導(dǎo)航或執(zhí)行操作。
• 內(nèi)容視圖（Content Views）：包含了應(yīng)用的具體內(nèi)容以及某些操作行為，比如滾動(dòng)、插入、刪除、排序等等。
• 控件（Controls）：用于執(zhí)行操作或展示信息。
• 臨時(shí)視圖（Temporary Views）：短暫出現(xiàn)給予用戶(hù)重要信息或提供更多的選擇和功能。

UIKit除了定義UI組件元素，還定義對(duì)象如何實(shí)現(xiàn)功能，例如手勢(shì)識(shí)別、繪圖、輔助功能和打印支持。

從編程的角度來(lái)看，UI組件元素其實(shí)是視圖的子類(lèi)，因?yàn)樗鼈兝^承了UIView。視圖能繪制屏幕內(nèi)容并知道用戶(hù)何時(shí)在其范圍內(nèi)觸屏。視圖的所有類(lèi)型有：控件（比如按鈕和滑塊）、內(nèi)容視圖（比如集合視圖和表格視圖），以及臨時(shí)視圖（如警告提示和動(dòng)作菜單）。

要在應(yīng)用中管理一組或者一系列的視圖，通常需要使用視圖控制器。它能協(xié)調(diào)視圖的內(nèi)容顯示，實(shí)現(xiàn)與用戶(hù)交互的功能并能在不同屏幕內(nèi)容之間切換。比如，“設(shè)置”使用了一個(gè)導(dǎo)航控制器來(lái)展示其視圖層級(jí)。

這里有一個(gè)關(guān)于視圖與視圖控制器如何結(jié)合并呈現(xiàn)iOS應(yīng)用的UI的例子，如圖。

盡管開(kāi)發(fā)者認(rèn)為真正起到作用的是視圖和視圖控制器，但一般用戶(hù)感知到的iOS應(yīng)用是不同屏幕內(nèi)容的集合。從這個(gè)角度來(lái)看，在應(yīng)用里，屏幕內(nèi)容一般對(duì)應(yīng)于一個(gè)獨(dú)特的視覺(jué)狀態(tài)或者模式。

注：一個(gè)iOS應(yīng)用程序包含一個(gè)窗口。但是，不同于計(jì)算機(jī)程序中的窗口，iOS窗口沒(méi)有可見(jiàn)的部分并且不能在屏幕上被移動(dòng)到另一個(gè)位置。很多iOS應(yīng)用程序只有一個(gè)窗口；可以支持外部顯示設(shè)備器的應(yīng)用程序可以有不止一個(gè)窗口。

在iOS Human Interface Guidelines中，屏幕（screen）這個(gè)詞和大部分用戶(hù)理解的一樣。作為一個(gè)開(kāi)發(fā)者，你也許需要閱讀一下其他與UIscreen相關(guān)的章節(jié)，這樣你可以更好的了解如何關(guān)聯(lián)外部屏幕。

 

1.3 適應(yīng)性和布局（Adaptivity and Layout）

1.3.1 為自適應(yīng)而開(kāi)發(fā)（Build In Adaptivity）

人們通常希望在他們所有的設(shè)備和多種情境中使用自己喜歡的應(yīng)用程序，比如在不同的設(shè)備方向上和iPad的分屏情況下。尺寸類(lèi)別（ Size classes）和自動(dòng)布局（Auto Layout）可以通過(guò)定義屏幕的布局、視圖控制器和視圖在環(huán)境變化時(shí)候應(yīng)該怎么適應(yīng)來(lái)幫助你實(shí)現(xiàn)這個(gè)愿望。（顯示環(huán)境[display environment]的概念指的是設(shè)備的整個(gè)屏幕或者其中一部分，比如彈出框的區(qū)域或者iPad分屏視圖中其中一側(cè)的區(qū)域。）

iOS在特征集合（trait collection）的定義中包含了顯示環(huán)境的概念，特征集合囊括了尺寸類(lèi)別（size class），顯示比例（display scale）和用戶(hù)界面語(yǔ)言（user interface idiom）。你可以使用一個(gè)特征集合讓你的視圖和視圖控制器響應(yīng)顯示環(huán)境的變化。

iOS定義了兩個(gè)尺寸類(lèi)別（size class），常規(guī)的（regular）和壓縮的（compact）。常規(guī)尺寸與拓展的空間緊密相關(guān)，壓縮尺寸與約束的空間相關(guān)。想要定義一種顯示環(huán)境， 你需要定義一種橫屏尺寸類(lèi)別，與一種豎屏尺寸類(lèi)別。如你所想，一個(gè)iOS設(shè)備在豎屏模式可以使用一套類(lèi)別，而橫屏模式下可以使用另一套類(lèi)別。

iOS能隨著尺寸類(lèi)別和顯示環(huán)境變化而自動(dòng)生成不同布局。舉個(gè)例子，當(dāng)垂直尺寸從壓縮變?yōu)槌Ｒ?guī)時(shí)，導(dǎo)航欄和工具欄會(huì)自動(dòng)變高。

當(dāng)你靠尺寸類(lèi)別來(lái)驅(qū)動(dòng)布局變化時(shí)，你的應(yīng)用在任何顯示環(huán)境時(shí)都能顯示得很好。關(guān)于如何在Interface Builder中更好的使用尺寸類(lèi)別，你可以查閱Size Classes Design Help.

注：在一種尺寸類(lèi)別中，持續(xù)使用Auto Layout進(jìn)行小的布局調(diào)整，比如拉伸或壓縮內(nèi)容。更多Auto Layout，參看 Auto Layout Guide.

下面的實(shí)例可以幫助你形象展現(xiàn)尺寸類(lèi)型如何適配不同設(shè)備的顯示環(huán)境。例如：iPad（包括iPad Pro）在長(zhǎng)寬和橫屏豎屏?xí)r都使用常規(guī)尺寸類(lèi)型。換句話(huà)說(shuō)，iPad顯示環(huán)境一直處于垂直和水平的常規(guī)狀態(tài)。

注：合格的iPad型號(hào)支持多任務(wù)，你的應(yīng)用可能需要與其他應(yīng)用共享同一個(gè)屏幕。確保使用Auto Layout，這樣你可以在用戶(hù)使用多任務(wù)功能時(shí)響應(yīng)他，比如 分屏模式（Split View）和多任務(wù)分屏模式（Slide Over）。

除了使用Auto Layout，當(dāng)你在iPad Pro上展示可讀性的內(nèi)容時(shí)，依靠UIView的 readableContentGuide屬性是非常重要的，這樣可以擁有讓讀者舒服的邊距。

iPhone的顯示環(huán)境可根據(jù)不同的設(shè)備和不同的握持方向而改變。

豎屏?xí)r，iPhone6 Plus使用的是壓縮寬度和常規(guī)高度類(lèi)型。

橫屏?xí)r，iPhone6 Plus使用的是常規(guī)寬度和壓縮高度類(lèi)型。

其他iPhone型號(hào)，包括iPhone6使用相同的尺寸類(lèi)型設(shè)置。

豎屏?xí)r，iPhone 6，iPhone 5 和iPhone 4S使用的是壓縮寬度和常規(guī)高度。

橫屏?xí)r，這些設(shè)備在寬高上使用的都是壓縮類(lèi)。

1.3.2 在不同環(huán)境提供良好體驗(yàn)（Provide a Great Experience in Each Environment）

當(dāng)你使用自適應(yīng)來(lái)開(kāi)發(fā)UI時(shí)，你可以保證UI跟隨顯示環(huán)境變化而適當(dāng)?shù)仨憫?yīng)。遵照這些指南，你可以給用戶(hù)良好的設(shè)備響應(yīng)體驗(yàn)。

在所有環(huán)境下都保持對(duì)主體內(nèi)容的專(zhuān)注。這是最高優(yōu)先級(jí)。人們使用應(yīng)用時(shí)，瀏覽感興趣的內(nèi)容并與之發(fā)生互動(dòng)。隨著環(huán)境變化改變專(zhuān)注點(diǎn)會(huì)讓用戶(hù)感覺(jué)到迷失方向，讓他們感覺(jué)對(duì)應(yīng)用失去控制。

避免布局上不必要的變化。在所有環(huán)境中保持一致的使用體驗(yàn)，能讓人們?cè)谛D(zhuǎn)設(shè)備或在不同設(shè)備上運(yùn)行你的應(yīng)用時(shí)維持穩(wěn)定的使用模式。例如，如果你在水平的常規(guī)模式下使用了網(wǎng)格來(lái)顯示圖像，那么無(wú)需在壓縮模式下使用列表來(lái)展示同樣的內(nèi)容，雖然你可能調(diào)整了網(wǎng)格的尺寸。

如果你的應(yīng)用只在一個(gè)方向上運(yùn)行，那么請(qǐng)直接一點(diǎn)。人們希望在各種握持方式下都可以使用你的應(yīng)用，能滿(mǎn)足這個(gè)期待是最好的。但是，如果你的應(yīng)用只在一個(gè)方向下運(yùn)行，那么你應(yīng)當(dāng)注意：

• 避免出現(xiàn)提示人們旋轉(zhuǎn)設(shè)備的相關(guān)UI元素。讓?xiě)?yīng)用在支持的方向下清晰地運(yùn)行，如果需要用戶(hù)旋轉(zhuǎn)設(shè)備，不要給UI添加不必要的混亂。
• 支持同一個(gè)方向上的變化。例如，如果一個(gè)應(yīng)用只能橫屏運(yùn)行，用戶(hù)無(wú)論用左手或是右手握持時(shí)都能觸及到home鍵。如果用戶(hù)在使用應(yīng)用時(shí)180度旋轉(zhuǎn)設(shè)備，那最好應(yīng)用內(nèi)容也能及時(shí)響應(yīng)并旋轉(zhuǎn)180度。

如果你的應(yīng)用將設(shè)備方向翻轉(zhuǎn)視為用戶(hù)輸入（的一種指令），那么就按照程序設(shè)定的方式來(lái)響應(yīng)設(shè)備翻轉(zhuǎn)。舉個(gè)例子， 一個(gè)游戲讓用戶(hù)利用設(shè)備翻轉(zhuǎn)來(lái)移動(dòng)游戲中的部件，那么這個(gè)游戲應(yīng)用本身（的UI）不能對(duì)翻轉(zhuǎn)屏幕產(chǎn)生響應(yīng)。在這種情況下，你必須關(guān)聯(lián)兩個(gè)需要變化的方向， 并且允許人們?cè)谶@兩個(gè)方向切換直到他們開(kāi)始（了解并執(zhí)行）應(yīng)用的主體任務(wù)。一旦人們開(kāi)始執(zhí)行主要任務(wù)，那就開(kāi)始按程序設(shè)定的那樣來(lái)響應(yīng)設(shè)備的動(dòng)作。

1.3.3 使用布局來(lái)溝通（Use Layout to Communicate）

布局包含的不僅僅是一個(gè)應(yīng)用屏幕上的UI元素外觀。你的布局，應(yīng)該告訴用戶(hù)什么是最重要的，他們的選擇是什么，以及事物是如何關(guān)聯(lián)起來(lái)的。

強(qiáng)調(diào)重要內(nèi)容或功能，讓用戶(hù)容易集中注意在主要任務(wù)上。有幾個(gè)比較好的辦法是在屏幕上半部分放置主要內(nèi)容——遵循從左到右的習(xí)慣——從靠近左側(cè)的屏幕開(kāi)始：

使用不同的視覺(jué)化重量和平衡來(lái)告訴用戶(hù)當(dāng)前屏顯元素的主次關(guān)系。大型控件吸引眼球，比小的控件更容易在出現(xiàn)時(shí)被注意到。而且大型控件也更容易被用戶(hù)點(diǎn)擊，這讓它們?cè)趹?yīng)用中尤其有用——就像電話(huà)和時(shí)鐘（上面的按鈕）那樣——能讓用戶(hù)經(jīng)常在容易分心的環(huán)境下仍然保持正常使用。

使用對(duì)齊來(lái)讓閱讀更舒緩，讓分組和層次之間更有秩序。對(duì)齊讓?xiě)?yīng)用看起來(lái)整潔而有序，也讓用戶(hù)在滑動(dòng)整屏內(nèi)容時(shí)更容易定位和專(zhuān)注于重要信息。不同信息組的縮進(jìn)與對(duì)齊讓它們之間的關(guān)聯(lián)更清晰，也讓用戶(hù)更容易找到某個(gè)控件。

確保用戶(hù)在內(nèi)容處于默認(rèn)尺寸時(shí)便可清楚明白它的主要內(nèi)容與含義。例如，用戶(hù)應(yīng)當(dāng)無(wú)需水平滾動(dòng)就能看到重要的文本，或不用放大就可以看到主體圖像。

準(zhǔn)備好改變字體大小。用戶(hù)期望大多數(shù)應(yīng)用都可以響應(yīng)他們?cè)趇OS的設(shè)置中設(shè)定的字體大小。為了適應(yīng)一些文本大小的變化，你也許需要調(diào)整布局；想要得到更多文本顯示相關(guān)的信息，請(qǐng)查閱下文“顏色與字體”中相關(guān)的內(nèi)容。

盡量避免UI上不一致的表現(xiàn)。在一般情況下，有著相似功能的控件看起來(lái)也應(yīng)該類(lèi)似。用戶(hù)常常認(rèn)為他們看到的不同總有原因，而且他們傾向于花時(shí)間去嘗試（譯者按：因此為了避免用戶(hù)做無(wú)用的嘗試，建議類(lèi)似的功能外觀都保持一樣。）

給每個(gè)互動(dòng)的元素充足的空間，從而讓用戶(hù)容易操作這些內(nèi)容和控件。常用的點(diǎn)按類(lèi)控件的大小是44 x 44點(diǎn)（points）。

 

1.4 啟動(dòng)與停止（Starting and Stopping）

1.4.1 即時(shí)啟動(dòng)（Start Instantly）

我們通常認(rèn)為用戶(hù)不會(huì)花超過(guò)一兩分鐘去評(píng)價(jià)一款新應(yīng)用。當(dāng)你可以地利用這段極短的時(shí)間，即時(shí)呈現(xiàn)對(duì)用戶(hù)有幫助的內(nèi)容時(shí)，你就能夠激發(fā)新用戶(hù)的興趣并給所有用戶(hù)一種極棒的體驗(yàn)。

重要：不要在安裝過(guò)程結(jié)束后告訴用戶(hù)需要重啟設(shè)備。重啟需要花費(fèi)時(shí)間，同時(shí)也會(huì)讓人覺(jué)得你的應(yīng)用不可靠且很難使用。
如果你的應(yīng)用有內(nèi)存使用或其它問(wèn)題，導(dǎo)致不重啟就無(wú)法流暢運(yùn)行，你必須聲明這些問(wèn)題。想要了解如何開(kāi)發(fā)一款性能良好的應(yīng)用，請(qǐng)參閱Use Memory Efficiently.
盡可能避免使用閃屏或者其他啟動(dòng)體驗(yàn)方式。用戶(hù)能夠在啟動(dòng)應(yīng)用后立即開(kāi)始使用是最好不過(guò)的。

盡可能地，避免讓用戶(hù)做過(guò)多設(shè)置。而應(yīng)該如此：

• 聚焦在80%目標(biāo)用戶(hù)的需求上。這樣絕大部分用戶(hù)就無(wú)需設(shè)置各種選項(xiàng)，因?yàn)槟愕膽?yīng)用已經(jīng)默認(rèn)處于他們想要的狀態(tài)。如果有些功能僅有少部分用戶(hù)想要，或者是大部分用戶(hù)只需要使用一次，那就別管它了。
• 盡可能用其他方式獲取更多的用戶(hù)信息。如果你能得到用戶(hù)在內(nèi)置應(yīng)用或硬件設(shè)置中提供的信息，直接從系統(tǒng)中獲取，不要讓用戶(hù)再次輸入。
• 如果你必須要求用戶(hù)設(shè)置用戶(hù)信息，在你的應(yīng)用中直接提示用戶(hù)輸入。然后盡快保存這些設(shè)定（一般來(lái)說(shuō)，保存到你的應(yīng)用的設(shè)置模塊中）。這樣用戶(hù)就無(wú)需強(qiáng)制跳出應(yīng)用進(jìn)入系統(tǒng)設(shè)置頁(yè)面了。如果用戶(hù)需要更改設(shè)置，他們可以在任何時(shí)候進(jìn)入應(yīng)用的設(shè)置模塊進(jìn)行修改。

盡可能讓用戶(hù)晚一點(diǎn)再登錄。最理想的狀態(tài)是，用戶(hù)在無(wú)需登錄的情況下就能盡量多地瀏覽內(nèi)容并使用部分功能。例如，App Store會(huì)在用戶(hù)確定進(jìn)行購(gòu)買(mǎi)商品時(shí)，才要求用戶(hù)進(jìn)行登錄。對(duì)于那些強(qiáng)制用戶(hù)登錄后才能進(jìn)行一切有用操作的應(yīng)用，用戶(hù)往往會(huì)直接放棄。

如果你的應(yīng)用必須先登錄后使用，那么你應(yīng)該在登錄頁(yè)面有一些簡(jiǎn)短的文字，來(lái)描述為什么必須先登錄，以及這樣做會(huì)給用戶(hù)帶來(lái)什么好處。

謹(jǐn)慎使用新手引導(dǎo)（介紹應(yīng)用的功能和如何進(jìn)行操作）。在考慮新手引導(dǎo)之前，你應(yīng)該努力地完善你的應(yīng)用，盡可能使應(yīng)用的功能直觀和易于尋找。其實(shí)，好的應(yīng)用不需要新手引導(dǎo)。如果你確實(shí)覺(jué)得需要新手引導(dǎo)，那么請(qǐng)參考如下的建議，設(shè)計(jì)一個(gè)簡(jiǎn)潔、有針對(duì)性并且不妨礙用戶(hù)的新手引導(dǎo)。

• 只提供開(kāi)始使用應(yīng)用所必需的信息。好的新手引導(dǎo)應(yīng)該告訴用戶(hù)第一步應(yīng)該做什么，或者簡(jiǎn)短地演示大部分用戶(hù)感興 趣的一些功能。如果在能夠探索你的應(yīng)用之前，給用戶(hù)展示太多信息，讓用戶(hù)記住這些不是當(dāng)前所必須的內(nèi)容，會(huì)讓用戶(hù)覺(jué)得你的應(yīng)用很難用。如果在某些特定場(chǎng)景 下確實(shí)需要額外幫助，那么也應(yīng)該只在用戶(hù)處于這個(gè)場(chǎng)景之后再提供。
• 使用動(dòng)畫(huà)和可交互的方式來(lái)吸引用戶(hù)，并讓用戶(hù)通過(guò)實(shí)際操作來(lái)學(xué)習(xí)如何使用。對(duì)于文字內(nèi)容的增加應(yīng)該謹(jǐn)慎，且僅 當(dāng)增加文字對(duì)于提升體驗(yàn)有益時(shí)才這么做。不要指望用戶(hù)會(huì)閱讀大段的文字。例如，可以使用動(dòng)畫(huà)而不是文字來(lái)描述如何執(zhí)行一個(gè)簡(jiǎn)單的任務(wù)。在引導(dǎo)用戶(hù)了解較為 復(fù)雜的任務(wù)時(shí)，可以通過(guò)一些引導(dǎo)浮層來(lái)簡(jiǎn)要說(shuō)明每一個(gè)步驟用戶(hù)需要做什么。盡可能避免展示應(yīng)用截圖，因?yàn)榻貓D不可交互的，用戶(hù)可能會(huì)混淆截圖和應(yīng)用的實(shí)際 界面。
• 能夠讓用戶(hù)很容易地取消或者跳過(guò)新手引導(dǎo)。有些用戶(hù)看完新手引導(dǎo)之后就不想再看，有些甚至根本就不想看新手引導(dǎo)。請(qǐng)記住用戶(hù)的選擇，不要強(qiáng)迫用戶(hù)每次打開(kāi)你的應(yīng)用都要再選擇一次。

不要太早要求用戶(hù)去給你的應(yīng)用評(píng)分。過(guò)早要求用戶(hù)進(jìn)行評(píng)分可能會(huì)適得其反。如果你想獲得有價(jià)值的反饋和評(píng)論，在邀請(qǐng)用戶(hù)評(píng)論之前，請(qǐng)給他們一點(diǎn)時(shí)間來(lái)使用你的應(yīng)用，并對(duì)你的應(yīng)用形成印象。例如，你可以等用戶(hù)訪問(wèn)了一定數(shù)量的頁(yè)面或完成了一定數(shù)量的任務(wù)之后，再邀請(qǐng)他們進(jìn)行評(píng)價(jià)。

一般建議按照屏幕默認(rèn)的定向方式啟動(dòng)你的應(yīng)用。盡管如此，如果你的應(yīng)用只有一種屏幕方向，那么就始終以這個(gè)方向 啟動(dòng)，讓用戶(hù)在他們自己需要時(shí)再改變?cè)O(shè)備方向。例如，一個(gè)游戲或者媒體觀看應(yīng)用只在橫屏模式下運(yùn)行，那么就應(yīng)該以橫屏模式啟動(dòng)，即使設(shè)備當(dāng)前處于豎屏模 式。這樣的話(huà)，如果用戶(hù)在豎屏模式下打開(kāi)應(yīng)用，他們也知道應(yīng)該把設(shè)備轉(zhuǎn)成橫屏來(lái)進(jìn)行使用。

注：最好讓橫屏應(yīng)用支持兩種方向的橫屏，即home鍵在左或在右方都支持。如果設(shè)備當(dāng)前已經(jīng)處于橫向狀態(tài)，那么就按照當(dāng)前狀態(tài)啟動(dòng)應(yīng)用，除非你有充 分的理由不這么做。其他情況時(shí)，可以考慮按home鍵處于右側(cè)的方式啟動(dòng)應(yīng)用。（想要了解更多關(guān)于支持不同設(shè)備方向的內(nèi)容，請(qǐng)參閱前文中 Adaptivity and Layout相關(guān)章節(jié)。）

提供一張與應(yīng)用首頁(yè)看上去一樣的閃屏。iOS會(huì)在啟動(dòng)應(yīng)用時(shí)調(diào)用這張圖，這樣可以讓用戶(hù)覺(jué)得啟動(dòng)速度很快，同時(shí)，也可以讓你的應(yīng)用有足夠的時(shí)間去加載內(nèi)容。具體如何制作閃屏，請(qǐng)查閱Launch Files。

如果可能，不要讓用戶(hù)在初次啟動(dòng)應(yīng)用時(shí)閱讀免責(zé)聲明或者確認(rèn)用戶(hù)協(xié)議。你可以直接在App Store展示這些內(nèi)容，使用戶(hù)在下載前就有所了解。如果在某些情況下你必須展示這些內(nèi)容，要確保它們與界面保持統(tǒng)一并在產(chǎn)品功能與用戶(hù)體驗(yàn)之間達(dá)成平衡。

在應(yīng)用重啟后，需要恢復(fù)到用戶(hù)退出使用時(shí)的狀態(tài)，讓他們可以從中斷之處繼續(xù)使用。無(wú)需讓用戶(hù)記住是如何回到此狀態(tài)的。了解更多關(guān)于保持和恢復(fù)應(yīng)用狀態(tài)的有效方式，請(qǐng)查閱Preserving Your App’s Visual Appearance Across Launches。

1.4.2 時(shí)刻準(zhǔn)備好停止（Always Be Prepared to Stop）

iOS 應(yīng)用不存在關(guān)閉或退出選項(xiàng)。當(dāng)用戶(hù)切換到另一個(gè)應(yīng)用，回到主屏幕或者將設(shè)備調(diào)至睡眠模式的時(shí)候，其實(shí)就是停止了當(dāng)前應(yīng)用的使用。
當(dāng)用戶(hù)切換應(yīng)用時(shí)，iOS的多任務(wù)系統(tǒng)會(huì)將其放置到后臺(tái)并將新應(yīng)用的UI替換上來(lái)。在這種情況下，你必須做到以下幾點(diǎn)：

隨時(shí)并盡快保存用戶(hù)信息。因?yàn)樵诤笈_(tái)的應(yīng)用隨時(shí)有可能被終止或退出。

當(dāng)應(yīng)用停止的時(shí)候保存盡可能多的當(dāng)前狀態(tài)的詳細(xì)信息。這樣使用戶(hù)可以在回到應(yīng)用時(shí)能從中斷之處繼續(xù)使用。例如，在使用可滾動(dòng)的數(shù)據(jù)列表時(shí)，退出后保存列表所在的位置。了解更多關(guān)于保持和恢復(fù)應(yīng)用狀態(tài)的有效方式，請(qǐng)查閱Preserving Your App’s Visual Appearance Across Launches.

有些應(yīng)用可能需要一直在后臺(tái)運(yùn)行。例如，用戶(hù)可能希望能在使用一個(gè)應(yīng)用的同時(shí)還能一直聽(tīng)歌，接著又想用另外一個(gè)應(yīng)用來(lái)檢查代辦項(xiàng)或者玩游戲。關(guān)于如何正確處理多任務(wù)，請(qǐng)查閱Multitasking.

不要強(qiáng)制讓?xiě)?yīng)用退出。因?yàn)檫@樣會(huì)讓用戶(hù)誤以為是系統(tǒng)崩潰。如果有問(wèn)題產(chǎn)生，需要告訴用戶(hù)具體狀況以及如何解決。以下有兩個(gè)建議，取決于出現(xiàn)的問(wèn)題有多嚴(yán)重，可以酌情使用：

如果應(yīng)用中所有的功能當(dāng)前都不可用，那么應(yīng)該顯示一些內(nèi)容來(lái)解釋當(dāng)前的情形，并建議用戶(hù)如何進(jìn)行后續(xù)操作。這部分內(nèi)容給予了用戶(hù)以反饋，使用戶(hù)相信你的應(yīng)用現(xiàn)在沒(méi)問(wèn)題。同時(shí)這也可以穩(wěn)定用戶(hù)情緒，讓他們決定是否要采取糾正措施，繼續(xù)使用應(yīng)用，還是切換到另一個(gè)應(yīng)用。

如果只有部分功能不可用，那么只要當(dāng)用戶(hù)使用這些功能時(shí)顯示提示即可。其他情況下，用戶(hù)就應(yīng)該能正常使用應(yīng)用的其他功能。如果你決定使用警告框來(lái)進(jìn)行提示，請(qǐng)確保只在用戶(hù)嘗試使用不可用的功能時(shí)再顯示。

 

1.5 導(dǎo)航（Navigation）

除非導(dǎo)航設(shè)計(jì)不合理，不然用戶(hù)應(yīng)該明顯察覺(jué)不到應(yīng)用中的導(dǎo)航體驗(yàn)。導(dǎo)航設(shè)計(jì)應(yīng)該能夠支撐你應(yīng)用結(jié)構(gòu)和目的卻又不分散用戶(hù)注意力。
廣義來(lái)說(shuō)，導(dǎo)航主要有以下幾種類(lèi)型，每個(gè)導(dǎo)航都有其適應(yīng)的應(yīng)用結(jié)構(gòu)：

• 分層
• 扁平
• 內(nèi)容或體驗(yàn)驅(qū)動(dòng)

在有層級(jí)結(jié)構(gòu)的應(yīng)用中，用戶(hù)在每個(gè)層級(jí)中都要選擇一項(xiàng)，直到到達(dá)目的層級(jí)。如果要切換到另一個(gè)目的層級(jí)，用戶(hù)必須回退一些層級(jí)，或者直接回到初始層級(jí)再次選擇。系統(tǒng)設(shè)置和郵箱應(yīng)用在這方面是很好示范，可以參考他們。

譯者注：以上為視頻截圖，完整視頻可點(diǎn)擊觀看。

在扁平信息架構(gòu)的應(yīng)用中，用戶(hù)可以從首頁(yè)目錄直接切換到另一個(gè)，因?yàn)樗械姆诸?lèi)都可以從主屏直接訪問(wèn)。音樂(lè)和App Store是兩個(gè)使用扁平結(jié)構(gòu)的好例子。

譯者注：以上為視頻截圖，完整視頻可點(diǎn)擊觀看。

在內(nèi)容或體驗(yàn)驅(qū)動(dòng)的信息架構(gòu)應(yīng)用中，導(dǎo)航也會(huì)根據(jù)內(nèi)容或體驗(yàn)來(lái)設(shè)計(jì)。例如，在閱讀一本電子書(shū)時(shí)，用戶(hù)會(huì)一頁(yè)接一頁(yè)的進(jìn)行閱讀，或者直接從目錄中選中某一個(gè)指定的頁(yè)碼；同樣，在游戲中導(dǎo)航也是體驗(yàn)的重要組成部分。

譯者注：以上為視頻截圖，完整視頻可點(diǎn)擊觀看。

在某些情況下，在一個(gè)應(yīng)用中結(jié)合多種導(dǎo)航類(lèi)型會(huì)有很好的效果。例如，對(duì)于扁平信息結(jié)構(gòu)中某一分類(lèi)下的內(nèi)容，用分層導(dǎo)航的方式來(lái)顯示可能會(huì)更好。

應(yīng)該讓用戶(hù)時(shí)刻清楚自己當(dāng)前在應(yīng)用中所處的位置，及如何前往目的頁(yè)面。無(wú)論使用哪種適合你的應(yīng)用結(jié)構(gòu)的導(dǎo)航，最重要的是用戶(hù)訪問(wèn)內(nèi)容的路徑要有邏輯、可預(yù)期和易于追溯。

UIKit定義了一些標(biāo)準(zhǔn)的UI元素，以方便地構(gòu)建分層或扁平導(dǎo)航，還有一些元素可以構(gòu)建以?xún)?nèi)容為中心的導(dǎo)航，例如電子書(shū)或者媒體觀看類(lèi)應(yīng)用。游戲或者其他體驗(yàn)驅(qū)動(dòng)的應(yīng)用通常需要一些自定義的元素和行為。

使用導(dǎo)航欄（Navigation Bar）幫助用戶(hù)輕松訪問(wèn)分層內(nèi)容。導(dǎo)航欄的標(biāo)題可以顯示用戶(hù)當(dāng)前所處的層級(jí)，而后退按鈕可以回到上一層級(jí)。想要了解更多內(nèi)容，請(qǐng)查看Navigation Bar.

使用標(biāo)簽欄（Tab Bar）顯示同類(lèi)型的內(nèi)容或功能。標(biāo)簽欄很適合于扁平信息結(jié)構(gòu)，可以讓用戶(hù)在分類(lèi)之間隨意切換，而不用在意當(dāng)前所處的位置。想要了解更多內(nèi)容，請(qǐng)查看Tab Bar.

在應(yīng)用中，如果每屏顯示的都是同類(lèi)項(xiàng)或同類(lèi)頁(yè)，可以使用頁(yè)面控件（Page Control）。頁(yè)面控件的優(yōu)點(diǎn)是可以直觀地告訴用戶(hù)有多少個(gè)項(xiàng)目或頁(yè)面，以及當(dāng)前所處位置。想要了解更多內(nèi)容，請(qǐng)查看Page Control。

一般來(lái)說(shuō)，最好能給用戶(hù)提供到達(dá)每一屏的唯一路徑。如果某屏內(nèi)容用戶(hù)需要在不同場(chǎng)景下查看，可以考慮使用臨時(shí)視圖，例如模態(tài)視圖、動(dòng)作菜單或警告框。想要了解更多，請(qǐng)查看Modal View、Action Sheet和Alert。

UIKit同時(shí)還提供了以下相關(guān)控件：

• 分段控件（Segmented Control）。分段控件讓用戶(hù)在一屏內(nèi)就可以查到不同分類(lèi)的內(nèi)容，而不需要切換到其他屏幕。
• 工具欄（Toolbar）。盡管工具欄和導(dǎo)航欄或標(biāo)簽欄相似，但是工具欄不具導(dǎo)航作用。相反，工具欄為用戶(hù)提供了可以控制當(dāng)前屏幕內(nèi)容的控件。

（譯者注：上文提到的Navigation Bar, Tab Bar, Page Control, Modal View, Action Sheet, Alert, Segmented Control和Toolbar均處在iOS Human Interface Guidelines的第4章 UI Elements部分，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候。若有需要，亦可先參考先前已翻譯的iOS7 UI Elements章節(jié)：上，下。）

 

1.6 模態(tài)情境（Modal Contexts）

模態(tài)是一個(gè)承載某些連貫操作或內(nèi)容的優(yōu)缺點(diǎn)并存的模式。它可以給用戶(hù)提供一種不脫離主任務(wù)的方式去完成一個(gè)任務(wù)或者獲得信息，但是也會(huì)臨時(shí)性的阻止用戶(hù)對(duì)應(yīng)用的其他部分進(jìn)行交互操作。

理想情況下，用戶(hù)可以與iOS 應(yīng)用進(jìn)行一種非線(xiàn)性的交互，所以，盡可能的減少你應(yīng)用中的模態(tài)體驗(yàn)是最好的。通常情況，僅在以下情境可以考慮使用模態(tài)：

• 必須引起用戶(hù)關(guān)注的時(shí)候
• 一個(gè)獨(dú)立的任務(wù)需要完成或者很明確需要被放棄，為了避免在模棱兩可的狀態(tài)下遺漏用戶(hù)信息的時(shí)候

保證模態(tài)任務(wù)簡(jiǎn)單、簡(jiǎn)短和高度聚焦。你肯定不希望用戶(hù)使用模態(tài)視圖時(shí)像使用應(yīng)用中的一個(gè)mini應(yīng)用一樣。如果子任務(wù)過(guò)于復(fù)雜，用戶(hù)會(huì)在進(jìn)入模態(tài)情境時(shí)忽略了主要任務(wù)。在設(shè)計(jì)一個(gè)涉及視覺(jué)層次的模態(tài)任務(wù)時(shí)特別要考慮這一點(diǎn)，因?yàn)橛脩?hù)有可能迷失并且忘記如何回到之前的操作中去。如果一個(gè)模態(tài)任務(wù)必須包含不同視圖的子任務(wù)，確保給用戶(hù)一個(gè)獨(dú)立、清晰的導(dǎo)航路徑，并避免迂回。更多關(guān)于模態(tài)試圖的信息請(qǐng)參考Modal View.

始終提供明顯、安全的退出模態(tài)任務(wù)的途徑。確保用戶(hù)在退出模態(tài)視圖時(shí)可以預(yù)期操作的結(jié)果。

一個(gè)任務(wù)需要多層級(jí)的模態(tài)視圖時(shí)，確保用戶(hù)理解點(diǎn)擊非最高層級(jí)下的完成按鈕的結(jié)果。點(diǎn)擊一個(gè)低層級(jí)視圖上的完成按鈕是完成這個(gè)視圖中任務(wù)的一部分，還是整個(gè)任務(wù)。因?yàn)橛锌赡艽嬖谶@種困惑，所以要盡可能避免在下級(jí)視圖中添加完成按鈕。

保證提醒對(duì)話(huà)框的內(nèi)容都是必要且可操作的。提醒對(duì)話(huà)框會(huì)打斷用戶(hù)的體驗(yàn)并且要點(diǎn)擊才會(huì)消失，所以要讓用戶(hù)感到提醒信息是有用的，打斷是有價(jià)值的。想要了解更多請(qǐng)參考Alert.

（譯者注：上文提到的Modal View與Alert均處在iOS Human Interface Guidelines的第4章 UI Elements部分，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候。若有需要，亦可先參考先前已翻譯的iOS7 UI Elements章節(jié)：上，下。）

尊重用戶(hù)關(guān)于接收通知的偏好設(shè)置。用戶(hù)會(huì)設(shè)置接收應(yīng)用通知的形式，確保遵重用戶(hù)的喜好設(shè)置，否則可能會(huì)觸怒用戶(hù)，導(dǎo)致其關(guān)閉應(yīng)用中所有的推送通知。

 

1.7 交互性與反饋（Interactivity and Feedback）

1.7.1 可交互元素吸引用戶(hù)點(diǎn)擊（Interactive Elements Invite Touch）

為了暗示交互性，設(shè)計(jì)時(shí)會(huì)使用很多線(xiàn)索，包括點(diǎn)擊的反饋、顏色、位置、上下文、表意明確的圖標(biāo)和標(biāo)簽等。并不需要過(guò)于修飾元素來(lái)向用戶(hù)展示可交互性。

在支持3D Touch的設(shè)備上，當(dāng)用戶(hù)按壓主屏上的圖標(biāo)時(shí)，背景會(huì)虛化以此來(lái)暗示可以進(jìn)行更多功能的選擇。

一個(gè)關(guān)鍵的顏色可以給用戶(hù)提供很強(qiáng)的視覺(jué)指引，尤其是沒(méi)有冗余的其它顏色時(shí)。為了對(duì)比，使用藍(lán)色來(lái)標(biāo)記可交互的元素，同時(shí)能提供統(tǒng)一的、易識(shí)別的視覺(jué)風(fēng)格。

返回按鈕使用多個(gè)線(xiàn)索指明其可交互并傳達(dá)其功能:它出現(xiàn)在導(dǎo)航中，顯示了一個(gè)指向后方的圖標(biāo)，使用了關(guān)鍵色，并且顯示了上一級(jí)頁(yè)面的標(biāo)題。

一個(gè)圖標(biāo)或者標(biāo)題提供了清晰的名稱(chēng)指引用戶(hù)點(diǎn)擊它。例如，地圖中的標(biāo)題“Flyover Tour”，“Directions to Here”，清晰的說(shuō)明了用戶(hù)可做的操作。結(jié)合關(guān)鍵色，就可以省去按鈕邊界或其他多余的修飾。

在內(nèi)容區(qū)域，必要時(shí)可以給按鈕添加邊界或背景。位于欄（Bar）、動(dòng)作列表（Action Sheet）和警告框（Alert）中的按鈕可以不需要邊界，因?yàn)橛脩?hù)知道在這種區(qū)域中大多數(shù)選項(xiàng)是可交互的。但是在內(nèi)容區(qū)域，有必要使用邊界或背景將 按鈕從其他內(nèi)容中區(qū)分出來(lái)。例如，音樂(lè)，時(shí)鐘，照片，App Store在一些特別的場(chǎng)景中使用這種按鈕。

照片管理中給分享按鈕增加了邊框，從其他解釋性文本中區(qū)分出來(lái)。

時(shí)鐘在秒表和計(jì)時(shí)頁(yè)面中給按鈕增加背景來(lái)強(qiáng)調(diào)開(kāi)始和暫停按鈕，并且使按鈕在易分散注意力的內(nèi)容中更容易點(diǎn)擊。

應(yīng)用商店中使用有邊界的按鈕，將按鈕和整個(gè)內(nèi)容條區(qū)分開(kāi)來(lái)，點(diǎn)擊整條內(nèi)容查看詳細(xì)信息，點(diǎn)擊按鈕進(jìn)行下載安裝。

1.7.2 用戶(hù)所知道的標(biāo)準(zhǔn)手勢(shì)（Users Know the Standard Gestures）

用戶(hù)使用點(diǎn)擊、拖拽、捏合等手勢(shì)與應(yīng)用和他們的IOS設(shè)備進(jìn)行交互。使用手勢(shì)拉近了用戶(hù)和設(shè)備之間的距離，并且增強(qiáng)了直接操縱感。用戶(hù)通常期待手勢(shì)在不同應(yīng)用之間都是通用的。

用戶(hù)在使用3D Touch時(shí)不需要學(xué)習(xí)額外的手勢(shì)操作。當(dāng)用戶(hù)輕按屏幕并得到反饋時(shí)，很容易就能發(fā)現(xiàn)3D Touch提供的額外的交互方式。

除了用戶(hù)熟悉的標(biāo)準(zhǔn)手勢(shì)，iOS還定義了一些系統(tǒng)范圍內(nèi)的操作，例如呼出控制中心（Control Center）或消息中心（Notification Center）。用戶(hù)可以在任意應(yīng)用下都使用這些手勢(shì)。

不要給標(biāo)準(zhǔn)手勢(shì)賦予不同的行為。除非你的應(yīng)用是游戲，否則重新定義標(biāo)準(zhǔn)手勢(shì)會(huì)使用戶(hù)迷惑，且增加使用難度。

不要?jiǎng)?chuàng)建和標(biāo)準(zhǔn)手勢(shì)功能相似的手勢(shì)操作。用戶(hù)已經(jīng)習(xí)慣了標(biāo)準(zhǔn)手勢(shì)的行為，沒(méi)有必要讓用戶(hù)額外學(xué)習(xí)不同的操作手勢(shì)來(lái)達(dá)到同樣的操作結(jié)果。

可以用復(fù)雜手勢(shì)作為完成某任務(wù)的快捷方式，但不能是唯一觸達(dá)方式。最好給用戶(hù)提供一些簡(jiǎn)單，直接的方式完成某操作，即使這種方法需要他們額外地多點(diǎn)擊一到兩次。簡(jiǎn)單的手勢(shì)能讓用戶(hù)集中于當(dāng)前的體驗(yàn)和內(nèi)容，而不是交互操作本身。

除非是游戲，否則避免定義新的手勢(shì)。在游戲或其他沉浸式的應(yīng)用中，操作手勢(shì)也是有趣體驗(yàn)的一部分。但是在普通應(yīng)用中，幫助用戶(hù)達(dá)成目標(biāo)要比操作本身重要的多，所以最好使用標(biāo)準(zhǔn)手勢(shì)，盡量避免讓用戶(hù)去發(fā)覺(jué)和記憶新的操作。

在特定的環(huán)境中，可以考慮使用多指操作。雖然復(fù)雜的操作并不一定適用于所有應(yīng)用，但對(duì)用戶(hù)會(huì)花大量時(shí)間使用的應(yīng)用來(lái)說(shuō)可以豐富體驗(yàn)，例如游戲或創(chuàng)建內(nèi)容環(huán)境。但因?yàn)榉菢?biāo)準(zhǔn)手勢(shì)可發(fā)現(xiàn)性差，要盡量少用，并且不要讓這類(lèi)手勢(shì)成為完成任務(wù)的唯一方式。

1.7.3 反饋有助于理解（Feedback Aids Understanding）

反饋幫助用戶(hù)了解應(yīng)用當(dāng)前在做什么，發(fā)現(xiàn)接下來(lái)可以做什么以及理解他們動(dòng)作產(chǎn)生的結(jié)果。UIKit的操作和視圖提供了很多反饋類(lèi)型。

盡可能將狀態(tài)或其他的反饋信息整合到UI中。用戶(hù)不進(jìn)行操作或不跳出當(dāng)前內(nèi)容就能獲得需要的信息是最好的。例如，郵箱將當(dāng)前的狀態(tài)顯示在不影響當(dāng)前內(nèi)容的工具欄上。

避免顯示不必要的提醒對(duì)話(huà)框。對(duì)話(huà)框是很強(qiáng)的反饋機(jī)制，只有在傳遞非常重要，且可操作的信息時(shí)才需要使用它。如果用戶(hù)?？吹胶芏鄾](méi)有重要信息的對(duì)話(huà)框，他們很快就會(huì)忽略所有對(duì)話(huà)框提醒。想要了解更多信息，請(qǐng)參考Alert.（譯者注：Alert處在iOS Human Interface Guidelines的第4章 UI Elements部分，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候。若有需要，亦可先參考先前已翻譯的iOS7 UI Elements章節(jié)：下。）

1.7.4 輸入信息的方式要簡(jiǎn)單（Inputting Information Should Be Easy）

不管用戶(hù)是點(diǎn)擊控件還是使用鍵盤(pán)，輸入信息都會(huì)花費(fèi)時(shí)間和精力。如果在發(fā)揮有用的效用前就讓用戶(hù)輸入大量信息會(huì)減弱用戶(hù)繼續(xù)使用的欲望。

讓用戶(hù)更容易的進(jìn)行選擇。例如，使用選擇器或者表格代替純文本，因?yàn)榇蟛糠钟脩?hù)覺(jué)得從列表中進(jìn)行選擇要比打字容易的多。

適時(shí)地從iOS中獲取信息。設(shè)備上存儲(chǔ)了大量的用戶(hù)信息。可以的話(huà)，不要讓用戶(hù)提供你可以輕易找到的信息，例如聯(lián)系人或日歷信息。

提供有用的反饋來(lái)平衡用戶(hù)的輸入。在使用應(yīng)用的過(guò)程中，付出和回報(bào)的概念可以幫助用戶(hù)感到進(jìn)程在被推進(jìn)。

 

1.8 動(dòng)畫(huà)（Animation）

細(xì)微、精美的動(dòng)畫(huà)遍布iOS的用戶(hù)界面，他們使應(yīng)用的體驗(yàn)更具吸引力，更具動(dòng)態(tài)性。適當(dāng)?shù)膭?dòng)畫(huà)可以：

• 傳達(dá)狀態(tài)和提供反饋
• 增強(qiáng)直接的操縱感
• 將用戶(hù)的操作可視化

（譯者注：以上為視頻截圖，完整視頻請(qǐng)點(diǎn)擊觀看）

謹(jǐn)慎地增加動(dòng)畫(huà)，特別是在那些無(wú)法提供沉浸式體驗(yàn)的應(yīng)用中。過(guò)多和無(wú)理由的動(dòng)畫(huà)會(huì)阻礙應(yīng)用的流暢性，降低性能，還會(huì)分散用戶(hù)在操作中的注意力。

尤其是要有目的地，合理地應(yīng)用動(dòng)效和UIKit中的動(dòng)態(tài)控件，并確保對(duì)結(jié)果進(jìn)行測(cè)試。合理地使用動(dòng)效可以提升用戶(hù)的理解程度和愉悅感；應(yīng)用過(guò)度使用動(dòng)效會(huì)給用戶(hù)帶來(lái)迷惑和難以掌控的感覺(jué)。

如果可以，保持自定義動(dòng)畫(huà)和內(nèi)置動(dòng)畫(huà)的一致性。用戶(hù)習(xí)慣于內(nèi)置iOS應(yīng)用使用的精細(xì)動(dòng)畫(huà)。事實(shí)上，用戶(hù)傾向于把視圖之間的平滑切換，對(duì)設(shè)備方向改變的流暢相應(yīng)和基于物理的滾動(dòng)效果看做是iOS體驗(yàn)的一部分。除非，你的應(yīng)用要給用戶(hù)提供類(lèi)似游戲應(yīng)用的沉浸式體驗(yàn)，這種情況下自定義的動(dòng)畫(huà)可以區(qū)別于內(nèi)置動(dòng)畫(huà)。

使用風(fēng)格類(lèi)型一致的動(dòng)畫(huà)。自定義動(dòng)畫(huà)之間也需要保持一致性，這樣可以讓用戶(hù)在使用應(yīng)用以之前建立的經(jīng)驗(yàn)為基礎(chǔ)。

一般來(lái)說(shuō)，自定義的動(dòng)畫(huà)要考慮動(dòng)畫(huà)的現(xiàn)實(shí)性和可信性。人們樂(lè)意接受自由的藝術(shù)創(chuàng)作，但是當(dāng)動(dòng)效不合理或者違反物 理學(xué)時(shí)，用戶(hù)會(huì)感到困惑。例如，當(dāng)你從屏幕頂部下滑拖出一個(gè)視圖的時(shí)候，你也要上滑將它收起，因?yàn)檫@么做可以幫助用戶(hù)記住這個(gè)視圖從何而來(lái)。如果你下滑到 屏幕底部關(guān)閉這個(gè)視圖，用戶(hù)關(guān)于從屏幕上方呼起的心理模型就會(huì)被打破。

 

1.9 品牌推廣（Branding）

成功的品牌推廣不僅僅包括在應(yīng)用中添加品牌元素。優(yōu)秀的應(yīng)用應(yīng)該通過(guò)創(chuàng)建獨(dú)特的外觀和感覺(jué)來(lái)為用戶(hù)提供愉悅、難忘的體驗(yàn)。

在iOS系統(tǒng)之下可以很容易地使用自定義的圖標(biāo)、顏色和字體來(lái)創(chuàng)建區(qū)別于其他應(yīng)用的UI。當(dāng)你進(jìn)行這些元素的設(shè)計(jì)時(shí)，牢記以下兩點(diǎn)：

• 每個(gè)自定義的元素本身都需要具備良好的觀感和功能性，但它也應(yīng)該與應(yīng)用中其他元素保持一致，無(wú)論應(yīng)用中其他元素是自定義的還是標(biāo)準(zhǔn)的。
• 為了在iOS中感覺(jué)舒適，你的應(yīng)用雖然不必看起來(lái)跟內(nèi)置的一樣，但是需要對(duì)它的遵從、清晰度和深度（如欲了解更多，參見(jiàn)1 為iOS而設(shè)計(jì)（Design for iOS））進(jìn)行整合?；ㄐr(shí)間弄清楚在你的應(yīng)用中遵從、清晰和深度所代表的意味，并把它們?cè)谀愕淖远x元素中表達(dá)出來(lái)。

當(dāng)你需要讓用戶(hù)意識(shí)到你的品牌時(shí)，你應(yīng)該遵循以下幾點(diǎn)：

以精致優(yōu)雅不唐突的方式植入品牌元素。用戶(hù)使用你的應(yīng)用來(lái)完成事務(wù)或者進(jìn)行娛樂(lè)，他們不希望被強(qiáng)迫著去觀看廣告。為了獲得最好的用戶(hù)體驗(yàn)，你可以通過(guò)字體、顏色和圖像的設(shè)計(jì)來(lái)潛移默化地地提醒用戶(hù)你的品牌身份。

避免遠(yuǎn)離用戶(hù)關(guān)心的內(nèi)容。不要像上圖中的反例那樣將僅有品牌意義的內(nèi)容放在屏幕頂部二級(jí)欄上持續(xù)展示，使正文內(nèi)容空間被壓縮，而是考慮以其他低侵入性的方法無(wú)處不在地展示品牌，如使用自定義顏色、字體，或巧妙地定制屏幕的背景。

抵抗住誘惑，不要把你的logo貫穿整個(gè)應(yīng)用。移 動(dòng)設(shè)備的屏幕多數(shù)相當(dāng)小，logo的每一次出現(xiàn)都會(huì)占據(jù)空間，從而將用戶(hù)與他們想看的內(nèi)容隔離開(kāi)。而且，在應(yīng)用中顯示logo并不能像在網(wǎng)頁(yè)中顯示 logo那樣達(dá)到相同的目的：對(duì)于用戶(hù)來(lái)說(shuō)通常會(huì)很容易在不知道網(wǎng)頁(yè)所屬的情況下訪問(wèn)一個(gè)網(wǎng)頁(yè)，但卻極少有用戶(hù)會(huì)在完全不看一個(gè)iOS系統(tǒng)中的應(yīng)用圖標(biāo)的 情況下就打開(kāi)它。

 

1.10 顏色與字體（Color and Typography）

1.10.1 色彩有助于增進(jìn)溝通（Color Enhances Communication）

在iOS系統(tǒng)中，顏色會(huì)用于表明交互，傳遞活性以及提供視覺(jué)連續(xù)性。內(nèi)置的應(yīng)用程序選擇使用那些看起來(lái)更具個(gè)性的、純粹、干凈的顏色，并輔以或亮或暗的背景組合。

如果你要?jiǎng)?chuàng)建多樣的自定義顏色，要確保它們能夠和諧共存。例如，如果你的應(yīng)用的基本風(fēng)格是柔和的色調(diào)，你就應(yīng)該創(chuàng)建一個(gè)協(xié)調(diào)的柔和色調(diào)的色板用于整個(gè)應(yīng)用。

注意在不同情境下的顏色對(duì)比。例如，如果在導(dǎo)航欄的背景與欄按鈕標(biāo)題之間沒(méi)有足夠的對(duì)比，按鈕就會(huì)很難被用戶(hù)看到。一個(gè)快速但不嚴(yán)謹(jǐn)?shù)姆椒ㄊ峭ㄟ^(guò)將設(shè)備置于不同的光照環(huán)境之中（包括晴朗的室外）來(lái)測(cè)試設(shè)備上的顏色是否具有足夠的對(duì)比度。

雖然在設(shè)備上查看你的應(yīng)用能夠在一定程度上幫助你找到需要調(diào)整的地方，但這仍代替不了能產(chǎn)生可靠結(jié)果的更科學(xué)客觀的方法。這種方法涉及到判定前景色 和背景色的亮度值是否符合一定的比率。這個(gè)比率值可以通過(guò)在線(xiàn)對(duì)比度計(jì)算器或者根據(jù)WCAG2.0標(biāo)準(zhǔn)中提供的公式自己計(jì)算獲得。你應(yīng)用中理想的顏色對(duì)比 度應(yīng)該是4.5:1或更高。

當(dāng)你使用自定義的欄顏色時(shí)，著重考慮半透明的欄和應(yīng)用內(nèi)容。當(dāng)你需要?jiǎng)?chuàng)建能匹配特別顏色的欄顏色時(shí)（比如一個(gè)已有品牌中的顏色），可能在你獲得你想要的結(jié)果之前，你需要用各種顏色進(jìn)行實(shí)驗(yàn)。欄的顯示將會(huì)同時(shí)受到iOS系統(tǒng)所提供的半透明欄與藏在欄后面的應(yīng)用內(nèi)容的呈現(xiàn)所影響。

API注：使用淺色（tintColor）的屬性值給予欄按鈕顏色，使用欄淺色（barTintColor）的屬性值為欄本身賦色。欲了解更多關(guān)于欄屬性的內(nèi)容，可參見(jiàn)UINavigationBar Class Reference,，UITabBar Class Reference，UIToolbar Class Reference和 UISearchBar Class Reference.

注意顏色的盲區(qū)。多數(shù)色盲的人很難區(qū)分紅色與綠色。需要對(duì)你的應(yīng)用進(jìn)行測(cè)試以確保在其中你沒(méi)有將紅色與綠色作為 區(qū)分兩個(gè)不同狀態(tài)或值的唯一方式，一些圖像編輯軟件或工具能夠有效的幫你驗(yàn)證顏色的盲區(qū)。通常意義來(lái)說(shuō)，使用多種方式來(lái)表征原色的交互性是非常好的（需要 了解更多關(guān)于在iOS系統(tǒng)中表征交互性的信息，請(qǐng)參閱Interactive Elements Invite Touch）。

考慮選擇一種基準(zhǔn)色顏色來(lái)表征交互性與狀態(tài)。內(nèi)置的應(yīng)用里的基準(zhǔn)色包括比如備忘錄中的黃色，和日歷中的紅色等等。如果你定義一種用于表征交互和狀態(tài)的基準(zhǔn)色，要確保你的應(yīng)用中的其他顏色不會(huì)與它發(fā)生沖突。

避免給可交互和不可交互的元素使用相同的顏色。色彩是表明UI元素交互屬性的方式之一。如果可交互和不可交互的元素使用相同的顏色，用戶(hù)將會(huì)難以判斷哪些區(qū)域是可點(diǎn)的。

色彩可以向用戶(hù)傳達(dá)信息，但不一定會(huì)以你希望的方式。每個(gè)人眼中的色彩是不一樣的，不同的文化為色彩賦予的意義也是不相同的?；〞r(shí)間來(lái)研究如何使用色彩才可能會(huì)被其他國(guó)家或者文化接受。你要盡可能確定應(yīng)用中運(yùn)用的色彩向用戶(hù)傳達(dá)了恰當(dāng)?shù)男畔ⅰ?/span>

大多數(shù)情況下，不能讓顏色喧賓奪主，讓用戶(hù)分心。除非色彩是應(yīng)用的目的和本質(zhì)所在，通常情況下色彩應(yīng)該用來(lái)從細(xì)微細(xì)節(jié)之處提升用戶(hù)體驗(yàn)。

1.10.2 優(yōu)秀的排版提供清晰的傳達(dá)（Great Typography Enables Clear Communication）

Apple為全平臺(tái)設(shè)計(jì)了San Francisco字體以提供一種優(yōu)雅的、一致的排版方式和閱讀體驗(yàn)。在iOS 9及未來(lái)的版本中，San Francisco 是系統(tǒng)字體。

San Francisco搭配Dynamic Type，可以為您提供：

• 一系列的字號(hào)大小，在任何用戶(hù)設(shè)置，包括可訪問(wèn)性設(shè)置下，可獲得優(yōu)質(zhì)的清晰度和極佳的閱讀體驗(yàn)。
• 自動(dòng)調(diào)整文字的粗細(xì)，字母間距以及行高的能力。
• 為語(yǔ)義上有區(qū)別的文本模塊指定不同的文本樣式，比如正文、腳注或者標(biāo)題。
• 文本可以根據(jù)用戶(hù)在字號(hào)設(shè)置和可訪問(wèn)性設(shè)置中指定字體大小的變化作出適當(dāng)?shù)捻憫?yīng)的能力

下載San Francisco可訪問(wèn) https://developer.apple.com/fonts/.（注意：iOS9中的San Francisco字體取名為SF-UI）。當(dāng)你在你的app中采用San Francisco時(shí)，你可以調(diào)整模擬器>設(shè)置中的值來(lái)測(cè)試在不同尺寸下你的app的文本。

注：如果你是用自定義字體，你仍然可以采用Dynamic Type或根據(jù)系統(tǒng)的字號(hào)設(shè)置來(lái)規(guī)劃字體范圍。當(dāng)用戶(hù)改變?cè)O(shè)置時(shí)，你的應(yīng)用也必須響應(yīng)式的配合。如需了解如何使用文字樣式并確保當(dāng)用戶(hù)改變文字型號(hào)設(shè)置時(shí)你的應(yīng)用能夠獲取通知，可以參考Text Styles.

San Francisco 有兩類(lèi)尺寸: 文本模式（Text）和 展示模式（Display）。 文本模式適用于小于20點(diǎn)（points）的尺寸，展示模式適用于大于20點(diǎn)（points）的尺寸。當(dāng)你在你的app中使用San Francisco時(shí)，iOS會(huì)自動(dòng)在適當(dāng)?shù)臅r(shí)機(jī)在文本模式和展示模式中切換。

注：如果你使用應(yīng)用程序如Sketch或Photoshop來(lái)生成你的設(shè)計(jì)，那么當(dāng)你設(shè)置的字體不小于20點(diǎn)的 時(shí)候，你需要切換到展示模式。iOS會(huì)根據(jù)字體大小為San Francisco自動(dòng)調(diào)整字間距。（字間距是以用作于修改文字間距）。表格10-1 和 10-2分別是文本模式(Text)和展示模式(Display) 在不同字號(hào)下的間距值。

為了突出某些文字或者為了在內(nèi)容塊之間建立視覺(jué)關(guān)聯(lián)，你可以依賴(lài)由Dynamic Type支持的語(yǔ)義化樣式，如標(biāo)題、正文，你也可以指定字體權(quán)重，如細(xì)體或者半粗。使用 Dynamic Type樣式使得你的內(nèi)容能更好地表達(dá)含義，但如果你想要對(duì)你的設(shè)計(jì)有更好的把控能力，你可以對(duì)特定的文字設(shè)置特定的權(quán)重。（想要了解更多關(guān)于調(diào)整字體權(quán) 重， 可以參閱UIFont Class Reference.）

例如，你可能想要增加某些文字的權(quán)重，來(lái)幫助用戶(hù)可視化你的內(nèi)容的層次結(jié)構(gòu)，或者把用戶(hù)的注意力吸引到特定的詞或短語(yǔ)。另外，你可以通過(guò)增加較小文 字的權(quán)重和減小較大文字的權(quán)重，在多個(gè)不同字號(hào)的、相鄰的標(biāo)簽中建立視覺(jué)凝聚。字體權(quán)重在內(nèi)容的整體風(fēng)格和表達(dá)中有重要影響，因此你可以選擇特定的權(quán)重來(lái) 達(dá)到設(shè)計(jì)目的。

文本尺寸的響應(yīng)式變化需要優(yōu)先考慮內(nèi)容。并不是所有的內(nèi)容對(duì)于用戶(hù)都是同等重要的。當(dāng)用戶(hù)選擇更大的文本尺寸時(shí)，他們是想要使他們關(guān)注的內(nèi)容更容易閱讀；他們并不總是想要屏幕上的每個(gè)單詞都更大。

例如，當(dāng)用戶(hù)選擇具備更大易用性的文本尺寸時(shí)，郵件將會(huì)以更大的尺寸顯示郵件的主題和內(nèi)容，而對(duì)于那些沒(méi)那么重要的信息——如時(shí)間和收件人——?jiǎng)t采用較小的尺寸。

確保一個(gè)自定義字體在不同尺寸下的所有類(lèi)型都具備可讀性。實(shí)現(xiàn)這一效果的方法之一是效仿在不同的文本尺寸下iOS系統(tǒng)呈現(xiàn)字體樣式的一些方法。例如：

• 文本永遠(yuǎn)都不應(yīng)該小于11點(diǎn)（points），即使是用戶(hù)選擇極小的文本尺寸。相較而言，內(nèi)容樣式使用17點(diǎn)的字號(hào)作為大尺寸，這也是默認(rèn)的文本字號(hào)。
• 通常來(lái)說(shuō)，字號(hào)與行距值在每一檔的文本尺寸設(shè)置中差別為1點(diǎn)。唯一例外的是兩種標(biāo)題的樣式，它們?cè)跇O小、小和中尺寸的設(shè)置中均使用相同的字號(hào)、行距和字距。
• 在最小的三種文本尺寸中，字間距相對(duì)較大；而在最大的三中文本尺寸中，字間距相對(duì)緊湊。
• 標(biāo)題和內(nèi)容的樣式使用相同的字體尺寸，同時(shí)，為了區(qū)分標(biāo)題與內(nèi)容樣式，標(biāo)題樣式使用更重的值。
• 導(dǎo)航控制欄的文本使用相同的字號(hào)，而內(nèi)容文本的樣式則使用大尺寸的設(shè)置（值為17點(diǎn)）。
• 文本總是使用常規(guī)或者中重，一般不適用輕或者加粗。

通常情況下，應(yīng)用中整體應(yīng)該使用單一字體。多種字體的混雜會(huì)使你的應(yīng)用看上去支離破碎和草率。相反，使用一種字體和少數(shù)樣式。根據(jù)語(yǔ)義用途，使用UIFont類(lèi)的API來(lái)定義不同文本區(qū)域的樣式，比如正文或者標(biāo)題。

 

1.11 圖標(biāo)和圖形（Icons and Graphics）

1.11.1 應(yīng)用圖標(biāo)（The App Icon）

每個(gè)應(yīng)用都需要一個(gè)漂亮的圖標(biāo)。用戶(hù)常常會(huì)在看到應(yīng)用圖標(biāo)的時(shí)候便建立起對(duì)應(yīng)用的第一印象，并以此評(píng)判應(yīng)用的品質(zhì)、作用以及可靠性。

以下幾點(diǎn)是你在設(shè)計(jì)應(yīng)用圖標(biāo)時(shí)應(yīng)當(dāng)記住的。當(dāng)你確定要開(kāi)始設(shè)計(jì)時(shí)，請(qǐng)參考App Icon來(lái)獲取更詳細(xì)的設(shè)計(jì)規(guī)格與指導(dǎo)。（譯者注：App Icon處在iOS Human Interface Guidelines的Icon and Image Design部分，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候。）

• 應(yīng)用圖標(biāo)是整個(gè)應(yīng)用品牌的重要組成部分。將圖標(biāo)設(shè)計(jì)當(dāng)成一個(gè)講述應(yīng)用背后的故事，以及與用戶(hù)建立情感連接的機(jī)會(huì)。
• 最好的應(yīng)用圖標(biāo)是獨(dú)特的，整潔的，打動(dòng)人心的，讓人印象深刻的。
• 一個(gè)好的應(yīng)用圖標(biāo)應(yīng)該在不同的背景以及不同的規(guī)格下都同樣美觀。為了豐富大尺寸圖標(biāo)的質(zhì)感而添加的細(xì)節(jié)有可能讓圖標(biāo)在小尺寸時(shí)變得不清晰。

1.11.2 小圖標(biāo)（Small Icons）

iOS提供了一系列小的icon，用以代表各種常見(jiàn)任務(wù)與操作，它們常用在標(biāo)簽欄（Tab Bar）、工具欄（Toolbars）與導(dǎo)航欄（Navigation Bar）中。用戶(hù)通常都已經(jīng)了解這些內(nèi)置圖標(biāo)的含義了，因此可以盡可能的多使用它們。

如果需要自定義動(dòng)作或者內(nèi)容，你也可以設(shè)計(jì)自定義圖標(biāo)。設(shè)計(jì)這些小的線(xiàn)性圖標(biāo)與設(shè)計(jì)應(yīng)用圖標(biāo)有很大的區(qū)別，請(qǐng)參考Bar Button Icons來(lái)了解更多內(nèi)容。（譯者注：Bar Button Icons章節(jié)處在iOS Human Interface Guidelines的Icon and Image Design部分，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候）

請(qǐng)注意，你有時(shí)候也可以用文字來(lái)代替工具欄和導(dǎo)航欄的圖標(biāo)。 就像iOS的日歷里面，工具欄上便是使用”今天”,”日歷”和”收件箱”來(lái)代替圖標(biāo)進(jìn)行表意的。

想要決定在工具欄和導(dǎo)航欄中到底是用圖標(biāo)還是文字，可以?xún)?yōu)先考慮一屏中最多會(huì)同時(shí)出現(xiàn)多少個(gè)圖標(biāo)。同一屏幕中圖標(biāo)的數(shù)量過(guò)多可能會(huì)讓整個(gè)應(yīng)用看起來(lái)難以理解。使用圖標(biāo)還是文字還取決于屏幕方向是橫向還是縱向，因?yàn)樗揭晥D下通常會(huì)擁有更多的空間，可以承載更多的文字。

1.11.3 圖形（Graphics）

iOS應(yīng)用大多數(shù)圖形豐富。無(wú)論是你需要展示用戶(hù)的照片，還是需要?jiǎng)?chuàng)建自定義圖片，以下這些需求都應(yīng)該遵守：

• 支持Retina顯示屏。確保你應(yīng)用中的所有圖片資源都提供了高分辨率規(guī)格。尤其需要注意的是，iPhone 6 Plus需要提供@3x規(guī)格的圖片，而所有其他的高分辨率iOS設(shè)備都需要提供@2x規(guī)格的圖片。
• 顯示照片或圖片時(shí)請(qǐng)使用原始尺寸，并不要將它拉伸到大于100%。你不會(huì)希望在你的應(yīng)用中看到拉伸和變形的圖片。可以讓用戶(hù)自己來(lái)選擇他們是否想要縮放圖片。

不要使用從蘋(píng)果系列產(chǎn)品中復(fù)制的圖形。這些圖形均受版權(quán)保護(hù)，而且產(chǎn)品的設(shè)計(jì)可能會(huì)頻繁改變。

不要將蘋(píng)果的應(yīng)用圖標(biāo)，圖像或者截圖用于你的設(shè)計(jì)中。所有蘋(píng)果的設(shè)計(jì)均受版權(quán)保護(hù)并且不允許出現(xiàn)在你的UI中，除非它們是由系統(tǒng)直接提供的。

 

1.12 術(shù)語(yǔ)和措辭（Terminology and Wording）

你在應(yīng)用中呈現(xiàn)的每一個(gè)字都是與用戶(hù)進(jìn)行對(duì)話(huà)的一部分。把握這樣的對(duì)話(huà)機(jī)會(huì)，為你的用戶(hù)提供清晰的表意與愉悅的體驗(yàn)。

設(shè)置是面向全體用戶(hù)的一個(gè)基礎(chǔ)應(yīng)用，因此它使用了簡(jiǎn)明扼要的語(yǔ)言來(lái)描述用戶(hù)可以進(jìn)行的操作。舉個(gè)例子，設(shè)置→勿擾模式（Do Not Disturb）就沒(méi)有使用難以理解的復(fù)雜技術(shù)術(shù)語(yǔ)，而是用了簡(jiǎn)單的語(yǔ)言，給用戶(hù)描述了里頭的一系列操作。

保證你使用的術(shù)語(yǔ)是用戶(hù)能理解的。根據(jù)你對(duì)用戶(hù)群的理解來(lái)決定在應(yīng)用中使用什么樣的詞匯。舉個(gè)例子，在一款針對(duì)小白用戶(hù)的應(yīng)用中使用技術(shù)術(shù)語(yǔ)是不合適的，但對(duì)于針對(duì)高端用戶(hù)的應(yīng)用來(lái)說(shuō)，使用技術(shù)術(shù)語(yǔ)是很自然的事情。

使用非正式的友好語(yǔ)氣，但不需要太過(guò)卑微。避免太正式太僵化，或者太過(guò)嘻嘻哈哈，傲慢無(wú)禮。請(qǐng)記住，用戶(hù)可能會(huì)反復(fù)閱讀這些文本，因此有些起初看上去很俏皮的語(yǔ)句，多看幾次之后可能會(huì)顯得煩人。

像新聞編輯一般遣詞造句，避免不必要的冗余語(yǔ)句。當(dāng)你的文案足夠簡(jiǎn)明扼要，用戶(hù)就可以很輕松地閱讀和理解它。確定最重要的信息，精煉它并且突出它，讓用戶(hù)不需要讀一大段文字才能了解他們?cè)谡沂裁矗约跋乱徊揭鍪裁础?/span>

給控件加上短標(biāo)簽或者容易理解的圖標(biāo)。讓用戶(hù)只掃一眼就能知道這個(gè)控件是干什么的。

描述時(shí)間時(shí)要注意準(zhǔn)確性。今天和明天這些詞匯確實(shí)顯得比較友好，但有時(shí)候會(huì)讓用戶(hù)費(fèi)解，因?yàn)槟憧赡軟](méi)有辦法確定 用戶(hù)當(dāng)前的時(shí)區(qū)和時(shí)間。舉個(gè)例子，假如有一項(xiàng)活動(dòng)會(huì)在半夜12點(diǎn)前開(kāi)始，對(duì)于在同一個(gè)時(shí)區(qū)的用戶(hù)而言，這個(gè)活動(dòng)是在今天開(kāi)始的，但對(duì)于那些在早一點(diǎn)的時(shí)區(qū) 里的用戶(hù)而言，這個(gè)活動(dòng)在昨天就已經(jīng)開(kāi)始了。

為你的應(yīng)用寫(xiě)一則漂亮的App Store描述，地把握住這個(gè)與潛在用戶(hù)溝通的絕佳機(jī)會(huì)。除了準(zhǔn)確描述你的應(yīng)用、強(qiáng)調(diào)應(yīng)用的品質(zhì)與亮點(diǎn)以外，你還需要：

• 修正所有的拼寫(xiě)、語(yǔ)法與標(biāo)點(diǎn)符號(hào)錯(cuò)誤。這些小錯(cuò)誤也許不會(huì)影響用戶(hù)正常使用，但是可能會(huì)讓他們對(duì)應(yīng)用的整體品質(zhì)產(chǎn)生負(fù)面印象。
• 盡量少用全大寫(xiě)的詞匯。雖然大寫(xiě)單詞有時(shí)候可以吸引注意力，但是全大寫(xiě)的段落不適合閱讀，而且會(huì)產(chǎn)生一種朝用戶(hù)扯著嗓子吼的感覺(jué)。
• 可以描述bug修復(fù)情況。如果您的應(yīng)用新版包含用戶(hù)一直期待的bug修復(fù)，那在你的軟件描述中提到這一點(diǎn)就是個(gè)很好的做法。

 

1.13 與iOS的整合（Integrating with iOS）

與iOS整合，指的是在當(dāng)前平臺(tái)上給用戶(hù)提供一種舒適的、賓至如歸般的體驗(yàn)，當(dāng)然這并不意味著我們要把每一個(gè)應(yīng)用做的和內(nèi)置應(yīng)用一模一樣。

最好的與iOS整合的方式便是深刻地了解iOS的主題與核心——這一部分在上文為iOS而設(shè)計(jì)（Designing for iOS）部分中已有詳細(xì)描述，并尋求出如何在你的應(yīng)用中融合與表達(dá)這種主題。當(dāng)你這么做的時(shí)候，遵循本章中的指引可以幫助你為你的用戶(hù)提供他們想要的體 驗(yàn)。

1.13.1 正確使用標(biāo)準(zhǔn)UI元素（Use Standard UI Elements Correctly）

盡可能使用UIkit提供的標(biāo)準(zhǔn)UI元素是一個(gè)好主意。多使用標(biāo)準(zhǔn)元素而非自定義元素，你與你的用戶(hù)都將受益：

• 標(biāo)準(zhǔn)UI元素會(huì)根據(jù)iOS官方的更新而自動(dòng)更新——而自定義元素不會(huì)。
• 標(biāo)準(zhǔn)UI元素對(duì)于你自定義外觀和行為來(lái)說(shuō)擁有優(yōu)秀的擴(kuò)展性。舉個(gè)例子，iOS中所有的視圖（Views，從UIView中繼承的對(duì)象）都是可以使用TintColor屬性來(lái)定義顏色的，它讓?xiě)?yīng)用配色變得很簡(jiǎn)單。
• 用戶(hù)更熟悉和習(xí)慣標(biāo)準(zhǔn)的元素，因?yàn)樗麄兛梢粤⒖堂靼啄愕膽?yīng)用中這些元素的用途。

想要充分地利用標(biāo)準(zhǔn)UI元素的優(yōu)點(diǎn)，有一些關(guān)鍵點(diǎn)需要特別注意：

嚴(yán)格遵循每個(gè)UI元素的設(shè)計(jì)規(guī)范。當(dāng)你應(yīng)用中的UI元素的外觀與功能都是用戶(hù)所熟悉的，他們可以很容易地根據(jù)先前的經(jīng)驗(yàn)來(lái)使用他們，進(jìn)而更好地使用你的應(yīng)用。你可以從這些章節(jié)中找到各種UI元素的設(shè)計(jì)規(guī)范：Bars, Content Views, Controls, Temporary Views.

（譯者注：上文提到的章節(jié)均處在iOS Human Interface Guidelines的第4章，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候。若有需要，亦可先參考先前已翻譯的iOS7 UI Elements章節(jié)：上，下。）

不要混用不同版本的iOS里的UI元素。你一定不希望讓用戶(hù)覺(jué)得你的UI元素來(lái)自于與當(dāng)前用戶(hù)的設(shè)備版本不同的iOS系統(tǒng)。

大體來(lái)說(shuō)，請(qǐng)避免創(chuàng)造自定義UI元素來(lái)表現(xiàn)標(biāo)準(zhǔn)交互行為。先 問(wèn)問(wèn)你自己為什么一定要?jiǎng)?chuàng)建一個(gè)與標(biāo)準(zhǔn)UI元素行為完全相同的自定義元素。如果你只是想改變標(biāo)準(zhǔn)UI元素的外觀，可以考慮使用UIKit外觀定制 API(UIKit appearance customization APIs)，或者給元素填充別的顏色。如果你需要定義一個(gè)與標(biāo)準(zhǔn)控件稍有不同的行為，請(qǐng)確保你在改變了這個(gè)UI元素的屬性和行為之后，這個(gè)元素仍然能完成 你所希望的操作。如果你需要完全自定義一個(gè)行為，最好是設(shè)計(jì)一個(gè)與標(biāo)準(zhǔn)元素完全不相像的自定義元素。

提示：Interface Builder讓獲取標(biāo)準(zhǔn)UI元素，使用外觀定制API（the appearance customization APIs），獲取屬性，以及在你的應(yīng)用里使用自定義和系統(tǒng)自帶圖標(biāo)變得很簡(jiǎn)單。想要了解更多Interface Builder的內(nèi)容，請(qǐng)參閱Xcode Overview.

不要用系統(tǒng)自帶的按鈕和圖標(biāo)表達(dá)其他含義。iOS提供了多種可用的按鈕和圖標(biāo)。請(qǐng)確認(rèn)你了解它們的準(zhǔn)確表意；不要單純憑借你看到這些圖標(biāo)樣式的猜測(cè)和理解來(lái)解讀和使用它們。（你可以在Toolbar and Navigation Bar Buttons和Tab Bar Icons中了解到這些按鈕和圖標(biāo)的準(zhǔn)確含義。）

如果你所需要的功能無(wú)法用系統(tǒng)提供的按鈕和圖標(biāo)來(lái)表現(xiàn)，你也可以設(shè)計(jì)自定義按鈕。自定義按鈕的設(shè)計(jì)可以參考 Bar Button Icons.

（譯者注：上文提到的章節(jié)均處在iOS Human Interface Guidelines的第4章，翻譯將在后續(xù)更新中放出，煩請(qǐng)各位耐心等候。若有需要，亦可先參考先前已翻譯的iOS7 UI Elements章節(jié)：上，下。）

如果你的app是沉浸式體驗(yàn)，那么創(chuàng)造全新的自定義UI是合理的。因?yàn)槟阍趧?chuàng)造一個(gè)統(tǒng)一的體驗(yàn)環(huán)境，讓用戶(hù)在其中能夠有所期待并探索如何控制應(yīng)用。

1.13.2 弱化文件和文檔處理（Downplay File and Document Handing）

iOS應(yīng)用可以幫助用戶(hù)創(chuàng)建和處理文件，但這并不意味著用戶(hù)需要過(guò)分考慮iOS設(shè)備的文件系統(tǒng)如何運(yùn)作。

如果你的應(yīng)用中支持用戶(hù)創(chuàng)建和編輯文檔，那么提供一個(gè)清晰的圖形庫(kù)視圖(document library view)讓用戶(hù)能夠方便地打開(kāi)或者新建文檔是一個(gè)好的做法。理想狀況下，這樣的圖形庫(kù)視圖擁有以下特征：

• 高度圖形化。用戶(hù)通過(guò)屏幕上的縮略圖就可以一目了然，快速找出自己想要的文件。
• 讓用戶(hù)用最少的動(dòng)作完成自己的任務(wù)。比如說(shuō)，用戶(hù)可以快速地水平滾動(dòng)文件列表，然后輕點(diǎn)一下自己想要的文件來(lái)打開(kāi)它。
• 包含新建文檔功能。一個(gè)圖形庫(kù)視圖應(yīng)該支持讓用戶(hù)點(diǎn)擊一個(gè)新建文檔的占位圖便完成新建文檔操作，而不是讓用戶(hù)通過(guò)訪問(wèn)別的地方來(lái)新建文檔。

舉個(gè)例子，Pages的圖形庫(kù)視圖里面，既展示了用戶(hù)已存在的文檔，也加入了便捷的新建文檔操作。

提示：你可以使用Quick Look Preview功能來(lái)讓用戶(hù)預(yù)覽你的應(yīng)用中的文件，哪怕你的應(yīng)用不能打開(kāi)這些文件。想要了解如何在你的應(yīng)用中提供這個(gè)功能，請(qǐng)參閱Quick Look.

如果你的應(yīng)用允許用戶(hù)使用在其他應(yīng)用中創(chuàng)建的文檔，你可以通過(guò)模態(tài)文檔選擇視圖控制器（modal document picker view controller）來(lái)幫助用戶(hù)觸達(dá)它們。這個(gè)控制器可以提取用戶(hù)在iCloud中的文檔，還可以通過(guò)文檔提供者擴(kuò)展（Document Provider extensions）來(lái)提取在其它應(yīng)用中創(chuàng)建和儲(chǔ)存的文件。想要了解更多文檔提供者擴(kuò)展的內(nèi)容，可以參考Document Provider Extensions; 想要了解更多文檔提取視圖控制器，請(qǐng)參考Document Picker Programming Guide.

給用戶(hù)足夠的信心，讓他們相信除非主動(dòng)取消或者刪除，他們的成果會(huì)被隨時(shí)妥善保存。如果你的應(yīng)用幫助用戶(hù)創(chuàng)建于管理文檔，不能要求用戶(hù)每次都能及時(shí)保存。無(wú)論是打開(kāi)另一個(gè)文檔或切換應(yīng)用的時(shí)候，iOS應(yīng)用都應(yīng)當(dāng)承擔(dān)起幫助用戶(hù)保存輸入內(nèi)容的責(zé)任。

如果你的應(yīng)用的主要功能不是創(chuàng)造內(nèi)容，但又允許用戶(hù)查看或編輯信息，這種情況下你需要詢(xún)問(wèn)用戶(hù)是否要保存修改。在這種場(chǎng)景下，比較好的做法是提供 “編輯”按鈕，點(diǎn)擊后進(jìn)入編輯狀態(tài)，同時(shí)編輯按鈕變成“保存”和“取消”按鈕，這種變化可以提示用戶(hù)當(dāng)前處于編輯模式?！氨４妗笨梢员Ａ粜薷膬?nèi)容，“取 消”則退出編輯模式。

1.13.3 必要時(shí)提供可配置選項(xiàng)（Be Configurable If Necessary）

某些應(yīng)用需要用戶(hù)手動(dòng)安裝或設(shè)置選項(xiàng)，但是大部分應(yīng)用不需要如此。一個(gè)好的應(yīng)用可以讓大部分用戶(hù)快速上手，并通過(guò)主界面給用戶(hù)提供便捷的調(diào)整體驗(yàn)的方式。

當(dāng)你的應(yīng)用在默認(rèn)狀態(tài)下就能滿(mǎn)足大部分用戶(hù)的期望，用戶(hù)對(duì)設(shè)置的需求就減少了。如果你需要儲(chǔ)存用戶(hù)的基本資料，可以?xún)?yōu)先向系統(tǒng)請(qǐng)求和拉取相關(guān)信息，而不是上來(lái)就讓用戶(hù)自己填寫(xiě)它。如果你一定要提供用戶(hù)鮮少用到的設(shè)置項(xiàng)，請(qǐng)參考App Programming Guide for iOS中的The Setting Bundle部分來(lái)了解如何在代碼中定義它們。

盡可能在主UI中提供設(shè)置選項(xiàng)。如果這個(gè)設(shè)置項(xiàng)代表著用戶(hù)一個(gè)基本任務(wù)，又或者用戶(hù)在進(jìn)行主線(xiàn)任務(wù)時(shí)有可能頻繁改變?cè)O(shè)置，那么將設(shè)置項(xiàng)放在主UI中會(huì)很方便。如果用戶(hù)只是偶爾才會(huì)用到設(shè)置項(xiàng)，那么可以將其放在獨(dú)立的視圖中。

如果應(yīng)用內(nèi)相關(guān)設(shè)置需要在系統(tǒng)設(shè)置中改變，幫助用戶(hù)直接訪問(wèn)系統(tǒng)設(shè)置。尤其是，如果你要用一段文字來(lái)描述如何改變這個(gè)設(shè)置，比如“設(shè)置>隱私>定位服務(wù)”，倒不如直接放置一個(gè)按鈕，點(diǎn)擊后即可到達(dá)設(shè)置中的定位服務(wù)。想要了解如何實(shí)現(xiàn)，請(qǐng)參考 Settings Launch URL.

1.13.4 充分利用iOS技術(shù)（Take Advantage of iOS Technologies）

iOS提供了豐富的技術(shù)方式來(lái)支持用戶(hù)完成他們所期望的各種任務(wù)和場(chǎng)景。這意味著在絕大多數(shù)情況下，將系統(tǒng)提供的技術(shù)整合到你的應(yīng)用中，往往比自定義一種新的技術(shù)更為可靠。

某些iOS技術(shù)，比如多任務(wù)并行（Multitasking）與語(yǔ)音向?qū)В?/span>VoiceOver）等等，是所有應(yīng)用都應(yīng)該包含的系統(tǒng)級(jí)特性。而另外一些技術(shù)是否整合到應(yīng)用中，則取決于應(yīng)用本身的功能性。比如處理門(mén)票和禮品卡的應(yīng)用（Wallet）支持用戶(hù)在應(yīng)用內(nèi)內(nèi)購(gòu)（In-App Purchase），展示應(yīng)用內(nèi)置廣告（iAd Rich Media Ads）則可以整合 Game Center，同時(shí)支持iCloud.

 

本章英文原文訪問(wèn)地址：iOS Human Interface Guidelines
本章中文翻譯PDF下載：點(diǎn)此下載

出處：騰訊ISUX