iOS7與扁平化界面設計潮流

蘋果電腦今天發佈了全新的iOS7操作系統。不出所料,界面設計秉承自Windows Metro後流行的極度扁平化風格。界面的操控,再不倚賴模仿實物機械操作的「擬物化」(skeuomorphic)視覺語言,進而發展至幾乎全無立體感的扁平化設計。這次升級,仿皮革紋理的行事曆不見了,稍微凸起的按鈕消失了,以至半透明的對話框都沒有了。當然,我要討論的,不是風格或潮流,而是這扁平化界面設計的互動體驗和信息設計的關係。

Screen shots of iOS7, from apple.com

耶魯大學榮休教授Edward Tufte出版了數本關於信息設計和數據呈現的書籍。其中Envisioning information(暫譯《信息構想》)中載有一個名為‘layering and separation’(層次與區隔)的原理。我認為這是其中一個最重要、最管用的設計原理。顧名思義,層次與區隔是把資訊按種類、重要性和功能分成不同的層次,以不同的視覺手法來區分。「對比」是層次與區隔最重要的表達手法,包括色相、亮度、透明度、陰影、大小、粗細、疏密等。極度扁平化的界面設計手法,正正是「層次與區隔」設計原理的典型反面教材。

這次升級,字體採用iOS一貫的Helvetica,不過今次是Helvetica Neue Light和Extra Light。當然,這是用來炫耀Retina display的超高解像度。莫說是直接發亮的螢幕顯示,就連印刷品,極幼細的字體對讀者來說也非常刺眼,少用為妙。用少了粗體,文字信息的層級就只能用顏色和字體尺寸來區分,極低的對比,尋找資訊和操控界面起來便事倍功半了。關於Helvetica的可辨度之低,容後再探討。

Weather app in iOS6, from apple.comWeather app in iOS7, from apple.com

至於去除透明度、(半)立體視窗按鈕、物件陰影等,為的是徹底消除虛擬操作環境中對物質世界的模仿。圖像界面在80年代初普及化時,一般用戶普遍未能瞭解電腦的虛擬操作環境,以「比喻」(metaphorical)和擬物化的手法作界面設計語言較易為用戶接受,尤其初學者。桌面、視窗、檔案夾都是比喻和實物的模仿。30多年後,大眾已經熟習虛擬界面的操作。去擬物化,其實是很自然的進化。然而,擬物化這種界面設計語言,從來並非尋求絕對的像真度(虛擬實境界面除外)。仿皮革、不銹綱、玻璃等物料,看來並沒有實際需要。而相對含蓄的立體視窗邊緣、稍微隆起的按鈕、半透明的對話框、一點點的陰影,卻對用戶理解操作系統的邏輯和狀態非常有用。Affordance(有譯「承擔性」,筆者暫譯「功能推斷」)這個心理學概念,說的是從一件物件的物理和視覺屬性所能推斷出的功能。極度扁平化、非擬物化的操作界面,令用戶無從推斷和掌握該怎樣與屏幕顯示出的圖象產生互動。這個是按鈕嗎?那個能否拉下?這是鏈結嗎?都無從以直觀方法理解,唯有試試看。

放棄了這些手法,便要倚賴其他方法表現操作系統的功能結構,如幼細的分隔線,或畫面上的餘白。沒錯,分隔線和餘白的確有幫助,但來得比較含蓄和單調。當屏幕尺寸較大的時候尚可接受,但於小小的智能手機屏幕上,空間根本不夠。平板電腦和智能手機的的時間體驗比較快速,用戶往往在一個應用程式裡只作短暫停留,時常需要作快速資料搜尋、處理任務和切換程式。而行動設備的使用場合,大多是人多擠迫的公共交通工具上,甚至在街上行走時。視覺對比低的界面,拖垮用戶執行任務的時間,容易發生錯誤,增添挫折感。在現今大量資訊充斥的世代,用戶的專注力愈來愈薄弱,極度扁平化的界面更顯得不適合。

簡潔、簡約似乎已經成為當代設計師的金科玉律。然而,盲目追隨這「格言」的設計師,往往對功能和可用性只有片面的理解。簡潔和簡約淪為風格和品味的表現。這正是現代主義設計沒落的原因。Louis Sullivan所宣揚的「形式跟從功能」已經變質了,或許已經不合時宜。功能從來不可能凌架於形式,因為形式正正就是功能。

Edward Tufte評論第一代iPhone操作系統的視頻

Categories Chinese, information design, interface design, typography
Tags , , , ,