網(wǎng)站用戶體驗(yàn)設(shè)計(jì)分析：傾聽色彩的聲音
來源:網(wǎng)站推廣 2012-08-02
當(dāng)色彩被正確傳達(dá)后,便能與用戶產(chǎn)生心靈共鳴,產(chǎn)品也就能更深入人心
前言
色彩是一個網(wǎng)站的情緒表達(dá)方式或者說是性格特征的體現(xiàn),每種顏色都有著屬于自己的聲音作為一種視覺元素,色彩是很難被量化被衡量的,也很難用理性的角度去分析和闡述它,我現(xiàn)在試著用另外一個角度去試圖衡量網(wǎng)頁的色彩,一種嘗試從最基礎(chǔ)的色彩本質(zhì)、色彩搭配形式、及色彩對用戶的潛在影響和心理暗示等著手,去分析色彩,讀懂色彩,讓色彩幫設(shè)計(jì)師說話
一、色彩的基礎(chǔ)知識
色彩的三大要素
1.色相
我們最常見的色譜“虹”就是把顏色按照“ 紅 橙 黃 綠 青 藍(lán) 紫 ”依次過渡漸變,色相兩端分別是暖色、冷色中間為中間色或中型色
2.明度
明度就是色彩的明暗差別,如深紅、大紅以及粉紅等
3.飽和度
飽和度是指色彩的鮮艷程度,也稱色彩的純度
二、不可思議的色彩魔力
1.色彩有魔力,選色需謹(jǐn)慎!
快餐店給我們的印象一般是座位很多,效率很高,顧客吃完就走,不會停留很長時間有人喜歡和朋友約在快餐店碰面,但其實(shí)快餐店并不適合等人這是因?yàn)楹芏嗫觳偷甑难b潢以桔黃色或紅色為主,這兩種顏色雖然有使人心情愉悅、興奮以及增進(jìn)食欲的作用,但也會使人感覺時間漫長如果在這樣的環(huán)境中等人,會越來越煩躁
請兩個人做一個實(shí)驗(yàn),讓其中一人進(jìn)入粉紅色壁紙、深紅色地毯的紅色系房間,讓另外一人進(jìn)入藍(lán)色壁紙、藍(lán)色地毯的藍(lán)色系房間不給他們?nèi)魏斡?jì)時器,讓他們憑感覺在一小時后從房間中出來結(jié)果,在紅色系房間中的人在40~50分鐘后便出來了,而藍(lán)色系房間中的人在70~80分鐘后還沒有出來有人說,這是因?yàn)榧t色的房間讓人覺得不舒服,所以感覺時間特別漫長確實(shí)有這個原因,但也不盡然最主要的原因是人的時間感會被周圍的顏色擾亂同樣道理,高血壓的人忌紅色
再舉個例子,在時下非常流行的休閑運(yùn)動潛水中,人需要攜帶氧氣瓶一個氧氣瓶大約可以持續(xù)40~50分鐘供氧,但是大多數(shù)潛水者將一個氧氣瓶的氧氣用光后,卻感覺在水中只下潛了20分鐘左右海洋里的各色魚類和漂亮珊瑚可以吸引潛水者的注意力,因此會感覺時間過得很快,這是原因之一更重要的是,海底是被海水包圍的一個藍(lán)色世界正是藍(lán)色麻痹了潛水者對時間的感覺,使他感覺到的時間比實(shí)際的時間短(部分資料來自-《每天懂點(diǎn)色彩心理學(xué)》)
2.聽見色彩的聲音
以上故事和實(shí)驗(yàn)都證明了,顏色是可以左右用戶的情緒,也可以影響用戶判斷的既然色彩潛意識在影響這著我們,那設(shè)計(jì)師必須學(xué)會善用色彩,在設(shè)計(jì)的時候,用色彩去正確傳達(dá)產(chǎn)品的本質(zhì)和內(nèi)涵
黃色:青春、樂觀、豁達(dá)常被作為點(diǎn)睛之筆
紅色:活力、速度、緊迫感,常用于促銷打折甩賣等
藍(lán)色:信任、安全、有底蘊(yùn),常用于企業(yè)、銀行、安全中心等行業(yè)機(jī)構(gòu)
綠色:生命力、輕松、天然、無污染,常用于保健品等行業(yè)
橙色:積極、進(jìn)取、活力,阿里巴巴色也是橙色,常用于喚起行動,如button的顏色也常用橙色
粉色:浪漫、女人,常用于女性消費(fèi)行業(yè),女性產(chǎn)品等
黑色:影響力、時髦、嚴(yán)肅,常用于奢侈品營銷等
紫色:安撫、冷靜、神秘,常用于美妝或抗老的女性產(chǎn)品設(shè)計(jì)中等
當(dāng)我們了解了顏色后,就能更加準(zhǔn)確的掌握我們的頁面風(fēng)格的定位,用顏色去闡述你的產(chǎn)品經(jīng)常做“腦部運(yùn)動”,聯(lián)想游戲等
3.色彩與營銷、品牌
每種特定的行業(yè),都有相似的產(chǎn)品色彩傾向性
大部分知名品牌的logo傾向于用色彩相近的色調(diào)
三、色彩搭配
以下以banner為例,簡單剖析下色彩的搭配技巧及色彩搭配組合方式以及搭配呈現(xiàn)的視覺效果
單色搭配:由一種色相的不同明度組成的搭配,這種搭配很好的體驗(yàn)了明暗的層次感
近似色搭配:相鄰的兩到三個顏色稱職為近似色如下圖(橙色/褐色/黃色),這種搭配比較讓人賞心悅目,低對比度,較和諧
補(bǔ)色搭配:色環(huán)中相對的兩個色相搭配顏色對比強(qiáng)烈,傳達(dá)能量、活力、興奮等意思,補(bǔ)色中最好讓一個顏色多,一個顏色少如下圖(紫色和黃色)
分裂補(bǔ)色搭配:同時用補(bǔ)色及類比色的方法確定顏色關(guān)系,就稱為分裂補(bǔ)色這種搭配,既有類比色的低對比度,又有補(bǔ)色的力量感,形成一種即和諧又有重點(diǎn)的顏色關(guān)系,如下圖,紅色文字就顯得特別的鏗鏘有力,特別突出
原色的搭配:大部分是在兒童產(chǎn)品上,色彩明快,這樣的搭配在歐美也非常流行,如藍(lán)紅搭配,frickr的logo以及 麥當(dāng)勞的logo色與主色調(diào)紅黃色搭配等
四、如何準(zhǔn)確定位你的色彩
前面分析的是通過顏色去感覺情緒這里簡單寫,如何根據(jù)產(chǎn)品去捕捉色彩,也就是所謂的MOOD BOARD(情緒版)
情緒版是指對要設(shè)計(jì)的產(chǎn)品以及相關(guān)主題方向的的色彩,影像,圖片等其他材料的收集,從而引起某些情緒反應(yīng), 以此作為設(shè)計(jì)方向或者是形式的參考(具體請參考情緒版(Mood board)操作流程的新思考——曉千)
1.原生關(guān)鍵詞選擇
首先,通過對產(chǎn)品的理解與認(rèn)識,以及用戶調(diào)研等得出體驗(yàn)關(guān)鍵詞(Experience Keywords)
2.衍生關(guān)鍵詞
針對所得到的關(guān)鍵詞,擴(kuò)容信息,通過頭腦風(fēng)暴畫出關(guān)鍵詞的思維導(dǎo)圖,尋找擴(kuò)展關(guān)鍵詞
3. 收集相關(guān)圖片,提取圖片生成情緒版
通過“原生關(guān)鍵詞”和“衍生關(guān)鍵詞”,通過網(wǎng)絡(luò)渠道,收集了大量的對應(yīng)的素材圖并配合定性訪談
4. 衍生關(guān)鍵詞的分析——分維詮釋
5. 對情緒版進(jìn)行“色彩分析”和“質(zhì)感分析”
色彩提取工具:kuler.adobe.com/#create/fromanimage
總結(jié)
色彩是種感覺,當(dāng)我們學(xué)會讀懂色彩,聽到他們的聲音,就可以做到熟能生巧,跟隨著流行的趨勢去游刃有余的駕馭它我的見解大多也是基于前人的分享總結(jié),同時結(jié)合了自我的一些觀點(diǎn)總之,多看,多想以及多臨摹,都可以幫助設(shè)計(jì)師在色彩感覺訓(xùn)練上事半功倍成功的配色方案,一定是理性+感性的結(jié)合,所以設(shè)計(jì)師要做個感情細(xì)致,情感豐富的感性之人,題外話:)
文章編輯: 365webcall在線客服軟件(www.365webcall.com)
我的評論
| 登錄賬號： | 密碼： | 快速注冊 | 找回密碼 |  |
