通過iOS人機互動指南的變化看iOS7的設計理念

iOS7在介面上最大的變化就是拋棄了蘋果使用了多年的擬物化設計，而轉投扁平化設計陣營。一時間，業界評論褒貶不一，槽點多多亦不乏溢美之詞。我們先暫且不去評判新的圖示和整體設計風格的好壞，而是從其背後的設計理念的變化來思考蘋果的新設計。

 

形式追隨功能，UI服務內容

蘋果在更新的iOS人機互動指南中最先提到的一點就是Defer to Content（尊重內容）。無論UI如何變化，內容始終是體驗的核心，UI永遠是服務於內容而不能影響內容的表現。這不禁讓人想起louis sullivan(易斯·沙裡文)當年的那句”Form follows the function”（形式追隨功能），蘋果的這次改變實際上是對設計本源的重新認知。

從iOS7具體的設計表現來看，以下幾點對其設計理念做出了很好的詮釋。

強調充分利用螢幕空間

iOS7強調讓內容自然地延伸至整個螢幕，而不使用多餘的視覺元素將內容與操作區、資訊區分開。一個最明顯的例子就是頂部狀態列融入內容，不再用線條分割開，使使用者在視覺上感覺內容空間變大。

 

為了使螢幕主體內容更加突出，更多地呈現給使用者，必要時會隱藏UI元素，將螢幕空間讓給內容。iOS7在很多原生應用中都是用了自動隱藏上下狀態列和導航欄的設計。地圖應用中甚至連最頂端的狀態列也一併隱藏了。

 

弱化控制元件視覺效果，以避免干擾內容

這一點是iOS7最明顯的變化，也就是所謂的扁平化設計風格。新的設計去除了iOS6系統控制元件的紋理和質感表現，非必要時不再使用擬物化方法來表達。最明顯的例子是系統按鈕控制元件，不再使用擬物化的按鈕邊框及高光、陰影，取而代之的是簡化的圖示元素和操作內容。

 

iOS6的按鈕被指示箭頭和文字所取代，而為了表達元素的可操作性，iOS7定義了關鍵色這一概念。在同一個app中，使用區別於內容的一致的統一用色來表達可操作元素。在備忘錄中，使用的是黃色；而在系統設定中，則統一使用了藍色作為關鍵色。

整體視覺效果上的變化，日曆的例子最為明顯，可以看到iOS7與iOS6兩種截然不同風格的日曆表達方式，iOS7的日曆，內容更加突出，操作元素被弱化；而iOS6的日曆，極具操控感，螢幕上每個內容元素和操作元素都是可互動的。

優化內容元素，使其清晰可見

我們知道，在設計中運用留白可以使得要表現的主體內容和功能更加突出。在iOS人機互動指南中，是這樣描述留白的：空白可以向使用者傳遞寧靜和安寧的感覺，讓app顯得更專注，更有效率。

iOS7的日曆是一個留白運用的經典例子，空白空間的使用使得iOS7的日曆內容更加突出，並不在有iOS6日曆的擁擠和緊迫感。

構建全新的層次空間，建立新的視覺秩序

　　iOS7引入了全新的視覺層次的概念，這種分層介面有助於營造縱深感，建立層次結構和秩序，並幫助使用者理解螢幕元素間的物理關係。

通過視差動畫營造縱深感

在主屏上，由於圖示層與背景層的分離，iOS7利用加速感應器檢測使用者視線角度的變化，控制不同層的位移速度，巧妙營造了視差動畫，從而螢幕元素活躍起來，營造了立體縱深感。

下圖是iOS7主屏在手機不同傾斜角度的截圖。可以看到在不同角度背景層與前面圖示的位置關係是不同的。

大量使用半透明UI元素

半透明效果能夠幫助使用者儘可能多的瞭解到被遮擋的內容，並使使用者理解層與層之間的物理關係。

 

相對於安卓的控制中心介面，採用同樣的拉出的方式，iOS7半透明的設計能夠讓使用者瞭解到控制皮膚和後面介面的層次關係，表達清晰，而安卓的皮膚，則更容易迷失。

在iOS6中，時間選擇器採用了非常逼真的擬物化效果，模擬了撥輪進行時間設定。IOS7則去除了撥輪的質感和紋理，將其扁平化，通過透視原理和半透明玻璃效果表現了一個扁平化的撥輪。值得注意的一點是，iOS7的玻璃效果處理得非常逼真到位，選擇時間的中間狀態裡，體現出了玻璃的折射效果。這一點在iOS6中並沒有見到。

 

鼓勵採用深度層次的資訊結構

在資訊結構上，iOS7更鼓勵採用深度層次來與使用者交流，並要求隱喻更加符合物理世界。

iOS7的資料夾摒棄了iOS6的螢幕裂開效果，而是採用了置於主屏之上的毛玻璃效果。這與系統整體的層次關係是相呼應的，在iOS7的層級秩序裡，背景層始終是處於最底層的，其他表現層則置於其上。那麼資料夾的開啟則理應是懸浮於主屏之上，並採用毛玻璃的效果表達其層次關係。

同時，iOS7一致性的應用/資料夾開啟動畫，也體現出了這種深度層次關係。與iOS6的開啟動畫不同，iOS7的開啟動畫是以被點選的應用/資料夾為中心，向四周放大的形式開啟，表現出一個非常合理的深度層次關係。而iOS6則無論被點選應用/資料夾位置，均是以螢幕中心點為中心，向四周放大開啟。從這一動畫方式的改變可以看出，iOS7更注重動畫與真實物理世界規則的對應，而不僅是流於形式。

 

iOS7的日曆應用採用了年、月、日3個深度層級的資訊結構，這較之iOS6的日曆，是一個很大的變化。IOS6的日曆應用強調扁平化的資訊結構，整個應用只有一個深度層級，月、日的切換通過TAB切換來實現，其他所有操作功能也都在這個一個層級中進行。深度的層級設計能夠有效減少每個層級介面中的操作元素，是的介面更乾淨、整潔，內容元素突出。與這種深度層級配合的轉場動畫與前面提到的系統開啟應用/資料夾的動畫一致，均已使用者點選出為中心點進行放大，向使用者傳達出與深度層級相對應的縱深感。

 

同樣的深度層級結構也運用到了圖片應用中，圖片的四個層級一次是年度、精選時刻和單圖。

 

通過蘋果最新的iOS人機互動指南我們可以看出，蘋果在對待所謂“扁平化”設計風格上是有著自己獨到的設計理念的。正如蘋果官網所說的那樣，“人們常常將簡約等同於極簡主義。但是，真正的簡約遠不止刪除矯飾和去除雜亂那麼簡單。而是因應你的需要，因地、因時恰到好處地展現每一方面。刪繁就簡，事事有序，以及確保所做的每一件事總是“行之有效”。當你第一次上手使用，就對它所能做的瞭然於胸時，那就是簡約。”

但好的設計理念，仍需不斷打磨，經過千錘百煉的設計來表現。從本次釋出的iOS7 beta的很多細節不難看出，本次iOS7的釋出是倉促的，許多設計還有很多值得推敲的地方，因此也引來眾多吐槽。不過，相信未來，隨著新設計風格的不斷完善，蘋果還會是果粉心目中的那個蘋果。