設(shè)計(jì)談:絕對(duì)的扁平化或擬物化,都是錯(cuò)誤
本文原題《360 OS發(fā)布之際,和老周說說視覺設(shè)計(jì),干貨》,發(fā)于AK47論壇“說老周”版塊。本文主要評(píng)價(jià)了以蘋果為例的扁平化視覺設(shè)計(jì)理念,更是指出了現(xiàn)有扁平化設(shè)計(jì)的內(nèi)在矛盾。贊同了Windows phone在視覺設(shè)計(jì)上的成功,并對(duì)谷歌的新系統(tǒng)寄予厚望。
誰犯下了扁平化錯(cuò)誤?
最近入了個(gè)錘子,讓我想起了曾經(jīng)把玩iOS 3.0的幸福時(shí)光,感觸良多。
一直都想把扁平化這種事情拿出來嘮一嘮,也一直找不到時(shí)間,恰好興致來了,就來說說我個(gè)人對(duì)于扁平化設(shè)計(jì)的看法。
起初iOS扁平化設(shè)計(jì)風(fēng)格出來之后,整個(gè)業(yè)界都在哀嚎為什么這個(gè)設(shè)計(jì)這么丑,更有甚者把“蘋果前設(shè)計(jì)師”的作品搬出來與之比較,來襯托 Jony Ive 的扁平化設(shè)計(jì)的失敗。
然而兩年過去,再回首當(dāng)年往事,只能微微一笑。
呵呵
說好的審美底線呢?
當(dāng)然這不是一篇抨擊扁平化設(shè)計(jì)的文章。最早在手機(jī)上施行扁平化設(shè)計(jì)的并不是蘋果,而是微軟。拋去Windows Phone不溫不火的現(xiàn)狀不談,我個(gè)人認(rèn)為Windows Phone的設(shè)計(jì),起碼在視覺角度是成功的。微軟通過對(duì)色塊的塑造給予每一個(gè)色塊代表的功能定義,這種設(shè)計(jì)思路極其簡單,卻又十分易于理解。這樣的設(shè)計(jì),可以說是成功的。
當(dāng)初iOS 7降臨的時(shí)候,國內(nèi)某知名評(píng)測人說過一句話,讓我印象很深刻:關(guān)于扁平或擬物的取舍,更多只是個(gè)人喜好罷了。我個(gè)人認(rèn)為,這樣說是毫無責(zé)任心的一種行為。
如果像FView在Smartisan T1評(píng)測里所提到的那樣,把扁平和擬物比喻為寫實(shí)派畫作和抽象派畫作,作為畫作而言是沒有任何問題的。而手機(jī)作為一個(gè)計(jì)算平臺(tái),人們?nèi)粘J褂玫墓ぞ?,風(fēng)格上的改變很可能會(huì)徹底改變用戶的使用習(xí)慣——畢竟手機(jī)的所有操作都是基于視覺來進(jìn)行的,如果一個(gè)操作系統(tǒng)的視覺風(fēng)格出現(xiàn)問題,那么對(duì)于使用者效率的影響也是巨大的。
我們先來看看iOS的設(shè)計(jì)思路
在當(dāng)初第一版iOS進(jìn)行設(shè)計(jì)時(shí),喬布斯就委托Scott Forstall(前iOS部門主管,已離職)和Jony Ive分別進(jìn)行iOS操作界面的設(shè)計(jì)。喬布斯當(dāng)時(shí)就選擇了Scott Forstall的擬物化設(shè)計(jì),相信喬布斯除了對(duì)于精致物品的喜愛之外,還有更深層次的考慮。
Ive的扁平化設(shè)計(jì)有兩個(gè)主要目的:一個(gè)是突出內(nèi)容,另一個(gè)是為信息分層。
在iOS UI的設(shè)計(jì)中,系統(tǒng)突出了一個(gè)功能:虛擬立體桌面(恕作者忘了這個(gè)高大上的英文名字),大概的作用是:通過陀螺儀感知手機(jī)的狀態(tài)、檢測手機(jī)的移動(dòng)過程,從而調(diào)整壁紙和圖標(biāo)的相對(duì)位置產(chǎn)生“3D”的幻覺。這個(gè)設(shè)計(jì)的思路很好,可是原理卻是矛盾的。
我們都知道,3D技術(shù)的實(shí)現(xiàn)是基于兩個(gè)眼睛看到的景物不同而產(chǎn)生的景深感。而蘋果的設(shè)計(jì)卻是試圖在平面上塑造一個(gè)虛擬的空間,類似于2D電影,我們都知道里面的東西是如何擺放的,我們也知道他并不是真的3D,他還是在一個(gè)平面的維度上。
手機(jī)和電影不同,我們需要通過與手機(jī)互動(dòng)來進(jìn)行操作,期間手機(jī)必然造成手機(jī)位置的相對(duì)運(yùn)動(dòng),我們會(huì)默認(rèn)為這個(gè)屏幕就是一個(gè)靜止的平面,但是在操作的過程中,虛擬3D桌面必定會(huì)模仿真實(shí)空間來進(jìn)行位置變換,這也是蘋果虛擬3D原理的根本所在。本身我們?nèi)梭w在操作手機(jī)的時(shí)候是沒有移動(dòng)的。不知道大家有沒有類似的感受,那就是在坐車的時(shí)候玩手機(jī)會(huì)有惡心的感覺。那就是因?yàn)槲覀兯吹降奈矬w的運(yùn)動(dòng)狀態(tài)和我們本身的運(yùn)動(dòng)狀態(tài)不同所導(dǎo)致的。在iOS7正式上架的初期有很多用戶在使用蘋果設(shè)備時(shí)都出現(xiàn)了不適和眩暈,以及后來蘋果出臺(tái)關(guān)閉動(dòng)態(tài)效果等補(bǔ)救措施都是因?yàn)檫@種虛擬3D的運(yùn)動(dòng)與我們本身的運(yùn)動(dòng)狀態(tài)相互沖突,才導(dǎo)致了視覺上的眩暈。
還有就是,突出的信息層級(jí),限制了蘋果對(duì)于動(dòng)態(tài)效果的運(yùn)用,進(jìn)入后臺(tái)的縮放,應(yīng)用程序的進(jìn)出特效都讓人很難分清到底我們是還停留在應(yīng)用程序?qū)蛹?jí),還是已經(jīng)躍入了一個(gè)更深的邏輯層次。也許這些事情在我們使用的時(shí)候不會(huì)刻意去想,但是當(dāng)我們在使用時(shí)感覺到費(fèi)解的時(shí)候,就足以證明設(shè)計(jì)的失敗了。
所以說,這種在平面上虛擬空間的想法是好的,但是違背了人對(duì)于世界最基本的認(rèn)知,所以可以說是失敗的設(shè)計(jì)。
除此之外,蘋果為統(tǒng)一虛擬桌面的視覺效果,對(duì)于圖標(biāo)的設(shè)計(jì)進(jìn)行了縮減,去掉了陰影高光和材質(zhì)等效果,進(jìn)一步加大了用戶的辨識(shí)成本,由于圖標(biāo)過于抽象,圖標(biāo)下的應(yīng)用程序名稱又沒有明顯的陰影無法看清,使得在整個(gè)扁平化的設(shè)計(jì)中尋找一款應(yīng)用程序成為了一個(gè)“靠熟練度”的事情。
UI作為操作的載體,運(yùn)行于平面上,有著銜接人與機(jī)器的重任。相比于蘋果的將圖標(biāo)簡化到無以比擬,然后再通過復(fù)雜的虛擬視覺層級(jí)突出信息的重要性,擬物化設(shè)計(jì)中的陰影和美麗的圖標(biāo)看起來要比扁平化性價(jià)比高的多。
包豪斯的設(shè)計(jì)理念
包豪斯強(qiáng)調(diào)造型藝術(shù)的結(jié)合,提出藝術(shù)與技術(shù)相結(jié)合的思想;強(qiáng)調(diào)新的工業(yè)產(chǎn)品的使用價(jià)值與審美價(jià)值的辯證關(guān)系;強(qiáng)調(diào)使用新的物質(zhì)材料、新技術(shù)和實(shí)用功能決定的現(xiàn)代抽象形式;強(qiáng)調(diào)藝術(shù)設(shè)計(jì)才能與工藝制作勞動(dòng)相結(jié)合;強(qiáng)調(diào)藝術(shù)家之間的協(xié)作和打破藝術(shù)家與匠師之間的壁壘。而扁平化的設(shè)計(jì)其實(shí)有些取進(jìn)求遠(yuǎn)的意思。
在新時(shí)代的移動(dòng)設(shè)備UI設(shè)計(jì)標(biāo)準(zhǔn)中,除了像Smartisan這樣固執(zhí)的堅(jiān)持絕對(duì)精致工匠主義,我反倒覺得Google提出的Material Design更符合包豪斯理念的定義。將屏幕抽象為紙張,用不同層次的陰影突出信息層級(jí),去掉無用的光線與材質(zhì),甚至連整個(gè)界面的虛擬光線照射角度都有簡潔明確的規(guī)定,雖然用戶感受不到,但是視覺上的簡潔和易于理解卻是可以真真切切感受得到的。當(dāng)然Material Design也有缺點(diǎn)。蘋果的扁平化設(shè)計(jì)雖然不算成功,可是也有自成一體的視覺邏輯,Material Design卻讓人感覺所有功能在視覺上是無規(guī)則而獨(dú)立的,沒有任何邏輯可言,希望谷歌可以優(yōu)化一下安卓系統(tǒng)的設(shè)計(jì),讓移動(dòng)設(shè)備的UI設(shè)計(jì)更進(jìn)一步。
說了這么多,相信大家也大致了解了,那就是無論何時(shí)絕對(duì)的扁平和擬物都是不可取的,盲目的擬物和扁平都會(huì)造成內(nèi)容的不直觀。目前來講,谷歌的新設(shè)計(jì)語言大有可為,還需要進(jìn)一步強(qiáng)化開發(fā)者的視覺風(fēng)格規(guī)范,繼續(xù)完善Material Design的視覺語言,結(jié)束安卓混亂一片的現(xiàn)狀,指日可待。
作者微信公眾號(hào):NativeBC
來源:虎嗅
原文地址:http://www.huxiu.com/article/112018/1.html?f=wangzhan
- 目前還沒評(píng)論,等你發(fā)揮!