最近，我有機會(huì )研究對視覺(jué)設計作用的常見(jiàn)誤解，這些誤解仍然盛行于行政主管、產(chǎn)品主管，工程經(jīng)理和市場(chǎng)專(zhuān)家中。設計團隊成員如何說(shuō)明這些認識是錯誤的？又該如何向同事和老板展示視覺(jué)設計真相？
視覺(jué)設計師在特定產(chǎn)品領(lǐng)域或職業(yè)生涯中會(huì )面對各種困難，但有三種誤解頻繁發(fā)生：
視覺(jué)設計是美化產(chǎn)品；
突出顯示能改善視覺(jué)設計；
可以分割評估視覺(jué)設計。
這種信條可能起源于工業(yè)時(shí)代的設計理念引入。從那時(shí)起，產(chǎn)品以前所未有的方式進(jìn)行設計，并形成風(fēng)格。Raymond Lowey等工業(yè)設計師對呆板產(chǎn)品進(jìn)行美學(xué)設計，而聲名大噪。
視覺(jué)設計固然能美化產(chǎn)品，但其與人交互的潛能早已超越美麗外觀(guān)。通過(guò)組織視覺(jué)元素，設計師可以傳達回答關(guān)鍵問(wèn)題的核心信息：
回答這些問(wèn)題是功能和可用性的關(guān)鍵組成部分，尤其是對于交互產(chǎn)品。舉些例子來(lái)說(shuō)明：
圖1到圖3，某個(gè)網(wǎng)絡(luò )應用工具，相同基本設置的三種表現方式，字體、顏色、漸變和圖片都相同。三者主要區別是頁(yè)面元素組織方式不同。這種區別表明該網(wǎng)絡(luò )應用工具存在三種主要使用方法。
圖1------網(wǎng)絡(luò )應用工具設計示例
圖1，表現方式清晰顯示出主要功能------查找客戶(hù)聯(lián)系信息；其次，用戶(hù)可以編輯、刪除或者增加備注。圖2，重點(diǎn)是顧客和公司之間的交流；其次，用戶(hù)可以查看、編輯和刪除聯(lián)系人信息。
圖2---相同網(wǎng)絡(luò )應用工具，不同視覺(jué)組織
圖3，關(guān)注點(diǎn)放在編輯客戶(hù)信息上。查看聯(lián)系人信息和跟蹤正在進(jìn)行的會(huì )話(huà)功能被弱化。
圖3---另一種視覺(jué)組織
相同應用工具，三種不同視覺(jué)組織，三種不同主操作：查找聯(lián)系人信息、管理客戶(hù)交流以及維護客戶(hù)記錄。每個(gè)例子中，影響視覺(jué)設計的因素大體一致：顏色、字體、漸變和圖片。
顯而易見(jiàn)，視覺(jué)設計不僅是美化此工具。它傳達工具的核心功能：它是什么？如何使用？為什么要使用？，而同時(shí)有美化了界面。
很多網(wǎng)站都喜歡把logo做得比較大，客戶(hù)和老板常要求視覺(jué)設計師著(zhù)重強調頁(yè)面上某些元素。這類(lèi)評論有時(shí)可以幫助我們發(fā)現設計中的最重要元素，但也常引發(fā)視覺(jué)設計的另一常見(jiàn)誤解：改善網(wǎng)站視覺(jué)設計，通過(guò)加大、加粗、變紅或同時(shí)使用三種方法來(lái)實(shí)現！
頁(yè)面任何元素的相對重要性都是由其周邊元素決定。白色頁(yè)面放上紅色圓圈，會(huì )吸引很多注意力。但把紅圈放在10個(gè)粉色圓圈旁就不會(huì )吸引那么多注意力。突出重要元素是整體設計的一個(gè)過(guò)程，并不是改變任何單一元素。給予單個(gè)元素額外視覺(jué)權重會(huì )破壞布局平衡，攪亂相關(guān)元素、主操作等之間的關(guān)系。
要是滿(mǎn)足客戶(hù)和老板每個(gè)強化某些功能的需求，頁(yè)面所有元素都會(huì )去搶著(zhù)吸引用戶(hù)注意—— 結果就是都得不到注意。圖4和圖5，兩個(gè)互聯(lián)網(wǎng)瀏覽器下載頁(yè)面。Firefox頁(yè)面，下載瀏覽器號召很明顯，頁(yè)面其他元素——Thunderbird、 Mozilla商店和最新內容——沒(méi)有干擾。
圖4---Firefox下載頁(yè)
圖5，Flock下載頁(yè)面強調了許多不同元素，設計團隊決定提供四個(gè)下載入口------右上角、左側菜單底部、新聞面板右上角和頁(yè)腳。如果頁(yè)面上沒(méi)強調那么多其他元素，Flock下載頁(yè)面或許可以和Firefox一樣只用一個(gè)下載按鈕。
圖 5---Flock下載頁(yè)
沒(méi)有從設計整體考慮，而強調單個(gè)元素會(huì )非常困難，同樣做出孤立改變也很難。但是視覺(jué)設計師收到的大部分反饋集中在孤立元素上：可以把Logo做大點(diǎn)嗎？能改變標題顏色嗎？這里可以換張圖嗎？
這些的確幫助設計師明白用戶(hù)和老板想要的東西，但他們沒(méi)有考慮優(yōu)秀設計必需的整體分析。改變顏色需要反復思考整體配色，因為設計師必須確保顏色對比明顯，才能突出關(guān)鍵操作。改變圖片意味著(zhù)同時(shí)要改變周邊元素，因為原圖片形成的焦點(diǎn)可能已不存在。諸如此類(lèi)。
產(chǎn)品總體視覺(jué)設計源于謹慎平衡頁(yè)面元素------傳達產(chǎn)品功能、可用性和優(yōu)勢的關(guān)鍵信息。如果要調整一項元素，設計師需要重組全局，重歸平衡。孤立設計決策無(wú)法保持修改前后整體一致。
孤立評估基于互聯(lián)網(wǎng)的產(chǎn)品特別脆弱。單個(gè)產(chǎn)品可以進(jìn)行獨立測試，所以產(chǎn)品團隊就會(huì )假設"這些產(chǎn)品結合在一起也會(huì )很好"， 而常常把單獨表現良好的產(chǎn)品組合起來(lái)。圖6，孤立決策的后果。
在這個(gè)eBay頁(yè)面，頁(yè)頭水桶測試（bucket testing）表現良好，PayPal保護機制的logo在焦點(diǎn)小組（focus group）中獲得好分數，攝影物品宣傳也獲得不錯點(diǎn)擊流，但把三個(gè)元素綜合到一個(gè)頁(yè)面上，并沒(méi)有形成有效設計。事實(shí)上，頁(yè)面上很多元素似乎互相競爭，互相干擾。
圖6---eBay意大利主頁(yè)
希望這些例子能解釋對視覺(jué)設計角色的一些常見(jiàn)誤解。只有同事和老板能直接體驗視覺(jué)設計潛能，他們才會(huì )相信視覺(jué)設計絕不僅僅是設計樣式、顯化元素或做出孤立決定。
聯(lián)系客服
