今天這篇長文讓人激動到手發抖，騰訊譯者糖箔糊的心血譯作，整篇2萬多字，源自官方超詳細的IOS 8人機界面指南，非常用心的作品，文字到位，邏輯清晰，保證任何一個細節讀起來都能明白曉暢，趁著IOS 8 剛剛發布，趕緊提前學起來，千萬記得收藏呦!

　　小技巧：Word 2013會自動檢測目錄，閱讀模式下學習非常方便!

　　1.1 為iOS而設計（Designing for iOS）

　　iOS 的革新關鍵詞如下：

　　遵從 ：UI能夠更好地幫助用戶理解內容并與之互動，但卻不會分散用戶對內容本身的注意力。

　　清晰 ：各種大小的文字應該易讀，圖標應該醒目，去除多余的修飾，突出重點，很好地突顯了設計理念。

　　深度 ：視覺的層次和生動的交互動作會賦予UI新的活力，不但幫助用戶更好理解新UI的操作并讓用戶在使用過程中感到驚喜。

　　無論你是重新設計一個現有的應用或是重新開發一個，請嘗試下列方法：

　　首先，去除了UI元素，讓應用的核心功能呈現得更加直接并強調其相關性。

　　其次，直接使用iOS的系統主題讓其成為應用的UI，這樣能給用戶統一的視覺感受。

　　最后，保證你設計的UI可以適應各種設備和不同操作模式，這樣用戶可以在不同場景下舒適地享用你的應用。

　　在整個設計過程中，時刻準備著推翻先例，假設問題，并以重點內容和功能(為目標)來驅動每個細節設計。

　　1.1.1 以內容為核心（Defer to Content）

　　雖然明快美觀的UI和流暢的動態效果是iOS體驗的亮點，但內容始終是iOS的核心。

　　這里有一些方法，以確保你的設計能夠提升你的應用功能體驗并關注內容本身。

　　充分利用整個屏幕

　　天氣應用是最好的例子：漂亮的天氣圖片充滿全屏，呈現用戶所在地當前天氣情況這最重要的信息，同時也留出空間呈現了每個時段的氣溫數據。

　　盡量減少視覺修飾和擬物化設計的使用

　　 UI面板、漸變和陰影有時會讓UI元素顯得很厚重，致使搶了內容的風頭。應該以內容為核心，讓UI成為內容的支撐。

　　嘗試使用半透明底板

　　半透明的控件——比如控制中心——關聯了使用場景，幫助用戶看到更多可用的內容，并可以起到短暫的提示作用。在iOS中，透明的控件只讓它遮擋住的地方變得模糊——看上去像蒙著一層米紙一樣——它并沒有遮擋屏幕剩余的部分。

　　1.1.2 保證清晰度（Provide Clarity）

　　保證清晰度是另一個方法，以確保你的應用中內容始終是核心。以下是幾種方法，讓最重要的內容和功能清晰，易于交互。

　　使用大量留白

　　留白讓重要內容和功能顯得更加醒目。此外，留白可以傳達一種平靜和安寧的視覺感受，它可以使一個應用看起來更加聚焦和高效。

　　讓顏色簡化UI

　　一個主題色——比如在記事本中使用的黃色——讓重要區域更加醒目并巧妙地表示交互性。這同時也給了一個應用一個統一的視覺主題。內置應用使用家族化的系統顏色，無論在深色和淺色背景上看起來都干凈，純粹。

　　通過使用系統字體確保易讀性

　　iOS的系統字體自動調整行間距和行的高度，使閱讀時文本清晰易讀，無論何種大小的字號都表現良好。無論你是使用系統或是自定義字體，務必使用動態型，這樣你的應用可以在用戶選擇不同字號時做出應對。

　　使用無邊框的按鈕

　　默認情況下，所有bar上的按鈕都是無邊框的。在內容區域，無邊框按鈕以文案、顏色以及操作指引標題來表明按鈕功能。當按鈕被激活時，該按鈕呈現高亮的淺色狀態來作為操作響應。

　　1.1.3 用深度來體現層次（Use Depth to Communicate）

　　iOS經常在不同的層級上展現內容，用以表達分組和位置，并幫助用戶了解在屏幕上的對象之間的關系。

　　通過使用一個在主屏幕上方的半透明背景浮層來區分文件夾和其余部分的內容。

　　備忘錄以不同的層級展示，如插圖所示。用戶在使用備忘錄里的某個條目時，其他的條目被收起在屏幕下方(譯者按：其實這個視覺提示使用起來很隱晦)。

　　日歷有較深的層級，當他們在翻閱年、月、日的時候，以及增強的交互動畫給用戶一種層級縱深感(循序切換的層次，從年到月到日)。在滾動年份視圖時，用戶可以即時看到今天的日期以及其他日歷任務。當用戶處于月份視圖時，點擊年份視圖按鈕，月份會縮小至年份視圖中的所處位置。

　　今天的日期依然處于高亮狀態，年份出現在返回按鈕處，這樣用戶可以清楚地知道他們在哪兒，他們從哪里進來并且知道如何返回。

　　類似的過渡動畫出現在用戶選擇一個日期時：月份視圖從所選位置分開，將當前的周日期推向屏幕頂端并翻轉出以小時為單位的當天時間視圖。這些動畫加強了日歷上年月日之間的關系的感知度。

　　1.2 iOS應用解析（iOS App Anatomy）

　　幾乎所有的iOS 應用都應用了UIKit framework中定義的組件。了解這些組件的名字，作用和構成能夠幫助你設計應用過程中做出更好的決定。

　　UIKit提供的UI組件大致分成以下4種大類：

　　Bars ： 包含了導航信息，告訴用戶他們所在的位置并包含了一些能幫助用戶瀏覽或啟動某些操作的控制按鈕。

　　內容視圖： 包含了應用的主體內容以及某些操作行為，比如滾動、插入、刪除、排序等等。

　　控制按鈕： 展示信息或者控制動作。

　　臨時視圖： 短時間出現，給用戶重要信息或者額外的選擇或者其他功能。

　　除了定義UI組件，UIKit也定義對象實現的功能，例如手勢識別、繪圖、輔助功能和打印支持。

　　從編程的角度來說，UI組件被認為是不同類別的視圖，因為他們從UIView得到繼承。視圖能繪制屏幕內容并且知道用戶何時觸摸了屏幕。視圖的所有類型有：控件(比如按鈕和滑塊)，內容視圖(比如集合視圖和表格視圖)，以及臨時視圖(如警告提示和動作菜單)。

　　要在應用中管理一組或者一系列的視圖，通常需要使用一個視圖控制器，它能協調視圖的顯示內容，實現與用戶交互的功能并能在不同屏幕內容之間切換。比如，“設置”使用了一個導航控制器來展示其視圖層級。

　　下面是一個例子，關于視圖與視圖控制器如何結合并呈現iOS 應用的UI。

　　雖然開發者認為真正起到作用的是視圖和視圖控制器，但一般用戶感知到的iOS應用是不同屏幕內容的集合。從這個角度來看，在應用里，屏幕內容一般對應于一個獨特的視覺狀態或者模式。

　　注：一個iOS應用程序包含一個窗口。但是，不同于計算機程序中的窗口，iOS窗口沒有可見的部分并且不能在屏幕上被移動到另一個位置。很多iOS應用程序只有一個窗口;可以支持外部顯示設備器的應用程序可以有不止一個窗口。

　　在iOS Human Interface Guidelines中，screen這個詞和大部分用戶理解的一樣。作為一個開發者，你也許需要讀一下其他與UIscreen相關的章節，這樣你可以更好的了解如何關聯外部屏幕。

　　1.3 適應性和布局（Adaptivity and Layout）

　　1.3.1 為自適應而開發

　　人們通常想隨心所欲地使用自己喜歡的應用程序。在iOS 8及未來的版本中，你可以使用不同分辨率和自動布局來幫助你定義屏幕布局視圖，視圖控制器以及需要隨顯示環境改變的視圖(顯示環境display environment的概念指的是設備的整個屏幕或者其中一部分，比如一個跳出菜單區域或一個分視圖控制器的主視圖部分)。

　　iOS定義了兩個尺寸類別(size class)，常規的(regular)和壓縮的(compact)。常規尺寸有著較易拓展的空間，而壓縮尺寸約束了空間的使用。想要定義一種顯示環境，你需要定義橫縱尺寸類型。如你所想，iOS設備可以有橫屏豎屏兩種不同的使用模式。

　　iOS能隨著顯示環境和尺寸類別變化而自動生成不同布局。舉個例子，當垂直尺寸從壓縮變為常規時，導航欄和工具欄會自動變高。

　　當你靠尺寸類別來驅動布局變化時，你的應用在任何顯示環境時都能顯示得很好。關于如何在Interface Builder中更好的使用尺寸類別，你可以查閱 Size Classes Design Help。

　　注： 在一種尺寸類別中，持續使用Auto Layout進行小的布局調整，比如拉伸或壓縮內容。

　　下面的實例可以幫助你理解尺寸類型是如何適配不同設備的顯示環境。例如：iPad在長寬和橫屏豎屏時都使用常規尺寸類型。換句話說，iPad顯示環境一直處于垂直和水平的常規狀態。

　　iPhone的顯示環境可根據不同的設備和不同的握持方向而改變。

　　豎屏時，iPhone6 Plus使用的是常規高度和壓縮寬度類型。

　　橫屏時，iPhone6 Plus使用的是壓縮高度和常規寬度類型。

　　其他iPhone型號，包括iPhone6使用相同的尺寸類型設置。

　　豎屏時，iPhone 6，iPhone 5 和iPhone 4S使用的是壓縮寬度和常規高度。

　　橫屏時，這些設備在寬高上使用的都是壓縮類。

　　1.3.2 在不同環境提供良好體驗

　　當你使用自適應來開發UI時，你可以保證UI跟隨顯示環境變化而適當地響應。遵照這些指南，你可以給用戶良好的設備響應體驗。

　　在所有環境下都保持對主體內容的專注

　　這是最高優先級。人們使用應用時，與感興趣的內容發生互動。當使用環境變化的同時，改變專注點會讓用戶感覺到迷失方向，喪失了對應用的控制。

　　避免布局上不必要的變化

　　在所有環境中類似的使用體驗讓人們在旋轉設備或在不同設備上運行你的應用時維持使用模式。例如，如果你使用一個網格在水平的常規模式下顯示圖像，你無需在一個列表中展示與壓縮模式下相同信息，雖然你可能調整了網格的尺寸。

　　如果你的應用 只在一個方向上運行，那么請直接一點

　　人們希望在各種握持方式下都可以使用你的應用，能滿足這個期待是最好的。但是，如果你的應用只在一個方向下運行，那么以下幾點請務必注意：

　　避免提示人們旋轉設備的提示UI出現。讓應用清晰地運行在支持的方向下，讓用戶明白應該旋轉設備，而不是添加不必要的引導性混亂。

　　支持同一個方向上的變化。例如，如果一個應用只能垂直運行，用戶無論用左手或是右手握持時都能觸及到home鍵。如果用戶在使用應用時180度旋轉設備，那最好應用內容也能及時響應并旋轉180度。

　　如果你的應用 將設備方向翻轉視為用戶輸入（的一種指令），那么就按照程序設定的方式來響應設備翻轉

　　舉個例子，一個游戲讓用戶利用設備翻轉來移動游戲中的部件，那么這個游戲應用本身(的UI)不能對翻轉屏幕產生響應。在這種情況下，你必須關聯兩個需要變化的方向，并且允許人們在這兩個方向切換直到他們開始(了解并執行)應用的主體任務。一旦人們開始執行主要任務，那就開始按程序設定的那樣來響應設備的動作吧。

　　1.3.3 使用布局來溝通（Use Layout to Communicate）

　　布局包含的不僅僅是一個應用 屏幕上的UI 元素外觀

　　你的布局，應該告訴用戶什么是最重要的，他們的選擇是什么，以及事物是如何關聯起來的。

　　提升重要內容或功能，讓用戶容易集中注意在主要任務上

　　有幾個比較好的辦法是在屏幕上半部分放置主要內容，以從左到右的習慣，從靠近左側的屏幕開始。

　　使用視覺化的重量和平衡向用戶展示相關的屏顯重要元素

　　大型控件吸引眼球，而比小的控件更容易在出現時被注意到。而且大型控件也更容易被用戶點擊，這讓它們在應用中更加有用——就像電話和時鐘(上面的按鈕)——用戶經常在容易分心的環境中能(正常)使用它們。

　　使用對齊來讓閱讀更舒緩，讓分組和層次之間更有秩序

　　對齊讓應用看起來整潔而有序，也讓用戶在專注于屏幕時更有空間，從而專注于重要信息。不同信息組的縮進與對齊讓它們之間的關聯更清晰，也讓用戶更容易找到某個控件。

　　確保用戶能明白處于默認尺寸的首要內容的含義

　　例如，用戶無需水平滾動就能看到重要的文本，或不用放大就可以看到主體圖像。

　　準備好改變字體大小

　　用戶期望大多數應用能有設置字號大小的功能。為了適應一些文本大小的變化，你也許需要調整布局;想要得到更多文本顯示相關的信息，你可以查閱章節Text Should Always Be Legible.

　　盡量避免UI 上不一致的表現

　　在一般情況下，有著相似功能的控件看起來也應該類似。用戶常常認為他們看到的不同總有原因，而且他們傾向于花時間去嘗試(譯者按：因此為了避免用戶做無用的嘗試所以建議類似功能外觀一樣)。

　　給每個互動的元素充足的空間，從而讓用戶容易操作這些內容和控件

　　常用的點按類控件的大小是44 x 44點(points)。