信賴感和驚喜感怎樣體現(xiàn)在自己的UI設(shè)計中

信賴感

近和業(yè)務(wù)方討論產(chǎn)品體驗?zāi)繕?biāo)時，「可信賴」一詞被多次提到，那么都有什么因素會影響到產(chǎn)品的可信賴感？如何通過體驗設(shè)計手段，打造能贏得用戶信任的產(chǎn)品呢？在此拋磚引玉，歡迎探討。

 

專業(yè)的整體印象

專業(yè)與信賴的關(guān)系密不可分，展現(xiàn)出產(chǎn)品的專業(yè)程度，有利于快速獲取到新用戶的信任，在高質(zhì)量的內(nèi)容基礎(chǔ)上，我們也可以通過設(shè)計進一步固化「專業(yè)」的印象。

1. 氛圍渲染

在上圖這個案例中，產(chǎn)品關(guān)鍵功能的截圖并不是孤立展示的，而是嵌入在具體的使用場景（老板和員工正在交談）之中，通過高質(zhì)量的場景圖/視頻，可以有效強化用戶對產(chǎn)品專業(yè)性的印象，這種方式在不少 B 類產(chǎn)品首頁都能見到。

除了以上這種形式，在頁面中透露出產(chǎn)品當(dāng)前已經(jīng)取得的成就，比如具體的數(shù)據(jù)、來自已有用戶的正面評價等，也是常用手段之一。

2. 關(guān)注細節(jié)

細節(jié)上的設(shè)計心思雖然不是所有人都能感知得到，但也是有效表達產(chǎn)品專業(yè)態(tài)度的手段之一，粗糙的界面、令人困惑的文案、糟糕的一致性、直接暴露的系統(tǒng)錯誤信息，不專業(yè)的設(shè)計表現(xiàn)，影響的是用戶對產(chǎn)品整體的信任。

3. 適當(dāng)保守

雖然我們平時都講要設(shè)計創(chuàng)新、要突破常規(guī)，但對于專業(yè)可信賴有著高要求的產(chǎn)品，一味追求酷炫的交互視覺表現(xiàn)，有時反而容易引發(fā)用戶的疑慮，并非所有人都是熱愛新鮮事物的年輕一族，適當(dāng)?shù)谋Ｊ貙τ跔I造產(chǎn)品專業(yè)印象還是有積極作用的。

 

放心的使用感受

1. 坦誠透明

處于個性化推薦等功能需要，產(chǎn)品有時會要求用戶提供個人信息、系統(tǒng)權(quán)限等，但不夠妥當(dāng)?shù)乃饕绞絼t會讓用戶感到不安、擔(dān)心隱私泄漏。

更合適的做法是，首先和業(yè)務(wù)確認需要讓用戶提供的內(nèi)容是否一定必要，在合適的場景下（比如不提供就無法進行下一步操作，而非一打開應(yīng)用就要求）向用戶請求，并表達清楚為什么需要個人信息/權(quán)限等內(nèi)容、提供后的具體用途，承諾保障隱私權(quán)、不會對用戶利益造成損害。

除此之外，涉及到多流程、多狀態(tài)等場景，及時反饋給用戶最新動態(tài)，讓用戶第一時間產(chǎn)生感知，也有利于贏得更多信任。

2. 井然有序

秩序，意為有條理地、有組織地安排各構(gòu)成部分以求達到正常的運轉(zhuǎn)或良好的外觀的狀態(tài)，映射到產(chǎn)品設(shè)計中，則是清晰有條理的瀏覽操作體驗。

內(nèi)容層面，信息組織需要有一條清晰連貫的邏輯主線，雜亂無章的堆積則很容易令人迷失；交互層面，操作邏輯環(huán)環(huán)相扣，適當(dāng)外化整體進度，對當(dāng)前所處位置有比較好的感知；展現(xiàn)層面，保持用戶注意力的聚焦，比如當(dāng)有多個模塊都存在切換動效時循序執(zhí)行，而不是每個模塊都在切換，令人無所適從。

3. 品牌背書

同等條件下，大公司、大品牌更容易獲取信任，產(chǎn)品設(shè)計中也可以利用這一點，在界面里嵌入展示品牌信息，增加權(quán)威印象。

當(dāng)然，我想營造信賴感的方法還有很多，文章也只是片面地總結(jié)了一部分，有更多想法的話，歡迎補充交流哦～

 

驚喜感

在平時的設(shè)計工作中，我們有時候會陷入一種「千篇一律的平淡」式苦惱，覺得類似的產(chǎn)品基本都是差不多的信息架構(gòu)、布局風(fēng)格、界面元素……自己按照各種方法推導(dǎo)下來的結(jié)果也難逃窠臼；而如果想要做一點不一樣的創(chuàng)新突破，又容易走進「為設(shè)計而設(shè)計」的誤區(qū)，非但不能討得合作方和用戶的歡心，還會招來類似「為啥不按 xx 產(chǎn)品那樣做」的質(zhì)疑。

過去幾個月來，我一直在試圖驅(qū)動自己多思考怎么賦予自己的設(shè)計以更多的「驚喜感」。首先要明確的是，「打破常規(guī)」只是「創(chuàng)造驚喜」的充分非必要條件，相比盲目追求「為了不一樣而不一樣」，嘗試有邏輯多維度的聯(lián)想發(fā)散，帶給了我更多有意思又具備一定說服力的靈感啟發(fā)，下文中就我就舉近期幾個思考的例子來說明。
 

1. 諧音聯(lián)想

在背單詞、想文案、譯商標(biāo)時，「諧音聯(lián)想法」經(jīng)常被有意無意地用到，很多流行一時的網(wǎng)絡(luò)用語也源于一些內(nèi)涵的諧音詞匯。而在設(shè)計工作中，諧音聯(lián)想則可以幫助我們把一些抽象或無味的詞匯，可視化成生動有趣的形象。

前段時間組隊參加部門的 Hackathon 活動，需要設(shè)計一個類似「壓力指標(biāo)」的數(shù)據(jù)圖表，最開始的時候我想到的是可視化成氣壓計、儀表盤之類的形象，比較直觀和常見，但也偏于平庸、沒什么驚喜感。

轉(zhuǎn)機發(fā)生在一次用拼音輸入「壓力值」的時候，無意間瞥到輸入法的建議列表中給出了「鴨梨」一詞，瞬間想到幾年前的流行網(wǎng)絡(luò)用語「鴨梨山大」，于是我想：為什么不直接把壓力值可視化成一個梨子的形象呢？還可以進一步拓展：壓力值越高梨子個頭越大，給梨子加上各種微表情，可以像「切水果」一樣切碎梨子來「釋放壓力」等……這下可比氣壓計儀表盤之類有趣多了，方案也得到了小組內(nèi)伙伴的一致肯定（雖然還是遺憾地沒能獲獎哈哈~）。
 

2. 行為聯(lián)想

動效設(shè)計研究是我這半年來一個主要的專業(yè)沉淀方向，也沒少搜集體驗各種界面動效設(shè)計案例，但感覺大部分的動效設(shè)計還是停留在諸如「讓體驗銜接更流暢」、「吸引你的注意力」之類的階段，對于深層次一點的有溫度、有情感的動態(tài)行為挖掘并不太深入。

之前聽公司里一位資深設(shè)計專家的分享時，他舉了一個設(shè)計案例，為了在產(chǎn)品中體現(xiàn)出「主動積極」的商務(wù)禮儀設(shè)計語言，為左右切換 Banner 的箭頭入口做了一個小動效，當(dāng)鼠標(biāo) Hover 到箭頭附近時，后者會主動向鼠標(biāo)靠近，就像商務(wù)場景中對方主動來向你握手一樣。雖然只是一個很小的細節(jié)，但卻能給人以觸動。

最近在做對話式交互產(chǎn)品的案例搜集工作，在 Dribbble 上看到了一個 Google 用來招聘實習(xí)生的作品，是一個類似 Google Allo 的對話界面，效果如下：

雖然對話氣泡出現(xiàn)的動效用在實際產(chǎn)品設(shè)計中，會顯得略于浮夸，但這卻給了我一個啟發(fā)，是不是可以考慮給對話氣泡賦予一些有情感的動效呢？比如當(dāng)我給這個氣泡的內(nèi)容點了贊，氣泡會感到「高興」而蹦蹦跳跳一下；當(dāng)我覺得氣泡里的回答沒有任何幫助，氣泡會因為「沮喪」而癱軟成一團爛泥；當(dāng)我表達了憤怒生氣的情緒時，氣泡會因為「害怕」而瑟瑟發(fā)抖……把設(shè)計的對象看成一個有血有肉的人，再去思考怎么賦予它的行為以意義，也許可以更好地幫我們做出「觸動人心」的動效設(shè)計。
 

3. 通感聯(lián)想

「通感」是我們在中學(xué)時就學(xué)過的一種修辭手法，「將人的聽覺、視覺、嗅覺、味覺、觸覺等不同感覺互相溝通、交錯，彼此挪移轉(zhuǎn)換，將本來表示甲感覺的詞語移用來表示乙感覺，使意象更為活潑、新奇」。

在體驗設(shè)計中我們同樣可以運用「通感」，不過受限于平臺，嗅、味、觸覺的施展空間不大，大部分情況下主要都依賴視覺與聽覺元素的轉(zhuǎn)換。比如說給用戶操作以反饋的場景，大部分設(shè)計可能只考慮了視覺一個維度，可能做出水波擴散、煙花綻放、漫天彩紙片飛舞一類的特效，如果再加上符合感覺的對應(yīng)趣味音效，也許就能把氛圍渲染得更上一層樓了；而對于FM、音樂播放器一類的應(yīng)用，則可以反過來把聲音具象為視覺元素，比如把聲波具象為一輪輪擴散的漣漪，挖掘聲音中的情感等……