知名iOS開發者Matt Gemmell談iOS 7

袁欣發表於2013-06-17

本週早些時候,蘋果釋出並提供了iOS 7 的預覽。正如外界所預期的一樣,iOS 7呈現了一種由簡潔有力的線條,單一或者漸變的顏色,缺少裝飾的美學風格。

對比iOS 6,我願意聊聊我對於這套新UI的一些看法。

首先最讓我吃驚的是有人對這種改變感到驚訝。這種美學風格的改變其實已經持續了一段時間了;早在一年前我在《Augmented Paper》這篇文章中就對此有過描述。

與此同時,業界大部分公司都開始已經轉向一種減少美化的UI設計風格(不可否認一部分公司可能只想和別人有所區別),而iOS一直堅定地實踐清楚地描繪螢幕的各段,並使用光照和陰影等偽3D效果來模擬出一種物理的功能可見性(譯註:也就是 iOS 7 之前的擬物化設計)。

問題是,我們已經長大。我們不需要有人手把手地指導我們怎麼去點選。互動就像是一種邀請,物理誘因只是其中一種特定地型別。iOS 7是為更加成熟的消費者準備的系統,他們理解數字介面也具有互動性,也不希望任何東西妨礙介面之中的內容。

基本的功能沒有任何改變。你仍然可以用同樣的方式使用iOS,幾乎一切都和你所期望的一樣。相同的手勢一樣可以工作。也許會有一些差異,但這是一個重要的全新作業系統,畢竟這些變化主要是審美風格的改變。如果你習慣了以前的版本你不會對iOS 7感到困惑。

然而,你可能發現它感覺更流暢、響應更加快速和現代化。

顏色和邊界

iOS 7可能用同樣的方式工作,但它看起來很不同。這些變化通過在iOS 6和iOS 7中用聯絡人應用檢視聯絡人的資訊可以進行有效的總結。

Contacts on iOS 6 and iOS 7

iOS 7放棄了邊界,取而代之的使用色彩來表示互動性、用分隔線來組織資訊。所有的控制元件是隱式的,基於文字標籤或圖示, 它們通過一個主題顏色來定位並讓你感覺有一種視覺“能量”(應用和應用之間不同:聯絡人是藍色的,音樂是紅色的,記事本是黃色的)。圖示都由非常基本輪廓的來呈現,現在似乎有一種省略標題的趨勢,並且將圖示和之後的背景放在同一個層次上。

iOS 7那種前後臺之間切換時顏色的變換,看似好像受到Windows Phone的嚴重影響, 其實這種易讀性和平靜的風格是當今設計的準則。有些人抱怨細長的預設字型(你可以選擇加粗,甚至改變全域性字型的大小),視網膜螢幕顯示會確保一切內容都是清晰可讀的。

清晰的視覺感受,顯然是得益於移除而不是新增內容。但對iOS 7來說,退化的附屬物就是那種人造的視覺深度。

 

扁平化

iOS 7並不扁平。有細微的陰影,燈光效果,漸變,甚至新的視差效果(在我看來,相當的莫名其妙和分散注意力,不過值得慶幸的是可選的)。它確實更扁平了,當然,不過不是從二維的視覺上。

蘋果公司並不靠“讓我們使它扁平化”這種目標來設計東西。扁平化是一個奇怪的概念,因為扁平化本身沒有一個與使用者體驗相對應的理論基礎。扁平化只是提供了一種特定的理想品質的視覺感受, 扁平化本身不是一種目標。

扁平化的目標在我寫給Loop雜誌的那篇文章中也有強調。在iOS 7裡,從美學和概念上來說,App應用只是成了傳遞資訊的必要內容。表格並不是明顯的控制元件,是物品清單(Tables aren’t so obviously controls, but rather lists of things)。應該關注功能,而不是樣式。

對比iOS 6,看一看現在的資訊介面。

Messages on iOS 6 and iOS 7

我們可以辯論顏色的選擇,但對比新風格時, iOS 6裡那種透明度,氣泡的伎倆,斜角和發光變得非常明顯。導航欄在頂部像一個門樑,皺著眉頭掛在那兒。這是一個漂亮的Photoshop的設計產品,但我看起來覺得粗短厚重,像給越獄裝置用的皮膚一樣。

當你收到一個電話時,您能看到這種風格轉變更明顯。

Phone on iOS 6 and iOS 7

斜角,滑動處理、凸起的按鈕、陰影、高亮、內發光和明顯的按鈕邊界。Chrome瀏覽器在iOS 6上侵蝕60%了的螢幕大小,並且很有出現一個警告的視窗。新版本不僅可以讓你看到更大的來電使用者照片,也是一種更安靜的呈現方式。它不是一種類似對小部件的盲目包裝,而只是內容——讓你只看到想使用的幾個選項。

還有一個方面的變化也很重要:終於有人拉開了這層窗簾了。

 

光澤

iOS 7在色彩上更加淡雅,也直接體現在視覺上。彷彿可呼吸的白色區域無處不在, 用來統一和緩衝與以前完全不同的介面風格。

iOS 7給人的總體印象是亮度和開放性。變化的程度只有在一個集合裡才變的更加明顯。下面是一些iOS 6 應用的拼圖:

iOS 6 iOS 7 Comparison iOS 6 grid

下面是一張對應的iOS 7應用程式的網格拼貼, 儘可能顯示相同的螢幕。當然,這些都是來自蘋果公開發布的iOS 7截圖。

iOS 6 iOS 7 Comparison iOS 7 grid

對比上面那一幅圖片,下圖你會有一種更名明亮的感覺。如果我們把兩張圖片並排會更加明顯。

iOS 6 iOS 7 Full Comparison

這個改變會變得更加強烈,如果我們畫素化這兩張圖片來減少顏色的複雜性:

iOS 6 iOS 7 Full Comparison Mosaic

iOS 6網格(grid)中右下角有一半陰暗的色調在iOS 7裡被替換為淡藍色。同樣,iOS 6中僅存的少數不同的視覺風格(和一些古怪的邊界) 在iOS 7本質上都轉化為兩種風格:大約75%的應用程式採用這種類似紙張的明亮風格,剩餘的採用暗色的實用風格。

新聞報導總是不成比例地集中在主螢幕,但現實是,你會花更多的時間在應用上。它們以前是隻有低矮天花板的陰暗小房間,而現在卻有了落地窗,天窗,和乾淨的環境。

我認為這是一個巨大的改進,也是一種典型的固執己見的舉動。

 

主屏 | Home

大多數爭論的焦點就是主螢幕,尤其是它的新圖示。它是一個作業系統和裝置視覺上最明顯的部分,但“主屏”其實是一種用詞不當:它更像是一個啟動器,而不是一個花費你任何重要時間的地方。你會頻繁訪問它,但你不會盯著它。

主螢幕以及平淡的圖示設計,是比以前更加明亮和簡單。雖然從截圖中還不是很明顯,圖示的間距現不同了,圖示本身也比以前大了幾個畫素。

Home Screen on iOS 6 and iOS 7

狀態列下方的頂部邊緣被重新分配,讓出更多的空間給圖示,標籤文字也變大了, Dock欄現在就是一個磨砂板。犧牲邊界換取易讀性也可以從圖示中看出來:留給內容的面積比iOS 6更大。這樣的是為了更容易認出圖示。

我覺得是有一些具體的設計問題(圓角半徑、一些地方內容的比重、一些不一致的漸變方向、背景的對比度、一些圖示——像備忘錄和提醒事項——過於抽象和空洞),但這些都是可以解決的,也是主觀的。

新的圖示是獨特的和容易識別的,卻不容易取悅使用者。我相信, 在最終版本釋出前我們會看到一些變化,我有一個感覺,這部分的設計已受到持續的關注,但最重要的是iOS 7不斷進化的精神不能改變。

 

內容至上

一個月前,我寫了一篇關於我對Jony Ive設計思維的印象的文章Why the skeuomorphism backlash is misdirected.現在重讀這篇文章,你會發現非常有先見之明。

iOS 7是對這個最令人興奮的、盈利最好的、最理想的移動作業系統的一次整理總結。這是一此轉變,從藝術品迴歸到了本質。它表明了一個清晰的願景,一種追求極致簡約的持續意願。

光澤,斜邊,陰影和邊界等裝飾已經一去不復返了。這些視覺盲區會引起緊張而不是讓你放鬆。厚重的色彩容易讓窒息而不是自由的呼吸。

新的iOS是專為一個不同的環境,不同的成熟的移動使用者而設計,他們認同Jony Ive所篤信的那種簡約。不是為了讓人覺著熟悉或僅僅是為了保持風格的一致性,而是專注和清晰;

在使用者體驗領域裡,現在過分注重簡潔,熟悉,包括爭論各種使用者介面。如今人們的感覺更加微妙。我們的設計不能只是基於經驗,也要在情感和直覺給使用者予迴應。

很多應用在模仿那些氾濫的設計,這不僅給使用者,也給設計師套上了枷鎖。我們太容易忘記,人們唯一在乎的是他們的目的:任務和內容。人的注意力是有限的,我們想把我們的精力關注重要的東西,而不是被那些偽裝成傳統的設計干擾和欺騙。

蘋果的哲學——特別是那些天才——一直在持續篩選使用者的需要,技術和文化思潮,找到最正確的一百件需求將其保留。我不在乎敲打一個設計師的腦袋,或被什麼東西分心。我關心我的裝置可以幫我做什麼,以及它們如何能幫助我的生活。

iOS 7是一個全新時代的介面,感謝其使用者和整個行業——現在都已經長大了。

 

英文原文:matt gemmell.,編譯:感謝@袁欣_Jason 的熱心翻譯。

譯文連結:http://blog.jobbole.com/41460/

【非特殊說明,轉載必須在正文中標註並保留原文連結、譯文連結和譯者等資訊,謝謝合作!】

相關文章