2015-3-10 周周
藍(lán)藍(lán)設(shè)計(jì)( m.sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
無(wú)論你是不是一名視覺(jué)設(shè)計(jì)師,可能都會(huì)有這樣的感受:視覺(jué)設(shè)計(jì)在創(chuàng)造一個(gè)新產(chǎn)品的過(guò)程中,顯得并不那么重要,被安排在設(shè)計(jì)流程最后一環(huán)的視覺(jué)設(shè)計(jì)師們所能接觸的,以及產(chǎn)生影響的范圍都非常有限。我們還會(huì)不禁認(rèn)為,視覺(jué)設(shè)計(jì)不就是畫(huà)幾個(gè)漂亮的icon和界面,比如我們平??吹揭粋€(gè)app的第一印象覺(jué)得漂亮,這對(duì)學(xué)習(xí)了幾年美術(shù)設(shè)計(jì)的人來(lái)說(shuō)簡(jiǎn)直易如反掌。
真的是這樣嗎?從我這些年的探索與積累,來(lái)談?wù)勎覐膬蓚€(gè)層次理解的視覺(jué)設(shè)計(jì):
在相對(duì)具體的操作層面上,視覺(jué)設(shè)計(jì)涉及到新產(chǎn)品中的每一個(gè)界面,要做的就是把它們之間的關(guān)系處理好, 我們可以稱之為排版設(shè)計(jì)。比方說(shuō),我們經(jīng)??磮?bào)紙,報(bào)紙的設(shè)計(jì)就是排版設(shè)計(jì),每個(gè)版面上有大小尺寸的標(biāo)題,以此讓讀者理解哪條新聞最重要哪條次要,哪條是編輯最希望吸引讀者注意的;視覺(jué)設(shè)計(jì)師在設(shè)備上設(shè)計(jì)遵循著相同的道理,比如手機(jī),現(xiàn)在的手機(jī)已經(jīng)成為一個(gè)五花八門(mén)信息的載體,我們要做的工作就是梳理信息,重新組織它們,用一個(gè)簡(jiǎn)潔的,有組織有條理的方式展現(xiàn)在用戶面前;并且視覺(jué)設(shè)計(jì)也要考慮到實(shí)用性,報(bào)紙上單純的閱讀體驗(yàn)與電子設(shè)備上可點(diǎn)擊的操作體驗(yàn)不同,滿足兩者的視覺(jué)設(shè)計(jì)一定也是不同的。
拔高一個(gè)層次來(lái)說(shuō),也就是視覺(jué)設(shè)計(jì)的最終目標(biāo),我認(rèn)為是對(duì)產(chǎn)品的氣質(zhì)負(fù)責(zé)。什么是氣質(zhì)?如果我們夸獎(jiǎng)一個(gè)人有氣質(zhì),是對(duì)他身上洋溢出的個(gè)性風(fēng)格的贊賞,并且更是在夸獎(jiǎng),這個(gè)人擁有一個(gè)與他的外表一樣美好的內(nèi)在涵養(yǎng)。那什么是產(chǎn)品的氣質(zhì)?同樣的道理,這個(gè)產(chǎn)品傳達(dá)了一種個(gè)性,或宣揚(yáng)了一種理念,而且,與它的設(shè)計(jì)語(yǔ)言交相呼應(yīng),協(xié)調(diào)統(tǒng)一。最顯而易見(jiàn)的例子,蘋(píng)果或微軟,只要一眼就能認(rèn)出是它的產(chǎn)品,因?yàn)橐曈X(jué)上與產(chǎn)品的性格精神是相一致的。也就是說(shuō),每個(gè)公司都有自己完整的統(tǒng)一的設(shè)計(jì)語(yǔ)言,實(shí)際上這就是產(chǎn)品的氣質(zhì),而視覺(jué)設(shè)計(jì)就起到了塑造產(chǎn)品氣質(zhì)中很關(guān)鍵的作用。以手機(jī)界面舉例,交互設(shè)計(jì)只是在搭建一個(gè)構(gòu)架,并不會(huì)對(duì)產(chǎn)品氣質(zhì)產(chǎn)生非常直接的影響,而只有當(dāng)視覺(jué)設(shè)計(jì)開(kāi)始進(jìn)行時(shí),當(dāng)設(shè)計(jì)師們并不只是把產(chǎn)品當(dāng)成單獨(dú)的一個(gè)個(gè)頁(yè)面來(lái)完成,而是從塑造整個(gè)產(chǎn)品氣質(zhì)的角度去思考,可能所帶來(lái)的作品將會(huì)是另外一個(gè)境界。這一點(diǎn)是我在微軟工作時(shí)切身體會(huì)到的,做一個(gè)界面其實(shí)并不只是做一個(gè)界面,而是需要考慮到微軟的品牌,風(fēng)格,和其它產(chǎn)品線的統(tǒng)一,等等。
說(shuō)到氣質(zhì),那什么是符合當(dāng)今審美標(biāo)準(zhǔn)的好氣質(zhì)?怎樣去塑造?這讓我一下聯(lián)想到早年據(jù)說(shuō)從微軟內(nèi)部流傳出來(lái)的一個(gè)惡搞視頻,名字叫 “如果讓微軟來(lái)設(shè)計(jì)iPod的包裝盒”,生動(dòng)描畫(huà)了從一個(gè)蘋(píng)果式的干凈利落的ipod包裝封面,如何一步步地添上微軟風(fēng)格的各種幾何色塊,腰封,功能參數(shù)描述等等,直到每一個(gè)空隙都被狠狠占滿, 最后儼然成為了又一個(gè)office軟件般的包裝。為什么一個(gè)包裝設(shè)計(jì)會(huì)成為微軟員工的一番自嘲呢? 我們都知道答案,因?yàn)?span style="font-family:Arial;">Apple用簡(jiǎn)潔的風(fēng)格,使自己的產(chǎn)品獨(dú)樹(shù)一幟,并且引領(lǐng)了當(dāng)今的審美潮流。想想iPhone如何通過(guò)簡(jiǎn)潔的外觀顛覆并重新定義了手機(jī)行業(yè),以至于現(xiàn)在的智能手機(jī)外觀幾乎都一模一樣。所以,微軟也意識(shí)到了這個(gè)問(wèn)題,我們看到它正在全力地作出改變,無(wú)論從新的win8操作系統(tǒng),還是surface,都在轉(zhuǎn)向更為簡(jiǎn)潔的設(shè)計(jì)。
那么簡(jiǎn)潔的設(shè)計(jì)難道只有Apple這一種嗎?
我們來(lái)看下面兩個(gè)設(shè)計(jì),左邊是日本一個(gè)很經(jīng)典的手機(jī)設(shè)計(jì)infobar2,右邊是諾基亞新的N9系列,兩者不僅獨(dú)具各自的產(chǎn)品氣質(zhì),并且都運(yùn)用了簡(jiǎn)潔的設(shè)計(jì)語(yǔ)言,重點(diǎn)是完全與Apple不一樣。我相信簡(jiǎn)潔的設(shè)計(jì)絕非只有Apple一種。設(shè)計(jì)可以因?yàn)楹芏嘁蛩囟Р钊f(wàn)別,比如說(shuō)是用來(lái)滿足不同的市場(chǎng)需要,比如說(shuō)是來(lái)自不同地方的設(shè)計(jì)師。在日本、或歐美的設(shè)計(jì)師,與在中國(guó)環(huán)境下的我們,成長(zhǎng)環(huán)境不同,問(wèn)題的思考方式就同,對(duì)于美好設(shè)計(jì)的解讀也一定各有千秋。簡(jiǎn)潔不會(huì)只是一條路。
將簡(jiǎn)潔,或者說(shuō)至簡(jiǎn)的理念付諸實(shí)踐的時(shí)候,作為設(shè)計(jì)師實(shí)際在進(jìn)行的工作便是將現(xiàn)有的設(shè)計(jì)不斷地做減法。減法不是僅僅將多余的元素去除,更可能是一些巧妙的轉(zhuǎn)換,下面就用一些案例來(lái)更好地說(shuō)明減法的依據(jù)與運(yùn)用。
用減法將產(chǎn)品從技術(shù)化轉(zhuǎn)向情感化
我曾參與過(guò)一個(gè)未來(lái)冰箱的概念設(shè)計(jì)。現(xiàn)在家庭的冰箱門(mén)上是一片空白,所以我們會(huì)貼上冰箱貼來(lái)加以裝飾,那么在未來(lái)有沒(méi)有辦法在冰箱門(mén)上作些文章呢?我們?cè)诋?dāng)時(shí)的市場(chǎng)研究中,發(fā)現(xiàn)了相當(dāng)多概念冰箱的設(shè)計(jì),在門(mén)上增添了許多實(shí)用或娛樂(lè)的功能,允許用戶在整片門(mén)板區(qū)域內(nèi)進(jìn)行操作,甚至能夠與個(gè)人設(shè)備形成互動(dòng),冰箱門(mén)儼然成了一個(gè)巨大的電子設(shè)備觸摸屏。可是當(dāng)我們開(kāi)始真正開(kāi)展調(diào)研深入思考的時(shí)候,卻意識(shí)到,人們真的需要一個(gè)這樣的冰箱嗎?我們每個(gè)人都有電腦,有平板,我們還需要站在家里廚房的冰箱面前去象使用一個(gè)電子設(shè)備一樣進(jìn)行復(fù)雜的操作嗎?每個(gè)用戶都需要在一個(gè)在普通電器上實(shí)現(xiàn)龐大的功能與技術(shù)嗎?從調(diào)研中,我們獲知人們面對(duì)冰箱這個(gè)擁有冷冰冰的龐大身軀的電器中,需要的更多是一種情感化或擬人化的交流和體驗(yàn)。為此,我們才轉(zhuǎn)變了設(shè)計(jì)思路,開(kāi)始著手于怎樣用在易用化的條件下給冰箱注入更多的情感化色彩,剔除了復(fù)雜技術(shù)化的操作。比如,我們可以用圖像甚至表情的方式來(lái)表示冰箱內(nèi)的存儲(chǔ)狀態(tài),食物的新鮮程度,用趣味化的方式來(lái)調(diào)節(jié)溫度等等,從追求簡(jiǎn)潔的思路來(lái)創(chuàng)造一個(gè)情感化的產(chǎn)品。
用減法令體驗(yàn)更流暢便捷
還記得iPhone從前的信息提醒,不管用戶在做什么,有一條新信息時(shí)總會(huì)在屏幕正中央彈出一個(gè)窗口以示提醒,用戶需要當(dāng)即做出關(guān)掉或者查看這個(gè)選擇操作,也就是說(shuō)當(dāng)時(shí)的設(shè)計(jì)理念是,新來(lái)的信息優(yōu)先級(jí)非常高,一定要立即強(qiáng)加給用戶作出一個(gè)判斷,可是一定要這樣做嗎?后來(lái)的設(shè)計(jì)中Apple就發(fā)現(xiàn)了這個(gè)問(wèn)題,新信息提醒的優(yōu)先級(jí)降低了一層,只顯示在最上面的一條bar上,并可以自動(dòng)消失。用戶仍舊可以作出判斷,但不會(huì)對(duì)你當(dāng)前的活動(dòng)造成任何干擾。這樣改動(dòng)的背后原因就在于,對(duì)任何設(shè)備來(lái)講,流暢的用戶體驗(yàn)才是重要的,切斷正在使用過(guò)程中的體驗(yàn)會(huì)給用戶帶來(lái)非常不舒暢的感受。所以強(qiáng)加的用戶操作是不必要的,必須減少用戶體驗(yàn)中的干擾。
減少了用戶操作步驟之后,進(jìn)一步減少用戶操作的麻煩程度是不是更好呢?一個(gè)很常用的例子是在平板電腦上觀看視頻這樣一個(gè)場(chǎng)景。下左圖是目前常用的視頻網(wǎng)站的播放界面。大多數(shù)視頻網(wǎng)站都擁有類似的設(shè)計(jì),我們雖然已經(jīng)習(xí)慣,但是否還有提升的空間?我想答案是肯定的。
試想我們拿著iPad看視頻時(shí)候的真實(shí)使用環(huán)境是怎樣的?大多數(shù)時(shí)候我們的姿勢(shì)是坐著,或躺在床上,雙手握住設(shè)備在觀看。那么如果能把經(jīng)常使用的操作比如暫停、音量等放到雙手不用移動(dòng)就能碰到的位置是不是更好呢??jī)蓚€(gè)大拇指能夠順便滑動(dòng)的區(qū)域里就能完成大部分的操作,是不是會(huì)更好呢?右圖中便是基于這些思考,做出的一個(gè)粗概的播放界面,希望能給大家一些啟發(fā)。
用減法來(lái)滿足真實(shí)的使用環(huán)境
我們將注意力轉(zhuǎn)向另一個(gè)產(chǎn)品:電視機(jī)?,F(xiàn)在,數(shù)字電視已經(jīng)變得相當(dāng)普及,而網(wǎng)絡(luò)電視功能更是商家們最大的賣(mài)點(diǎn)之一,那又是為什么電視機(jī)的體驗(yàn)在這幾年來(lái)始終不為人稱道?
每個(gè)使用過(guò)機(jī)頂盒的用戶都記得,打開(kāi)后的主界面,所有的內(nèi)容堆砌在一起,讓人很容易聯(lián)想起網(wǎng)易,新浪這些國(guó)內(nèi)新聞門(mén)戶網(wǎng)站。現(xiàn)在我們看到的電視界面顯示方式都有點(diǎn)象把電腦頁(yè)面直接搬過(guò)來(lái),電腦是用鼠標(biāo)操作,電視是用很多遙控器操作,兩種屬性完全不一樣;再者,觀看電視的體驗(yàn)我們稱為后仰式體驗(yàn),用戶在一個(gè)遠(yuǎn)距離的條件下進(jìn)行操作,這又和電腦桌前聚精會(huì)神的狀態(tài)相差甚遠(yuǎn);電視界面與網(wǎng)頁(yè)界面完全不可以照搬這是顯而易見(jiàn)的道理;歸根結(jié)底,現(xiàn)在電視機(jī)行業(yè)的問(wèn)題是我們?nèi)笔е嬲龑儆陔娨暤慕缑妗?/span>
這就延伸出了更多改進(jìn)的可能性。比如,電視上目前體驗(yàn)很差的輸入法可以怎樣得到改進(jìn)?現(xiàn)在許多用戶把電視當(dāng)作載體來(lái)用,連接各種各種的dvd,游戲機(jī)等,更多的工作是從一個(gè)設(shè)備轉(zhuǎn)移到另一個(gè)設(shè)備來(lái)完成,這給設(shè)計(jì)帶來(lái)怎樣的機(jī)會(huì)?結(jié)合前面討論的簡(jiǎn)潔至上的理念,電視機(jī)上的呼出菜單又能怎樣體現(xiàn)出流暢的用戶體驗(yàn)等等。這是電視機(jī)產(chǎn)品當(dāng)前的巨大機(jī)會(huì),我想也是大眾們?nèi)绱似诖鼳pple電視產(chǎn)品的原因。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.sillybuy.com