始于美的爭論：陽春白雪與下里巴人

一個廣為流傳的關(guān)于手機(jī)的段子：

iOS：游戲拍照發(fā)微博；?安卓：刷機(jī)重啟換電池；??諾記：開核桃摔手機(jī)摔手機(jī)；??山寨機(jī)：鳳凰傳奇、鳳凰傳奇、鳳凰傳奇??？梢姡?strong>氣質(zhì)，很重要。

陽春白雪與下里巴人總是個合適爭論的話題。設(shè)計(jì)界自然也存在著這樣的風(fēng)格，就先看看這里面幾個典型的代表吧。

設(shè)計(jì)界的陽春白雪——黑粗直加持的細(xì)白美google谷歌。從誕生之初就保持著，主題簡潔、留白的風(fēng)格。在google+推出后在上不添加了黑粗直的功能項(xiàng)條，并64分，每個單項(xiàng)功能不做特別突出項(xiàng)。

相反的設(shè)計(jì)界的“鳳凰傳奇”——好123。幾乎是我朝最著名多網(wǎng)址首頁了，因當(dāng)年捆綁在盜版番茄花園的xp盤里而奠定了其統(tǒng)治地位。

設(shè)計(jì)初衷就是把所有你要的都給你扔在一頁。雖然凌亂，但省卻了用戶手動輸入網(wǎng)址的步驟，只要你記得住上面網(wǎng)址位置你就可以獲得便利。而且快捷登陸各大著名郵箱的的設(shè)計(jì)（把@后面的后綴都自動寫好）在當(dāng)時確實(shí)是超前的。同時網(wǎng)站的位置排名很容易成為盈利點(diǎn)。以至于在百度收購后，百度也只是對其logo稍作美化。甚至反噬百度首頁。

缺點(diǎn)和有點(diǎn)一樣一目了然——丑陋，凌亂，粗放，毫無品味可言。里面的位置只要稍微有點(diǎn)改變，用戶就暈菜了。其想強(qiáng)調(diào)所有都一步到位，所有項(xiàng)都想突出的風(fēng)格。結(jié)果就是神馬也沒突出。而今百度首頁也在向著高大全的方向進(jìn)行了。

美，確實(shí)很難量化

那位看官說了：”我就覺得hao12345678奶好看啊。你裝什么高雅。”看官說的沒錯，筆者也沒裝。這里就存在一個問題，就是”美“的特殊性造成的——美，確實(shí)很難量化。

自古，文無第一，武無第二。藝術(shù)上，無論是文學(xué)、音樂、繪畫，還是戲劇雕塑等，延伸至現(xiàn)代工業(yè)設(shè)計(jì)，從來都很難直接比較其高低，特別是用量化的方式去衡量。

然而美，卻又是神，賜予所有人最平等的東西。每個人都可以去欣賞美、評價美、創(chuàng)造美。低門檻、標(biāo)準(zhǔn)的不確定性，就給對藝術(shù)作品上的鑒賞和評判帶來了很多和爭論的空間。UI設(shè)計(jì)作為藝術(shù)設(shè)計(jì)的一個子類，也自然帶有它父類的這一特殊屬性。所以除了美術(shù)人員，幾乎所有成員都可以參與與評價美工設(shè)計(jì)GGMM的勞動成果。人人心中都有一評價，公婆各有理，一時難以界定。

真的無法界定么？然而，美卻能在一定尺度上呈現(xiàn)明顯的方向性。

雖然美很難量化。細(xì)枝末節(jié)的地方，如這個logo放在A處好還是B處好的問題雖然很難有判定。但，美卻能在一定尺度上呈現(xiàn)一個明顯的方向性的。?這里引述作家馮唐的一句話。馮唐在回復(fù)韓寒的公開信中寫了這樣一段話：?? ?

“文學(xué)是雕蟲小道，是窄門。文學(xué)的標(biāo)準(zhǔn)的確很難量化，但是文學(xué)的確有一條金線，一部作品達(dá)到了就是達(dá)到了，沒達(dá)到就是沒達(dá)到，對于門外人，若隱若現(xiàn)，對于明眼人，一清二楚，洞若觀火。文章千古事，得失寸之心。”?? ?

同樣，美和設(shè)計(jì)也存在著這樣一條金線。產(chǎn)品能否達(dá)到這樣一條金線，最終會在市場的接受度上得到反饋。市場是殘酷的。每家大公司都在尋找這條金線并試圖超越它。

三大移動平臺的不同選擇

?iOS

顯然喬布斯領(lǐng)導(dǎo)下的蘋果公司一直在這條線之上。?工業(yè)設(shè)計(jì)與美學(xué)設(shè)計(jì)，結(jié)合的最好的公司，溢美之詞自是不必多說?？垂賯冊缫讶缋棕灦Ｖ徽f一點(diǎn)。是蘋果，讓中國的多數(shù)土鱉企業(yè)主第一次認(rèn)識到，產(chǎn)品與界面的美觀，人性化的交互也能創(chuàng)造價值，甚至創(chuàng)造巨大的價值。僅憑這一點(diǎn)，就足以為后世憑吊。雖然蘋果今天本身面臨不少問題。但蘋果的問題是稱王后求穩(wěn)心態(tài)導(dǎo)致創(chuàng)新步伐減慢，加之審美疲勞和反主流情緒的共同作用。而非蘋果本身失去原來審美的標(biāo)準(zhǔn)。

相信你也一定看過很多關(guān)于iOS設(shè)計(jì)規(guī)范的文字。但為了說明后面的問題這里還要簡單介紹兩句iOS的主題風(fēng)格。?蘋果的圓角矩形的logo在今天已經(jīng)稱為一種繞不開的必然。老羅直呼為UI設(shè)計(jì)史的災(zāi)難。這種設(shè)計(jì)讓在小屏幕而秘籍排列的圖標(biāo)，看上去也規(guī)矩整齊。

? ?

蘋果在全局通用模擬為90度的上照下光的設(shè)定。logo也就設(shè)計(jì)成這種角度的反光。另外注意按鈕和鍵盤的陰影，也都秉承著這一設(shè)計(jì)。

還有蘋果標(biāo)志的漸變NavigationBar 的皮膚

同時，蘋果采用一種稱為skeuomorphic（模仿現(xiàn)實(shí)物品）的風(fēng)格。

Android

直到4.0的時候，界面才算稍微能看一看。最被廣泛的2.3系列的版本的默認(rèn)界面簡直丑的一逼，不堪入目。Android的系統(tǒng)應(yīng)用直到4.0版本還多數(shù)為雞肋。可是市場和用戶需要一個非iOS的選擇。也只能感嘆生逢其時是多么重要。android的很多操作邏輯在今天依然很混亂。但其在4.0推廣的扁平化的設(shè)計(jì)風(fēng)格卻影響越發(fā)的擴(kuò)大。在iOS面臨審美疲勞的時候更是承基而上。?

扁平化的按鈕，扁平化的通知欄。大色塊的直鋪。圖標(biāo)圓角小于iOS，大于win。

WindowsPhone??

把扁平化進(jìn)一步發(fā)展，一扁到底。更強(qiáng)調(diào)顏色統(tǒng)一化。圖標(biāo)完全無圓角。用帶有設(shè)計(jì)感的分割體現(xiàn)藝術(shù)感。第一眼很吸引人。問題是如果不按照win的設(shè)計(jì)規(guī)范來做的logo，會讓整個界面特別突兀。

主流app們?nèi)绾芜m應(yīng)

面對這三家主流平臺的設(shè)計(jì)規(guī)范。廠家公司們是如何做的呢。

第一階段大家主要以iOS為主，android為輔。首先都是以iOS為主力運(yùn)行平臺。安裝iOS規(guī)范來設(shè)計(jì)。然后才推出android版的。有的會做改動，有的干脆原UI移植。如微信：即使是最新版本，android版微信基本承襲了iOS版的UI界面。

第二階段，有實(shí)力的公司已經(jīng)可以分別針對不同的平臺設(shè)計(jì)規(guī)范推出不同的UI界面。但是問題也一面了然。增加運(yùn)營成本，影響品牌統(tǒng)一化。如陌陌早期版本

第三階段，發(fā)現(xiàn)了第二階段的問題后。個大廠商開始慢慢游離余各個平臺的設(shè)計(jì)規(guī)范。轉(zhuǎn)而采用類似幾家的規(guī)范中和的風(fēng)格。使軟件在各個平臺下統(tǒng)一，又不會在該平臺下顯的違和感十足。如啪啪、淘寶等：

? ?

在網(wǎng)頁端：主流網(wǎng)站適應(yīng)寬屏，扁平化的按鈕，更大的留白，更淺的漸變，一賬戶通用，信息流瀑布流的使用都是目前的趨勢。網(wǎng)頁端總體上是在hao123和google的折中，找一個平衡點(diǎn)。四大門戶其中有三家在改版后都是這樣來做的。相比之下搜狐依然是老版本，還沒有進(jìn)行改版。老版在今天看來凌亂而且過時：

避免UI中的違和感

違和感，就是不適應(yīng)不舒服。穿西服領(lǐng)帶配籃球鞋，山寨范兒十足。這里也舉個反例。zaker 的iOS版。用window8的風(fēng)格?？粗拖裨贛ac上用xp一樣無比的違和。在android上用iOS同樣在氣質(zhì)上也會用種強(qiáng)烈的山寨感。

再舉幾個正向的例子，比如fuubo?優(yōu)酷iOS新版：

???

未來的產(chǎn)品趨勢正在向多屏幕，多場景，多平臺過度。應(yīng)對這一變化而產(chǎn)生的是，多平臺下同一產(chǎn)品的風(fēng)格統(tǒng)一化。在同一化的大前提下適應(yīng)各家的設(shè)計(jì)規(guī)范形成差異化。

來源：互聯(lián)網(wǎng)er的早讀課