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