好網站 會表情

鄭建鵬

《Emotional Design》是美國人唐納德·諾曼撰寫的一本講述設計情感化的經典著作。諾曼是國際知名的認知心理學家和計算機專家，是一位兼跨科學研究、教育和商業實踐等多個領域的設計師。在這本以獨特輕松、詼諧幽默的筆法寫就的暢銷設計圖書里，諾曼通過大量的設計案例分析，告訴我們產品的可用性與美觀性同樣重要，而且兩者并不矛盾。諾曼認為，如果我們的設計不能夠給我們帶來樂趣和快樂、興奮和喜悅、自豪和驕傲、焦慮和不安等多樣化的情感，那這種設計就是毫無意義的。諾曼的情感化設計理念廣泛適用于重視與人直接溝通、關系密切相關的各種設計類型，如軟件界面、交互媒體、日常產品等。作為交互和界面設計的重要類型的網頁設計，在情感化的方向上自然也有同樣的追求，而情感化確實也已成為網頁設計處理好看與好用之間固有矛盾的重要策略。

情感化的網站設計需求首先來自于網站吸引游客瀏覽的現實動力，瀏覽量和參與度是衡量網站優劣的重要標準，無人問津的網站起不到任何信息傳達的作用，自然也就沒有任何價值。情感化網站設計需求還來自于對瀏覽者接受心理的考慮，瀏覽者會特別關注和深度參與那些能夠跟其在情感上產生共鳴的網站，在離開之后還會經常返回，以便有持續的關注和參與。即使你的網站有最好的SEO（搜索引擎優化）或者已經通過了最時髦的網頁優化A/B測試，但它沒有一個讓瀏覽者心動的情感投入，那也只能獲得瀏覽者的一次駐足，而不會有持續重復的多次光臨。

情感對于網站設計如此重要，但我們的網站設計應該傳達什么樣的情感呢？這個問題取決于網站所展示的產品或服務內容。如果你是運動產品或賽事網站，那活躍、俏皮、熱情可能是適合你的情感選項；如果你是新聞網站，那沉穩、客觀、真實應該是你要表達的情感內涵；如果你設計的是一個交友網站，那就要營造甜蜜、溫馨、可信賴的情感氛圍。

網站是多媒體交互藝術，所以其表達感情的途徑包括了視覺的、聽覺的各種形態元素以及頁面的運動方式等。視覺形象中的照片、圖形和色彩是網站表情的基本單元，清晰而真實的照片最容易喚起人們的某種情愫，細膩的圖形設計則營造出溫暖和輕松，濃烈的色彩傳達出的是歡快與興奮。SOYUZ是位于圣彼得堡的一家著名咖啡店（www. soyuzcoffee.com），這里烘焙最經典、最傳統的俄羅斯咖啡。SOYUZ對咖啡制作有著嚴格的原料甄選標準和烘制流程。網站的首頁用俯拍照片展現出一片深藍色的平靜海水和坐在岸邊手捧咖啡的普通人。照片的色調是一種濃烈的暗色，深沉的近乎壓抑，而這種色彩與圖形正好傳達出尊重傳統和嚴謹認真的情感色彩。

網站中的聽覺元素對情感表達也至關重要，激烈的配樂能刺激人的神經，讓人不由自主地隨之舞動，而平靜的吟唱則讓人變得寧靜平和，與同風格的畫面相互配合，會讓人產生無限的遐想。雀巢Special-T制茶機是雀巢專為其特制的25種世界名茶配合使用的專用泡茶家電產品，Ogreen是其中的日本綠茶系列。在其宣傳網頁中（ogreen. special-t.com/nl_BE），設計者營造了陽光透過清澈的海水直射充滿生機的綠色海底的夢幻場景，一襲白衣的少女飄搖于海水之中，蘋果沉積在海底細沙之上，黃瓜片則如浮萍般懸空于海洋之中。配合著這一唯美畫面的是空曠、幽靜、深遠、充滿禪意的女生“啊”的婉婉轉轉、斷斷續續的低聲吟唱，以及清脆、寧靜的敲擊瓷器的音樂。這聲畫完美配合，傳達著平和、淡然、深幽的情感意蘊。來自茶的芬芳香氣轉化為唯美絕倫的視覺觀感，又傳達出沁人心脾的情感之韻。

網頁內容之間的切換和頁面運動方式不僅是功能性的，也是情感性的，它不僅能實現選擇和瀏覽的便利，更能展現獨特的情感思路。普通門戶網站的頁面切換中規中矩，傳達的是一種嚴肅、中庸和謹慎；而想要表達某些特殊意愿和目的、承載信息不那么多的網站則傾向于用靈活多變的運動方式設計展現獨特的個性情感。當下許多設計公司網站、運動品牌網站或汽車網站最喜歡采用視差滾動的方式進行頁面切換，因為視差滾動的運動方式傳達出了不落俗套、追求時尚的創新品格和熱情開放的先鋒精神，而這正與網站的目標瀏覽者實現了內在的心理契合。

諾曼認為，一項設計應該基于三種不同的水平：本能的、行為的和反思的。本能水平的設計關注的是外形，行為水平的設計關注的是操作，而反思水平的設計關注的是形象和印象。

鏈接

blackhouse.uk.com

英國黑屋牛排店官方網站。首頁展現的是一塊剛剛出爐的牛排放置于粗糙的桌面上的場景。擺放著暗色刀叉和鐵質托盤的略顯雜亂的臺面、冒著白氣滋滋作響的稍有發焦的牛排，暗黃的飲品，暗灰的餐具，邊緣燒過的暗黑餐墊，這一切都在傳達著大快朵頤的粗獷和豪放。

westinfinds.com

威斯汀酒店全球網站。作為一個致力于提供優質獨角休閑服務的企業，寧靜平和是其網站傳遞的主要情感。首頁放置了多張全球著名景點的唯美照片，如雄偉的海上大橋、安寧的黃昏廟宇、深沉的閃著燭光的紅色燈籠、蔥蔥蘢蘢的樹林深處等，這些景點如幻燈片般在人眼前交替出現。

hilo.hawaii.edu/～advising

夏威夷大學希洛校區宣傳網站。夏威夷是微笑的群島，而夏威夷大學招生網站也試圖將歡笑傳播給每一位瀏覽者。主頁的所有大背景圖片都以歡笑的個體為主角：學生面對鏡頭友善的微笑；舞者羞澀而含蓄的笑；朋友間開懷與興奮的笑等。幸福和歡樂是網站的情感主題。

dearmum.org

“親愛的媽媽”活動網站。在母親節之際，網站希望通過簡單的編程，幫助每一位參與者制作一個屬于自己母親的頁面，連同那些自己平日沒有機會跟母親表達的感謝與愛意一起展現在網頁中。網站整體為粉紅色，其中心以大量暗色方塊拼成心的形態。粉紅色彩與心形圖案組合，傳達出對母親的濃濃愛意。

explore.speedousa.com

Speedo限量版泳帽展示網站。世界領先的泳裝品牌Speedo邀請五位奧運會游泳選手、五位藝術大師共同設計了五款經典泳帽。網站首頁設有五位運動員的圖像，五人精神飽滿、躍躍欲試，或歡樂、或休閑、或認真。鼠標滑過各個方格時，兩張圖片會迅速切換，一如網站傳遞的快樂運動精神。endprint