視覺設(shè)計師可能會花很長時間產(chǎn)出了精致的,高品質(zhì)的設(shè)計,得到的卻是用戶或客戶的一句話:“這不是我想要的!”一般來說,在沒有實物前,人們并不清楚自己要的是什么。但是在看到成品后,他們可以輕易地判斷是否符合自己的喜好或期望。因此,在為錯誤的設(shè)計方向投入過多前,了解用戶對風格的期望和需求,從而確定整個網(wǎng)站或產(chǎn)品的視覺風格是有必要的。 而情緒版可以很好的解決以上問題。
什么是情緒版?
情緒版是一種啟發(fā)式和探索性的方法,可以對如下問題進行研究:圖像風格(photography style)、色彩(color palettes)、文字排版(typography)、圖案(pattern)以及整體外觀以及感覺。視覺設(shè)計和人的情緒緊密相連,不同的設(shè)計總是會引發(fā)不同的情感。
情緒版分為:拼貼式情緒版、參考式情緒版和模版式情緒版
拼貼式情緒版
直接將可以運用到項目中的圖片素材拼合在一起。下圖是NIKE MECURIAL系列的一個拼貼式情緒版,里面的圖片都是來自官方的海報、圖片和影像,這些素材都能夠直接運用到我們的設(shè)計中。
參考式情緒版
將與設(shè)計主題風格相關(guān)或功能類似的真實項目拼接在一起。下圖是一個以多彩和現(xiàn)代視覺風格的情緒版,里面選取的素材都是真實項目的界面。
模版式情緒版
靈感圖片素材和概念控件的結(jié)合。概念控件是指概念設(shè)計中的一些核心組件,它可以是色彩搭配、按鈕、卡片、圖形或者是信息排版等,它們是概念設(shè)計的雛形。
情緒版作為可視化的溝通工具,可以快速地向他人傳達設(shè)計師想要表達的整體感覺。
設(shè)計師要幫助用戶發(fā)掘其真正需求,情緒版作為一個工具可以很好的幫助了解用戶所希望展現(xiàn)的調(diào)性,從而提高生產(chǎn)效率和滿意度。
對于設(shè)計師:是定義視覺風格和指導設(shè)計方向的依據(jù);對團隊:在團隊之間傳遞設(shè)計靈感與設(shè)計思路,從而使想法充分融合,深化設(shè)計。
1.情緒版可以讓客戶參與我們的設(shè)計流程中,提高我們的工作效率。客戶的加入,能夠讓我們更好的了解業(yè)務(wù)本身以及客戶對項目的期待。盡早的讓客戶參與整個設(shè)計流程,還能夠避免在錯誤的設(shè)計方向上投入過多。
2.情緒版是設(shè)計與客戶溝通的可視化溝通工具,可以減少設(shè)計師和客戶之間由于認知不同導致的溝通障礙。
情緒版的推導過程
在制作情緒版過程中,原生關(guān)鍵詞的作用相當重要:
獲得原生關(guān)鍵詞是情緒版的第一項工作,一般從內(nèi)部涉眾(相關(guān)的產(chǎn)品和設(shè)計人員)及外部用戶兩種渠道獲得。
自涉眾訪談和用戶研究中,可以收集大量的體驗詞樣本。在獲得這些樣本后,可以內(nèi)部進行討論,通過歸納整理精簡為幾個關(guān)鍵詞。
原生關(guān)鍵詞提取好之后,可以在內(nèi)部使用情緒版,也可以招募用戶來完成。
01.明確原生關(guān)鍵詞
訪談及用研結(jié)果導入產(chǎn)生原生體驗關(guān)鍵詞
原生關(guān)鍵詞(Primary keywords)的產(chǎn)生是一個糅合的過程,它需要綜合企業(yè)文化、用戶研究成果、品牌/營銷策略,行業(yè)特征、目標用戶群、產(chǎn)品的價值定位等因素來界定,通常,這也會是一個商業(yè)決定。
涉及的訪談受眾可以是產(chǎn)品、運營、交互、視覺、用戶等,根據(jù)產(chǎn)品是0—1還是改版現(xiàn)有版本設(shè)置不同問題,以改版為案例,產(chǎn)品使用的感受、期望產(chǎn)品更新的樣子等。以此得出的關(guān)鍵詞,一般是很抽象的詞匯。例如:親切、熟悉、溫度,一般一個產(chǎn)品的關(guān)鍵詞不易過多3~5個為佳。
項目案例(示例)
某手機銀行是以服務(wù)客戶日常金融業(yè)務(wù)辦理及投資理財需求為主的綜合金融服務(wù)APP。面向30-40歲為主要年齡段的中青年用戶群體。目前產(chǎn)品處于成長期向成熟期過渡。
02.挖掘衍生關(guān)鍵詞
如果僅通過單純對原生關(guān)鍵詞的搜索,很容易導致不同參與者提供圖片素材出現(xiàn)同質(zhì)化的問題。所以,首先頭腦風暴畫出關(guān)鍵詞的思維導圖。一方面,合理地引導調(diào)研對象發(fā)散思路;另一方面,也在過程中深挖原生關(guān)鍵詞在他們心中的定義。
衍生關(guān)鍵詞(Derived keywords)是原生關(guān)鍵詞的發(fā)散和提煉,主要通過部門內(nèi)部頭腦風暴或用戶訪談得出。
將所有“衍生關(guān)鍵詞”按照三個維度去分類整理。這個過程的目的是幫助項目組成員從用戶的角度去理解“抽象關(guān)鍵詞”的“具象詮釋”。所有的關(guān)鍵詞可按照以下三個維度分類:
訪談對象會根據(jù)主觀印象以及過往親身經(jīng)歷給出一些看法或答案,而很多時候并不可以把訪談對象的答案直接作為關(guān)鍵詞,我們需要了解為什么,直到覺得用戶的答疑非常清晰具體,然后提煉關(guān)鍵詞。
例如衍生關(guān)鍵詞訪談:
自由發(fā)散問題—看到“品質(zhì)”你想到了什么?
引導發(fā)散問題—如果“品質(zhì)”是一種顏色,你覺得是什么?為什么?
如果“品質(zhì)”是一種食物,你覺得是什么?為什么?
如果“品質(zhì)”是……
衍生關(guān)鍵詞的分析—分維詮釋
根據(jù)原生關(guān)鍵詞的的定義,從視覺映射、心境映射、物化映射三個維度去理解“抽象關(guān)鍵詞”的“具象詮釋”。
03.搜集圖片素材
根據(jù)“原生關(guān)鍵詞”及發(fā)散的“衍生關(guān)鍵詞”搜集素材,對應視覺映射、心理映射、物化映射三大維度。在素材搜集時具體以「具象」和「抽象」兩個方向搜集。
1.搜集圖片
根據(jù)已有關(guān)鍵詞,搜集具象圖片(具體的實物場景)—風格感受;根據(jù)已有的關(guān)鍵詞,搜集抽象圖片(包含色彩、質(zhì)感、圖形等元素)—設(shè)計元素。
2.素材整理
將收集到的圖片素材,按照衍生關(guān)鍵詞進行分類并提取生成情緒版。
3.邀請用戶參與情緒版創(chuàng)建
1.主持人需要不斷詢問被訪者,去探究選擇圖片背后的原因:“為什么你會選擇這張圖片?能否和大家分享一下你的想法?”
2.注意差異的挖掘。注意挖掘被訪者之間的觀點差異,一百個人心中有一百個哈雷姆特,同一張圖片對于不同被訪者可能會有不同的解釋,如果好幾位被訪者同時選擇一張圖片代表他們各自對某個品牌的感覺,注意詢問他們選擇這張圖片的原因是否一樣。
3.可以呈現(xiàn)給用戶的圖片有限的,因此,在挑選圖片時,需要內(nèi)部研究和設(shè)計人員協(xié)同,根據(jù)視覺設(shè)計所需要考慮的幾個維度結(jié)合已有的關(guān)鍵詞進行圖片的篩選。一般來說,在將圖片呈現(xiàn)給用戶之前,內(nèi)部人員已經(jīng)明確了每一張圖片所代表的意義,在用戶選擇和訪談結(jié)束后,兩方面的數(shù)據(jù)綜合分析才能獲得最終的結(jié)果。
04.創(chuàng)建生成情緒版
歸納和整理圖片,進行排版組成情緒版,得到設(shè)計主題相關(guān)的內(nèi)容。建立幾個統(tǒng)一風格的情緒版,以便更好的捕捉產(chǎn)品相關(guān)的感覺,為探索設(shè)計方向提供靈感。
05.確定視覺設(shè)計策略
綜合情緒版制定風格
提取圖片主要顏色,明確主色。結(jié)合衍生關(guān)鍵詞分析結(jié)果,將情緒版中高頻物化紋理和材質(zhì)提取出來。
1.色彩提取
通過對色彩的分析發(fā)現(xiàn),高明度低飽和度的色彩搭配,能讓畫面保持豐富的同時顯得干凈和協(xié)調(diào),可以達到「」「簡潔」的效果,例如:鄰近色、類似色、低飽和度對比色。
電子化情緒版對“色彩分析”是比較方便的
1.圖片在PS中進行高斯模糊或馬賽克處理,使用顏色滴管提取大色塊;2.圖片導入PS中,選擇存儲為Web所用格式-選擇Gif仿色。當然,現(xiàn)在已經(jīng)有很多用戶配色方案提取的網(wǎng)站和軟件,這樣更事半功倍。
通過對情緒版中顏色提取并結(jié)合品牌色及對當下流行趨勢的把握,確定如下顏色運用:
2.圖形提取
通過對圖形分析發(fā)現(xiàn),基本幾何形具有肯定、純粹的特點,可以很好的體現(xiàn)「品質(zhì)」與「精簡」的特征。例如:方形、圓形等。
融入圖形符號 強化視覺語言
圖標使用深色+漸變色的展現(xiàn),對比突出、品牌屬性統(tǒng)一、信息層級分明。簡約筆挺的線性圖標更符合平臺信息架構(gòu)清晰,內(nèi)容易懂的特征。
圖標設(shè)計
3.字體提取
通過對字體的研究發(fā)現(xiàn),中文字體端莊勻稱、字體方正。例如:思源宋體、方正宋體等,英文字體線條簡潔、字形嚴謹。例如:Helvetica、Avenir、DIN等,都比較符合「品質(zhì)」和「簡潔」的特征。
筆畫有粗細變化,而且一般是橫細豎粗,末端有裝飾部分,給人正式、正規(guī)感覺,既可以區(qū)分標題與模塊內(nèi)容的差別,也可以增加產(chǎn)品的差異化。
4.構(gòu)成提取
通過對構(gòu)成的研究發(fā)現(xiàn),并置型和九宮格型構(gòu)成比較嚴謹和秩序,滿版型和通欄型構(gòu)成,視覺傳達直觀而強烈,給人大方、舒展的感受;這與「」的特征是匹配的。
5.質(zhì)感提取
在質(zhì)感的選擇方面,大多與當下流行風格趨勢相貼近,例如:圓角卡片、彌散投影、漸變、輕擬物、毛玻璃等,可以有效地表達出「精簡」「品質(zhì)」的情緒感受。
總結(jié)
情緒版是一種設(shè)計方法論,可以指導設(shè)計方向,傳遞設(shè)計靈感與思路。
制作情緒版時,首先要明確原生關(guān)鍵詞、然后頭腦風暴挖掘衍生關(guān)鍵詞,接著搜集相關(guān)圖片并提取生成情緒版,另外訪談用戶收集衍生關(guān)鍵詞映射,最后通過情緒版和關(guān)鍵詞映射來提取視覺風格。
在項目前期,我們可以通過情緒板來定義產(chǎn)品整體的設(shè)計風格和產(chǎn)品主色調(diào),設(shè)計過程中,界面排版、圖標的顏色、形狀和設(shè)計細節(jié)都可以使用情緒板來定義。
無論我們做什么樣的設(shè)計,情緒板都無疑是一個很好的工具,它不僅可以幫助我們明確設(shè)計需求,做出更容易被大眾所接受的設(shè)計,也可以幫助我們更好地去與領(lǐng)導和其他需求方溝通,向他們傳達設(shè)計的價值主張,最終達成共識,提高設(shè)計效率。
再總結(jié)一下情緒板的作用:
首先:它是整個設(shè)計項目的寶貴資源;
其次:它是低成本的設(shè)計工具;
再次:它是有效溝通的保障;
最后:它是團隊協(xié)作的方法。