關於iOS7，設計師需要了解的十件事

在今年的WWDC上，蘋果推出了採用全新設計語言打造的iOS7。新系統棄用了諸如皮革、木質一類的偽3D擬真效果，取而代之的是更加簡潔輕量的設計路線，其中文字排版成了重頭戲，另外在某些方面也受到了扁平化設計的影響。

對於負責打造iOS應用介面的設計師們來說，長久以來的設計習慣和規則即將被改變。在iOS7的這些變化當中，哪些與設計師們最為相關？蘋果公司在轉變了自身的設計思維之後，又會希望我們這些應用設計者們將哪些新東西體現到自己的應用當中？

我們分析了蘋果的iOS7 UI過渡指南，並從中挑選出了設計師們需要知道的最重要的10條設計方面的變化。希望你能通過本文了解到iOS7的這些新特性將會怎樣影響到你的內容呈現方式。

根據蘋果官方的設計規範，設計師們需要遵守三點最核心的設計主題：

• 依從：UI要幫助使用者對內容進行理解和互動，但絕不能與內容產生競爭關係。
• 清晰：任何字號的文字都要清楚易讀，圖示要精細且含義明確，裝飾性元素要少而精，且使用得當；聚焦於功能性的實現，並以此激發設計的進行。
• 縱深：視覺外觀的層次以及逼真的動畫效果可以傳達出介面的活力，使介面更容易被理解，並提升使用者的愉悅度。

蘋果希望你在設計應用的介面和互動模式時密切關注這些設計主題，特別是“依從”。它著重強調了怎樣使設計更好地支援內容，而不是反過來壓制內容。

可以看看蘋果是怎樣在iOS7內建的日曆應用當中貫徹這一點的。新的日曆應用在介面上極大的簡化了，去除了一切不必要的設計元素，並使用了乾乾淨淨的白色背景，完全以內容為中心。

iOS7使用了全新的動態字型系統，以改善文字內容在任何字號下的易讀性。

動態字型可以自動調整任何字號下的文字粗細、字間距和行距。它同時支援字型風格，使你能夠為內容標題、正文和按鈕當中的文字設定不同的樣式。

新的天氣應用為我們展示了新的字型以及清晰的文字排版在使用了動態背景的全屏檢視當中的表現。

iOS7當中最重要的設計變化之一就是在介面中引入了透明與半透明化。

狀態列(status bar)能夠以完全透明的形式呈現，導航欄(navigation bar)、標籤欄(tab bar)、工具欄(tool bar)和其他一些控制元件也採用了半透明化的處理方式。因此，你可能需要調整內容檢視在縱向上的實際尺寸，以便在半透明控制元件的下方將內容上下文隱約地展示給 使用者。

另外你也要考慮到全新的控制中心(control center)，使用者可以在這裡快速訪問到一些常用功能，例如開啟藍芽、調整螢幕亮度等等。控制中心是一種模態檢視(modal view)，它會隨著使用者的手勢從螢幕底部向上展開，並覆蓋在系統介面或當前應用介面之上；使用者可以透過其半透明毛玻璃背景看到下方介面中的內容環境。

iOS7裡的按鈕不再有邊框和背景。這使得按鈕中的標題文字可以使用相對大一些的字號，但對於那些經過自定義設計的按鈕來說，你需要重新考慮它們的樣式能否適用於新的系統風格。

蘋果在iOS7當中加入了右滑切換介面的手勢。切換過程中，導航欄會展現出精巧的介面覆蓋疊加效果。如果你為導航欄中的 按鈕使用了自定義設計的背景圖片，那麼現在你需要建立一個蒙版圖片來確保這種動畫效果的實現。詳見iOS7 UI過渡指南之Bars and Bar Buttons一節。

iOS7的標籤欄和工具欄也有了全新的外觀，對於其中的圖示，你可能需要重新繪製一套更簡潔、更線條化的圖片了。

你可以在iOS7自帶的簡訊應用當中看到最官方的按鈕使用示例，包括導航欄中的新訊息按鈕、返回到訊息列表的按鈕、聯絡人按鈕、傳送按鈕等。

透明的狀態列，移除了左右邊距和邊框的介面，這些新風格體現出蘋果正在鼓勵設計師們將介面中的內容擴充套件至螢幕邊緣。

例如系統鍵盤一類的模態檢視都採用了半透明的風格，使得它們底部的內容元素可以被使用者感知到，即使模糊不清，也可以傳遞出縱深的含義。系統內建的天氣、照片和相機應用都非常好的展示了怎樣使用全屏風格展示內容。

根據“依從”原則所提倡的，蘋果在設計規範中進一步強烈建議設計師們“避免模擬和擬物化的視覺指引形式”。使用者介面應該是一種圍繞著內容而存在的支援結構，不要喧賓奪主。

簡單的說，這意味著蘋果不再願意看到3D質感的按鈕，以及漸變、投影等其他擬物化的設計元素，因為這樣的元素會導致“UI元素過重，以至於壓倒內容”。

雖然互動元素要輕量化，但44畫素的最小點選區域規則依然有效，你不能寄希望於使用者能夠精準的點選到小於44畫素見方的介面元素。

關於移除擬物化風格的設計方式，可以參考iOS7內建的Game Center、日曆和Podcast應用。

iOS7最吸引人的設計之一就是系統介面當中由加速計驅動的3D效果。隨著裝置在物理空間當中的移動，圖示與背景圖片會展示出視差效應。這是iOS7三大設計主題當中的第三點的典型示例：

縱深：視覺外觀的層次以及逼真的動畫效果可以傳達出介面的活力，使介面更容易被理解，並提升使用者的愉悅度。

自然，蘋果也希望應用設計師們採用相同的方式，通過半透明及動畫效果來展示介面和元素之間的層級關係。這是應用設計理念的一次重大飛躍，而且隨著iOS7的釋出和普及，這些效果很快就會成為使用者期望當中的一部分。

在iOS7設計規範當中，蘋果建議，在iOS7框架下重新設計應用的最佳方式，就是剝離你已有的介面，將應用的核心功能呈現出來，重新確認它們之間的相關性。

一旦你確認好功能方面的核心要素，就需要通過iOS7的設計主題將介面和互動模式重新構建起來。舉個簡單的例子，蘋果的指南針應用採用了最小化和功能優先的設計方式，通過重新設計過的、更注重細節的形式來展示關鍵資訊。

iOS7的應用介面通過大量的呼吸空間來確保可讀性和易用性。在官方的設計規範中，蘋果明確指出，他們希望設計師們通過留白傳達出平靜和穩定的感覺，使應用看上去更加專注和高效。

不要將所有東西都緊緊的塞到介面當中，通過留白讓你的內容呼吸起來。你可以通過App Store等介面來看看蘋果自己是怎樣做的。

最後一點從技術角度上講不是新東西了，但在iOS7設計規範中，蘋果再次提醒設計師們，要避免使用那些無意義的、主要用 來展示品牌資訊的啟動畫面，或是任何妨礙使用者使用應用完成任務的介面。我們的目的是要使用者儘可能快速的獲取內容或使用功能，所以除非你有充分的理由，否則 不要使用歡迎介面。為了強調這一點，蘋果專門拿計算器應用做了一張演示圖片，來告訴我們不要這樣做。

 

自：資料控