首頁

淺析用戶體驗四維度

ui設(shè)計分享達(dá)人

用戶體驗,是用戶在使用產(chǎn)品過程中建立起來的一種純主觀感受。

 

解讀用戶體驗,可以有很多視角。本文提供一個以人為本的視角:用戶體驗四維度。具體如下。

 

HI X:Human Interface Experience,人與界面的交互體驗。

HC X:Human Content Experience,人與內(nèi)容的交互體驗。

HH X:Human Human Experience,人與人的交互體驗。

HB X:Human Brand Experience,人與品牌的交互體驗。


用戶體驗四維度

 

 

01 四維度的概念

 

怎樣判斷一款產(chǎn)品有幾個維度?這就要從四維度的概念說起。

 

1. HI X(人與界面的交互體驗)

 

HI X 是指用戶在瀏覽、閱讀、操作界面過程中產(chǎn)生的主觀感受。

 

HI X 既受信息架構(gòu)、交互設(shè)計和UI設(shè)計的影響,也受根需求和功能架構(gòu)的影響。主要依托手機和電腦的互聯(lián)網(wǎng)產(chǎn)品,天然存在界面。所以,HI X 屬于基礎(chǔ)屬性,所有產(chǎn)品都有。

 

2. HC X(人與內(nèi)容的交互體驗)

 

HC X 是指用戶在消費內(nèi)容時,內(nèi)容本身帶給用戶的主觀感受。

 

這里的內(nèi)容,既包括衣服、鞋子等實體商品,也包括文章、圖片、視頻等虛擬內(nèi)容。諸如淘寶、網(wǎng)易嚴(yán)選等電商產(chǎn)品,以及公眾號、Instagram、抖音等 UGC 產(chǎn)品,都具備 HC X 屬性。

 

3. HH X(人與人的交互體驗)

 

HH X 是指用戶與其他用戶、產(chǎn)品工作人員溝通交流時產(chǎn)生的主觀感受,或產(chǎn)品的社區(qū)氛圍、溝通氛圍帶給用戶的主觀感受。

 

所以 HH X 有兩層含義。第一層發(fā)生在用戶與用戶之間,是指當(dāng)用戶扎堆或溝通交流時,交流氛圍、交流內(nèi)容帶給用戶的主觀感受。第二層發(fā)生在用戶與產(chǎn)品工作人員之間,是指當(dāng)產(chǎn)品依靠人力向用戶提供咨詢、售后、配送等服務(wù)時,產(chǎn)品工作人員的服務(wù)行為帶給用戶的主觀感受。

 

關(guān)于第一層含義,不管是更強調(diào)社區(qū)屬性的產(chǎn)品,比如天涯社區(qū)、豆瓣小組、百度貼吧,還是更強調(diào)內(nèi)容屬性的產(chǎn)品,比如公眾號、微博、小紅書的筆記,都具備 HH X 屬性。

 

關(guān)于第二層含義,常見的 HH X 由客服人員提供。如果是電商產(chǎn)品,提供人員還包括快遞員和售后人員等。

 

4. HB X(人與品牌的交互體驗)

 

HB X 是指當(dāng)用戶想起、談?wù)撈鹌放?,或使用品牌的產(chǎn)品、體驗品牌的服務(wù)時,品牌帶給用戶的主觀感受。

 

只要一款產(chǎn)品做成了品牌,它就有 HB X 屬性。

 

HB X 會直接影響到我們是否信任、喜歡一個品牌,以及是否會使用它的產(chǎn)品和服務(wù)。所以,我們對 HB X 往往會有一個抓重點的綜合評價。就像一個外向活潑的女生,雖然在外向程度方面和一個內(nèi)向安靜的男生不一致,但雙方也可能會選擇在一起,因為內(nèi)向、外向并非雙方關(guān)注的重點。

 

因為 HB X 牽涉到對品牌的綜合評價,所以就像工作都有一段試用期、戀愛都有一段了解期一樣,HB X 的形成往往也需要較長時間,通常至少要 3~5 年。

 

 

02 四維度的價值

 

每一個維度,各有什么價值?

 

1. HI X(人與界面的交互體驗)

 

作為基礎(chǔ)屬性,HI X 的價值主要體現(xiàn)在以下兩方面。

如果是一款只具有 HI X 屬性的工具型產(chǎn)品,比如視頻會議產(chǎn)品 Zoom,那于這款產(chǎn)品而言,HI X 就是一切,這款產(chǎn)品的成敗也幾乎完全取決于 HI X。

 

如果是一款同時具有 HC X、HH X 屬性的內(nèi)容型社區(qū)型產(chǎn)品,比如 B 站、快手這些視頻類產(chǎn)品,那此時的 HI X 就會扮演一個類似交通出行(基礎(chǔ)設(shè)施)的角色。如果 HI X 比較差,這個“出行”過程就會像出去玩時的塞車一樣,讓人難受;如果 HI X 很優(yōu)秀,這個“出行”過程就會像準(zhǔn)點的高鐵、飛機一樣,又快又爽。

 

2. HC X(人與內(nèi)容的交互體驗)

 

HC X 主要從內(nèi)容層面影響用戶滿意度。

 

如果 HC X 比較好,用戶消費時的決策時間就會被大大縮減,同時用戶滿意度也會比較高。比如淘寶上就有一些原創(chuàng)設(shè)計、質(zhì)量不錯、價格不貴的精品小店,很受歡迎。我們?nèi)ゾW(wǎng)易嚴(yán)選、優(yōu)衣庫天貓旗艦店這些質(zhì)量不錯、設(shè)計不錯、價格適中的店鋪買 東西時,也會很快很省心。

 

以上說的是電商產(chǎn)品,對于 UGC 類的內(nèi)容產(chǎn)品,也是類似的道理。比如站酷上的首頁推薦和編輯推薦,相對而言,HC X 比較不錯,所以看這些內(nèi)容的用戶也會比較多。

 

3. HH X(人與人的交互體驗)

 

HH X 是用戶情緒的最大影響因素,在情感方面對用戶具有最大吸引力。物以類聚,人以群分。HH X 良好的產(chǎn)品,會像一場談笑風(fēng)生、其樂融融的聚會,吸引用戶去扎堆。

 

良好的 HH X 往往意味著良好的氛圍,它不僅能帶給我們諸如輕松、愉快等積極情緒,還能在一定程度上帶給我們一種歸屬感。最終的結(jié)果,就是我們喜歡用這款產(chǎn)品。比如 B 站的 HH X 就比較好,具體而言就是彈幕氛圍比較歡樂友好,這樣的氛圍帶給用戶的感覺是比較好的,用戶也喜歡在 B 站就著彈幕看視頻。

 

4. HB X(人與品牌的交互體驗)

 

HB X 事關(guān)品牌能不能以正面形象住進(jìn)用戶心里。

良好的 HB X,往往意味著良好的品牌美譽度和忠誠度。HB X 良好的產(chǎn)品,就像你信任和喜歡的男/女朋友一樣,他/她會在你心里占據(jù)一定的分量和地位,讓你樂意介紹給家人和朋友認(rèn)識。比如蘋果的 Mac,就有很高的品牌美譽度和忠誠度,用戶也很樂意把 Mac 推薦給身邊的朋友。

 

 

03 四維度的關(guān)系

 

四維度之間存在怎樣的關(guān)系?

 

1. HI X 是另外三個維度的基礎(chǔ)

 

HI X 作為基本維度,相當(dāng)于“水之源,木之本”。如果把用戶體驗四維度比作一個金字塔的話,塔底的基石一定是 HI X,塔尖則是 HB X。

 

2. HC X 通常是 HH X 的基礎(chǔ)

 

HH X 的產(chǎn)生,通常離不開 HC X。也就是說,通常得有一個合適的“內(nèi)容”或“主題”,才能把人聚攏過來。比如結(jié)婚的時候,你可以邀請到很多親朋好友來參加婚禮,但在平時,你很難邀請到這么多人。我們在 B 站看視頻的時候,彈幕通常比較歡樂友好,氛圍不錯,但如果沒有這些視頻,也就不會有這些彈幕,以及不錯的社區(qū)氛圍。

 

3. HI X、HC X 和 HH X 共同構(gòu)成了 HB X 的基礎(chǔ)

 

HC X、HH X 和 HI X 一樣,都可以成就 HB X。

 

以早期 Keep 為例,剛開始只有課程這個功能,也就是說只有 HI X 和 HC X 這兩個屬性。其中,HI X 還可以,HC X 比較優(yōu)秀。在此基礎(chǔ)上,慢慢發(fā)展出了社區(qū)功能(HH X 屬性),而且做得不錯。再往后,有了“自律給我自由”的品牌精神。在課程、社區(qū)、品牌精神等因素的助力下,Keep 有了不錯的品牌美譽度和忠誠度。也就是說,HC X、HH X 和品牌精神等因素,一起成就了良好的 HB X。

 

4. HB X 也可以僅有 HI X 這一個基礎(chǔ)

 

有些產(chǎn)品并不具有 HC X 和 HH X 這兩個屬性,而是僅有 HI X 這一個屬性。單憑一個良好的 HI X,也可以成就良好的 HB X。

 

比如 Zoom,作為一款開視頻會議的工具應(yīng)用,它最初只有 HI X 這一個屬性。但是因為很好用,HI X 很優(yōu)秀,所以如今的 Zoom 即便沒有內(nèi)容(HC X)和社區(qū)(HH X)屬性,依然成了一個在全球都很受歡迎的品牌,擁有了不錯的 HB X。

 

總的來說,在四維度的金字塔里面,它們的關(guān)系如下圖所示。


用戶體驗四維度的金字塔關(guān)系

文章來源:站酷  作者:Snow Design

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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


B端產(chǎn)品界面高屏效初探

ui設(shè)計分享達(dá)人

背景

在 B 端設(shè)計領(lǐng)域中,不管是內(nèi)部用戶、產(chǎn)品、設(shè)計師、開發(fā),還是外部產(chǎn)品、設(shè)計師等,總能聽到關(guān)于界面「屏效」方面的訴求或吐槽。


undefined


「屏效」狹義理解是「界面過度留白」;廣義理解,「屏效」源自諧音“坪效”,指的是每坪的面積可以產(chǎn)出多少營業(yè)額(營業(yè)額/專柜所占總坪數(shù))。而「屏效」對于界面而言可以指屏幕單位時間、單位面積內(nèi)的信息可以帶來多少商業(yè)效益/效率提升。


為了探索在 B 端產(chǎn)品中用戶為何對「界面過度留白」或「屏效」問題如此敏感,于是我們展開了「屏效」專題的設(shè)計探索與實踐?!钙列А箤n}探索主要以「探索」與「實踐」相結(jié)合的方式展開,將實踐過程中反復(fù)驗證有效的設(shè)計策略沉淀成設(shè)計手冊,同步將部分功能進(jìn)行工程化,確保可以開箱即用。


undefined


探索階段-為誰在何時何地設(shè)計

用戶聲音|不同的故事相似的訴求

面向內(nèi)部設(shè)計師和終端用戶投放的《高屏效訴求》《中后臺產(chǎn)品滿意度調(diào)研》問卷中認(rèn)為提高屏效能極大提升用戶體驗的設(shè)計師占 58.14%;認(rèn)為提升屏效對體驗有提升的終端用戶占 50.6%。


undefined


外部知乎上針對《Ant Design 4.0 設(shè)計價值觀》的 13 條反饋里,其中就有 2 點提到關(guān)鍵字「效率」。


undefined


通過了解不同用戶和產(chǎn)品類型發(fā)現(xiàn),不同的用戶在工作場景的產(chǎn)品使用中有著相似的特征:


undefined



案例收集|發(fā)現(xiàn)問題,大膽假設(shè)

縱觀 B 端產(chǎn)品界面,發(fā)現(xiàn)普遍問題和收錄在解決屏效問題上實踐得比較好的案例,為了逐步突破問題,選擇以數(shù)據(jù)產(chǎn)品中覆蓋率極高的表格為設(shè)計切入點,通過線上跨產(chǎn)品多端地毯式的體驗走查,發(fā)現(xiàn)表格三個層次的問題:


undefined


視覺、交互層在無需理解業(yè)務(wù)場景和用戶目標(biāo)的情況下,都較容易發(fā)現(xiàn),屬基礎(chǔ)問題,但很多「過度留白」的屏效問題往往是信息被組織方式的差異導(dǎo)致的「過度留白」。

綜上我們提出假設(shè):為提高屏效,可從視覺、交互、信息三個層次解決

視覺層為提高信息查閱速度,可以通過提高信息密度;交互層為提高操作速度,可以縮短當(dāng)前手勢到目標(biāo)之間的距離;信息層為提高信息被理解的速度,可以通過重組織等方式。

基于假設(shè),我們進(jìn)行了進(jìn)一步的桌面研究,查閱論文等書籍,尋找設(shè)計理論的驗證和指導(dǎo)。


競品分析|尋找實踐證據(jù),謹(jǐn)慎驗證

我們知道視覺上界面留白過多(過疏會增加滾屏成本,過密因易串行而影響閱讀效率),以表格「行高」為例,探索各表格在字號、字高和行高的關(guān)系,因為不同字體的同字號實際像素高度會有差異,因此選擇的是字高(即文字垂直高度的視覺大?。┒亲痔柣蜃中懈?,決定留白的兩個重要因子是字高和表格行高,以次推演,界面元素和元素間距的留白關(guān)系,探究在視覺層怎樣的留白率能保證甚至提升屏效。


undefined


以數(shù)據(jù)產(chǎn)品中的表格為例,通過直接和間接競對的方式,分別從數(shù)據(jù)的查閱(視覺)、分析(交互)維度進(jìn)行功能點和設(shè)計細(xì)節(jié)上的比對,來看看優(yōu)秀產(chǎn)品是如何解決屏效問題。

直接競對:內(nèi)部用戶口碑較好的產(chǎn)品 A、B外界競對:同領(lǐng)域的 Tableau、網(wǎng)易有數(shù)、金山、微軟表格;間接競對:谷歌郵箱、AntD 等的緊湊主題的常規(guī)列表(一維表格)


undefined


通過競品分析可以發(fā)現(xiàn),數(shù)據(jù)分析領(lǐng)域的表格留白率普遍較低(信息密度高),尤其是金山和微軟的電子表格,其次是同類面向數(shù)據(jù)用戶的 Tableau、網(wǎng)易有數(shù),而谷歌郵箱等工作臺常用的常規(guī)列表緊湊版本中,留白率和數(shù)據(jù)領(lǐng)域的電子表格不相上下。


緊湊版的使用場景也常常是面對數(shù)據(jù)量巨大的信息呈現(xiàn),通過切換緊湊主題,提升信息的快速瀏覽,而這也非常適合數(shù)據(jù)分析場景中巨大的數(shù)據(jù)量呈現(xiàn)。因此我們的產(chǎn)品在留白率的提升空間極大,而在實際案例實踐中,也已經(jīng)將表格行高優(yōu)化至 30px,克制的使用留白。


除此外,競品其他層次的設(shè)計也做了比對,總結(jié)來看整體設(shè)計做法:高密度、少屏數(shù)、少留白等。


文字陷阱:中英文字高不等于字號


舉個容易犯錯的競品參考是,谷歌在緊湊版主題下字號 12px,列表行高是 28px,但在 AntD Table 中同樣的 12px 和列表行高 28px 就會發(fā)現(xiàn)非常擁擠,缺乏呼吸感。


undefined


原因在于谷歌的 12px 是英文字體,實際字高只有 10px,而 AntD Table 的語境是中文字偏多,實際字高有 12px,所以留白的差異在于一個是 18px(28-10),一個是 16px(28-12),這也是為什么決定決定留白的兩個重要因子是「字高」和表格行高,而非「字號」和表格行高,進(jìn)一步推演,決定界面留白的是「元素視覺高度」和「元素間距」。


論文查閱|尋找理論證據(jù),謹(jǐn)慎驗證

研究表明,低密度認(rèn)知負(fù)荷低,但高密度任務(wù)完成率高,用戶更喜好

參考資料:論文《基于眼動的網(wǎng)頁對稱性和復(fù)雜度對用戶認(rèn)知的影響的研究》

對于信息,用戶需要需要閱讀(視覺),思考和理解(認(rèn)知),需要點擊按鈕、操作鼠標(biāo)和打字(行動),在人機工程學(xué)中,統(tǒng)稱為負(fù)荷。即認(rèn)知(記憶)負(fù)荷、視覺負(fù)荷、動作負(fù)荷,即分別對應(yīng)用戶體驗設(shè)計的三個層級,信息/視覺/交互。而負(fù)荷所花費資源從多到少依次為:認(rèn)知 > 視覺 > 行動。


認(rèn)知負(fù)荷,舉個例子,看了但不一定懂了。你是否有這么一種體驗——刷抖音,雖然很多(信息密度小,輸出效率低),但可以一直刷下去并且刷很久;而看一門 C4D 教學(xué)視頻,即使就短短十來分鐘(信息密度大,輸出效率高),但是卻要看上半天。因為刷短視頻時,你的輸入效率遠(yuǎn)高于作者的輸出效率,而看一門 C4D 教學(xué)視頻時,你的輸入效率遠(yuǎn)低于作者的輸出效率。可是,輸出效率是客觀的,輸入效率是主觀的。如果輸出效率很高,你可以通過提高自己的輸入效率(比如讓自己成為 C4D 專家)來跟上作者,從而變強;否則輸出效率很低(信息質(zhì)量低),你的輸入效率很高(很專業(yè)),信息于你而言都是無效的。


假設(shè)負(fù)荷總量不變的情況下,那么以上三類場景界面需要對用戶負(fù)擔(dān)分配大致如下,官網(wǎng)品宣類需要低認(rèn)知成本,低視覺負(fù)擔(dān),視覺要求高,用戶才會被吸引過來閱讀,甚至酷炫的交互更能增加互動體驗而帶來的趣味感,比如蘋果官網(wǎng),信息量極少、圖版率高帶來極具藝術(shù)的視覺體驗、進(jìn)而吸引用戶愿意跟隨屏幕滾動漸進(jìn)式接受信息,而 B 端應(yīng)用因為是專業(yè)使用,首先認(rèn)知方面隨著員工的專業(yè)度提高而降低,因此可以通過提高視覺負(fù)擔(dān),來降低行動負(fù)擔(dān),進(jìn)而減少操作用時,當(dāng)然最佳情況是三個維度能整體降低負(fù)擔(dān),讓總負(fù)擔(dān)降低,就需要更多設(shè)計巧思了。


undefined


面向內(nèi)部設(shè)計師和終端用戶投放的《高屏效訴求調(diào)研》預(yù)設(shè)解決方案中,設(shè)計師常用的 Top 3 做法為:【信息層】隱藏不必要信息、【視覺層】提高布局緊湊度、【交互層】減少點擊跳轉(zhuǎn)。


undefined



實踐階段-如何設(shè)計

通過以上的探索,我們可以確定的是,B 端產(chǎn)品面向?qū)I(yè)人員的工作界面設(shè)計中,提高屏效可從視覺、交互、信息三個層次進(jìn)行,視覺層-高密度,即提高屏幕信息密度;交互層-低跳轉(zhuǎn),通過減少頁面跳轉(zhuǎn)、手勢與常用操作的距離等;信息層-有效性,通過重組織或輔助信息幫助用戶理解,甚至提供幫助手冊等以提高用戶專業(yè)能力。


undefined


基于以上的總結(jié),對產(chǎn)品進(jìn)行優(yōu)化。下面以一個簡單案例進(jìn)行設(shè)計策略的解讀。一位運營同學(xué)想對比 A、B 兩不同人群在相同維度(白領(lǐng)-有信用卡)下的人數(shù)差異,尋找運營機會點。


如下表格經(jīng)過高屏效策略優(yōu)化前后對比圖,優(yōu)化前相同維度下不同人群數(shù)量的對比需要視線來回跳動比對,而優(yōu)化后的表格內(nèi)容,更符合用戶看差異場景下分析目的數(shù)據(jù)查閱,視線鎖定相同維度,即可快速比對數(shù)值大小。


undefined


下面以視覺、交互、信息三個層次解剖設(shè)計過程背后的思考。


視覺層|高密度-克制的留白

眼動理論:研究表明,人眼最小可視視角 0.3 度,水平最大眼動舒適轉(zhuǎn)動區(qū) 30度,垂直最大眼動舒適轉(zhuǎn)動區(qū) 55度??傻贸鋈搜圩钚∽R別范圍 12px,水平視野舒適眼動寬 1200px,垂直視野舒適眼動高 2200px。參考資料:論文《基于眼動交互的用戶界面設(shè)計與研究》


undefined


如圖,縮小表格行高的同時,目標(biāo)信息之間的眼動距離隨之縮短,在眼動舒適區(qū)內(nèi)看到更多信息,便于信息的高效獲取。


undefined



交互層|低跳轉(zhuǎn)-高頻信息前置

理論基礎(chǔ):菲茨定律是用來預(yù)測從任意一點到目標(biāo)位置所需時間的數(shù)學(xué)模型,它由保羅·菲茨在1954年首先提出。這個模型考慮了用戶定位點的初始位置與目標(biāo)的相對距離、目標(biāo)的大小、移動的最短時間。三者之間關(guān)系公式為:T=a+blog2(D/W+1),W為其中目標(biāo)的大??;D為到目標(biāo)的距離;T為移動到目標(biāo)所用最短時間。參考資料:菲茲定律


undefined


表格單元格借助交互狀態(tài),增加懸浮出現(xiàn)的信息組件,前置顯示目標(biāo)單元格明細(xì)信息,同時通過交互出現(xiàn)的指示器輔助行列信息的獲取,高頻操作考慮手勢位置放置,縮短與操作目標(biāo)的距離,以提高整體操作效率。


undefined



信息層|有效性-信息重組織

理論基礎(chǔ):交互設(shè)計四大策略「組織、刪除、隱藏、轉(zhuǎn)移」參考資料:《簡約至上》


undefined


用戶為了對比 A、B 兩不同人群在相同維度(白領(lǐng)-有信用卡)下的人數(shù)差異,但內(nèi)容的重組織方式讓兩數(shù)據(jù)行需要頻繁點擊滾動條來查看,根據(jù)用戶目標(biāo),將關(guān)聯(lián)性大的數(shù)據(jù)放置相鄰列(即將要對比的人群放置列頭),即可快速查閱,減少眼跳距離。


undefined


結(jié)語

設(shè)計趨勢中常見的大字體大留白界面,但在 B 端場景中,面對緊張的工作節(jié)奏,時間和注意力變得尤為可貴,相對而言,基于復(fù)雜度守恒定律, B 端信息量大且高頻訪問的產(chǎn)品中,「用得快」要比「看得美」更重要,「高密度」「低跳轉(zhuǎn)」詮釋的即是「空間換時間」,少一次點擊,少一次跳轉(zhuǎn),少一份等待,就多一份時間和效率。

文章來源:站酷  作者:Ant_Design

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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



詳解|用戶體驗地圖,到底該如何使用?

ui設(shè)計分享達(dá)人

用戶體驗地圖是什么 | WHAT

用戶體驗地圖(Experience Maps)旨在通過描述用戶歷程和故事,使設(shè)計師、產(chǎn)品經(jīng)理等項目成員更好地了解用戶和洞察訴求。所以對于用戶體驗地圖,我們可以將其定義為以下內(nèi)容:

- 是一種描述用戶故事的可視化工具;

- 是一種幫助設(shè)計師、產(chǎn)品經(jīng)理等更好地了解用戶的共創(chuàng)工具;

- 從用戶視角出發(fā),直觀展現(xiàn)產(chǎn)品流程各個觸點上用戶的痛點、需求和情緒;

- 用戶體驗地圖繪制的形式并不唯一,可以根據(jù)項目需求,增減內(nèi)容。


undefined  

△ 途家 App 用戶租房 · 用戶體驗地圖案例



通常在接觸到需求之后,設(shè)計師就可以開始梳理現(xiàn)有流程、使用用戶體驗地圖了。要注意的是:

- 需要梳理的功能不分大小,都可以使用;

- 做之前,務(wù)必要先調(diào)研和訪談用戶使用產(chǎn)品的情況。

建議時長:

- 重要項目:120~180 分鐘- 日常項目:60~120分鐘

參與者:

- 必選:設(shè)計師、產(chǎn)品- 可選:研發(fā)、市場、其他

工具:

- 電腦或白板+便利貼

 

為什么需要用戶體驗地圖 | WHY

需要發(fā)現(xiàn)和拆解產(chǎn)品現(xiàn)有問題,梳理用戶流程時使用用戶體驗地圖,可以在聚焦階段,整合用戶訴求和業(yè)務(wù)訴求,共創(chuàng)機會點,找出解決方案,通常在以下場景中使用:

- 新產(chǎn)品設(shè)計:需要對需求進(jìn)行拆解和優(yōu)先級排序;

- 產(chǎn)品優(yōu)化:發(fā)現(xiàn)產(chǎn)品現(xiàn)有問題,洞察設(shè)計發(fā)力點。

 

由此可見,在設(shè)計過程中使用用戶體驗地圖作為設(shè)計工具,有以下益處:

- 更好的以用戶視角來看產(chǎn)品的體驗;

- 通過共創(chuàng),項目成員達(dá)成共識;

- 確認(rèn)觸點,作為我們的設(shè)計方向;

- 通過用戶痛點找到機會點;

- 幫助梳理產(chǎn)品流程。


undefined


△ 用戶體驗地圖共創(chuàng)現(xiàn)場

 

用戶體驗地圖操作流程 | HOW

我們通常會將流程分成4 個階段:定義原則和目的 —— 梳理階段流程 —— 洞察痛點 —— 尋找機會點。


1. 定義原則和目的

首先要了解我們做用戶體驗地圖的原因和目的,包括用戶是誰、解決什么問題、用戶的目標(biāo)、產(chǎn)品的整體目標(biāo)、限定條件等等,對用戶群體、整個項目背景和共創(chuàng)任務(wù)目標(biāo)有清晰、全面的認(rèn)知。


undefined


2. 梳理階段流程 

首先是劃分階段,將用戶的行為拆分成幾個大的階段,在整理時要注意:

- 在整個產(chǎn)品的范圍之內(nèi)盡量把故事、流程講完整;- 以廣度優(yōu)先,而非深度,不要過早的沉浸到細(xì)節(jié)中。

接下來我們要將主要階段拆分成單個任務(wù),并梳理具體的任務(wù)和觸點,羅列出過程中的任務(wù)和各個觸點,要做到事無巨細(xì)。


undefined


然后根據(jù)任務(wù)和觸點,整理對應(yīng)的用戶疑問、用戶感受/情緒。通過對用戶的觀察和訪談進(jìn)行梳理,客觀的描述事實,切勿自說自話或是將自己的情緒代入其中,也不要急于猜想與分析。


undefined


3. 洞察痛點

這一步需要我們匯總用戶的痛點,并將痛點分級,洞察用戶痛點背后的真實訴求。這個過程中可以先讓大家在一定時間內(nèi)寫出自己的想法,每一條寫在一張卡片上,做到先相互不干擾,之后再統(tǒng)一整理和總結(jié)。


undefined


4. 尋找機會點

通過上述總結(jié),思考新的機會點、解決方案、優(yōu)化整體流程,并對新流程下的功能做優(yōu)先級排序??梢酝ㄟ^準(zhǔn)備一些問題來刺激大家腦爆出更多的內(nèi)容,比如:用戶還有其他選擇么?怎么做用戶才能更爽?其他用戶來到這里該怎么處理?等等。在這個階段需要:

- 對內(nèi)容進(jìn)行對標(biāo)、討論,把公認(rèn)的點保留下來,無用的點剔除出局;- 根據(jù)實際情況和項目成本、進(jìn)度等條件,對新流程下的功能做優(yōu)先級排序。


undefined


 

如何為過程提效 |TIPS

在實際的工作過程中,因為項目時間都非常緊張,繪制這樣一個完整的用戶體驗地圖比較耗費時間,所以推薦大家?guī)讉€提效的技巧,既可以減少時間浪費,也可以提高共創(chuàng)質(zhì)量:

1. 事前

充分做好用戶調(diào)研,提前準(zhǔn)備好用戶地圖模板,可以在開始之前的一到兩天發(fā)給參會人員,讓所有人對產(chǎn)品有一個整體梳理和思考,有助于提高大家的產(chǎn)出質(zhì)量。

2. 事中

如果是優(yōu)化的產(chǎn)品,可以將設(shè)計稿 demo 或者線上產(chǎn)品截圖打印出來,這樣可以增強大家的代入感,有利于想法的輸出。

3. 事后

整理電子版體驗地圖,需要跟隨產(chǎn)品的演進(jìn)進(jìn)行更新,上傳到項目共享空間隨時查看。

文章來源:站酷  作者:Ant_Design

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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



用戶體驗是玄學(xué)嗎?

純純

Part 01 - 用戶體驗和用戶體驗設(shè)計


關(guān)于“用戶體驗”這個詞,很多剛?cè)胄械男氯硕加X得它玄之又玄,妙不可言。一方面是不知道他具體到底是什么,就好像那是一塊理想地,看不見也摸不著,另一方面呢糟糕的用戶體驗,作為用戶是能清晰感覺到它的存在。所以呢,在這里,會圍繞“用戶體驗”這個詞做一個科普性質(zhì)的解釋和綜述,希望對初學(xué)者一些小小的幫助。



1.1 什么是用戶體驗?

用戶體驗的定義有很多種,我比較傾向的解釋是:

“用戶體驗是人對于使用一個產(chǎn)品、系統(tǒng)、服務(wù)時的預(yù)期和反應(yīng)?!?

首先明確第一個概念,體驗是一個過程,生活中的一切皆是體驗,我們赤裸裸的來到這個世界,最后赤裸裸的離開,來人世走一遭就是來體驗來了。

從廣義上來看,體驗的主體是人,客體可以是一切物體和事情,媒介是我們的感官;當(dāng)我們的感官作用在一切事物上,會產(chǎn)生相應(yīng)的心理行為,比如預(yù)期,比如反饋,比如情緒,著所有的一切一起作用,形成了用戶體驗過程。


只要留心生活,你會發(fā)現(xiàn)用戶體驗無處不在。

舉兩個例子:

第一個是北京隨處可見的地鐵充值機,我經(jīng)??吹接脩粽驹谀抢镢卤疲钪饕氖撬`背了用戶的操作習(xí)慣,插卡機器的的行為總會讓人聯(lián)想到APM機,而幾乎所有的APM機器卡都是插一半然后自動吸進(jìn)去的,而北京地鐵卡是需要插到底,然后還需要用力按一下才能成功識別,跟多用戶懵逼在這一步,并沒有用力按,然后以為是機器壞了沒有識別。

第二個例子是我工作的地方旁邊商場一樓有一個肯德基,它有兩個門可以進(jìn)入,第一個門是在商場外臨街,第二個門是在商場內(nèi)。

我連續(xù)兩周的工作日每天早上9點半到10點在這家店吃早餐,發(fā)現(xiàn)一件很有趣的現(xiàn)象,由于工作人員的疏忽,商場內(nèi)的門二經(jīng)常會忘記打開,因為這個商場的負(fù)二樓和地鐵站連在一起,所有很多人地鐵到站的人群從地鐵站口出直接從商場內(nèi)走向街道:

在這些人群里,如果他們正巧有買早餐的需求,他們往往會從門2進(jìn),如果正巧由于工作人員的疏忽,門2沒開。按照常人的思維,哪怕門2沒開,那不還有一個門1么,用戶完全可以多走幾步出去從街道門1進(jìn)入啊,應(yīng)該不會太影響。如果你能得出這樣的結(jié)論,又碰巧你正好是互聯(lián)網(wǎng)的設(shè)計或者產(chǎn)品人員,那么你可能有“自我安慰型人格”。

我吃早餐的兩周里做了一個統(tǒng)計,10個工作日里,每天在我吃早餐的這半個小時內(nèi),試圖推開門2卻發(fā)現(xiàn)打不開的,平均到每天有6位,按照每個人平均買一份早餐套餐15元錢來算,10天內(nèi),由于工作人員的失誤,這個門至少阻擋了至少900元營業(yè)額。


回到剛剛那個“自我安慰”的思維,我發(fā)現(xiàn),10天內(nèi)被這個門阻擋的實際62位用戶里,真正出街道從街道門1再次進(jìn)入的人,只有十七位。也就是說這個實驗中肯德基早餐用戶被最短路徑阻隔之后,再次選擇次路徑完成轉(zhuǎn)化的轉(zhuǎn)化率17/62(27%)。

別急,還有更吃驚的數(shù)據(jù):在被門2阻隔的62個人中,有17個是自身順路要往街道右邊走路過門1的。但是由于被門2阻隔,他們17個人當(dāng)中,哪怕自身行走路徑要路過門1,選擇從門1進(jìn)去的也只有7位,大概在11/17(64%)(判斷順路依據(jù)是他們吃完后從門1出門往右走)。


再看一下肯德基這個例子的數(shù)據(jù)結(jié)論:

被門2阻攔的62個人里,45人流失。

其余17位選擇從門1再次進(jìn)入,這17人里,本身就要順路經(jīng)過門一的占11位,說明大概率只有順路才會進(jìn)入完成轉(zhuǎn)化。


這個例子說明什么呢?

在替代品遍地都在的今天,不要試圖去挑戰(zhàn)用戶的體驗。


當(dāng)用戶看到肯德基的門2,他們產(chǎn)生的預(yù)期是馬上就可以推開享受一頓早餐,這時候由于門2打不開,使得用戶預(yù)期受挫。

受挫用戶的第一反應(yīng)并不是想解決辦法(表現(xiàn)在例子中就是尋找另一個門進(jìn)入),而是放棄它。畢竟,沒有肯德基我還可以吃麥當(dāng)勞,還有星巴克,還有面包店,各種各樣的選擇。


這就是為什么互聯(lián)網(wǎng)行業(yè)把產(chǎn)品用戶體驗看得這么重要的原因,除了社交產(chǎn)品以外的用戶是很難有忠誠度的,你的產(chǎn)品難用,你不能給用戶更大的福利,用戶一旦發(fā)現(xiàn)別的產(chǎn)品做得比你好,用戶會馬上放棄你,轉(zhuǎn)而用別的替代品。


上面的那個例子主要表達(dá)的是用戶預(yù)期受阻帶來的糟糕體驗導(dǎo)致用戶流失。其實整個用戶體驗的過程當(dāng)中,是有很多很的因素相互制約,協(xié)同作用的:


戶體驗本身一個很龐雜繁復(fù)的系統(tǒng);在一個過程內(nèi),用戶對整個過程中的元素的預(yù)期和反應(yīng)(情感和生物反應(yīng))構(gòu)成了整個用戶體驗系統(tǒng)。這里面包含了很多很多的旁支,比如人的感知、人的經(jīng)驗系統(tǒng)和使用場景決定了人對于單個體驗的預(yù)期,而如果超過預(yù)期會帶來驚喜,促使用戶正向評價,也促使用戶再次體驗。比如人感知和體驗中客體呈現(xiàn)的意符決定了人的行為等等…


用戶體驗最初的時候它只是用于表征易用性方面,而現(xiàn)在,它的概念更多的表現(xiàn)在情感的一個分支,包含設(shè)計情感互動和評估情緒 。因為人的情緒是很難拿捏的,面對不同教育背景不同生活經(jīng)歷的用戶,我們最初其實很難歸納出到底什么樣的設(shè)計是具有好的用戶體驗。


好的用戶體驗各有各的優(yōu)點,但是,糟糕的用戶體驗卻很容易被歸納和識別出來。


設(shè)計師們不斷的在識別和總結(jié)糟糕的體驗問題,慢慢在優(yōu)化這些問題的過程中積累經(jīng)驗,其實也慢慢的有了一些關(guān)于用戶體驗的方法論形成,這種方法論作用于各個設(shè)計行業(yè),工業(yè)設(shè)計、服裝設(shè)計、奢侈品、廣告、互聯(lián)網(wǎng)產(chǎn)品設(shè)計各個行業(yè)產(chǎn)生的方法論其實不盡相同。




1.2 什么是用戶體驗設(shè)計?


說起設(shè)計(Design)這個詞,那就厲害了 ,作為設(shè)計師的你聽說過解釋肯定有很多種,而我個人對”設(shè)計“的理解是:設(shè)計是一種”約束條件下,解決問題的可行的辦法“。而對于用戶體驗設(shè)計而言,早期的時候,我們僅能夠基于經(jīng)驗主義去完成一些設(shè)計,這時候?qū)<业淖饔脮环糯?,因為專家提出的不要這樣、不要那樣,往往會成為指導(dǎo)性方案:


但是隨著發(fā)展,不斷地有人站出來嘗試描述和定義用戶體驗的邊界,比如:


隨著探索者越來越多,我們最終也是大致能夠夠了出用戶體驗設(shè)計的定義范圍:既然體驗是一個過程,那么狹義的,用戶體驗設(shè)計實際上是通過改善和優(yōu)化用戶與產(chǎn)品交互過程,從而提升用戶的滿意度的過程。


這里有兩個要點:


1、用戶體驗設(shè)計的目標(biāo)是逐步不斷提升用戶滿意度,前面兩有個定語:“逐步“、”不斷”,對于用戶而言,永遠(yuǎn)沒有所謂“最滿意”的說法,只有“相較于上一次體驗更滿意”.所以除非定義一種可量化的終極滿意度模型作為指標(biāo)參照,否則用戶體驗設(shè)計是一個永遠(yuǎn)都有優(yōu)化空間的過程。


2、用戶體驗設(shè)計是圍繞過程的設(shè)計,在互聯(lián)網(wǎng)行業(yè)中,這個過程主要指用戶與產(chǎn)品(app、PC端,客戶端、VR等)的交互過程中,所以下文重點討論的是在互聯(lián)網(wǎng)行業(yè)中的用戶體驗設(shè)計。



Part 02 - 用戶體驗設(shè)計是一個崗位嗎?


以2018年2月為時間節(jié)點的目前來說,用戶體驗設(shè)計不是一個崗位,現(xiàn)階段來看,它更像是一個協(xié)同目標(biāo),每個公司的所有設(shè)計師(UI/視覺/交互),用研人員,包括開發(fā)人員其實工作的目標(biāo)都是為了逐步提升自己公司產(chǎn)品的用戶體驗。


雖然用戶體驗設(shè)計目前還不是一個崗位,但是它正在趨向于成為一個崗位。要解釋這一點,我們還是要從用戶體驗的定義說開去,還記得用戶體驗設(shè)計是什么嗎?用戶體驗設(shè)計是通過改善和優(yōu)化用戶與產(chǎn)品交互過程,從而提升用戶的滿意度的過程。


既然要改善和優(yōu)化用戶與產(chǎn)品交互過程,那把這個句子拆分開來,大概需要的知識儲備有:

1、從主語的角度看:首先你要了解用戶吧?用戶是人,要提升人的滿意度,對人感到心理滿足的機制是不是需要了解?


2、從客體的角度看:客體是產(chǎn)品,在互聯(lián)網(wǎng)行業(yè)表現(xiàn)為手機(app)、pad(app)、PC(軟件)和VR設(shè)備等等。這些產(chǎn)品是我們著重需要關(guān)注的點,比如一個app中視覺信息的呈現(xiàn),app的信息架構(gòu)、app的交互設(shè)計、app的可用性和易用性等等,都是需要考慮的。


3、既然是用戶與產(chǎn)品交互過程,是不是要知道人和產(chǎn)品(手機、app、PC)到底是如何交互的?每一次的點擊,滑動對于用戶來看心理應(yīng)該是怎樣,產(chǎn)品的每一次反饋都意味著什么?


吶,你現(xiàn)在來看,其實我們互聯(lián)網(wǎng)行業(yè)現(xiàn)在劃分的UI/視覺/交互/用研,甚至往廣了說包括產(chǎn)品/開發(fā)/測試,工作內(nèi)容都是構(gòu)成用戶體驗的要素,它需要的知識面特別特別廣,對人的綜合素質(zhì)要求很高,所以目前來看,用戶體驗還不能是一個崗位,但是很多大公司,比如騰訊阿里,他們期待設(shè)計師能夠變成有更大洞察和對業(yè)務(wù)、人性有更多了解的全方位人才,而不是一個只會畫圖的美工,所以說未來,用戶體驗設(shè)計師可能會變成一個title,但是可以預(yù)料的是,用戶體驗涵蓋的這么多方面知識,每個人都是有側(cè)重和專長的:可能有些人就是很喜歡視覺設(shè)計和UI設(shè)計,那他們在精研這部分的同時,相應(yīng)的懂一些交互方面的知識,這就算是優(yōu)秀的偏視覺方向的用戶體驗設(shè)計師;那視覺表現(xiàn)很差的人能不能算優(yōu)秀設(shè)計師呢?當(dāng)然可以,比如他是心理學(xué)或者HCI(人機交互設(shè)計)的研究生,對人和用戶心理有自己獨特的認(rèn)識,再加上精通定性和定量研究方法,對數(shù)據(jù)有獨特的敏感,那他未來可能是用戶研究方向的用戶體驗設(shè)計師。


只不過我們現(xiàn)在因為崗位固化,大多數(shù)公司,每個人的工作職責(zé)僅限于那一塊,你是做視覺/UI的,那就好好畫界面,你是做交互的,那就好好研究布局,你是用研,你是DBA,你是什么職位就做什么職位的事情,從來不越界,這樣其實是不利于人的發(fā)展的,那我們追求上進(jìn)的設(shè)計師們只能自己下來多看書,多去做研究,私下來多花時間修煉自己的內(nèi)功心法,才能讓自己立于不敗之地。


用戶體驗設(shè)計發(fā)展到今天,目前包含了最大的三個有模糊邊界的模塊是用戶研究、交互設(shè)計、視覺設(shè)計。現(xiàn)在絕大多數(shù)互聯(lián)網(wǎng)公司也都是按照以上這三個模塊去設(shè)置崗位的,這樣有一個很大的問題其實是不利于設(shè)計師的發(fā)展。


阿里巴巴1688的設(shè)計總監(jiān)汪方進(jìn)關(guān)于這三個崗位,有這樣的一番評述:

比如交互崗位,如果對接的是一位能力較強的PD,他們可能把交互稿定了七八成,交互設(shè)計師完善后交付給視覺設(shè)計師,而對接的視覺設(shè)計師又有一些交互Sense,他也許把交互稿又改了改,那么這個過程下來,交互設(shè)計師的內(nèi)容,還能保留多少呢?我所說的這種情況,可能也是當(dāng)下我們交互設(shè)計師同學(xué)所面臨的痛。

而視覺設(shè)計師又是怎樣的現(xiàn)狀呢?視覺設(shè)計師拿到交互稿后,在交互稿的基礎(chǔ)上美化潤色一下,自主發(fā)揮空間不太大。從我們集團(tuán)總體情況來看,視覺設(shè)計師的(P級)成長是比較慢的,因為我們講求論述自身設(shè)計的價值是什么,但把視覺從整體中剝離出來,視覺設(shè)計師設(shè)計的某一個頁面,具體能帶來多少商業(yè)價值?視覺設(shè)計師很難去論述這點。


關(guān)于用研、視覺、交互這三個模塊,我也想分開來談?wù)劊M軐δ壳皠側(cè)胄谢蛘呷胄胁痪酶械矫悦5男』锇橛兴鶐椭?



Part 03 - 用戶研究


上面我們說到,用研、交互、視覺這三個模塊構(gòu)成了一個用戶體驗設(shè)計的能力維度,要搞清楚這三個維度,我們不妨先看看業(yè)界最出名的一張用戶體驗要素圖:

我們一般把最下面戰(zhàn)略層的部分分解開,其中除了產(chǎn)品和公司戰(zhàn)略之外,關(guān)于用戶需求的定義交給用研(用戶研究)人員去完成。


關(guān)于用戶研究,如果是一個從0到1的產(chǎn)品,產(chǎn)品初期是需要對產(chǎn)品用戶進(jìn)行定位劃分和用戶畫像,就是我的這個產(chǎn)品是為了解決什么樣的用戶的什么需求的,這些用戶的屬性是怎樣的,他們具有什么樣的特質(zhì)和顏色、他們一般使用產(chǎn)品的情景是如何的?


這里需要注意的是,如果你不是一位有用研經(jīng)驗的人去第一次嘗試做用研,需要留心我們很容易落入理想化用戶設(shè)計的陷阱。再客觀的站在用戶角度去思考,去設(shè)計也會有主觀和流于表面的情況出現(xiàn)。我們不能想當(dāng)然的按照理想情景去思考用戶需求,用戶需求是復(fù)雜的,再加上企業(yè)自己的,以及各部門的需求紛繁,所以一般在產(chǎn)品迭代的過程中新的功能很容易陷入想當(dāng)然的“用戶就是需要啊”的思維之中。所以對于成熟的產(chǎn)品來說,需要劃分核心主流和普通用戶并分別畫像。關(guān)于用戶畫像的方法有很多很多,大家可以去隨意搜索在這里就不細(xì)談了。


還有如果是一個初次開展用戶研究的同學(xué)做用戶研究的時候,可以掌握幾種常見的方法,訪談法,焦點小組,易用性測試,問卷調(diào)查這些方法各有利弊,最重要的是找到當(dāng)前情境下解決問題且行之有效的方案,比如訪談或者焦點小組,精心整理問題并邀請公司的一些員工或者核心用戶進(jìn)行訪談并全程錄音,在結(jié)束后認(rèn)真提煉訪談中多次被用戶提到的關(guān)鍵詞,從關(guān)鍵詞中按維度抽象整理出用戶的需要,是訪談的核心價值。并且輸出文檔,賦予思考,再以此作為整個設(shè)計改版的核心依托,讓里面用戶提到的關(guān)鍵詞在設(shè)計頁面中體現(xiàn),這才是有效的設(shè)計。


關(guān)于用戶研究的常用方法,具體推薦給大家兩本大部頭的書,大家感興趣或者不知道自己感不感興趣,可以去看看《設(shè)計調(diào)研》和《洞察用戶體驗方法與實踐》 第二版。



Part 04 - 交互設(shè)計 


交互設(shè)計的輸出物是產(chǎn)品原型,也就是你們看到的線框圖。那線框圖是怎么產(chǎn)生的呢?這個需要從產(chǎn)品經(jīng)理那邊對功能梳理開始。

一般大一點的有交互團(tuán)隊的公司,比如新浪微博啊之類的,他們的產(chǎn)品經(jīng)理的工作重點會更加focus在功能本身到底是不是用戶所需要的,而經(jīng)過產(chǎn)品提出來的需求文檔,一般只有功能需求List和他們的優(yōu)先級,如果遇到要畫圖說明的,也就是簡略的幾一個草圖。

這時候,交互設(shè)計師會根據(jù)產(chǎn)品的提出的功能需求List去進(jìn)行整理和區(qū)分:

這里整理和區(qū)分的方法是合并,拆分和歸納。

比如功能A是可以拆分成更細(xì)顆粒度的需求A1和A2的,其中A1和A2又碰巧屬于不同的已有的兩個功能區(qū)塊,那么就可以把他們拆分到不同的功能線上,如果某些功能發(fā)現(xiàn)他們有同樣的屬性,那是不是考慮把他們整合在一起?


這樣整合完了需求,再按照優(yōu)先/重要的二維表格去劃分,最后得到一個需求量表:

然后我們根據(jù)這樣的版本需求量表優(yōu)先級和重要性,有的放矢的去設(shè)計功能入口和信息架構(gòu),就會游刃有余:


而一般復(fù)雜產(chǎn)品新增功能的時候,往往要考量很多因素,不能一味的去做功能堆砌,還是需要把不重要的功能隱藏或轉(zhuǎn)移,突出重要的功能,再把一些同屬性的功能入口組織在一起并列,這些都是在原型之前需要思考的問題。再往下,那就是根據(jù)一個一個的信息去設(shè)計產(chǎn)品低保證原型圖,那就沒啥好說的了,你們看到的原型圖幾乎都差不多,但是至于你們的交互設(shè)計師的原型是不是按照我上面步驟一步一步推演出來的,那就要打個問號了,這可能是區(qū)分一般交互設(shè)計師和高級一點的交互設(shè)計師的一種辦法。(如果你見到聽到功能就開始畫低保真的交互,那…)



如果你以為交互設(shè)計師就是畫個原型,那你就錯了,交互設(shè)計師切記不要淪為產(chǎn)品助理……其實在真?zhèn)€UX體系中,交互設(shè)計師承擔(dān)的是最重要也是最核心的一個環(huán)節(jié),那就是優(yōu)化用戶路徑(即優(yōu)化流量路徑)。


什么叫優(yōu)化用戶路徑呢,舉個例子,全民k歌是一款唱歌的app,那用戶最核心的功能就是在上面唱歌,而關(guān)于唱歌,大概有獨唱、合唱兩種維度。比如現(xiàn)在,我作為普通用戶,想要去完成獨唱一首歌的行為。這種行為從用戶路徑上看就是用戶從任何頁面到唱歌詳情頁。那么到底有多少條路?既是說,到底有多少個頁面可以跳轉(zhuǎn)到唱歌詳情頁?然后你會發(fā)現(xiàn),其實能跳到唱歌詳情頁的,除了清唱那種獨特的方法以外,其他的都是要通過伴奏詳情頁跳轉(zhuǎn),那么問題又來了,到底有多少個頁面可以跳轉(zhuǎn)到伴奏詳情頁呢?

就這樣,去窮舉所有的用戶路徑,然后看看這些路徑過程中有沒有一些冗余操作是可以刪減的:


窮舉所有用戶路徑,看看有沒有哪一跳是可以被優(yōu)化的(以唱吧為例



這里面有很大很大的學(xué)問,如果展開說的話可能是一個幾萬字都說不清楚的篇幅。

總之,一個好的app一定是功能和產(chǎn)品形態(tài)足夠扁平簡單。

要讓產(chǎn)品形態(tài)足夠扁平簡單,就需要根據(jù)app的形態(tài)去整理和梳理交互層級,針對流量問題進(jìn)行具體的分流設(shè)計:

比如當(dāng)我們看到一個200wpv的頁面,下屬三個平行按鈕分別只有40w、12w和3wpv,刨除場景問題之外,從交互出發(fā)那是不是我們可以設(shè)計一個內(nèi)頁的segment組件去完成三個內(nèi)頁的滑動跳轉(zhuǎn)、降低操作成本呢?

比如淘寶這樣:

又或者說,我們是不是可以未一個pv較低卻承載功能較大的頁面另外設(shè)置另多個入口呢?

比如像外賣產(chǎn)品這樣:

最后的最后,交互設(shè)計的工作產(chǎn)出就是原型了,既然都思考妥當(dāng)了,畫個圖就就沒啥好說的了...



Part 05 - UI設(shè)計



再往后,交互設(shè)計師會把原型給到UI設(shè)計師,UI設(shè)計師的工作范圍大家想必很了解,就是把低保真的原型變成高保真的設(shè)計稿。


在這里再啰嗦一遍?。?


UI設(shè)計師的基本技能是精確的信息視覺傳達(dá),不是視覺炫酷的界面!

UI設(shè)計師的基本技能是精確的信息視覺傳達(dá),不是視覺炫酷的界面!

UI設(shè)計師的基本技能是精確的信息視覺傳達(dá),不是視覺炫酷的界面!


重要的事情說三遍!


我們唱吧UED最近一直在招人。

看UI的簡歷,然后發(fā)現(xiàn)一個很大的問題是,我發(fā)現(xiàn)UI設(shè)計師的簡歷真的是千奇百怪五花八門,有那種插畫畫的很好的,有那種第一眼上來就是一個很立體的3D建模渲染震撼到你的,也有那種大漸變dribbble風(fēng)給你一種好像很厲害的樣子的,但是這些都不重要,如果一個界面上的內(nèi)容信息沒有主次區(qū)分,或者展現(xiàn)得沒有層級對比,再花哨的東西都沒有用。


關(guān)于UI需要掌握的比如格式塔啊之類的東西已經(jīng)有太多人說了,在這里就不贅述,具體也可以看我的文章《形式與內(nèi)容的關(guān)系 -  app的視覺美成因分析》


UI設(shè)計其實都不是鬧著玩的工作,也絕對不是純主觀感性的工作,判斷一個UI界面的好壞可以通過易用性和易讀性測試、瞇眼測試的方法檢驗,判斷一個產(chǎn)品交互設(shè)計的優(yōu)劣也可以從易用性測試和用戶反饋中得出線索,判斷哪種交互手段和信息架構(gòu)更為可行通過ab test的方法得出結(jié)論,這一些的一些設(shè)計它都是一個有著科學(xué)的方法論作為指導(dǎo)的。


希望從此之后大家審視產(chǎn)品的時候不要以UI美丑這種最低級的主觀因素去思考(當(dāng)然UI的一致性和美觀度很重要),但是更多的,要想想更深層次功能布局和信息架構(gòu),以及產(chǎn)品打的人群上往更加宏觀和抽象的高胃度進(jìn)行思考。


文章來源:站酷   作者:Seany

分享此文一切功德,皆悉回向給文章原作者及眾讀者.


免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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




從交互維度量化用戶體驗

純純

和大家分享一些在產(chǎn)品和交互設(shè)計中的一些自己的方法。



Part - I 什么是交互

狹義的交互(Interaction)定義交互主體必須是人本身,而客體可以是產(chǎn)品,環(huán)境,服務(wù)等等,且不論交互客體是什么,只要主體是人,人和客體去進(jìn)行交互的時候,一定是人帶著心理預(yù)期施加一個行為,然后客體會根據(jù)這個行為給與一個反饋(沒有反饋本質(zhì)也是一個反饋),而人會根據(jù)這個反饋是否符合預(yù)期去進(jìn)行心理修正。如下圖所示,這就是我理解的最小交互模型:

當(dāng)時我舉的例子是用翻頁器去控制ppt翻頁:


如上圖所示,拆解這一套交互行為:

當(dāng)我我點擊翻頁器的“下一頁”按鈕,我點擊行為附帶的心理預(yù)期是“PPT翻往下一頁”,然后我點擊的時候,遙控器塑膠按鈕給到我手指一個物理反饋,證明我按下的行為已經(jīng)完成了,這是“輸出端(我的手)的交互與反饋”,這時候遙控器接收到按鈕指令,把指令通過紅外線傳輸?shù)経SB接收器上,接收器把指令傳到PC端然后完成翻頁動作,再通過大屏幕傳到我的眼(輸入端)中,我就可以確認(rèn)這一次交互反饋是符合預(yù)期的。BTW這里有一點想要補充:設(shè)備對設(shè)備(上圖中黑色箭頭),也屬于廣義的交互,只不過現(xiàn)階段大家研究的交互設(shè)計都是狹義的,人為主體的交互。


在我們?nèi)沼每萍籍a(chǎn)品的早期,有兩個東西是無法跳過的,那就是按鍵手機和PC電腦:


他們幾乎是同步在發(fā)展的,而這兩個產(chǎn)品的交互行為基本上延續(xù)到了觸屏手機時代,所以為了弄明白觸屏手機的交互,這兩個產(chǎn)品是值得講一講的。


先看按鍵手機(就是我們小時候用的非智能手機):

在按鍵手機中,最讓用戶困惑的其實是按鍵和屏幕之間存在一個映射關(guān)系,而不同廠商缺乏一個統(tǒng)一的規(guī)范,各家映射規(guī)則不一樣。大家是否還記得當(dāng)年的手機說明書那可以說是相當(dāng)厚,因為說明書必須要給用戶建構(gòu)一個心理模型;比如上圖,點擊左上角和右上角那兩個“-”按鈕,其實一一對應(yīng)的是屏幕左下角的“Goto”和右下角的“Names”。這個一一對應(yīng)關(guān)系作為今天的用戶來看應(yīng)該是很平常而且很易懂的,但是當(dāng)年沒用過手機的人,需要花很長時間閱讀說明書,才能夠明白物理按鍵和屏幕上的映射關(guān)系,這就是觸屏手機很難用的地方,也是很反人性的地方。因為作為用戶來說,心智上,我們當(dāng)然希望所觸即所得。

再來看PC,作為和按鍵手機差不多一起出現(xiàn)的載體形式,人們操作PC端人是通過媒介(也就是鼠標(biāo)+鍵盤)輸入的,其實本質(zhì)上也是我們通過鼠標(biāo)在桌面上滑動x-y區(qū)域?qū)?yīng)到電腦桌面上指針的移動來創(chuàng)造屏幕中x-y的映射關(guān)系,然后鍵盤上幾十個鍵配合輸入完成操作。


大家發(fā)現(xiàn)了么,上述的兩種設(shè)備其實本身就是在制造一種一一對應(yīng)的映射關(guān)系去完成交互行為,這兩種載體從出身開始就還是需要很大交互成本的。

隨著科技的發(fā)展,觸屏感應(yīng)技術(shù)推出了之后,印象中觸屏手機就是兩三年時間就摧枯拉朽的淘汰了按鍵手機,本質(zhì)上是干掉了一一對應(yīng)的交互映射,所按即所得:

觸屏手機出現(xiàn)之后,交互專家們不禁要問一個問題了:

手和觸摸屏到底有多少種交互方式?

答案是有很多種:

越是高階越是隱藏的交互手勢越復(fù)雜,所謂的“交互成本”也越高,比如錘子三指滑動換屏保那種,就是利用了高階交互便捷實現(xiàn)邊界功能。那這么看起來,iOS也好還是所有的安卓手機都好,從用戶端而言,就是組合交互手勢,讓信息更好的傳達(dá)而已。那么同理,在App中也是一樣,如果我們了解了每一個交互行為的用戶心理預(yù)期,對設(shè)計工作而言就能做到有的放矢:


我們以“單擊”和“滑動”這兩個最簡單的交互行為舉例。

所謂單擊手機屏幕,用戶其實最核心的是有兩個預(yù)期:

第一是選中一個元素,比如Radio組件。第二是邏輯上的Next,比如點了一件衣服,應(yīng)該Next到衣服的詳情;點了付款,應(yīng)該出現(xiàn)付款流程,點了返回,應(yīng)該back到上一路徑點等等。


劃動交互也是一樣的,用戶在一塊手機屏幕上單指劃劃劃,用戶內(nèi)心的預(yù)期其實也不復(fù)雜,最核心的預(yù)期也就兩點:

第一是查看屏幕外的線索(前提是設(shè)計師給用戶留下線索了或者是這個UI組件長得就是可以劃動的樣子)第二是查看相鄰標(biāo)簽的內(nèi)容,或者查看同一個標(biāo)簽下的相鄰元素,比如iOS的segment controlle組件就是典型例子:


當(dāng)我們了解了這些之后,我們在實際的設(shè)計工作中就可以根據(jù)上面這些理論來合理選擇UI組件去呈現(xiàn)對應(yīng)的信息了。




Part - II 從交互維度合理選擇UI組件

我們在設(shè)計工作中,選擇UI組件,本質(zhì)上就是選擇信息的呈現(xiàn)形式。

每一個常見的UI界面和UI組件,都一定也滿足上面所說的最小交互模型:



在這里我舉一些例子說明。

第一個例子:同樣的內(nèi)容,選擇不同的UI組件呈現(xiàn),給用戶呈現(xiàn)的是完全不同的產(chǎn)品結(jié)構(gòu):

大家看下面這張圖:


這兩個UI模塊擺在大家面前,大家應(yīng)該能清晰的感受到,左邊是一個segment控制下面內(nèi)容的UI;而右邊是一個所有內(nèi)容列表的集合頁,只不過通過tab聚類了而已。

第一件事應(yīng)該想到的是如果需要采用右邊的排列形式就必須要控制tag的字?jǐn)?shù);然后由于右邊的tag占據(jù)了推薦貼的位置,導(dǎo)致推薦貼可能沒有左邊的那種展現(xiàn)形式更加醒目。但是相對的,圖右的優(yōu)勢在于,由于豎向排列tag可以讓一個屏幕顯示更多的tag,可以讓用戶更方便的定位內(nèi)容,比如外賣產(chǎn)品之所以用右邊這種形式是因為力求一屏展示更多的菜,而且外賣產(chǎn)品的左側(cè)tag一般是一家店鋪的菜的品類,用戶下滑菜品配合點擊品類,點完即走,很方便(京東和淘寶電商類平臺也是類似的)。

但是比如今日頭條,新聞類客戶端只能采用左邊的這種形式,因為新聞類客戶端是需要用戶長時間沉浸的,比如用戶選中一個“體育”的tag之后一般要沉浸的看好久好久,用戶需要沉浸在這個tag下的內(nèi)容中,那這個時候顯然用右邊這種設(shè)計方式讓tag常駐屏幕左側(cè)是不合適的。


再來看第二個例子,就是UI應(yīng)該會隨著內(nèi)容而進(jìn)行調(diào)整和優(yōu)化:


這里舉一個唱吧的例子,唱吧從7.0到8.6之間做了三次改版,大家可以看到,唱吧團(tuán)隊幾乎是損失了屏幕效率來加大了間隔和突出了歌名,這是為什么呢?

這是因為頁面承載的關(guān)鍵任務(wù)不同,大家對比著7.0時候和8.6時候的UI樣式,正好是今天快手和唱吧的對比:

大家會發(fā)現(xiàn),其實這個頁面,快手和唱吧承載的內(nèi)容都是消費轉(zhuǎn)化,都希望用戶點擊進(jìn)去消費內(nèi)容,但是兩款產(chǎn)品做了截然不同的UI風(fēng)格,原因是什么呢?

快手在這個頁面,其實承載的關(guān)鍵任務(wù)是:“迅速讓用戶找到感興趣的點”,它這么設(shè)計的本質(zhì)原因是因為它的截圖可以幫助用戶判斷內(nèi)容本身,比如第一張圖是一個人在打高爾夫,右邊是一個工人,然后第二排左邊是一個游戲的鏡頭,右邊是一個傳遞正能量,大家可以很方便的通過圖片識別里面的內(nèi)容,用戶更沉浸更聚焦的去選自己喜歡的點擊進(jìn)入消費就可以了。但是唱吧的視頻截圖其實是不能識別里面內(nèi)容的,大家可以看到,第一張圖是一個妹子,第二場圖是一個妹子,第三張圖還是一個妹子,那用戶點擊進(jìn)去的動力在哪兒了?除了這個照片長相之外,更多的其實是文字決定的,是這個人唱的這首歌的歌曲名是不是我喜歡的,或者是這個演唱者的的歌手等級。

所以基于這種跟深層次的邏輯,唱吧和快手兩款產(chǎn)品的這個頁面都是為了促進(jìn)消費轉(zhuǎn)化,但是UI長相上完全不同。


我們看第三個例子:


同樣組件下,選擇不同的交互方式,也會使得效果完全不同,比如現(xiàn)在有一個UI頁面,主要由一個tab(iOS叫segment controlled)組件控制下面的內(nèi)容,樣子張這樣:


我先假定一個前提:這個app中的這個組件不支持橫劃,只支持點擊切換。

好了,現(xiàn)在我假設(shè)這是一款已經(jīng)穩(wěn)定運營了一年的產(chǎn)品,為了說明問題,我假設(shè)一個理想數(shù)據(jù):

假設(shè)每天有20W的uv訪問這個頁面,其中分流情況是:

10Wuv消費“推薦”下的內(nèi)容

2Wuv消費“生活”下的內(nèi)容

1Wuv消費“段子”下的內(nèi)容

3Wuv消費“美女”下的內(nèi)容

4Wuv消費“游戲”下的內(nèi)容


這時候,為了優(yōu)化交互行為,有一天決定把這個tab組件從不可橫向劃動改成可以劃動的(并且告訴用戶這里可以滑動了喲~),然后給你一次機會重新排列這五個tab順序,你會怎么做呢?最簡單的辦法當(dāng)然是把五個tab按照用戶消費意愿逐一排列,即:“推薦、游戲、美女、生活、段子”。

這樣排列當(dāng)然沒有任何問題,但是還有沒有更優(yōu)解呢?我給出的解決辦法是這樣的,大家評判一下:

按照用戶的消費量,“游戲”是消費量第二的一個tab,毫無疑問我會把它排在第二項,這樣可以刺激用戶劃動行為,然后“美女”是消費量第三的,我會把他放在第四位,這時候我會把“段子”和“生活”這兩個消費率最低的tab分AB test做兩個版本放在第三和第五位拿去測,以判斷之前的“段子”和“生活”是由于自身內(nèi)容不夠優(yōu)質(zhì),還是之前交互成本太低導(dǎo)致的數(shù)據(jù)較差:



最后我們來看第四個例子:


比如一個app,他的UI張如下圖所示的這個樣子


現(xiàn)在假設(shè)在運營和市場團(tuán)隊不做任何努力的情況下,單從產(chǎn)品交互的角度,能不能優(yōu)化上面這個版塊的點擊率?

首先我們來分析一下頁面架構(gòu):

如果我們認(rèn)為,不管是點擊右上角的“>”,還是點擊留個圓形入口都算完成轉(zhuǎn)化的話,我們現(xiàn)在的這個紅色的UI組件,入口位置一共有7個。根據(jù)長尾理論,如果我們把這個圓形入口從6個擴展到比如九個,是不是一定對轉(zhuǎn)化率有正向影響?答案并不一定:

為什么呢?因為主要是這樣的改動會帶來一個未知的泳道橫劃交互,它會產(chǎn)生一定的影響,如下圖所示:

用戶看到這個泳道之后可能出現(xiàn)三種行為:

a.“用戶完全不滑動”——那入口就從7個變成了7.5個,別的沒有變量影響。

b.“用戶滑動看完了之后,點擊某一個或者左上角的“>”進(jìn)入”——這是我們想要的轉(zhuǎn)化

c.“用戶滑動看了這些圓形入口之后松手,就是不點擊進(jìn)去”——這是我們不愿意看到的結(jié)果

想到這里,那為什么我們不能讓用戶直接滑動之后松手就跳轉(zhuǎn)呢?


想到這里,所以優(yōu)化方案如下圖所示,給與用戶一個x軸區(qū)間,滑動手勢操過那個區(qū)間則告訴用戶你現(xiàn)在松手默認(rèn)跳轉(zhuǎn),用戶不愿意跳轉(zhuǎn)也可以回劃,只要不足這個x區(qū)間就給與用戶自主選擇的機會:


我之前在上家工作的時候,我們把6個圓形入口變成了10個,然后用這個“松手跳轉(zhuǎn)”的交互把單元模塊的穿透率從21%提升到了31%,這是一個實戰(zhàn)當(dāng)中的真實例子。


當(dāng)然了,請大家再思考這樣的一個問題:


一個頁面的流量就這么大,一個地方漲了11%,那勢必別的地方就會相應(yīng)的損失11%。一般情況下app首頁承擔(dān)著80%以上的分流工作,根據(jù)流量漏斗來看的話每一次引流都會導(dǎo)致其他模塊的數(shù)據(jù)下降,所以設(shè)計師們應(yīng)該要根據(jù)運營策略和公司大的產(chǎn)品OKR來合理選用合適的交互組件,以達(dá)到想要的目的,還是那句話:“小孩兒才分對錯,大人只看利弊?!?




Part - III 從交互的維度量化用戶體驗

移動互聯(lián)網(wǎng)產(chǎn)品設(shè)計中,尤其是在中國的app產(chǎn)品,有兩大分歧陣營:

“扁平”陣營表示了,我們需要產(chǎn)品足夠扁平,最好就是三次交互可以觸達(dá)所有app界面:

“簡潔”陣營也表示了,我們需要頁面信息足夠簡潔,最好一個頁面只完成一個核心任務(wù):



雙發(fā)你來我往,誰也說服不了誰,如下圖所示,“簡潔”陣營反駁“扁平”陣營說:你們一點都不遵守席客定律,層級扁平是扁平了,但是相應(yīng)的頁面信息變得越來越多,給用戶呈現(xiàn)的干擾就越來越多,用戶做出決定的時間也越來越多,所以你們“扁平黨”都是辣雞。這時候“扁平”陣營也找到了反駁的論點,他們說你看你頁面足夠簡潔了,但是頁面層級就很深啊,交互成本這么高,每一次都伴隨流失,可用性這么差,你們還有理了?所以“簡潔黨”你們才是辣雞!


中國的互聯(lián)網(wǎng)產(chǎn)品,很難做到既簡潔又扁平,這個問題的根源在于永遠(yuǎn)有那么多信息需要呈現(xiàn),永遠(yuǎn)有那么多功能需要添加,這個是中國的激烈市場競爭導(dǎo)致的,并不是說中國的產(chǎn)品就不如國外的好(我的哥哥之前在Facebook現(xiàn)在Airbnb工作,他經(jīng)常感嘆道國外的互聯(lián)網(wǎng)產(chǎn)品到中國來真的都得死...)我想要討論的是,面對中國現(xiàn)在互聯(lián)網(wǎng)產(chǎn)品市場現(xiàn)狀, 如果一款產(chǎn)品非要你站隊上面兩派陣營,你會選哪一派?我現(xiàn)在的選擇是“扁平黨”,因為用戶面臨一款眼花繚亂的app,如果是經(jīng)常使用,缺功能布局信息架構(gòu)很少改動的前提下,早晚也會習(xí)慣和適應(yīng)的,但是如果一些核心的東西不能第一時間暴露在用戶眼中,很有可能用戶就不知道你有這種功能。這個就是為什么我們設(shè)計經(jīng)常會說這個產(chǎn)品經(jīng)理傻逼吧,怎么什么東西都想展現(xiàn)出來,這一堆東西找個入口集合收起來頁面多干凈多清爽多好看呀~~我早年間也是和諸位一樣的觀點,但是現(xiàn)在我越來越覺得,界面清爽了,你的大功能feature因為設(shè)計隱藏沒有被發(fā)現(xiàn),不是設(shè)計開發(fā)測試都白做了么,說好的ROI在哪里?


我們大家都是互聯(lián)網(wǎng)從業(yè)者,不管看到這篇文章的你是一位設(shè)計、產(chǎn)品、還是開發(fā)、測試、運營人員,我們都明白用戶體驗這個詞是由N多維度綜合而成的一個過程性評價,它和方方面面都有關(guān)系。



那既然是這么專業(yè)且牽連甚廣的一個名詞,我們真的就沒有辦法去量化評價它了嗎?

永遠(yuǎn)不要忘記,用戶體驗是個過程,而我們每個人也都是用戶本身。在這里我提供一種普通用戶維度的比較好用的用戶體驗評估方法是“窮舉分析用戶行為路徑”。


比如你是一款外賣產(chǎn)品的設(shè)計師,那么用戶在不同產(chǎn)品模塊下定一個外賣的流程路徑大概有多少種,都窮舉出來。比如你是一款在線演唱類的產(chǎn)品設(shè)計師,那么用戶在產(chǎn)品中完成一首歌需要的用戶路徑到底有多少條,窮舉所有路徑之后一一優(yōu)化,讓路徑變得更加扁平,或許是一個最“笨”但是有效的方案,怎么優(yōu)化呢?用淘寶消息頁舉個例子:


淘寶消息頁上面有“交易物流”、“通知”、“互動”三個tab,這時候我們假設(shè)一個用戶三個按鈕下面都有消息,用戶想要看完這三個消息大概需要幾次交互?答案是至少6次:“點擊第一個進(jìn)去 - 返回 - 點擊第二個進(jìn)去 - 返回 - 點擊第三個進(jìn)去 - 返回”,這樣的交互顯得呆板且冗長,淘寶團(tuán)隊巧妙的把三個內(nèi)頁集合成一個頁面的三個tab形式,大大縮短的交互成本,這就是所謂的“把用戶路徑變得更扁平”:


大家在使用很多產(chǎn)品的過程中,多多留心就會發(fā)現(xiàn)原來細(xì)節(jié)里面總有魔鬼。


文章來源:站酷   作者:Seany

分享此文一切功德,皆悉回向給文章原作者及眾讀者.


免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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


用戶體驗度量模型

周周

本文介紹了幾個關(guān)于用戶體驗度量的模型,UES模型、適合網(wǎng)站的 PLUSE、谷歌的 HEART、螞蟻的 PTECH和GSM模型,它們各有切入點,也各有其適應(yīng)場景。對各個模型的概念和它們相應(yīng)的維度做了詳細(xì)的介紹。

你好,我是《用戶體驗四維度》

ui設(shè)計分享達(dá)人

你好,我是《用戶體驗四維度》,一本關(guān)于用戶體驗的新書,今天正式上市了。


具體內(nèi)容方面,我選擇了聚焦于“人”——主要探討了人與界面、人與內(nèi)容、人與人和人與品牌的交互體驗——大部分話題既有宏觀上的綱領(lǐng),也有微觀上的實現(xiàn)細(xì)節(jié)。這四類交互體驗,下文的提及會使用簡稱,所以先看下簡稱及對應(yīng)的全稱。

 

HI X:Human Interface Experience,人與界面的交互體驗;

HC X:Human Content Experience,人與內(nèi)容的交互體驗;

HH X:Human Human Experience,人與人的交互體驗;

HB X:Human Brand Experience,人與品牌的交互體驗。



下面把時間交給作者李瀟,由他來做一些分享。

 

你好,我是作者李瀟。我主要分享兩點,第一點是這本書的來龍去脈,第二點是這本書的主要特點。

 

 

01 《用戶體驗四維度》的緣起

 

2019 年 7 月 15 日,我在個人公眾號上發(fā)表了第一篇設(shè)計類文章《淺談 Keep 的 UI 設(shè)計》,轉(zhuǎn)到朋友圈后有很多人點贊,也有朋友說寫得不錯,轉(zhuǎn)到站酷后也有很多設(shè)計師留言稱贊。算是一個還行的開頭,這給了我信心。

 

之所以會寫公眾號,是因為當(dāng)時我成立了一個個人的設(shè)計工作室,希望借公眾號的文章引來一些客流。之所以第一篇文章會寫 Keep,一方面是因為 Keep 比較知名,另一方面是因為我比較喜歡 Keep,也是 Keep 比較忠實的用戶。

 

當(dāng)時的計劃就是挑一些個人比較喜歡的、具有一定知名度的產(chǎn)品來寫,每款產(chǎn)品至少寫兩篇文章,一篇寫 UI 設(shè)計,一篇寫交互設(shè)計,或許還可以就產(chǎn)品功能再寫一篇。因為我分別從事過產(chǎn)品經(jīng)理和 UI 設(shè)計的工作,同時也兼任過交互設(shè)計的工作,有這些方面的經(jīng)驗。

 

按照計劃,第二篇文章很自然地就是關(guān)于 Keep 的交互設(shè)計,不過名字是《淺談 Keep 的用戶體驗》。因為所寫內(nèi)容已經(jīng)超出了“交互設(shè)計”的范疇,而“用戶體驗”恰好是一個更合適的主題。這篇文章的反響依然還行。另外,有趣的是,根據(jù)使用感受,我發(fā)現(xiàn) Keep 這個擁有課程和社區(qū)的運動品牌,它的用戶體驗可以用四個維度來描述,它們分別是:人與界面、人與內(nèi)容(課程)、人與人(社區(qū))、人與品牌。沒錯,這就是本書最原始的雛形了。

 

再加上也有讀者朋友反饋說“用戶體驗的四維度”挺不錯,有啟發(fā)。于是第三篇文章就“拐彎”了——沒寫 Keep 的產(chǎn)品功能,也沒寫其他產(chǎn)品,而是把“用戶體驗的四維度”單獨寫成了一篇文章:《淺談用戶體驗的 4 個維度》。

 

某種程度上,第三篇文章的反響好過前兩篇,因為當(dāng)時有 3 個業(yè)內(nèi)比較知名的公眾號(分別是 MicroUX、應(yīng)謀鬼計、UXPA,在此向他們致以謝意)轉(zhuǎn)載了這篇文章,且有一名立志成為產(chǎn)品經(jīng)理的大學(xué)生根據(jù)這篇文章的觀點寫了一篇分析 QQ 和微信用戶體驗的文章:《從微信與 QQ 的交互比較中談用戶體驗》。另外,當(dāng)時在跟一些朋友聊起我寫公眾號的近況時,有兩位設(shè)計師朋友都提了句“可以寫書/出書”。

 

不知說者是否有意,但是聽者有心,朋友的話更加堅定了我內(nèi)心逐漸萌發(fā)的寫書的想法。第三篇文章之后,我就開始認(rèn)真考慮寫書這件事了:首先,“用戶體驗的四維度”這個概念比較新,或許可以作為書的框架;其次,個人對用戶體驗非常感興趣,也就是對這個潛在的書的框架非常感興趣;第三,發(fā)在網(wǎng)上的文章,包括“用戶體驗的四維度”這個概念,反響都還行;第四,公眾號我是全職在寫,為了質(zhì)量寫得很慢(平均兩周一篇 4000 多字的文章),時間成本已然很高,還不如再增加點時間成本來寫書。

 

所以,是不是真的可以把“用戶體驗的四維度”寫成一本書?

 

試試才知道。于是,在參考很多書的大綱以后,2019 年 8 月下旬,我就為“用戶體驗的四維度”列好了一個初步的大綱。

 

之后發(fā)在網(wǎng)上的所有文章,也就是從第四篇開始,就是按照這個大綱來寫的。也就是說,我是先把書稿寫成了網(wǎng)文,這種網(wǎng)文的更新一直持續(xù)到第 2 章 HI X(人與界面的交互體驗)的尾聲,隨后斷更。因為那時已和出版社簽好合同了,按照約定,書里的內(nèi)容不再發(fā)到網(wǎng)上。對于那些曾在網(wǎng)上追過我文章的讀者朋友,在此我要說聲抱歉,請見諒。

 

順便說下書稿和網(wǎng)文的主要區(qū)別。歷經(jīng)編輯的指導(dǎo)與建議、作者的反復(fù)修改、審校流程的打磨,與網(wǎng)文相比:

一,書稿的邏輯與結(jié)構(gòu)更加嚴(yán)謹(jǐn)、合理,內(nèi)容和語言也比網(wǎng)文精簡;

二,書稿更加體系化,相互之間(如 HI X 部分的根需求、功能架構(gòu)和信息架構(gòu))盡可能做到了“環(huán)環(huán)相扣”,章節(jié)之間的起承轉(zhuǎn)合也更加連貫、自然;

三,書稿在內(nèi)容層面進(jìn)行了一定程度的修改和優(yōu)化,個別章節(jié)(第 1 章的四維度,第 2 章的根需求、功能架構(gòu)等)則是進(jìn)行了極大程度的修改和優(yōu)化。

四,書稿在產(chǎn)品案例和生活案例方面也進(jìn)行了一定程度的調(diào)優(yōu)。

 

以上就是這本書的一個簡單緣由,接下來分享下它的主要特點。

 

 

02 《用戶體驗四維度》的特點

 

這本書主要有四個特點,它們分別是:追求深度、追求卓越、展望未來、兼顧大小。當(dāng)然,我也很期待你去發(fā)現(xiàn)這本書的其他特點,包括它的缺點。



1 追求深度
 
無論是宏觀上的大綱(用戶體驗四維度),還是微觀上的具體內(nèi)容(根需求、功能架構(gòu)、UI 設(shè)計、HH X 等),本書都著力于深挖本質(zhì)。
 
先以根需求為例。在日常工作中,“需求”是一個高頻詞匯:大到上線一個大功能,小到改一下字體顏色,都被我們稱之為“需求”。面對大大小小、林林總總的“需求”,是不是有必要關(guān)注下根需求(本質(zhì)需求)?因為根需求是一切需求的根本。如果根需求有問題,往往意味著用戶的根需求沒有完全得到滿足,那由此衍生出來的一系列大小需求都會有問題;如果根需求有問題,就意味著這個行業(yè)的類似產(chǎn)品,依然有機會,直到用戶的根需求完全得到滿足為止。所以本書就以幾乎人人都會用的資訊產(chǎn)品為例,比較深入地探討了兩類用戶(生產(chǎn)型用戶和消費型用戶)的根需求。
 
再以 UI 設(shè)計為例。關(guān)于 UI 設(shè)計,最近幾年出現(xiàn)了一些“商業(yè)化設(shè)計”“增長設(shè)計”的概念,也就是說,UI 設(shè)計的肩膀上多了“增長”“商業(yè)化”這些擔(dān)子。這不禁使人擔(dān)心,未來會不會有新的擔(dān)子,繼續(xù)加在 UI 設(shè)計的肩膀上?另外,術(shù)業(yè)有專攻,職能亦有分工,這些擔(dān)子,UI 設(shè)計擔(dān)負(fù)得起嗎?我認(rèn)為未必?fù)?dān)負(fù)得起。就像于動物的生命而言,心肝肺各有分工、各有貢獻(xiàn),總不能讓心臟負(fù)責(zé)呼吸、肝臟負(fù)責(zé)跳動、肺負(fù)責(zé)造血。于心肝肺而言,做好分內(nèi)的事情就是最大的擔(dān)當(dāng)與貢獻(xiàn);于 UI 設(shè)計、交互設(shè)計、信息架構(gòu)、產(chǎn)品功能等而言,情況亦然。那 UI 設(shè)計的分內(nèi)事是什么?是它的本質(zhì),這便是本書關(guān)于 UI 設(shè)計的探討視角。
 
2 追求卓越
 
在本書中,有些話題有嘗試深挖本質(zhì),有些話題沒有。不管有沒有深挖本質(zhì),最終目的都是落腳于“如何做到更好”,也就是追求卓越。
 
以交互設(shè)計為例,在規(guī)劃它的大綱時,我嘗試過不同的切入點:大的設(shè)計原則(iOS Human Interface Guidelines, 尼爾森十大交互原則等)、小的交互細(xì)節(jié)(微交互)、設(shè)計哲學(xué)(3-4 個要點)、設(shè)計目的(人人喜愛)。仔細(xì)斟酌之后,我發(fā)現(xiàn)要想實現(xiàn)“人人喜愛”這個設(shè)計目的,“設(shè)計哲學(xué)”這個方法的可能性是最大的,而且設(shè)計哲學(xué)本身是足夠“海納百川”足夠“獨立成章”的,所以最終果斷摒棄了其他切入點,而只保留了“設(shè)計哲學(xué)”這個切入點。具體而言,這個設(shè)計哲學(xué)就是:周到,品質(zhì),驚喜,善意。想象一下,一個為人周到、能力(品質(zhì))卓越、時不時會給身邊人帶來驚喜、同時又很善良的人,自然會受到身邊人的喜愛。類似的交互設(shè)計,同樣會受到用戶的喜愛。

3 展望未來
 
內(nèi)容“扎根生活”是本書的追求之一。但是當(dāng)探討到目前面臨困境并存在諸多不足的話題時——比如 UGC 產(chǎn)品(HC X 部分)——本書則會更多地展望一下未來。
 
UGC 產(chǎn)品面臨什么困境,存在什么不足?
 
以文章類 UGC 產(chǎn)品為例:各行各業(yè)的從業(yè)者——比如教師和律師——都有自我充電(如看到本行業(yè)高品質(zhì)的深度文章)的需求,這個需求基本上能在公眾號里得到滿足;但是,不管一篇深度文章的品質(zhì)有多高,公眾號這個包含各類信息的平臺,都是像黑洞一樣將其“吞噬”和“湮沒”,而不是像書店、圖書館一樣將其“陳列”和“流傳”下去。再以極其熱門的短視頻類 UGC 產(chǎn)品為例:得益于簡單易用等諸多優(yōu)勢,短視頻類 UGC 產(chǎn)品在“信息和知識的大眾普惠”(尤其是針對老年人)上做出了重要貢獻(xiàn);但是,短視頻類 UGC 產(chǎn)品也存在一定不足,比如容易使人上癮、沉迷,比如上面的信息和知識一定程度上缺乏質(zhì)量保障。
 
未來更好,或更受歡迎和尊重的 UGC 產(chǎn)品,會是什么樣子?
 
個人觀點,首先是簡單清晰的分類,也即 UGC 產(chǎn)品需要分成知識型 UGC 和信息型 UGC,前者以知識為主,后者會包含前者。實際上這個分類目前是存在的,比如站酷、人人都是產(chǎn)品經(jīng)理、CSDN 等社區(qū)就屬于知識型 UGC,公眾號、B 站、抖音等平臺則屬于信息型 UGC。
 
篇幅所限,這里僅說下信息型 UGC。以短視頻類的信息型 UGC 產(chǎn)品為例,雖然大熱,但也飽受爭議,甚至飽受詬病。什么樣的信息型 UGC,在廣受歡迎的同時還受人尊重,甚至受人喜愛?據(jù)個人觀察,有兩大類。一類是像公眾號這樣足夠多元的“真實世界”,另一類是像 B 站、Instagram 這樣在某些方面比較美好的“理想世界”?!罢鎸嵤澜纭焙汀袄硐胧澜纭?,值得所有信息型 UGC 來學(xué)習(xí)。

關(guān)于信息型 UGC,怎么建立更多“真實世界”和“理想世界”?關(guān)于知識型 UGC,未來更好的產(chǎn)品會是什么樣子?這些問題,本書都嘗試進(jìn)行了探討,以供參考。

4 兼顧大小
 
用戶體驗的四個維度,交互設(shè)計的設(shè)計哲學(xué),知識型 UGC 和信息型 UGC,都是比較宏觀的大話題。本書不光有這些大話題,還有與之對應(yīng)的關(guān)乎“怎么實現(xiàn)”的小細(xì)節(jié)。
 
還以交互設(shè)計為例,周到的、高品質(zhì)的、給人驚喜的、帶有善意的交互設(shè)計會受人喜愛,那交互設(shè)計如何做到周到、品質(zhì)、驚喜和善意呢?自然而然地,本書就這四個問題進(jìn)行了比較深入的探討。以“驚喜”為例,本書先是將交互設(shè)計的“驚喜”分為“小驚喜”和“大驚喜”,簡單給出了定義和示例,然后又就“如何做到驚喜”分別給出了針對短期(可以立馬實現(xiàn),更適合“小驚喜”)和長期(需要長期積累,更適合“大驚喜”)的建議。
 
于 UI 設(shè)計、信息架構(gòu)、功能架構(gòu)、HH X 等話題而言,也是同樣的或類似的寫作手法。


分享完主要特點,接下來請允許我簡單介紹下這本書適合哪些讀者,供你參考。
 
5 適宜人群
 
得益于以上幾個主要特點,再加上本書涉及的話題既有屬于基礎(chǔ)的根需求、功能架構(gòu)、信息架構(gòu)、交互設(shè)計、UI 設(shè)計,也有更進(jìn)一步的 HC X(人與內(nèi)容的交互體驗)、HH X(人與人的交互體驗)和 HB X(人與品牌的交互體驗),個人觀點:
 
本書既適合一線從業(yè)者(產(chǎn)品經(jīng)理、交互設(shè)計師、UI 設(shè)計師等),也適合相關(guān)從業(yè)者(技術(shù)人員、運營人員、市場人員等);
既適合創(chuàng)業(yè)者(“根需求”“功能架構(gòu)”以及“知識型 UGC”“信息型 UGC”等部分或許會使你發(fā)現(xiàn)更多新的機會),也適合學(xué)生。
 
希望你能在書中找到自己需要的、或自己感興趣的內(nèi)容。
 
以上就是我的分享,接下來把時間交給《用戶體驗四維度》。
 
 
結(jié)語
 
好的,謝謝作者李瀟的分享,讓我意識到我的出生似乎是個意外;也謝謝李瀟把我夸得這么好,但我還是要補充一句,他的夸獎僅供參考,一切以自己的切身感受為準(zhǔn)。
 
用戶即人,談用戶體驗,自然離不開對人的關(guān)注。人作為高級動物,自然有其強大和理智的一面;人作為動物本身——置身于高速發(fā)展的現(xiàn)代社會,置身于“亂花業(yè)已迷人眼”的智能化信息社會,置身于既相互溫暖也相互競爭甚至還相互“傷害”的同類中——也有其脆弱和感性的一面。正如李宇春在《軟肋》里唱的那樣: 


是最堅強的人,是最脆弱的人   
是最理智的人,是最敏感的人   
固若金湯的人,語無倫次的人   
不過,血肉之身   


 
同樣作為人的互聯(lián)網(wǎng)從業(yè)者,在打造自家產(chǎn)品時,在兼顧商業(yè)化的同時,有沒有可能以更美好的方式去對待這一個個用戶,一個個血肉之身?
 
我想這是一些產(chǎn)品正在面臨的問題,也是所有產(chǎn)品都難以回避的問題(用戶利益和企業(yè)利益難免會發(fā)生矛盾)?;ヂ?lián)網(wǎng)行業(yè)在中國的蓬勃發(fā)展,不過二三十年的歷史,所以相信這也是一個布滿荊棘、充滿希望的問題?!队脩趔w驗四維度》從根本上探討的,也正是這個問題。希望我的探討,能為你帶來一點參考或啟發(fā)。
 
最后,謝謝你的時間。


- -  The End - -


實拍圖:

undefined

文章來源:站酷      作者:SonwDesign

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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



設(shè)計師眼中的用戶體驗

ui設(shè)計分享達(dá)人

用戶體驗

首先,我們先來了解什么是用戶體驗

從字面上來說,用戶體驗就是用戶在使用產(chǎn)品過程中對產(chǎn)品的直觀感受以及評價

這種感受非常的主觀,但又很容易影響別人對產(chǎn)品的判斷。這就是為什么某寶商家一直求好評,而某團(tuán)騎手會為了好評跟用戶“大動干戈”的原因了


名詞解釋

  • UI——User Interface,本意是“?戶界面”,但現(xiàn)在這個詞已經(jīng)被擬人化了,即把那些做用戶界面的設(shè)計師們叫做UI

  • UE——User Experience,本意是“?戶體驗”,現(xiàn)在也變成了一個職業(yè)名詞,是指那些做用戶調(diào)研的研究員,比如用戶畫像、產(chǎn)品分析、競品分析等。有些公司把“交互設(shè)計師”也叫做UE,嚴(yán)格來說UE和交互是兩個職位,不過現(xiàn)在很多UE除了做用戶調(diào)研也會畫交互原型,所以混在一起也不奇怪了

  • IxD——InteractionDesigner,本意為“交互設(shè)計”,也就是交互設(shè)計師,現(xiàn)在也常常用UX(User Experience)來表示交互設(shè)計,用來跟UI進(jìn)行區(qū)分。簡單來說就是幫產(chǎn)品畫原型的,實際上這個職位非常的關(guān)鍵,產(chǎn)品希望表達(dá)的邏輯,各個界面的跳轉(zhuǎn)與關(guān)聯(lián)關(guān)系,以及產(chǎn)品的可用性與易用性,都體現(xiàn)在交互上

  • UED——User Experience Design,本意為“?戶體驗設(shè)計”,現(xiàn)在常常表示用戶體驗設(shè)計團(tuán)隊,基本上大一點的互聯(lián)網(wǎng)公司都有自己的UED團(tuán)隊,甚至大的部門都有自己的UED團(tuán)隊


UED工作領(lǐng)域

UED團(tuán)隊要做的事情可多了,通常來來說主要坐下面的事情: 

  • 用戶研究

  • 產(chǎn)品分析

  • 交互設(shè)計

  • 產(chǎn)品設(shè)計

  • 視覺設(shè)計

  • 品牌設(shè)計

  • 插畫設(shè)計

簡而言之,UED是以用戶需求為目標(biāo)而進(jìn)行的設(shè)計的團(tuán)隊,通過團(tuán)隊的經(jīng)驗與設(shè)計能力給出設(shè)計方案,是幫助公司進(jìn)行產(chǎn)品策劃的主力之一


用戶體驗五要素

說到用戶體驗,就不得不提用戶體驗五要素了

現(xiàn)在我們所談?wù)摰挠脩趔w驗的概念,其實最早出自一本叫《用戶體驗要素》的一本書

《用戶體驗要素》--作者Jesse James Garrett,是美國用戶體驗咨詢公司Adaptive Path的創(chuàng)始人之一


這本書出的其實比較早,英文版在2001年就出了,國內(nèi)常見的是2010年出版的中文版第2版,書里的概念在互聯(lián)網(wǎng)設(shè)計界廣為流傳,非常值得閱讀


當(dāng)設(shè)計師在設(shè)計或重構(gòu)產(chǎn)品,卻不知從何開始時,這時我們可以參考用戶體驗五要素


用戶體驗五要素是一種產(chǎn)品分析與設(shè)計的方法論,他向教科書一樣指導(dǎo)我們從0到1設(shè)計一款產(chǎn)品。同時它涵蓋了一個產(chǎn)品從想法到落地的整個流程,這正是我們學(xué)習(xí)它的重要原因

用戶體驗五要素由戰(zhàn)略層、范圍層、結(jié)構(gòu)層、交互層、表現(xiàn)層等5個層級構(gòu)成,由下而上像個金字塔的結(jié)構(gòu)一樣,戰(zhàn)略層則是底部最堅定的根基,產(chǎn)品的起源也源自該層


1.戰(zhàn)略層

這是五要素的最底層,一般是公司負(fù)責(zé)人與產(chǎn)品總監(jiān)、市場總監(jiān)等高層之間的討論范圍層。這一層主要是確定產(chǎn)品目標(biāo)以及用戶需求。比如:

  • 公司要做什么

  • 面向什么樣的用戶

  • 什么樣的解決方案

  • 公司的產(chǎn)品特色是什么

  • 競爭對手有什么

  • 將來的收益怎么樣

 

值得一提的是用戶畫像需要在這一層定義出來。我們可以招募一些用戶進(jìn)行訪談,然后為用戶分組,并結(jié)合用戶的需求確定我們的產(chǎn)品目標(biāo)

2.范圍層

戰(zhàn)略決定范圍,這一層主要針對戰(zhàn)略層的需求進(jìn)行更細(xì)致的分析,定義需求是什么,提出解決方案,同時要定要好需求的優(yōu)先級

3.結(jié)構(gòu)層

根據(jù)前兩層思考產(chǎn)品的信息架構(gòu),規(guī)劃任務(wù)流程,簡單來說這一層主要是產(chǎn)品PRD的輸出

4.框架層

頁面的具體功能擺放,信息布局,這一層主要是交互設(shè)計,輸出低保真原型

5.表現(xiàn)層

頁面最終給用戶呈現(xiàn)的視覺效果,這一層主要是視覺設(shè)計,輸出高保真視覺稿

模擬案例

作為設(shè)計師的你,接到了一個餅干公司的設(shè)計需求,公司希望你能幫他完成從產(chǎn)品到包裝一系列的設(shè)計,你該怎么去做呢?

我們用用戶體驗五要素來整理設(shè)計思路:

-戰(zhàn)略層

  • 先了解這家公司的產(chǎn)品需求和用戶需求

  • 產(chǎn)品需求:公司是個小型食品加工廠,主營是面包和餅干,有實體店也有網(wǎng)店,今年準(zhǔn)備在圣誕節(jié)推出一款圣誕餅干

  • 用戶需求:用戶畫像是20-35歲的女性,喜歡看劇,喜歡網(wǎng)購,對可愛的東西沒有抵抗力。今年上映的一部電影叫《餅干俠》(虛擬)票房火爆,用戶都想買到劇中同款的餅干

  • 公司目標(biāo):希望圣誕前后一個月內(nèi)盈利50w

-范圍層

  • 分析需求:公司是做一款圣誕餅干,了解到《餅干俠》的原型是出自美國卡芙食品的一款餅干,并把它確定為競品并展開分析

  • 設(shè)計方案:列出一系列設(shè)計清單,包括品牌logo重新設(shè)計,食品包裝、網(wǎng)店圣誕裝飾、廣告宣傳圖等,給這些設(shè)計需求確定好優(yōu)先級

-結(jié)構(gòu)層

  • 信息架構(gòu):進(jìn)一步細(xì)化已列出的設(shè)計方案,輸出文檔或者設(shè)計規(guī)范,比如《品牌手冊》《食品包裝標(biāo)準(zhǔn)》等

  • 交互流程:進(jìn)一步的用戶畫像與分析,收集市場同類型品牌調(diào)性,通過試用的方式整理出餅干的分類屬性,如口味、分量、包裝材質(zhì)等

-框架層

  • 從這里可以開始整體的、低保真的設(shè)計了,可以出一些比較具體的設(shè)計方案,目的是快速跟需求方進(jìn)行評審,為后續(xù)的視覺設(shè)計作準(zhǔn)備

-表現(xiàn)層

  • 經(jīng)過前面反復(fù)的溝通與評審,開始高保真的視覺設(shè)計,從產(chǎn)品包裝到廣告圖到物料,這里就是設(shè)計師們展示商品顏值,提升其商業(yè)價值的時刻到了

  • 最終產(chǎn)品上市



文章來源:站酷      作者:Pison西歌
分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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


量化用戶研究:可用性測試

seo達(dá)人


WHAT? 什么是用戶研究?

用戶研究聽起來是個非常大的學(xué)科和話題,沒有具象的描述和切實的研究方法就顯得虛無縹緲,讓人有種霧里看花的感覺。用戶研究和用戶體驗一樣,在國外市場得到驗證、認(rèn)可并被不同行業(yè)的企業(yè)所接受,而國內(nèi)市場處于萌芽階段,只有部分行業(yè)的頭部企業(yè)對其有較為清晰的認(rèn)知和應(yīng)用。

那么怎么定義用戶研究?首先,用戶研究的目的是了解用戶,對用戶有更清晰、具象的畫像,是一系列研究方法的概括型的名稱。聚焦互聯(lián)網(wǎng)行業(yè),什么崗位的同學(xué)最需要關(guān)注和學(xué)習(xí)用戶研究方法?與用戶、數(shù)據(jù)打交道的崗位需要對相關(guān)用研方法和分析方法有不同程度了解和應(yīng)用能力,例如,用戶研究員、市場研究員、數(shù)據(jù)分析師、產(chǎn)品經(jīng)理、體驗設(shè)計師、交互設(shè)計師等等。作為體驗設(shè)計師或交互設(shè)計師,可以通過研究方法對用戶目標(biāo)、需求和能力的系統(tǒng)研究,用于指導(dǎo)設(shè)計、產(chǎn)品結(jié)構(gòu)或者工具的優(yōu)化,提升用戶工作和生活體驗。

圖片

 

HOW? 怎么做用戶研究?

研究中包含的用研方法有很多,可以根據(jù)實際場景和資源選擇適合的方法,目前常用的實用性、可操作性比較強的四大方法:可用性測試、網(wǎng)站訪客(埋點數(shù)據(jù))、用戶調(diào)查、A/B Test。在設(shè)計過程中的每個階段,用戶研究是都需要做的工作,但很多時候由于工期較短,deadline在前,設(shè)計師在產(chǎn)品設(shè)計初期沒有辦法做到較為完善的用戶研究,那么這部分工作就會被延后,在驗證階段研究任務(wù)就會變得比較重,后期的優(yōu)化對此依賴性也比較強。可用性測試是設(shè)計師在驗證階段相對比較能貼近用戶的用研方式,在測試過程中通過觀察用戶行為,從即時的反饋中更容易獲得貼近真實的定性數(shù)據(jù),用對話溝通的方式深度挖掘用戶遇到的問題,從而鎖定優(yōu)化重點。

圖片

 

1、了解可用性測試

1.1 可用性測試的優(yōu)勢

可用性測試是確定用戶是否完成目標(biāo)的核心方式,它與其他用戶研究方法有許多相同的測試指標(biāo),并且能夠得出較多可用的定性數(shù)據(jù),可以收集的數(shù)據(jù)類型也比較多,例如,完成率、出錯數(shù)、任務(wù)時間、任務(wù)水平的滿意度、測試水平的滿意度、尋求幫助的次數(shù)和可用性問題清單,這些數(shù)據(jù)極大的便利了后續(xù)的分析工作,幫助多維度的判斷產(chǎn)品的狀態(tài)、用戶的滿意度、體驗問題等等。

 

1.2 可用性測試的類型

可用性測試可以分為兩種測試類型:形成性測試(Formative Test)和總結(jié)性測試(Summative Test)

 

1.形成性測試:主要作用于查找與修復(fù)可用性問題,提供及時反饋便于改進(jìn),是設(shè)計師重點參與的測試類型

  • 通常以小樣本量的定性調(diào)查
  • 數(shù)據(jù)以問題描述和設(shè)計建議形成輸出
  • 采用頻率和嚴(yán)重性為指標(biāo)量化問題,追蹤那些用戶用到什么樣的問題,衡量完成任務(wù)時長,并判定他們是否成功的完成任務(wù)等

 

2.總結(jié)性測試:用指標(biāo)度量可用性,用來評估效果,其中又分為基準(zhǔn)測試和比較測試

圖片

 

1.3 可采集的數(shù)據(jù)

樣本量:通常大于30,當(dāng)數(shù)據(jù)量小于10可通過統(tǒng)計學(xué)方法計算得到有效統(tǒng)計分析結(jié)論

代表性:樣本能夠代表預(yù)期要描述的用戶群,若存在不同用戶群組中有重要差異因素的使用分層抽樣(Stratified Sampling)的方式

隨機性:考慮所有重要變量,設(shè)計理想樣本,合理合并用戶群組

測試數(shù)據(jù):現(xiàn)場/遠(yuǎn)程測試,觀察記錄用戶用戶行為,與用戶互動深入挖掘問題

完成率:即成功率,完成=1、失敗=0,完成率=完成任務(wù)用戶數(shù)/用戶總數(shù)

可用性問題:根據(jù)問題出現(xiàn)的頻率和影響程度評估嚴(yán)重性、優(yōu)先級

任務(wù)時間:任務(wù)完成時間、直到用戶失敗所用的時間、任務(wù)總時間

出錯數(shù):嘗試任務(wù)產(chǎn)生的無意識的出錯數(shù)量,診斷失敗原因,預(yù)判可能出現(xiàn)的場景

滿意度評分:使用標(biāo)準(zhǔn)化可用性問卷,回收數(shù)據(jù)計算得出

復(fù)合分?jǐn)?shù):復(fù)合型總結(jié)可為用戶體驗提供更好的總體描述

 

2、可用性測試問卷

經(jīng)過長期的研究和市場驗證,目前已沉淀出很多標(biāo)準(zhǔn)化的可用性問卷,不同的問卷的評估針對性不一樣,可以滿足大部分用研需求。使用標(biāo)準(zhǔn)化的問卷是因為這些問卷是經(jīng)過大量的使用后驗證校準(zhǔn)后產(chǎn)生的,是被認(rèn)可具有通識性的衡量標(biāo)準(zhǔn),這些問卷都具備客觀性、重復(fù)性、量化、經(jīng)濟(jì)、溝通、科學(xué)的普適性的優(yōu)質(zhì)屬性。

 

2.1 標(biāo)準(zhǔn)化的可用性測試問卷

問卷類型主要可以分為以下兩大類:

圖片

列表中的問卷大部分是需要繳納一定的費用后才能使用,但其中系統(tǒng)可用性整體評估問卷、軟件可用性問卷、場景后問卷是標(biāo)準(zhǔn)可用性問卷中可以免費使用的。應(yīng)用廣泛且被專家推薦的測試問卷是:軟件可用性問卷主要針對系統(tǒng)或功能進(jìn)行整體評估,問題設(shè)計精煉清晰,使用快捷方便;單項難易度問題追求的是心理測試的簡單和適用性,有5分和7分制,7分制的可靠性更高;主觀腦力負(fù)荷問題是在線測試,靈敏性更好。綜合評估下,軟件可用性問卷(Software Usability Scale,SUS)是設(shè)計日常中最合適最經(jīng)濟(jì)實用的測試問卷。

 

2.2 軟件可用性問卷(SUS)

軟件可用性問卷是可用性測試結(jié)束時的主觀性評估問卷,應(yīng)用廣泛,測試后該問卷使用占比約43%。整個問卷共10題,每題為5分制,奇數(shù)項為正面描述,偶數(shù)項為反面描述,可以通過修改問題文案聚焦測試范圍;如有需要可以將偶數(shù)項的問題調(diào)整為正面描述,但數(shù)據(jù)驗證調(diào)整為正面描述的問卷結(jié)果與包含負(fù)面描述的問卷差異不大,不影響問卷的測試結(jié)論。在完成測試任務(wù)后,用戶需快速完成各個題目,不進(jìn)行過多思考,若用戶因某些原因無法完成其中某個題目,則視為選擇中間值。

圖片

 

2.3 可用性、易用性抽取

問卷整體可以抽取部分題目作為子測量表來作為單獨的問卷有針對性的進(jìn)行可用性和易學(xué)性測量,可用性由問卷中1-3、5-9題構(gòu)成,易學(xué)性由問卷中4、10題構(gòu)成。研究表明使用子測量表對量表的可信度的減低可忽略不計(0.92  → 0.91),并且使用子測量表可減少答題時間。

 

2.4 分值計算

得分計算:范圍在0-4,每題進(jìn)行轉(zhuǎn)化分值;奇數(shù)題(正面):原始分減去1,(x-1);偶數(shù)題(負(fù)面):5減去原始分,(5-x)

  • SUS總分= 所有轉(zhuǎn)化過的分值相加 * 2.5, 多樣本算SUS總分均值
  • 可用性總分=所有轉(zhuǎn)化過的可用性分?jǐn)?shù)相加*3.125
  • 易用性總分=所有轉(zhuǎn)化過的易用性分?jǐn)?shù)相加*12.5

 

3、統(tǒng)計學(xué)描述方法

可用性測試因為耗費時間較長,能夠參與測試的用戶資源稀缺,回收樣本量小能夠收集到的樣本量一般會比較小。樣本量小的情況下這個樣本量所能概括的整體是范圍比較大的,會存在較大誤差,那么在較為嚴(yán)謹(jǐn)?shù)膱蟾嬷?,可能需要對所得分?jǐn)?shù)和除測試樣本外的分值預(yù)期進(jìn)行描述,這時候會涉及到統(tǒng)計學(xué)中常用的描述方式,即通過置信度及置信區(qū)間來描述,根據(jù)置信區(qū)間的下邊界看軟件是否低于行業(yè)標(biāo)準(zhǔn)。

 

3.1 相關(guān)概念

置信區(qū)間是指在一定概率下包含樣本位置總體參數(shù)的這部分?jǐn)?shù)值區(qū)間,通過計算置信區(qū)間來描述測試結(jié)果的概率。置信區(qū)間寬度和樣本量之間是一個逆平方根的關(guān)系, 樣本量越小,誤差越大,未知樣本數(shù)據(jù)可能所在的區(qū)間更大。

置信度就是說,你測得的均值,和總體真實情況的差距小于這個給定的值的概率,應(yīng)該是1-α;換句話描述,即我們有1-α的信心認(rèn)為,你測得的這個均值和總體的實際期望很接近了(測得的均值就是總體期望是很草率的,但是說,我有95%的把握認(rèn)為我測得的均值,非常接近總體的期望了)。研究員可以選擇0%-100%之間的任意數(shù)值的置信度,通常設(shè)為90%或95%(最常用)。

臨界值是在原假設(shè)下,檢驗統(tǒng)計量在分布圖上的點,這些點定義一組要求否定原假設(shè)的值。

圖片

 

3.2 置信區(qū)間計算

置信區(qū)間= (樣本平均值-誤差幅度)~(樣本平均值+誤差幅度)=(x -(x- μ))~(x +(x- μ))

  • x = 樣本平均值
  • 誤差幅度=臨界值*(樣本標(biāo)準(zhǔn)差/樣本量的平方根),即:(x – μ) = α* (s / sqrt(n))
  • α=臨界值(Excel函數(shù)=TINV(1-置信度,樣本量-1))
  • μ=被檢驗的基準(zhǔn)值(行業(yè)標(biāo)準(zhǔn))
  • s=樣本的標(biāo)準(zhǔn)差(Excel函數(shù)=STDEVP(N1,N2,..))
  • n=樣本量

tips:臨界值可以通過所設(shè)置信度和樣本量在t分布表中查找相應(yīng)的值

圖片

 

3.3 可用性測試策劃應(yīng)用

在做可用性測試前,需要進(jìn)行很多準(zhǔn)備,過程中也需要記錄很多相關(guān)的信息,初步嘗試的設(shè)計師可以參照以下步驟完成可用性測試的整個流程:

  • Step1: 確定調(diào)研目標(biāo)(目的、用戶、時間、環(huán)境)
  • Step2: 確定測試任務(wù)(任務(wù)內(nèi)容、測試方案、SUS問卷地址),任務(wù)內(nèi)容可以通過抽取用戶體驗地圖(User Journey Map)流程中的觸點設(shè)計,保證流程的完整性和任務(wù)的關(guān)聯(lián)性

圖片

  • Step3: 引導(dǎo)測試用戶完成可用性測試,過程中記錄測試時間、用戶遇到的問題、發(fā)生的頻率等等,記錄類型可以根據(jù)測試測中點進(jìn)行記錄

圖片

  • Step4:  用戶填寫SUS問卷,回收問卷分?jǐn)?shù)進(jìn)行計算,得出SUS分?jǐn)?shù)、可用性分?jǐn)?shù)、易用性分?jǐn)?shù)的均值作為本次測試的結(jié)論

圖片

圖片

  • Step5: 作為補充,可以計算SUS樣本分?jǐn)?shù)的置信區(qū)間,預(yù)期未被測到的目標(biāo)用戶對產(chǎn)品的評分可能落在的區(qū)間,區(qū)間下限可橫向?qū)Ρ?,看是否低于行業(yè)標(biāo)準(zhǔn)??梢悦枋鰹椤皹颖痉?jǐn)?shù)標(biāo)準(zhǔn)誤差約=5.34,置信區(qū)間為63.78~69.12;有95%的把握認(rèn)為測得的均值接近總體期望,未測樣本分值將落在63.78~69.12之間,符合行業(yè)標(biāo)準(zhǔn)預(yù)期”。
  • Step6: 通過測試過程中觀察用戶行為,探討用戶提出或下意識忽略的問題,并進(jìn)行問題的記錄和分類
  • Step7: 用戶訪談記錄問題進(jìn)行解析,對問題的嚴(yán)重程度進(jìn)行評級,選出問題較多的部分并提供可能的解決辦法進(jìn)行優(yōu)化

圖片

  • Step8: 根據(jù)以上結(jié)論對測試進(jìn)行總結(jié)性分析

 


 

原文鏈接:酷家樂用戶體驗設(shè)計(公眾號)

作者:藜漫

轉(zhuǎn)載請注明:學(xué)UI網(wǎng)》量化用戶研究:可用性測試

藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請掃碼藍(lán)小助,報下信息,藍(lán)小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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

UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司



設(shè)計師應(yīng)該關(guān)注的用戶體驗設(shè)計模式

ui設(shè)計分享達(dá)人

我們在周圍的世界中看到了許多熟悉的設(shè)計模式。例如,大多數(shù)道路用實線或條紋線分隔車道。還有交通燈和道路標(biāo)志可以幫助您在道路上行駛。如果每個國家/地區(qū)使用不同的系統(tǒng),司機將不得不為他們想要駕車經(jīng)過的每個國家/地區(qū)學(xué)習(xí)新的駕駛模式——但這不切實際!

UX 設(shè)計模式的工作原理類似。它們使用戶無需學(xué)習(xí)新系統(tǒng)即可熟悉瀏覽數(shù)字產(chǎn)品或網(wǎng)頁。

什么是用戶體驗設(shè)計模式?

UX 設(shè)計模式是用于構(gòu)建用戶界面的常見構(gòu)建塊。設(shè)計師使用 UX 設(shè)計模式作為可重用組件來解決常見的可用性問題。

例如,我們經(jīng)??吹降囊环N設(shè)計模式是面包屑。面包屑向用戶顯示他們所在的頁面以及返回主頁的路徑。

UX 設(shè)計模式如何改善用戶體驗

設(shè)計模式為設(shè)計人員提供了構(gòu)建塊以更快地創(chuàng)建用戶界面,但它們也增強了用戶體驗。

UX 設(shè)計模式通常遵循用戶熟悉的通用設(shè)計標(biāo)準(zhǔn),從而減少學(xué)習(xí)和瀏覽新產(chǎn)品或網(wǎng)站所需的時間和認(rèn)知負(fù)擔(dān)。

在《我們?nèi)绾螞Q定》一書中,作者喬納·萊勒 (Jonah Lehrer) 寫道,識別熟悉的模式會釋放出多巴胺——一種與動機、獎勵、記憶和注意力有關(guān)的化學(xué)物質(zhì)。當(dāng)用戶體驗?zāi)J桨搭A(yù)期工作時,多巴胺命中會增加。

使用有效的UX 設(shè)計心理學(xué)技術(shù)的設(shè)計師,例如熟悉的 UI 設(shè)計模式,可以增強用戶體驗并使產(chǎn)品交互更加愉快。

UX 和 UI 模式之間的差異

大多數(shù)設(shè)計師交替使用UX 模式和UI 模式這兩個術(shù)語,因為區(qū)別很小,有很多重疊,并且可能會引起混淆!

UX 模式:用戶流和導(dǎo)航的可重用模式——在社交媒體平臺或網(wǎng)站上無限或連續(xù)滾動。用戶認(rèn)識到他們可以向下滾動以刷新頁面。

UI 模式:用于視覺和交互設(shè)計的可重用模式——一個漢堡圖標(biāo)。用戶知道漢堡包圖標(biāo)將打開導(dǎo)航。

何時以及如何應(yīng)用設(shè)計模式

知道何時使用設(shè)計模式對于產(chǎn)品設(shè)計和用戶體驗至關(guān)重要。設(shè)計人員必須僅在有明確的可用性原因時才使用設(shè)計模式。

以下是識別用戶需求和應(yīng)用設(shè)計模式的四步、以問題為中心的方法:

查明問題——您可以通過分析和可用性測試的組合來識別問題。例如,您注意到在獲取客戶詳細(xì)信息時,您的產(chǎn)品注冊流程有很高的流失率。通過可用性測試,您了解到一個常見的痛點是注冊過程耗時太長——您的注冊表單要求填寫全名、電子郵件、年齡、性別、城市和手機號碼(其中許多細(xì)節(jié)與使用產(chǎn)品無關(guān)) 。

通過市場和競爭對手研究找到解決方案——尋找競爭對手和流行的設(shè)計庫,以找到常見的 UI 模式來解決您的問題?;氐轿覀兩厦娴睦?,您會發(fā)現(xiàn)競爭對手通常只在注冊時詢問用戶的全名和電子郵件地址。它們還允許用戶使用社交媒體帳戶進(jìn)行注冊和登錄,從而簡化注冊流程。

自定義設(shè)計模式——您必須自定義新的設(shè)計模式以匹配您的品牌和現(xiàn)有設(shè)計系統(tǒng)。對于我們的用戶注冊示例,此自定義可能包括調(diào)整輸入、社交媒體按鈕和提交按鈕的圓角半徑。占位符文本、輸入標(biāo)簽和錯誤/成功消息將使用您的樣式指南中的顏色。

測試您的設(shè)計模式——最后,您必須始終測試新的設(shè)計模式實現(xiàn),以確保它們滿足可用性和品牌要求。

上面的例子展示了可用性測試的重要性——識別和應(yīng)用用戶界面設(shè)計模式以測試開始和結(jié)束。

不要因為競爭對手有一個設(shè)計模式或者你認(rèn)為這是正確的做法就添加一個設(shè)計模式。例如,您的網(wǎng)頁設(shè)計是否需要面包屑導(dǎo)航?對于電子商務(wù),可能有必要讓用戶返回到產(chǎn)品類別或知道他們在結(jié)賬序列中的位置。但是,對于大多數(shù)其他網(wǎng)站,它只是添加了額外的數(shù)據(jù)點供用戶處理。

UX 設(shè)計模式的常見示例

設(shè)計模式分為六大類:

A. 數(shù)據(jù)輸入輸出

B. 內(nèi)容結(jié)構(gòu)

C. 導(dǎo)航

D. 社交媒體和分享

E. 激勵

F. 等級制度

數(shù)據(jù)輸入和輸出

數(shù)據(jù)輸入和輸出是最常見的用戶/產(chǎn)品交互之一。用戶輸入信息,系統(tǒng)返回數(shù)據(jù)或完成一個動作。

一個很好的例子是許多網(wǎng)站和應(yīng)用程序使用的日期選擇器。盡管它們看起來略有不同,但大多數(shù)日期選擇器顯示類似的布局和功能——標(biāo)題中的月/年、星期幾和日期。

當(dāng)用戶單擊一個日期時,它會突出顯示以選擇。最后,有一個 CTA(有時是一個取消按鈕),用戶可以在完成并準(zhǔn)備繼續(xù)時單擊。

數(shù)據(jù)輸入和輸出的其他示例包括:

a) 表單提交

b) 成功/失敗消息

c) 應(yīng)用通知

d) 進(jìn)度條/步驟

內(nèi)容結(jié)構(gòu)

你有沒有注意到大多數(shù)界面使用類似的塊布局和圖像縮略圖?或者,管理界面的左側(cè)導(dǎo)航面板和右側(cè)的內(nèi)容如何?

使用這些熟悉的內(nèi)容結(jié)構(gòu)和 UI 模式可以幫助用戶快速瀏覽新的數(shù)字產(chǎn)品或網(wǎng)站。目標(biāo)是最大限度地減少摩擦(例如學(xué)習(xí)新界面),以獲得無縫和愉快的用戶體驗。

導(dǎo)航

熟悉的 UI 模式可以幫助用戶輕松瀏覽網(wǎng)站或數(shù)字產(chǎn)品。桌面和移動界面有不同的導(dǎo)航模式。

例如,主導(dǎo)航位于桌面網(wǎng)站或應(yīng)用程序的標(biāo)題中或左側(cè)。在移動應(yīng)用程序中,主導(dǎo)航欄位于頁腳中,只需用拇指觸碰即可。

無限或連續(xù)滾動是 Instagram 和 Pinterest 使用的典型導(dǎo)航設(shè)計模式。當(dāng)用戶滾動時,系統(tǒng)會刷新以顯示更多內(nèi)容。這種設(shè)計模式很熟悉并增強了用戶體驗,因為用戶不需要單擊下一步按鈕或分頁來查看更多內(nèi)容。

社交媒體與分享

設(shè)計師可以使用多種社交媒體和共享設(shè)計模式,包括:

a) 鏈接的品牌社交媒體圖標(biāo)

b) 共享圖標(biāo) - 向右彎曲的箭頭或三個點的共享圖標(biāo)

c) 引言——用引號引用此人的姓名和形象

這些熟悉的設(shè)計模式可幫助用戶找到社會認(rèn)同,以建立對您的產(chǎn)品和品牌的信任。

這些設(shè)計模式利用心理學(xué),鼓勵用戶執(zhí)行所需的操作。這里的目標(biāo)是在用戶和產(chǎn)品之間建立聯(lián)系。

激勵

激勵 UX 模式利用設(shè)計心理學(xué)來鼓勵用戶執(zhí)行任務(wù)和操作,從而創(chuàng)建用戶/產(chǎn)品關(guān)系。

設(shè)計師鼓勵使用設(shè)計模式通過積極的反饋、認(rèn)知、游戲化等來吸引用戶。

例如,游戲化模式鼓勵用戶邀請朋友來獲得獎勵。UI 模式將通過 CTA 向用戶顯示他們當(dāng)前的積分,以邀請更多朋友賺取更多。

等級制度

層次結(jié)構(gòu)模式類似于內(nèi)容結(jié)構(gòu),因為它們?yōu)橛脩魟?chuàng)造了即時的視覺熟悉度,以便快速瀏覽界面并知道如何完成所需的操作。

博客的兩種常見層次結(jié)構(gòu)模式包括標(biāo)題和目錄。用戶可以滾動頁面以快速找到他們想要的內(nèi)容或使用目錄跳轉(zhuǎn)到特定部分。

面包屑是電子商務(wù)網(wǎng)站用來幫助用戶瀏覽產(chǎn)品頁面和結(jié)賬流程的另一種層次結(jié)構(gòu)模式。

總結(jié)

UX設(shè)計模式是用戶體驗的重要組成部分,因為它們最大限度地減少了產(chǎn)品的學(xué)習(xí)曲線和人類認(rèn)知負(fù)擔(dān)。設(shè)計師必須知道何時使用這些 UX 設(shè)計模式,而不僅僅是出于習(xí)慣或模仿競爭對手而實施它們。

分析和可用性研究可幫助設(shè)計人員確定界面中缺少哪些 UX 模式,然后測試他們是否實施了正確的模式。

藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請掃碼ben_lanlan,報下信息,會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

文章來源:站酷 作者:對啊設(shè)計君
分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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


日歷

鏈接

個人資料

存檔