「類扁平化設計」時代到來

本文作者張悅是PICOOC公司創始人,PICOOC研發的第一款將于近期上市的智慧設備是名叫Latin的智慧秤,具體可見我們之前的報導。張悅之前還創辦過移動應用開發培訓公司博看文思。

前幾天iOS 7正式版終於發佈, 使用者對其扁平化設計風格褒貶不一。其實我們早在三個月前就在 PICOOC 的 APP 上率先「痛苦地」決定了採用「類扁平化設計」(稍後會給出解釋)。基於 PICOOC 系列產品的特性,當時整個 App 的 GUI 上遇到了很多的問題和挑戰。

比如Latin健康秤所採集的紛雜的體征資料流程如何能以易懂的圖形化形式,讓使用者明白自己的身體健康情況;那些北漂、廣漂一族通過 Latin 如何異地查看、管理家人、朋友的健康資訊,因為巨大的資訊流要流入到不同類型的使用者介面上;在如今的多屏世界裡,如何才能滿足他們在 (如手機 / 手錶 /iPad/ 電視) 中隨意切換和查看自己健康資訊的需求。這些都是我們要解決的問題,我們團隊也歷經了無數次的嘗試和反覆運算。以下便是我們對扁平化和擬物化的思考:

「扁平化設計」與「擬物化設計」 孰是孰非?

關於蘋果的這次大膽的嘗試,業界一直對於「擬物化設計」和「扁平化設計」褒貶不一,有些則比較偏頗;所謂偏頗,也就是片面表達某種風格一定比某種風格更 好,以及好在哪裡。我先闡述幾個概念,並分析蘋果為什麼這麼做,以及我們為什麼這麼做!而我認為二者並不是非黑即白的對立關係,因為設計並無好壞之分,存 在即合理。拖離開產品以及使用者, 那些誰對誰錯的判斷都是顯得毫無底氣。況且蘋果根本就沒有否定並且取消「擬物化設計」,而且之前老喬時代,iOS 介面裡 同樣有扁平化的影子,比如圖表功能表等。



何為「擬物化設計」 ?

擬物化設計的概念就不再這裡闡述了,簡單的理解就是「類比現實物件」,按照蘋果的說法,應用程式的外觀看起來與現實生活中的對應物越接近,使用起來就越簡單,相應的也有利於改善應用程式的使用者體驗。

而 人類最早的語言「表意字元」便是擬物化,人類幾乎所有的文字一開始都是表意字元,用擬物的方式來描繪現實世界中的東西,學習成本低,易記。老喬對介面設計 的一個理想是,任何年齡的人,任何經歷的人,都可以在拿到設備後的幾分鐘內輕鬆的掌握它的用法。於是 Apple 通過利用人們的日常經驗, 做出擬物化的介面,從而降低使用者的學習成本以及理解難度。

想像一下,當你應用中的視覺化物件和操作按照現實世界中的物件與操作仿造,使用者就能快速領會如何使用它( iOS Human Interface Guidelines)」。類比實物的視覺設計和交互體驗,讓使用者完全不用去抽象的理解就可以直觀的認知和使用。當你到三裡屯的 Apple Store 裡面,你會發現很多的小孩,兒童,老人在操作 iPhone、iPad 的時候,根本不需要別人去教,自己玩幾分鐘即可以流暢的使用他們。

蘋果之所以形成了如今的介面風格,是因為老喬對低學習成本的極大的重視,因而才會在介面中大量使用隱喻和模仿;而如今的扁平化設計也沒有從本質上脫離這個根本的軌道。

何為「扁平化設計」?

扁平化設計(Flat design)完全屬於二次元,這個概念最核心的地方就是放棄一切裝飾效果,諸如陰影,透視,紋理,漸變等等能做出 3D 效果的元素一概不用。所有的元素的邊界都乾淨俐落,沒有任何羽化,漸變,或者陰影。

扁平化設計其實是一門古老的 UI 設計,早在 Windows 95 時代開始,我們在 PC 上看到的 BIOS 設置介面就是非常典型的扁平化設計,他當時不美觀,但是並不難學,而且扁平化介面很是清晰明瞭!

「扁平化設計」有著鮮明的視覺效果, 整個介面的配色平均會採用到 6-8 種顏色 (這個對於開發團隊的挑戰極大),頁面效果更加絢麗、明亮。它所使用的元素之 間有著清晰的層次和佈局,這使得使用者能直觀的瞭解每個元素的作用以及對話模式。在需要展現強大資訊流的介面內,它讓使用者最大程度地減少學習使用成本。僅僅 憑藉使用者的直覺就大概能夠明白每個物件、按鈕的作用。

微軟在Win8 Metro介面中,使用了完全的扁平化設計;在蘋果產品及 iOS 系統中,看到了部分扁平化設計影子,在Google中,我們也同樣看到了准扁平化設計模式

蘋果這一次徹底否定了什麼?

我拋出「類扁平化設計」概念,就是因為從邏輯上講,蘋果並未拋棄「擬物化設計」,同樣也並未完全追求所謂的「扁平化設計」,而是擬物化的扁平化設計這種相容並包的嘗試。蘋果這次徹底拋棄了「浮雕化設計」。所以,蘋果的這種「類扁平化設計」的邏輯出發點是「 為觸摸優化」。

浮雕化其實是滑鼠時代的產物,它需要配合各種游標浮動和光影來給使用者明確的提醒和引導。而觸屏時代之初,這種浮雕化也留存下來,但其意義已經不大。因為觸屏時代所觸即所得而不需要光影等來做方向指引了。

何為浮雕化設計?

滑鼠時代的開始,「富有智慧」的「浮雕化設計」作為新生事物便開始躍躍欲試,記得從 Mac OS 6 和 Windows 3.1 開始,PC 的介面開始大膽使用浮雕效果。——滑鼠的游標點擊動作在螢幕上得到確認,設計者使用了「浮雕效果」讓按鈕能夠清晰地展現「選中、按下、彈 起「狀態,整個滑鼠主導下的 GUI 的風格都是以此為出發點,並且沿用至今。

記得 08 年底,我剛剛籌畫博看文思的那個時候,連我自己都沒有相信,移動互聯網僅僅用了 4、5 年的時間幾乎把互聯網 10 多年發展的內容全部做了一遍,而且移動智慧終端機的 SoLoMO 的特性又開始把互聯網做不到的內容和服務又做了一遍。

滑鼠的興起成就了「浮雕化設計」的輝煌。現在,千元智慧手機也都已經成為了各家手機廠商喊殺價格戰的「紅海」, 蘋果這次大膽的取消了浮雕效果,基本就是觸摸操控興起和滑鼠沒落的結果,因為摸操控的時代已經開始了。

類扁平化設計時代到來

我這裡說 「類扁平化設計」指的是擬物化的扁平化設計。它並未徹底拋棄擬物化的優勢,但是,從另一個維度,它在 「扁平化設計」方面進行了大膽的嘗試:如取消了浮雕效果。在觸摸的時代,浮雕效果的必要性大大減弱了,它變成了一種偏重裝飾性的多餘的設計。 「類扁平化設計」風格本質上把良好的體驗給了使用者,把挑戰留給了開發者。比如上文已提到整個介面的配色平均會採用到 6-8 種顏色,這個就對於開發團隊的挑 戰極大。

「類扁平化設計」成為一種必然的趨勢,並不是單純的因為審美疲勞導致的為了變化而變化,而有以下幾個原因:

  1. 「類扁平化設計」具備非常好的相容性,而單純的擬物化設計既繁瑣又費時。現在是一個多屏的時代,不同尺寸和解析度的的智慧終端機,PC 顯示器、智慧電視、以及所謂的智慧手錶等等,你會發現,類扁平化設計都能很好的適配到不同的終端上。
  2. 「類扁平化設計「具備優秀的組織和展現資訊的能力。現在是一個資訊紛雜的時代,扁平化設計可以把紛繁複雜的內容和功能有效的組織起來,以簡單但合理的方式排列,使得最終的使用者介面變得如此的簡單易用。
  3. 「類扁平化設計」更適合螢幕較小的智慧終端機,它有更少的按鈕和選項,使整個介面乾淨整潔、條理清晰,讓使用者減少認知障礙,降低使用者的學習成本。

完美的設計的終極目的就是使用者拿到產品後沒有學習成本,易用,好用,愛用!不管白貓黑貓,使用者喜歡的就是好的產品,我們可以採用任何方式,其中包括所謂的 扁平化設計、擬物化設計。沒有任何公司能夠把所有的生意都做完,也沒有任何的商人能夠把全世界所有的錢都能賺完。同樣,也沒有任何的設計風格能夠包打天 下。但是我認為,氾濫的資料、紛雜交叉的資訊流、PC時代網頁當在前多屏時代就要憑藉 「類扁平化設計」呈現給使用者。 「類扁平化設計」才剛剛開始。

來源:HTTP://www.36kr.com/p/206411.html

特別注意:本站所有轉載文章言論不代表本站觀點,本站所提供的攝影照片,插畫,設計作品,如需使用,請與原作者聯繫,文章轉自alibuybuy

Comments are closed.