前言——用戶體驗(yàn)五要素

AJAX之父Jesse James Garrett在2007年出版了一本名為《用戶體驗(yàn)要素》的書，提出了從5個(gè)要素自下而上的建設(shè)用戶體驗(yàn)；從最早這本書針對(duì)web端的設(shè)計(jì)到現(xiàn)在移動(dòng)互聯(lián)的app設(shè)計(jì)，因?yàn)槠涑瑥?qiáng)的普適性和實(shí)戰(zhàn)指導(dǎo)性被廣為流傳為UX設(shè)計(jì)中經(jīng)典的項(xiàng)目創(chuàng)建與研究的方法論。

1.1業(yè)務(wù)訴求產(chǎn)生app功能

2008年，當(dāng)你宅在宿舍玩游戲，發(fā)現(xiàn)已經(jīng)很晚了，你打開(kāi)餓了么APP，點(diǎn)了一個(gè)蛋炒飯，半個(gè)小時(shí)后就有人把飯給你送到宿舍。你禁不住說(shuō)道“Aha，原來(lái)在這個(gè)APP中可以足不出戶就能吃到身邊的美食！”

2015年，當(dāng)你在學(xué)校散步，發(fā)現(xiàn)有很多輛小黃車，然后下載一個(gè)APP就可以將車子騎走，你會(huì)禁不住說(shuō)道“Aha，原來(lái)共享單車可以這么便宜就隨便騎呀！”

好的產(chǎn)品一定是企業(yè)服務(wù)能力的體現(xiàn)，要保證每一個(gè)產(chǎn)品功能都能落地實(shí)施，否則產(chǎn)品只是鏡花水月。沒(méi)有能力去支撐的產(chǎn)品都是耍流氓。因此要基于企業(yè)的發(fā)展布點(diǎn)規(guī)劃，每一個(gè)我們做出的核心決定，都應(yīng)該建立在我們確切了解的基礎(chǔ)上。

但一個(gè)好的軟件之初應(yīng)該去怎么思考未來(lái)設(shè)計(jì)的方向呢？通過(guò)5w1h指導(dǎo)我們更加全面的考慮問(wèn)題并高效解決問(wèn)題。

What：產(chǎn)品具體形式是什么？做成什么樣？

Who：產(chǎn)品為誰(shuí)設(shè)計(jì)？目標(biāo)用戶是誰(shuí)？誰(shuí)購(gòu)買，誰(shuí)使用？數(shù)量有多少？

Why：用戶為什么要選擇我們的產(chǎn)品？除了我們的產(chǎn)品外，他還有哪些選擇？產(chǎn)品被替代的可能性大嗎？

When：用戶什么時(shí)候使用我們的產(chǎn)品，多久用一次，會(huì)持續(xù)多久？

Where：用戶在哪里使用我們的產(chǎn)品？

How：用戶是怎么使用它的？

1.2用戶需求

弗洛伊德認(rèn)為，如果將人的整個(gè)意識(shí)比喻成一座冰山的話，那么浮出睡眠的部分屬于意識(shí)的范圍，淹沒(méi)在水下的那片深不可測(cè)的部分屬于意識(shí)的范圍，而鏈接意識(shí)和無(wú)意識(shí)的那層面屬于前意識(shí)的狀態(tài)，這就是著名的“冰山理論”。

無(wú)意識(shí)設(shè)計(jì)是深澤直人提出的理論，是指通過(guò)有意識(shí)的設(shè)計(jì)實(shí)現(xiàn)無(wú)意識(shí)的行為。無(wú)意識(shí)并不是真的沒(méi)有意識(shí)，而是人們知道自己需要某些東西，但還沒(méi)有意識(shí)到到底需要什么。

以商場(chǎng)購(gòu)物流程為例把握整體環(huán)節(jié)

用戶體驗(yàn)顧名思義就是“用戶使用產(chǎn)品時(shí)的心理感受”。用戶體驗(yàn)可能來(lái)自產(chǎn)品給用戶留下的第一印象，也可能來(lái)自用戶長(zhǎng)期以來(lái)感受到的正面或者負(fù)面影響。理想的用戶體驗(yàn)是用戶感到高興、滿足、驕傲甚至是愛(ài)上這款產(chǎn)品。

通過(guò)問(wèn)卷調(diào)查等方式對(duì)用戶進(jìn)行調(diào)研，收集用戶對(duì)產(chǎn)品的反饋，分析用戶認(rèn)為本產(chǎn)品中最有價(jià)值的功能點(diǎn)是什么？做了什么關(guān)鍵動(dòng)作才認(rèn)識(shí)到產(chǎn)品有這個(gè)功能點(diǎn)的？收集匯總產(chǎn)品的一些關(guān)鍵功能點(diǎn)之后進(jìn)行分析，思考產(chǎn)品想要解決用戶最大的痛點(diǎn)是什么？產(chǎn)品是如何解決這一痛點(diǎn)的？競(jìng)品是如何解決這一痛點(diǎn)的？我們與他們的解決方式有什么不同？如何讓用戶認(rèn)識(shí)到產(chǎn)品的價(jià)值等。

 通過(guò)上面用戶超市購(gòu)物邏輯的分析/發(fā)現(xiàn)/了解/反思，可以精確的了解到當(dāng)前電商軟件設(shè)計(jì)中的分類/購(gòu)物車/購(gòu)物卷/配送等功能的設(shè)計(jì)應(yīng)用的必要性。

戰(zhàn)略層中明確了用戶需求和產(chǎn)品目標(biāo)后，范圍層就要確定做哪些功能、提供什么內(nèi)容來(lái)實(shí)現(xiàn)產(chǎn)品目標(biāo)。

上圖可看同樣的購(gòu)物app首頁(yè)功能卻有著極大的不同，拼多多與京東還是以傳統(tǒng)的電商頁(yè)面為主，而得物（毒）卻以一種展示形式呈現(xiàn)出來(lái)。為什么得物要以展示性功能進(jìn)行首頁(yè)的展示，而京東和拼多多要以商品為主去展示整體功能呢？

在我看來(lái)因?yàn)槊鎸?duì)用戶整體的不同，整體功能和展現(xiàn)內(nèi)容也有不同的展現(xiàn)，如計(jì)劃需求型的商品有固定的需求或者確定的購(gòu)物計(jì)劃才去進(jìn)行需求型購(gòu)買。而對(duì)于潮牌的用戶群體是因?yàn)樵谫?gòu)物現(xiàn)場(chǎng)見(jiàn)到某種產(chǎn)品或某些營(yíng)業(yè)推廣、廣告宣傳，提示或激起顧客尚未滿足的消 費(fèi)需求，從而引起消費(fèi)欲望決定購(gòu)買，其實(shí)這是購(gòu)物現(xiàn)場(chǎng)刺激的結(jié)果，是的一種刺激沖動(dòng)型消費(fèi)。

 

好的產(chǎn)品設(shè)計(jì)是順勢(shì)而為，而不是重新定義用戶體驗(yàn)，更全面地了解用戶畫像，可以幫助我們作出更有方向，更符合用戶需求。

在設(shè)計(jì)主要的頁(yè)面的時(shí)候需要問(wèn)自己幾個(gè)問(wèn)題，功能導(dǎo)向是否符合產(chǎn)品目標(biāo)？核心功能板塊是否缺失？頁(yè)面布局是否一致等問(wèn)題。

通過(guò)觀察以上的功能但是卻又有很大的不同，在拼多多首頁(yè)的設(shè)計(jì)以產(chǎn)品為主，而得物app卻以用戶分享頁(yè)面為主；拼多多設(shè)計(jì)風(fēng)格為一種較為“接地氣”的頁(yè)面，得物app卻以一種“高端時(shí)尚”的頁(yè)面。

 

為什么要以這兩種風(fēng)格去設(shè)計(jì)這兩款軟件呢，同樣是國(guó)內(nèi)大的電商平臺(tái)，為什么一個(gè)風(fēng)格高端時(shí)尚一個(gè)“低端混亂”？

模擬用戶的行為，當(dāng)一個(gè)產(chǎn)品可以模擬用戶的行為，將用戶代入真實(shí)的情境中，用戶就會(huì)對(duì)產(chǎn)品產(chǎn)生深刻的認(rèn)同感。在以用戶畫像進(jìn)行分析，當(dāng)一個(gè)60歲的叔叔，晚上5點(diǎn)準(zhǔn)備為一家人去做晚飯之前，去給家人買菜。他是更喜歡去高端的專賣店去買還是去一個(gè)臟亂的菜市場(chǎng)去買菜呢？結(jié)果顯而易見(jiàn)在會(huì)更加傾向于市場(chǎng)，因?yàn)槭袌?chǎng)給人最直觀的印象就是價(jià)格便宜，能以最便宜的價(jià)格去買到自己想要的物品。

再進(jìn)行一個(gè)用戶畫像進(jìn)行分析，一個(gè)00后的潮男，他要為自己買一款好看的球鞋，他的購(gòu)買路徑是什么呢？首先他需要去了解什么樣的什么品牌款式的鞋才是最時(shí)尚的，其次他會(huì)選著一個(gè)最專業(yè)的品牌專賣店或者大的電商平臺(tái)去進(jìn)行購(gòu)買，因?yàn)檫@樣能給他最大的品牌保障。

通過(guò)以上這兩點(diǎn)才能更加詮釋一個(gè)產(chǎn)品的設(shè)計(jì)方向和最佳的用戶體驗(yàn)。

4.1更舒服的閱讀效率

根據(jù)尼爾森F模型，我們可以得出幾個(gè)心理暗示：

用戶快速掃視時(shí)，具體的文字并不重要

多用小標(biāo)題、短句引起閱讀者注意

將重要的內(nèi)容放在最上邊

4.2更舒服的操作位置

其實(shí)，拇指操作熱圖最早是由設(shè)計(jì)師Steven Hoober于2011年的書《Designing Mobile Interface》中使用，其中的綠色部分被他稱為“單手握持時(shí)拇指觸摸最舒適的區(qū)域”。這些區(qū)域的測(cè)量是通過(guò)1333份觀測(cè)分析總結(jié)出來(lái)的，這些分析數(shù)據(jù)還表明，49%的用戶習(xí)慣于單手握持手機(jī)，用拇指操控屏幕，而用另外一只手做其他的事情。同樣是基于當(dāng)年的這些報(bào)告，還獲取了以下信息：

36%的用戶會(huì)雙手環(huán)抱手機(jī)，用其中一只手的拇指操控屏幕

15%的用戶會(huì)用雙手握持手機(jī)并用兩手的拇指操控屏幕，其中90%的用戶操作時(shí)習(xí)慣屏幕豎著，而10%的用戶偏向于橫屏操作。

結(jié)合觸屏拇指熱區(qū)和推導(dǎo)模型，將高頻操作放在最容易點(diǎn)擊位置，降低用戶使用成本，提升用戶體驗(yàn)。

4.3更短的操作路徑

合格的設(shè)計(jì)師能夠繪制風(fēng)格統(tǒng)一的圖標(biāo)，而優(yōu)秀的設(shè)計(jì)師能夠創(chuàng)造風(fēng)格獨(dú)特的圖標(biāo)。我們是否能夠在最求大小一致、圓角一致、線寬一致、視覺(jué)一致和配色一致的同時(shí)，為它的視覺(jué)表現(xiàn)力加入更多的創(chuàng)意呢？

心理學(xué)認(rèn)為，情感是人對(duì)客觀事物是否滿足自己的需求而產(chǎn)生的態(tài)度體驗(yàn)，當(dāng)這種需求得到滿足時(shí)，人們會(huì)產(chǎn)生愉悅、喜愛(ài)、幸福的情感。延伸到APP設(shè)計(jì)中，在產(chǎn)品加入情感化設(shè)計(jì)可以成為用戶之間的感情的傳遞橋梁，增加用戶對(duì)產(chǎn)品的好感度。情感化設(shè)計(jì)不是轟轟烈烈，有的時(shí)候僅僅是一個(gè)icon，一個(gè)圖片一句話。情感化設(shè)計(jì)讓產(chǎn)品變得有溫度，讓用戶獲得愉悅的使用體驗(yàn)，這些簡(jiǎn)單的細(xì)節(jié)設(shè)計(jì)充滿了積極的情緒。它滿足產(chǎn)品的功能性和易用性的同事追求更高層次的目標(biāo)。

 

情感化設(shè)計(jì)在空白頁(yè)設(shè)計(jì)中發(fā)揮著巨大的作用，他通過(guò)設(shè)計(jì)手段來(lái)減輕用戶在看到一個(gè)毫無(wú)內(nèi)容的頁(yè)面時(shí)產(chǎn)生的挫敗感。

  

Tabs是APP設(shè)計(jì)中最常見(jiàn)的控件之一，它幫助界面進(jìn)行快速的信息分類導(dǎo)航。在視覺(jué)表現(xiàn)形式上，Tabs和標(biāo)簽欄同樣也分為選中狀態(tài)和未選中狀態(tài)，一個(gè)好的Tabs既要有設(shè)計(jì)感又符合產(chǎn)品特性。在一個(gè)APP中有許多的界面，每一個(gè)界面又有許多的元素，那些同類的元素應(yīng)保持統(tǒng)一的設(shè)計(jì)樣式。通常個(gè)人中心的人形剪影，它代表著用戶，因此可以在展示用戶頭像和用戶形象的界面中延展使用。或者獨(dú)特的產(chǎn)品外觀、logo、ip形象，也可以作為視覺(jué)符號(hào)的一種，延續(xù)到其他的界面中。這樣這個(gè)界面就被統(tǒng)一的設(shè)計(jì)元素聯(lián)系起來(lái)了，給用戶始終如一的一致感，增加了極強(qiáng)的品牌效應(yīng)。并將這種情感投射到產(chǎn)品，從而提升用戶對(duì)產(chǎn)品的認(rèn)同感和忠誠(chéng)度。

 

 

我們還可以從品牌基因中獲取靈感，品牌作為用戶熟知的形象是個(gè)絕佳的來(lái)源。從品牌形象中提取具有獨(dú)特氣質(zhì)的視覺(jué)符號(hào)作為Tab選中狀態(tài)，既讓界面視覺(jué)獨(dú)一無(wú)二，又進(jìn)一步強(qiáng)化了用戶對(duì)品牌形象的認(rèn)知。

 

 

作為中國(guó)最大線上購(gòu)物平臺(tái)之一的天貓，其品牌最顯著的特征就是那只大腦袋小身體的黑貓，而它的“貓頭”也成為天貓每一次品牌推廣的必要元素。其中最受矚目的就是“貓頭”

聯(lián)合營(yíng)銷海報(bào)的設(shè)計(jì)，已成為天貓與大品牌一起聯(lián)合營(yíng)銷的傳統(tǒng)項(xiàng)目，通過(guò)設(shè)計(jì)創(chuàng)意淋淋盡職地表達(dá)出廠商的品牌精神和各自倡導(dǎo)的生活方式。

從品牌圖形中提取具有鮮明特征的形狀作為設(shè)計(jì)語(yǔ)言，也是一種設(shè)計(jì)風(fēng)格的最好表現(xiàn)。

 

總結(jié)

多年設(shè)計(jì)一直在視覺(jué)層面進(jìn)行設(shè)計(jì)，近一年的設(shè)計(jì)發(fā)現(xiàn)并不是“美”的設(shè)計(jì)就是最好的設(shè)計(jì)。而是最符合用戶場(chǎng)景，用戶體驗(yàn)的設(shè)計(jì)才是最佳的視覺(jué)設(shè)計(jì)。

文章來(lái)源：站酷     文章作者：大峰_Design

藍(lán)藍(lán)設(shè)計(jì)( m.sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)