首頁(yè)

后臺(tái)界面設(shè)計(jì)的7條原則

seo達(dá)人

圖片

Illustration: Outcrowd

 

1、構(gòu)思儀表盤界面的大腦

讓我們深入研究設(shè)計(jì)解剖學(xué)。儀表盤的“父母”是客戶端、設(shè)計(jì)人員和開發(fā)人員,每個(gè)組件設(shè)計(jì)都需要他們的合作產(chǎn)出,所有關(guān)鍵點(diǎn)在一開始要做出說明。

智人是由胚胎發(fā)展而來(lái)的。首先形成的是腦細(xì)胞和神經(jīng)細(xì)胞,然后是身體的其他細(xì)胞。這正是任何可行的項(xiàng)目應(yīng)該遵循的方式。第一個(gè)階段是最重要的。如果你忽視這個(gè)階段,再花哨的設(shè)計(jì)也不能挽救局面。這正是為儀表盤的長(zhǎng)期發(fā)展奠定基礎(chǔ)。

儀表盤如果會(huì)說話的話,它會(huì)問“我為什么出生?誰(shuí)需要我?“。

試問你能回答嗎?因此你需要明確:

  • 儀表盤將如何助力公司目標(biāo)?
  • 什么結(jié)構(gòu),功能和視覺效果將幫助儀表盤服務(wù)好用戶?
  • 哪種設(shè)計(jì)最適合目標(biāo)受眾?

這些問題的答案將構(gòu)成你的設(shè)計(jì)理念基礎(chǔ)。

圖片

Perls

 

儀表盤中沒有瑣碎的細(xì)節(jié)。

儀表盤顯示的信息應(yīng)該使用戶能夠做出決策。設(shè)計(jì)師的工作是幫助用戶解決問題,而不是讓他們使用一堆很酷的小工具。任何對(duì)目標(biāo)不起作用的事情都會(huì)與目標(biāo)背道而馳。

從項(xiàng)目的最初階段到最后階段,設(shè)計(jì)師必須關(guān)注公司的目標(biāo)、儀表盤的目標(biāo)和用戶的目標(biāo)。

否則,儀表盤將永遠(yuǎn)不會(huì)做的更好。

圖片

Clover

 

2. 數(shù)據(jù)及關(guān)鍵指標(biāo)選擇:循環(huán)系統(tǒng)

儀表盤數(shù)據(jù)就像循環(huán)的血液。我們必須理解它們來(lái)自哪里,當(dāng)用戶需要它們時(shí)如何處理,以及應(yīng)該如何可視化。

設(shè)計(jì)師需要理解數(shù)據(jù)的目的。顯然,這將幫助他們選擇合適的組件,但還有更多的工作要做。例如,用戶希望在屏幕上看到大量不同的讀數(shù)。你不需要移除任何東西來(lái)清除一些空間,但你可以做的是突出最重要的元素,并在視覺上“弱化”次要的東西。然而,要做到這一點(diǎn),你必須知道數(shù)據(jù)的優(yōu)先級(jí)。

圖片

Bidding Car

 

最重要的指標(biāo)是哪些數(shù)據(jù)能幫助達(dá)成目標(biāo)。例如:

  • 顯示實(shí)際成功率;
  • 影響產(chǎn)品的感知方式;
  • 激勵(lì)創(chuàng)造產(chǎn)品的團(tuán)隊(duì)。

參數(shù)的選擇也需要了解用戶。用戶應(yīng)該看到哪個(gè)關(guān)鍵指標(biāo),他們認(rèn)為什么樣的可視化表現(xiàn)最容易理解?

人們喜歡看到與他們的目標(biāo)相符的數(shù)字。

圖片

Panch

 

3. 儀表盤結(jié)構(gòu):骨架

想象進(jìn)入一個(gè)酒店房間,看到一張床,一張桌子和椅子,一面鏡子和一個(gè)壁櫥。甚至不用打開壁櫥,你就能猜到里面有什么。吹風(fēng)機(jī)、拖鞋和毛巾都在你想要的地方——有人確保了這些。一個(gè)好的儀表盤就像那個(gè)房間。它是干凈的,整潔的,可預(yù)測(cè)的。你馬上就能看到所有的要點(diǎn),憑直覺知道在哪里可以找到其余的內(nèi)容。

設(shè)計(jì)師有自己的工具來(lái)確保整潔。

 

1) 層次結(jié)構(gòu)

首先,你得整理思緒。在開始設(shè)計(jì)之前,一定要對(duì)所有數(shù)據(jù)進(jìn)行排序,將其分類,了解什么是最先發(fā)生的,什么是最后發(fā)生的,接下來(lái)是什么等等。確定用戶必須馬上看到的關(guān)鍵內(nèi)容。

視覺層次結(jié)構(gòu)必須反映信息層次結(jié)構(gòu)。

數(shù)據(jù)層次結(jié)構(gòu)通過小組件的大小和位置表示。如果你的讀者從左到右閱讀,關(guān)鍵信息必須放在左上角,最不相關(guān)的信息將在右下角。

對(duì)數(shù)據(jù)排序的方法將取決于儀表盤的用途。重要的是根據(jù)信息的優(yōu)先級(jí)組織信息,并創(chuàng)建邏輯場(chǎng)景。

把信息面板看作是一個(gè)故事,而不是一系列數(shù)據(jù)點(diǎn)。

 

2) 網(wǎng)格

網(wǎng)格對(duì)于創(chuàng)建頁(yè)面的總體布局、排序、平衡和對(duì)齊元素非常有用。

圖片

 

3) 信息模塊

模塊系統(tǒng)類似于公寓的分區(qū)。臥室是用來(lái)睡覺的,餐廳是用來(lái)吃飯的——每個(gè)區(qū)域都有自己的功能。你的舒適度取決于他們所處位置的便利程度。糟糕的布局不能通過裝修或家具來(lái)修復(fù)。相應(yīng)地,必須提前考慮模塊劃分。

模塊幫助顯示內(nèi)容層次結(jié)構(gòu),根據(jù)數(shù)據(jù)的重要性、相關(guān)性和邏輯連接對(duì)數(shù)據(jù)進(jìn)行分組。每個(gè)模塊都應(yīng)該在給定的流程中服務(wù)于特定的目的。

圖片

圖片

 

4) 連續(xù)性和接近性

如果你去廚房需要經(jīng)過有兩扇門的走廊,這是一個(gè)糟糕的布局。互連的流程假定邏輯接近。如果一個(gè)模塊中的流程需要來(lái)自另一個(gè)模塊的信息,那么布局上應(yīng)該保證數(shù)據(jù)的連續(xù)性。這一點(diǎn)必須提前考慮,這樣用戶就不必在晦澀的存儲(chǔ)空間中尋找他們需要的信息。

圖片

Illustration: Outcrowd

 

所有相關(guān)信息都應(yīng)按重要到不重要的順序進(jìn)行分組,并就近放置。

 

5) 分離模塊

沒有人需要一個(gè)延伸到臥室的廚房。為了將一個(gè)模塊與另一個(gè)模塊分開,你需要負(fù)空間。確保從一開始就考慮到這一點(diǎn):將負(fù)空間視為需要視覺平衡的設(shè)計(jì)元素的組合。

圖片

Wingle

 

4. 功能:肌肉

功能和工具的數(shù)量由儀表盤的用途及其用戶的關(guān)鍵目標(biāo)決定。

要想自由活動(dòng),人類只需要兩條腿,狗需要四條腿,蜘蛛需要八條腿。一個(gè)功能太多的儀表盤就像一條六條腿的狗一樣,這有點(diǎn)令人毛骨悚然。

不要在控制面板上放置過多的工具。用戶只需要手邊有必要的東西。過多的可用工具會(huì)讓人們感到困惑,并嚇走他們,因?yàn)樗雌饋?lái)太復(fù)雜了。個(gè)性化總是比標(biāo)準(zhǔn)化好。

圖片

Band

 

5.小組件:重要的器官

如果屏幕上有超過5到7個(gè)小組件,人們就很難理解內(nèi)容。因此,我們的工作是讓相關(guān)數(shù)據(jù)易讀,但不過量。用戶應(yīng)該在幾秒鐘內(nèi)理解他們所看到的內(nèi)容。

數(shù)據(jù)可視化工具包括:

  • 表格
  • 圖表
  • 示意圖
  • 卡片
  • 指標(biāo)
  • 地圖
  • 圖片
  • 分組
  • 篩選器
  • 列表
  • 選擇樹

圖片

Activity

 

小組件的選擇取決于儀表盤的用途和用戶。想想以下幾點(diǎn):

  • 哪個(gè)組件能最好地顯示一個(gè)特定的KPI?
  • 用戶可以立即看到什么?
  • 哪個(gè)組件是用戶最容易理解的?
  • 什么可以幫助用戶更快地找到他們需要的東西?

選擇易于理解和閱讀的小組件。

這里是一個(gè)令人困惑的小組件的例子:

圖片

想想主要的“目標(biāo)”來(lái)吸引用戶的注意力。例如,如果你的優(yōu)先級(jí)是績(jī)效目標(biāo),你應(yīng)該使用數(shù)字;如果你需要比較值,用直線或柱狀圖會(huì)很好;為了激勵(lì)團(tuán)隊(duì),可以使用帶有相關(guān)亮點(diǎn)的排行榜。

不正確選擇的小組件或默認(rèn)小組件模板可能會(huì)使用戶混淆或?qū)е滤麄冋`解數(shù)據(jù)。

最好的解決方案是分析和測(cè)試的結(jié)果。

圖片

最好的小組件設(shè)計(jì)是極簡(jiǎn)和易于閱讀的。例如,一個(gè)3D圖表可能看起來(lái)令人印象深刻,但它占用了用戶太多的注意力,最終證明會(huì)分散用戶的注意力。這也適用于漸變、過度使用顏色和過多的細(xì)節(jié)。

 

6. 視覺設(shè)計(jì):一般技巧

我們已經(jīng)創(chuàng)建了儀表盤的思想和身體。唯一要做的就是皮膚——最外層。這可以根據(jù)優(yōu)秀設(shè)計(jì)的基本原則來(lái)實(shí)現(xiàn),但仍有一些新的需要注意的細(xì)節(jié)。

 

1) 簡(jiǎn)單

儀表盤應(yīng)該像你喜歡工作的桌子一樣干凈:它必須只有必要的文件和工具,沒有干擾。

圖片

MEMO

 

2) 顏色

儀表盤顏色的選擇必須有一個(gè)目的:盡可能清晰地顯示信息。顏色跨度越大,就越難把數(shù)據(jù)展示清晰。所以不要讓儀表盤的顏色過多。使用同一顏色的深淺是一個(gè)好的辦法。

圖片

首先要選擇底色,然后是補(bǔ)色。每種顏色都必須有特定的用途。一種顏色可以用來(lái)組合元素,另一種顏色可以用來(lái)高亮。顏色還能體現(xiàn)一個(gè)元素是積極的還是消極的。

避免使用可能有負(fù)面含義的顏色。例如,在這個(gè)例子中,紅色看起來(lái)像是代表壞的和不受歡迎的東西:

圖片

如果儀表盤提供了可定制的顏色,確保所有可用的選擇看起來(lái)都比較舒服。

選擇顏色組合的一個(gè)好工具是Adobe color CC。

 

3) 突出

語(yǔ)義高亮應(yīng)該與視覺高亮相對(duì)應(yīng)。為了突出一個(gè)元素,你可以使用顏色(對(duì)比度,亮度),形狀,大小,負(fù)空間等。

 

4) 可讀性和數(shù)字格式化

這是確保視覺清晰度的重要因素:干凈的布局,視覺層次,重點(diǎn)突出,對(duì)比元素,適當(dāng)?shù)淖煮w,這些字體也必須具有對(duì)比性和易讀性。

高精度的數(shù)字格式很難理解。最好把所有的數(shù)字都四舍五入,然后把較長(zhǎng)的數(shù)字尾巴去掉。

 

7. 適應(yīng)性

在實(shí)踐中,當(dāng)用戶優(yōu)先考慮桌面版本時(shí),在移動(dòng)版本之前創(chuàng)建網(wǎng)頁(yè)版本是合理的。如果你的目標(biāo)用戶主要使用的是手機(jī)版本,那么你可以先從移動(dòng)設(shè)備著手構(gòu)建儀表盤,然后再開發(fā)桌面版本。

圖片

Snap

 

總結(jié)

設(shè)計(jì)一個(gè)好的儀表盤不是一件容易的事情。我們把它比作人類的發(fā)展,因?yàn)樗且粋€(gè)很好的方式來(lái)呈現(xiàn)重要的東西。當(dāng)你在設(shè)計(jì)儀表盤時(shí),請(qǐng)不斷地問自己:是否一切都已就緒?有多余的肢體嗎?身體的各個(gè)部位協(xié)同工作嗎?用戶會(huì)喜歡這個(gè)結(jié)果嗎?它有用嗎?

正如你所看到的,視覺設(shè)計(jì)實(shí)際上是設(shè)計(jì)師最不應(yīng)該擔(dān)心的事情。

最后,彩云再分享一組常用的后臺(tái)圖表界面組件庫(kù),相信會(huì)對(duì)大家的日常設(shè)計(jì)工作有幫助,

圖片

圖片

圖片


 

本文翻譯已獲得作者的正式授權(quán)。

 

原文地址:medium

作者:Erik Messaki

譯文地址:彩云譯設(shè)計(jì)(公眾號(hào))

譯者:彩云Sky

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》后臺(tái)界面設(shè)計(jì)的7條原則

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

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)

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



UI設(shè)計(jì)師交互設(shè)計(jì)-被忽視的UX產(chǎn)品文案

周周

在很多體驗(yàn)設(shè)計(jì)師的認(rèn)知中,產(chǎn)品界面上的文案是設(shè)計(jì)中最細(xì)枝末節(jié)的事,往往會(huì)被忽視。大部分時(shí)候,能讓用戶理解的文案就是合格的。而什么是好的文案,沒有一致的評(píng)價(jià)標(biāo)準(zhǔn),在復(fù)雜的業(yè)務(wù)場(chǎng)景中也很難做出判斷。

體驗(yàn)設(shè)計(jì)師的成本思維

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

為什么設(shè)計(jì)師要有成本思維,以及成本思維在做我們做設(shè)計(jì)時(shí)對(duì)我們有什么幫助。



不僅僅在工作中我們需要思考成本,在生活中我們也無(wú)時(shí)無(wú)刻都在計(jì)算成本。成本總是和收益掛鉤,所以貝克爾在《人類行為的經(jīng)濟(jì)學(xué)分析》中提到:人的任何行為都是理性選擇的結(jié)果,無(wú)利可圖的事人們事不會(huì)去做。雖然這句話不能覆蓋所有的人,但是大多數(shù)人就是如此。



在夜深人靜的夜晚你饑腸轆轆想吃夜宵,你可以選擇下樓到周邊小吃店就餐,也可以選擇叫外賣,前者付出的成本是你需要通過身體行動(dòng)來(lái)交換最后的結(jié)果,后者則是花費(fèi)一定的金錢來(lái)代替前者的行動(dòng)。


那么我們通常會(huì)如何選擇呢?如果這兩種成本有很大的差異,比如需要到很遙遠(yuǎn)的地方那么除了身體行動(dòng)成本外,時(shí)間成本也會(huì)計(jì)算其中,所以相比后者成本陡然增大,于是我們就會(huì)選擇成本低收益大的方式。但是假如你現(xiàn)在極度想要吃那家的夜宵,外賣點(diǎn)餐會(huì)特別影響口感,那么你可能會(huì)選擇前者,這里由于外賣口感和主觀意愿影響到了我們理性的選擇?!?



1.為什么要關(guān)注成本


成本決定了收益的效率、大小和方式,小到你伸手拿一支筆你會(huì)選擇最近的,大到我們?nèi)松耐顿Y。成本與收益之間并非是直接關(guān)系,收益的大小的不取決于成本的大小,還有風(fēng)險(xiǎn)因素。例如我們?cè)趯?duì)UI界面進(jìn)行優(yōu)化,可以選擇的方式有很多:


1.只調(diào)整視覺,替換樣式

2.對(duì)頁(yè)面邏輯進(jìn)行重構(gòu)

3.整體功能進(jìn)行重新分類組合

......


我們的目標(biāo)是讓用戶獲得更好的體驗(yàn)并且提升業(yè)務(wù)價(jià)值。3種方式需要的成本高低不同,我們都希望付出最小的成本達(dá)到最好的效果,于是我們就會(huì)考慮到風(fēng)險(xiǎn)因素,假如新流程用戶不會(huì)用怎么辦,假如新版本導(dǎo)致的數(shù)據(jù)下滑怎么辦,假如行業(yè)出了新政策了怎么辦等等。所以除了這些成本外也要考慮應(yīng)對(duì)風(fēng)險(xiǎn)的成本。



你看為什么有錢人都會(huì)坐頭等艙是因?yàn)轭^等艙可以幫他們節(jié)約更多的時(shí)間,提供更好的環(huán)境與服務(wù),讓他們產(chǎn)出更多的價(jià)值。還有假如你的車壞了,你最直接的方法就是花錢找人幫你修而不是自學(xué)自修,因?yàn)槟銓⒒ㄙM(fèi)太高的成本。


再舉一個(gè)例子,我們想提升能力,有的人選擇自學(xué)、白嫖,有的人選擇報(bào)培訓(xùn)班,這也只是時(shí)間和金錢上的成本選擇,如果你的自學(xué)(白嫖)在短時(shí)間收益很大那就毫無(wú)疑問幫你省了一大筆錢,但是如果自學(xué)很久都毫無(wú)效果,那么時(shí)間就是你花費(fèi)的成本,時(shí)間和金錢不同的是,時(shí)間不可逆。看起來(lái)花錢比花時(shí)間更好?不是,花錢也有風(fēng)險(xiǎn),比如課程質(zhì)量和服務(wù)很差,錢沒了還學(xué)不到,甚至賠上了時(shí)間。但如果你選對(duì)了,那么收益就遠(yuǎn)遠(yuǎn)會(huì)大于自學(xué)。




2.設(shè)計(jì)師可以關(guān)注哪些成本


1.實(shí)現(xiàn)成本


實(shí)現(xiàn)成本指的是想法與落地中間需要付出的行為、時(shí)間和其他損耗,例如我們希望提升用戶下單的轉(zhuǎn)化率,我們可以選擇:1.減少整個(gè)流程的步驟 2.將按鈕設(shè)計(jì)的更明顯 3.給用戶發(fā)放優(yōu)惠券 4.給用戶營(yíng)造搶購(gòu)氛圍,在這幾個(gè)方案中最低成本是2,因?yàn)橹恍枰{(diào)整樣式和簡(jiǎn)單開發(fā)就可以實(shí)現(xiàn),但收益并不是最高的,而其他的方案需要更多的角色花費(fèi)更多的時(shí)間來(lái)參與,但是收益也不是顯而易見的。所以如果你的產(chǎn)品比較成熟,那么我們一定選擇成本更低的方案,反之我們會(huì)進(jìn)行更高成本的嘗試。



還有比如我們找工作,新公司福利待遇比現(xiàn)在公司好50%,平臺(tái)也更大,是否不需要思考直接去呢?當(dāng)然不是,你需要考慮通勤成本、生活成本、自身成長(zhǎng)成本等等因素。如果你50%薪資漲幅換來(lái)的是996、每天通勤時(shí)間3、4個(gè)小時(shí),不僅僅是時(shí)間精力,還有我們的身體健康的成本,我會(huì)覺得遠(yuǎn)遠(yuǎn)不值,成本太高。




2.機(jī)會(huì)成本


我們先來(lái)看一下定義:機(jī)會(huì)成本是指面臨多方案抉擇時(shí),被舍棄的選項(xiàng)中價(jià)值最高的就是本次決策的機(jī)會(huì)成本。舉個(gè)例子,比如當(dāng)前版本我們有1個(gè)開發(fā)一個(gè)設(shè)計(jì)一個(gè)產(chǎn)品,我們面臨著兩個(gè)需求,但是資源和時(shí)間只夠我們做一個(gè)需求,這時(shí)候2選1,那個(gè)被拋棄的需求所擁有的價(jià)值就是我們所選擇的那個(gè)需求的機(jī)會(huì)成本,相當(dāng)于我們放棄了那個(gè)需求所擁有的價(jià)值。


再通俗一點(diǎn)講,我現(xiàn)在有100萬(wàn),面臨著兩個(gè)選擇:1.銀行理財(cái),年收益4%,4000. 2.做生意投資,年收益8%,8000,那么就相當(dāng)于我花費(fèi)了這4w的潛在成本獲得了8萬(wàn)的收益。



3.邊際成本


邊際成本的理解很簡(jiǎn)單,我們可以理解為我們每付出一定的成本收貨的收益或者每收獲1個(gè)單位的收益所付出的成本。用一個(gè)通俗一點(diǎn)的例子來(lái)講,比如你一共學(xué)習(xí)10天,第一天學(xué)完你考了30分,第二天學(xué)完你考了50分……第8天學(xué)完你考了94分,第9天學(xué)完你考了98分第10天學(xué)完你考了100分,花費(fèi)的單位天數(shù)一樣但是每次增加的分?jǐn)?shù)卻越來(lái)越少,收益也就越來(lái)越少。



在做產(chǎn)品設(shè)計(jì)的時(shí)候,我們往往會(huì)有一個(gè)板塊叫為你推薦,比如微信閱讀中的這個(gè)板塊,它一次提供了用戶6本書,雖然算法可以算出有許多書,但是這里每次只提供給用戶6本,是因?yàn)樯婕暗搅诉呺H成本,少量多次提供能夠讓用戶更聚焦,更快的選擇好書本進(jìn)行閱讀,每多提供幾本書,用戶選擇閱讀的時(shí)間成本就會(huì)越大。有同學(xué)會(huì)問:那我只給1本不就好了,用戶就能馬上讀了,何必要推薦6本?



我們?nèi)绾伪WC那一本剛好是用戶想讀的,沒有辦法做到如此精準(zhǔn),如果每次只推薦一本書,而用戶嘗試了幾次都不喜歡,他們就會(huì)放棄,所以這里就會(huì)選擇一個(gè)臨界值,比如我們可以選擇每次放不同數(shù)量的書,根據(jù)數(shù)據(jù)判斷在給用戶幾本書的時(shí)候用戶閱讀轉(zhuǎn)化和選擇時(shí)間成本更低。




4.體驗(yàn)成本

體驗(yàn)成本也是我們?cè)O(shè)計(jì)師需要時(shí)刻關(guān)注的,俞軍老師在產(chǎn)品方法論中提到,用戶價(jià)值=新體驗(yàn)-舊體驗(yàn)-替換成本,體驗(yàn)成本可以包含很多信息,最主要的就是認(rèn)知與交互的成本。


4.1認(rèn)知成本

如何降低認(rèn)知成本可以從以下這些點(diǎn)進(jìn)行優(yōu)化


4.1.1.文案

文案的設(shè)計(jì)要求是簡(jiǎn)單易懂,避免產(chǎn)生歧義,之前給大家舉過的一個(gè)高德地圖導(dǎo)航在到達(dá)目的地之后給出一個(gè)“原路返回”按鈕的分析,大家可以再思考一下,是否會(huì)產(chǎn)生歧義。還有確定、確認(rèn)大家是否知道怎么用呢?


文案也需要有情感化,避免生硬、帶負(fù)面情緒的問題等等


4.1.2.樣式

視覺最為直觀,一個(gè)按鈕一個(gè)控件的樣式是否能滿足用戶的心智和預(yù)期,將會(huì)影響用戶的認(rèn)知,例如以下的幾個(gè)按鈕,出現(xiàn)在不同場(chǎng)景用戶會(huì)出現(xiàn)一系列問題:為什么我點(diǎn)了沒用?為什么還不能點(diǎn)?我到底該點(diǎn)哪里?



還有你的品牌是否識(shí)別度高,也決定了用戶對(duì)你的認(rèn)知,最近小米花了百萬(wàn)請(qǐng)大師做了新的logo,在視覺上更加圓潤(rùn),在圓logo的基礎(chǔ)上做了很多的微調(diào),實(shí)際上也是避免了太大的logo變化導(dǎo)致品牌認(rèn)知成本的提高,認(rèn)知成本一旦太高,品牌市場(chǎng)的敏感度和曝光度還有各種替換、衍生、配套的隱性成本也會(huì)大大增加。所以這一舉動(dòng)是明智的。



4.1.3.信息

比如我們希望新用戶去關(guān)注一些大咖、kol獲得更好的推薦,但是如果我們只是將推薦者的頭像和昵稱給新用戶,那么這個(gè)策略就是失敗的。因?yàn)槲覀儧]有考慮新用戶的認(rèn)知:1.我為什么要關(guān)注她 2.關(guān)注她我能獲得什么。所以僅僅依靠頭像和名字在這里對(duì)用戶的認(rèn)知是沒有任何幫助的。




4.2.行為成本

我們通過利用肢體來(lái)和媒介進(jìn)行交互,目的是完成某項(xiàng)任務(wù)。其實(shí)只需要你抬手,那么就是產(chǎn)生了成本,只不過某些成本是固定的無(wú)法減少的,比如你要去騎車那就需要去解鎖,如果沒有鎖車可能就會(huì)被偷走,這是出于安全考慮。


行為成本在具體數(shù)字產(chǎn)品中我們可以發(fā)現(xiàn)很多,例如你只需要將手機(jī)拿起,屏幕就會(huì)亮,相比于找到解鎖鍵再按一下成本就低了很多。而亮屏后不直接解鎖是為了防止誤觸或者隱私,所以還需要通過指紋或者人臉進(jìn)行識(shí)別。


例如幾種不同的驗(yàn)證方式,利用滑動(dòng)拼圖來(lái)解鎖和輸入相關(guān)驗(yàn)證碼解鎖,前者比后者的學(xué)習(xí)成本和操作成本都低。


在移動(dòng)端我總結(jié)了幾個(gè)減少交互成本的方法,不妨來(lái)看下:



1.利用滑動(dòng)代替點(diǎn)擊


soul音頻處理

日期選擇

iPhone底部橫條切換窗口




2.利用點(diǎn)擊代替輸入

游戲昵稱隨機(jī)

股票買入數(shù)量



這里也有同學(xué)會(huì)問,既然都可以代替,那滑動(dòng)能否代替輸入?必須也是可以的,例如iOS自帶的計(jì)時(shí)器中選擇時(shí)間的控制器,還有鬧鐘設(shè)置,這里要注意的是,滑動(dòng)代替輸入是要基于本身該信息是由范圍內(nèi)并且不需要精細(xì)化控制的,比如房?jī)r(jià)篩選,房?jī)r(jià)本身量級(jí)很大,用戶篩選也不會(huì)精確到個(gè)位數(shù),在這里用點(diǎn)擊和輸入會(huì)比滑動(dòng)的成本更低。


反例就是音量、明暗控制,大家可以感受一下輸入在這里的雞肋。你需要精確控制選輸入,需要大致的范圍選點(diǎn)擊,非常模糊的感受選擇滑動(dòng)。



3.在必要時(shí)利用語(yǔ)音代替輸入

例如我們?cè)陂_車進(jìn)行導(dǎo)航的時(shí)候,打字輸入非常不便,于是加入了語(yǔ)音輸入。還有在微信進(jìn)行賬號(hào)切換時(shí),我們可以選擇利用語(yǔ)音輸入數(shù)字來(lái)驗(yàn)證身份。



4.給予詳細(xì)的提示

對(duì)于新用戶操作復(fù)雜功能和界面的時(shí)候,提供更多提示能夠很大程度上減少用戶的操作成本。



5.盡量不使用二級(jí)手勢(shì)

在iOS或者安卓的手勢(shì)控制中,我們會(huì)發(fā)現(xiàn)又一些常用的手勢(shì)比如:點(diǎn)擊、拖動(dòng)、輕掃、雙擊、縮放,這里我們可以定義為一級(jí)手勢(shì)。還有一些不常用的比如:重按、長(zhǎng)按、三指滑動(dòng)、三指縮放等,這些手勢(shì)的認(rèn)知成本和行為成本都很高,定義為二級(jí)手勢(shì),不建議頻繁使用。




總結(jié)

設(shè)計(jì)師在日常工作中接到的需求繁多,無(wú)論是在做需求之前還是在思考設(shè)計(jì)方案的時(shí)候,成本思維可以幫助我們很好的規(guī)避一些問題和風(fēng)險(xiǎn),我們追求控制成本使收益最大化。所以學(xué)會(huì)控制成本的設(shè)計(jì)師不僅僅題可以提高個(gè)人工作效率還可以幫助公司創(chuàng)造更多價(jià)值。

文章來(lái)源:站酷      作者:應(yīng)駿

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)



淺析用戶體驗(yàn)四維度

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

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

 

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

 

HI X:Human Interface Experience,人與界面的交互體驗(yàn)。

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

HH X:Human Human Experience,人與人的交互體驗(yàn)。

HB X:Human Brand Experience,人與品牌的交互體驗(yàn)。


用戶體驗(yàn)四維度

 

 

01 四維度的概念

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

因?yàn)?HB X 牽涉到對(duì)品牌的綜合評(píng)價(jià),所以就像工作都有一段試用期、戀愛都有一段了解期一樣,HB X 的形成往往也需要較長(zhǎng)時(shí)間,通常至少要 3~5 年。

 

 

02 四維度的價(jià)值

 

每一個(gè)維度,各有什么價(jià)值?

 

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

 

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

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

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

 

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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

 

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


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

文章來(lái)源:站酷  作者:Snow Design

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)


合理預(yù)設(shè):如何為用戶提前設(shè)置好默認(rèn)值

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

What 是什么

「合理預(yù)設(shè)」是指系統(tǒng)提供默認(rèn)選項(xiàng),這些默認(rèn)選項(xiàng)不需要用戶做任何操作,可以節(jié)省用戶完成表單的時(shí)間和精力。

這些默認(rèn)選項(xiàng)來(lái)的數(shù)據(jù)源包括: 先前輸入的會(huì)話數(shù)據(jù)、來(lái)自用戶帳戶的信息、當(dāng)前位置、當(dāng)前數(shù)據(jù)和時(shí)間等等。


案例 釘釘?shù)摹按k事項(xiàng)”設(shè)置功能,可以自動(dòng)抓取到語(yǔ)句中的時(shí)間信息,自動(dòng)幫助用戶默認(rèn)填寫時(shí)間,減少用戶的操作時(shí)長(zhǎng):

相關(guān)模式 :語(yǔ)句填空


Why 為什么

系統(tǒng)通過提供合理的默認(rèn)信息和答案,分擔(dān)了用戶思考和輸入信息的工作,減少時(shí)間,提高效率。

而就算預(yù)設(shè)信息不是用戶想要的,也為用戶提供了一個(gè)示例來(lái)說明答案應(yīng)該是什么樣子的。這一點(diǎn)也可以節(jié)約用戶幾秒的思考時(shí)間,或者避免輸入錯(cuò)誤的信息。


另外,合理的默認(rèn)值還可以幫助用戶應(yīng)對(duì)一些“難題”。如果用戶跳過了一塊字段,那么可能是這個(gè)問題沒有引起他的注意。用戶可能是不理解這個(gè)問題、或是默認(rèn)值的含義。輸入答案,選擇值,或單擊按鈕的動(dòng)作會(huì)迫使用戶有意識(shí)地面對(duì)這個(gè)問題。


比如疫情期間,大部分公司都需要做健康打卡,下圖中有一些選項(xiàng)是直接填了默認(rèn)值,但是有些就沒有填。比如下圖的左圖中,有關(guān)于“請(qǐng)假未到崗”這些問題,因?yàn)闆]有填默認(rèn)值,用戶就會(huì)對(duì)這個(gè)問題有印象。然后比如“今日是否有發(fā)熱癥狀”,“是否有咳嗽”這些,因?yàn)楸幌到y(tǒng)默認(rèn)填了,用戶很容易就忽略過去了。

所以一些刻意希望被關(guān)注的問題,其實(shí)最好不要提供預(yù)設(shè)值,這樣可以讓用戶感知到這個(gè)重要信息的存在,進(jìn)而加深對(duì)內(nèi)容的認(rèn)知。



When 什么時(shí)候使用

當(dāng)產(chǎn)品要求用戶提供類似表單的信息輸入(例如文本框或單選按鈕),并希望減少用戶填寫時(shí)長(zhǎng)時(shí),可以使用提供默認(rèn)設(shè)置。


但是當(dāng)問題的答案會(huì)很敏感或是與政治相關(guān)時(shí),最好不要提供默認(rèn)值,例如密碼、性別或公民身份等。最好也不要為用戶擅自訂閱非必要的內(nèi)容信息,如“請(qǐng)給我發(fā)送廣告郵件”等。


使用條件

· 用戶需要做類似表單的信息輸入操作;

· 系統(tǒng)希望減少用戶需要做的工作;

· 系統(tǒng)希望確保用戶填寫的準(zhǔn)確性和一致性;

· 可能用戶并不知道或者不關(guān)心答案,不需要引起用戶的重視;

· 問題的答案不屬于敏感信息或是與政治無(wú)關(guān)。


How 如何使用

設(shè)定「合理預(yù)設(shè)」有兩種普遍的用法:

1、使用一個(gè)通用的、常識(shí)性的、滿足大部分用戶需求的默認(rèn)值,預(yù)先填寫輸入框;

2、可以調(diào)用用戶早些時(shí)候提供給系統(tǒng)的信息來(lái)動(dòng)態(tài)地設(shè)置默認(rèn)值。例如,某個(gè)用戶提供了一個(gè)中國(guó)的郵政編碼,系統(tǒng)可以從這個(gè)編碼推導(dǎo)出用戶所在的省,甚至市和區(qū)的名稱。


除此之外要注意幾點(diǎn)應(yīng)用原則:

· 使用預(yù)設(shè)的默認(rèn)值不僅僅是為了防止用戶留下空白的輸入?yún)^(qū)域;

· 要充分的了解你的用戶,默認(rèn)值的設(shè)定要有絕對(duì)合理的理由 —— 否則,系統(tǒng)會(huì)給所有人帶來(lái)額外的工作量。


Example 案例

案例一:唯品會(huì)小程序在購(gòu)買服飾類選擇 SKU

用戶需求:購(gòu)買服裝時(shí)需要選擇尺碼


唯品會(huì)小程序在購(gòu)買服飾類選擇 SKU 時(shí),每個(gè)尺碼點(diǎn)擊后會(huì)顯示對(duì)應(yīng)的衣服參數(shù),用戶不再需要去商品描述中的尺碼表格中再找,也可以是設(shè)置好自己的身材數(shù)據(jù),平臺(tái)會(huì)默認(rèn)選中適合你的尺碼。

案例二:螞蟻鏈實(shí)人認(rèn)證表單

用戶需求:需要根據(jù)表單內(nèi)容填寫和上傳文件

螞蟻鏈實(shí)人認(rèn)證在上傳證件時(shí)會(huì)根據(jù)用戶所在國(guó)家和地區(qū),幫助用戶默認(rèn)選擇概率最大的選項(xiàng),不需要用戶自己操作。

案例三:Photoshop 創(chuàng)建新文件

用戶需求:創(chuàng)建新文件,調(diào)整畫布大小

在 Photoshop CC 中創(chuàng)建新的圖像文件時(shí),默認(rèn)情況下會(huì)從操作系統(tǒng)剪切板開始。這里的假設(shè)是用戶剛剛創(chuàng)建了一個(gè)屏幕截圖,并且正在編輯該圖像。因此,Photoshop 在剪貼板中獲取圖像的寬度和高度,并使用它們來(lái)預(yù)先填充創(chuàng)建新文件的尺寸,這是一種節(jié)省時(shí)間的聰明方法。不用擔(dān)心圖像和畫布會(huì)有尺寸不匹配的情況。


當(dāng)用戶想要調(diào)整畫布大小時(shí),原先畫布的長(zhǎng)寬尺寸會(huì)預(yù)設(shè)出現(xiàn)在新的畫布大小里面,方便用戶進(jìn)一步進(jìn)行尺寸調(diào)整。


文章來(lái)源:站酷  作者:Ant_Design
分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

藍(lán)藍(lán)設(shè)計(jì)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ù)



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

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

背景

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


undefined


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


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


undefined


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

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

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


undefined


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


undefined


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


undefined



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

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


undefined


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

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

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

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


競(jìng)品分析|尋找實(shí)踐證據(jù),謹(jǐn)慎驗(yàn)證

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


undefined


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

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


undefined


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


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


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


文字陷阱:中英文字高不等于字號(hào)


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


undefined


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


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

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

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

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


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


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


undefined


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


undefined



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

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


undefined


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


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


undefined


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


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

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


undefined


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


undefined



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

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


undefined


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


undefined



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

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


undefined


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


undefined


結(jié)語(yǔ)

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

文章來(lái)源:站酷  作者:Ant_Design

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)



按鈕組 Button Groups:大量的操作按鈕如何排布與設(shè)計(jì)?

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

What 是什么

簡(jiǎn)介: 按鈕組是把相關(guān)的動(dòng)作組織成一組按鈕的設(shè)計(jì)模式。按鈕組的內(nèi)部?jī)?nèi)容彼此水平或垂直對(duì)齊,并采用相似的視覺設(shè)計(jì)。如果超過三個(gè)或四個(gè)動(dòng)作,往往會(huì)采取多個(gè)分組。

例子: 語(yǔ)雀編輯器的頂部工具欄

undefined


Why 為什么

按鈕組可以讓界面不言自明。在復(fù)雜的布局中,被精心安排過的按鈕組會(huì)很容易被用戶感知和使用。一方面,它們?cè)诮缑嫔贤浅C黠@,用戶能夠一眼看到有這些功能可以進(jìn)行相關(guān)操作。


大家所熟知的格式塔原則(Gestalt principles)也在這里起作用。彼此相鄰的按鈕往往暗示著這些按鈕的功能相近,因此會(huì)讓用戶感覺到這一組按鈕可以完成類似的功能。相對(duì)的,不同的按鈕分組往往暗示著不同的功能類型,因此彼此間應(yīng)該保持間距,或用不同的形狀,或用分割線進(jìn)行區(qū)分。


When 什么時(shí)候使用


如果你需要在界面上展示許多操作按鈕,且需要確保它們隨時(shí)在界面上可見。但同時(shí),你又需要用圖形化的方式組織它們,以使它們看起來(lái)不會(huì)特別散亂。

這些動(dòng)作中有許多是彼此相似的 —— 它們有相似或互補(bǔ)的效果,比如,它們的功能語(yǔ)義相類似 —— 由此它們可以三五成組地放在一起。

按鈕組可以用在對(duì)產(chǎn)品全局有效的操作上(例如「打開」和「選項(xiàng)」操作),或特定的一些通用操作(「保存」、「編輯」和「刪除」),或特定的某些操作(例如布局的「對(duì)齊」、「分布」)。不同范圍的操作不應(yīng)當(dāng)被到一個(gè)組中。


使用條件:

· 存在大量操作按鈕;

· 希望用圖形化的方式組織這些按鈕;

· 操作按鈕間存在功能相關(guān)性和差異性;


How 如何使用

這個(gè)模式的總結(jié)簡(jiǎn)單到像是一句廢話:把相關(guān)的操作按鈕分成一組。


但如果詳細(xì)展開就會(huì)有更多的介紹。比如:


· 如果需要包含文本說明,盡量使用兩個(gè)字或三個(gè)字的動(dòng)詞短語(yǔ),不要使用專業(yè)術(shù)語(yǔ)。

· 不要把不同功能范圍的按鈕放在一個(gè)組,應(yīng)當(dāng)將它們分成不同的分組。

· 同一組的按鈕應(yīng)該有同樣的視覺設(shè)計(jì):邊框、顏色、高度或?qū)挾?、圖標(biāo)風(fēng)格、動(dòng)態(tài)效果等。

· 在空間排布上,可以將它們并排起來(lái)作為橫排放置,如果空間不太適用的話,也可以考慮一列縱列放置(例如Photoshop的左側(cè)工具欄)。

· 如果某一個(gè)動(dòng)作是核心動(dòng)作,可以將其區(qū)別對(duì)待。例如網(wǎng)頁(yè)表單中的“提交”按鈕。核心動(dòng)作是希望大部分用戶都需要(或期待)執(zhí)行的動(dòng)作。讓這個(gè)按鈕擁有更加強(qiáng)烈的圖形或視覺風(fēng)格來(lái)讓它在顯得更為突出。

· 如果按鈕足夠多,而且它們都有小圖標(biāo),你也可以把它們放在工具條或者像工具條那樣的狹長(zhǎng)條上,放置在頁(yè)面的頂部。


通過使用按鈕組可以避免界面上按鈕或鏈接過于擁擠混亂,也可以避免一長(zhǎng)串冗長(zhǎng)的動(dòng)作列表看起來(lái)毫無(wú)關(guān)聯(lián)或區(qū)別。

通過這一模式,你可以創(chuàng)建一個(gè)較為清晰的元素層級(jí)結(jié)構(gòu):用戶可以一眼看出哪些動(dòng)作是彼此相關(guān)的,哪些是重要的。


Example 案例

案例一:Sketch 的頂部按鈕工具區(qū)

用戶需求:編輯設(shè)計(jì)文件中的對(duì)象


Sketch 也是個(gè)很典型的應(yīng)用了按鈕組的設(shè)計(jì)工具。Sketch頂部的按鈕不少于15個(gè), 有很多要理解和追查。 但是得益于精心的視覺和語(yǔ)義組織,界面按鈕始終保持一定的可理解性。

undefined


案例二:macOS Finder

用戶需求:按自己需求對(duì)文件進(jìn)行顯示修改和操作


這個(gè)案例顯示了來(lái)自 macOS 的 Finder 窗口的頂部按鈕組。 秉承其設(shè)計(jì)傳統(tǒng),按鈕風(fēng)格明顯。 導(dǎo)航組是放置在左側(cè)中的按鈕組。 布局相關(guān)的按鈕組放在了中間,文件操作相關(guān)的按鈕組放在了右側(cè)。這樣的設(shè)計(jì)使得界面變得易于理解和使用。

undefined


案例三:WebStorm 頂部操作區(qū)

用戶需求:項(xiàng)目執(zhí)行相關(guān)操作


這個(gè)案例顯示了 Webstorm 的頂部功能操作區(qū)。WebStorm 采用了按鈕組的模式,將項(xiàng)目執(zhí)行的相關(guān)操作和Git相關(guān)的操作聚合在一起,中間使用了分割線進(jìn)行了區(qū)分。

undefined

文章來(lái)源:站酷  作者:Ant_Design

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)



詳解|用戶體驗(yàn)地圖,到底該如何使用?

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

用戶體驗(yàn)地圖是什么 | WHAT

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

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

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

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

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


undefined  

△ 途家 App 用戶租房 · 用戶體驗(yàn)地圖案例



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

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

- 做之前,務(wù)必要先調(diào)研和訪談?dòng)脩羰褂卯a(chǎn)品的情況。

建議時(shí)長(zhǎng):

- 重要項(xiàng)目:120~180 分鐘- 日常項(xiàng)目:60~120分鐘

參與者:

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

工具:

- 電腦或白板+便利貼

 

為什么需要用戶體驗(yàn)地圖 | WHY

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

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

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

 

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

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

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

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

- 通過用戶痛點(diǎn)找到機(jī)會(huì)點(diǎn);

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


undefined


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

 

用戶體驗(yàn)地圖操作流程 | HOW

我們通常會(huì)將流程分成4 個(gè)階段:定義原則和目的 —— 梳理階段流程 —— 洞察痛點(diǎn) —— 尋找機(jī)會(huì)點(diǎn)。


1. 定義原則和目的

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


undefined


2. 梳理階段流程 

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

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

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


undefined


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


undefined


3. 洞察痛點(diǎn)

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


undefined


4. 尋找機(jī)會(huì)點(diǎn)

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

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


undefined


 

如何為過程提效 |TIPS

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

1. 事前

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

2. 事中

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

3. 事后

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

文章來(lái)源:站酷  作者:Ant_Design

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)



如何通過數(shù)據(jù)驅(qū)動(dòng)設(shè)計(jì)

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

一、前言


在日常的工作中,會(huì)經(jīng)常接觸到一些數(shù)據(jù)方面的內(nèi)容,同時(shí)我也在不斷的加強(qiáng)相關(guān)方面的專業(yè)知識(shí)學(xué)習(xí),希望可以借此做一個(gè)總結(jié),與大家分享。如果你也在平時(shí)的工作中遇到相關(guān)的數(shù)據(jù)問題、不知如何利用數(shù)據(jù)推動(dòng)設(shè)計(jì)、或者對(duì)數(shù)據(jù)抱有一定的興趣,那我們可以一起往下看。

本文主要圍繞以下幾個(gè)方面來(lái)進(jìn)行解釋說明:




二、背景


隨著互聯(lián)網(wǎng)大環(huán)境從增量進(jìn)入到存量市場(chǎng),企業(yè)發(fā)展與產(chǎn)品的迭代越來(lái)越離不開數(shù)據(jù)的指導(dǎo),數(shù)據(jù)驅(qū)動(dòng)已然成為當(dāng)下產(chǎn)品的主趨勢(shì)。身為設(shè)計(jì)師的我們,更應(yīng)該對(duì)數(shù)據(jù)保持高度敏感,通過一系列的數(shù)據(jù)分析推動(dòng)設(shè)計(jì)迭代,并讓其更合理、更具有可信度。

任何一款產(chǎn)品,設(shè)計(jì)師都無(wú)法根據(jù)自己的心情、想法,一拍腦門的迅速產(chǎn)出。好的產(chǎn)品,既要考慮市場(chǎng)價(jià)值,也離不開用戶體驗(yàn),應(yīng)該明確目標(biāo)而進(jìn)行實(shí)現(xiàn),所以設(shè)計(jì)過程中需要依靠數(shù)據(jù)給予我們指導(dǎo),即利用數(shù)據(jù)驅(qū)動(dòng)設(shè)計(jì)。



三、深入了解數(shù)據(jù)


3.1 數(shù)據(jù)的作用

數(shù)據(jù)在產(chǎn)品迭代過程中有著舉足輕重的地位,對(duì)于設(shè)計(jì)師而言也是極其重要。在了解數(shù)據(jù)之前,簡(jiǎn)單的理解一下為什么需要數(shù)據(jù),在互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)中,數(shù)據(jù)的作用主要分為以下三點(diǎn)。


3.1.1 提效賦能

工作中或許會(huì)常常面臨多種需求并線進(jìn)行的狀況,合理客觀的數(shù)據(jù)有助于我們更好的分清任務(wù)的優(yōu)先級(jí),并聚焦于當(dāng)前最緊急的任務(wù)展開進(jìn)行。合理有序的安排可以推動(dòng)任務(wù)的快速高效完成。



3.1.了解用戶

設(shè)計(jì)師與真正的用戶之間往往存在一定的差異,我們不能按照設(shè)計(jì)師固有的思維方式去衡量用戶的想法,更不能想當(dāng)然的覺得用戶需要什么。

數(shù)據(jù)可以幫助我們更好的了解用戶,利用數(shù)據(jù)分析的種種方法,我們可以進(jìn)行抽絲剝繭,發(fā)現(xiàn)更深層次的問題,不斷的去深挖用戶需求,進(jìn)而更好的滿足用戶,只有這樣我們才能更好的留住用戶,促進(jìn)產(chǎn)品增收。



3.1.設(shè)計(jì)支撐

在進(jìn)行設(shè)計(jì)輸出的過程中,我們可能常常會(huì)遇到以下情況:

我相信各位設(shè)計(jì)師在日常的對(duì)接中,一定是根據(jù)需求文檔進(jìn)行了設(shè)計(jì)輸出,但是在設(shè)計(jì)評(píng)審階段卻很難去說服各需求方。數(shù)據(jù)在此情景下就顯得非常重要,它可以幫助我們針對(duì)設(shè)計(jì)方案有一個(gè)理性的數(shù)據(jù)支撐,去衡量我們的設(shè)計(jì)方案是否合理有效。

其次在項(xiàng)目上線后依據(jù)數(shù)據(jù)反饋,可以驗(yàn)證此次設(shè)計(jì)是否達(dá)到理想目標(biāo),是否還有進(jìn)一步優(yōu)化的空間。了解數(shù)據(jù)可以更好的幫助我們深耕需求、把控方向。



3.2 數(shù)據(jù)的類型

為了進(jìn)一步了解數(shù)據(jù),現(xiàn)將所有的數(shù)據(jù)進(jìn)行整合區(qū)分,大致上可以分為兩個(gè)類型,分別是定性數(shù)據(jù)與定量數(shù)據(jù)兩大類。

定性數(shù)據(jù)指導(dǎo)設(shè)計(jì)過程,往往判斷某件事物的意義與價(jià)值。定量數(shù)據(jù)關(guān)注數(shù)據(jù)頻率,在結(jié)果上更具有說服力。這兩種數(shù)據(jù)的類型在數(shù)據(jù)分析以及設(shè)計(jì)驅(qū)動(dòng)的過程中都非常重要。時(shí)常會(huì)通過定性數(shù)據(jù)來(lái)發(fā)現(xiàn)、定義問題,最后再由定量數(shù)據(jù)來(lái)驗(yàn)證結(jié)果。


3.2.1 定性數(shù)據(jù)

定性數(shù)據(jù)是非統(tǒng)計(jì)數(shù)據(jù),在樣本選取上,數(shù)據(jù)量較少,主要收集途徑有以下方法:應(yīng)用商店評(píng)論、客服反饋、音視頻記錄、筆記反饋、訪談?wù){(diào)研等。

可以快速了解到用戶的行為和態(tài)度,這種數(shù)據(jù)具有可調(diào)查性,是可以進(jìn)行深入研究的,能進(jìn)一步推斷出設(shè)計(jì)的哪些方面存在問題,從而通過設(shè)計(jì)方法優(yōu)化產(chǎn)品設(shè)計(jì)體驗(yàn)。


3.2.2 定量數(shù)據(jù)

定量數(shù)據(jù)是統(tǒng)計(jì)性的,可以用來(lái)問“多少”的問題,最終生成結(jié)論性的數(shù)據(jù)信息。收集途徑可以有以下方法:測(cè)試、產(chǎn)品數(shù)據(jù)、指標(biāo)上報(bào)、實(shí)驗(yàn)調(diào)查等。

定量數(shù)據(jù)提供了對(duì)設(shè)計(jì)的間接評(píng)估,可以快速了解用戶基礎(chǔ)信息數(shù)據(jù)以及對(duì)產(chǎn)品的使用感知,例如完成率、滿意度等等數(shù)據(jù)指標(biāo),它不僅可以幫助我們快速統(tǒng)計(jì)信息,還能驗(yàn)證結(jié)果。




3.3 數(shù)據(jù)的維度

數(shù)據(jù)不應(yīng)該是只停留在表面的數(shù)字,需要深入的了解數(shù)據(jù),善于從這一堆數(shù)字背后,發(fā)現(xiàn)數(shù)據(jù)的真實(shí)意義。

由此,Google推出HEART模型,作為一套完善的用以評(píng)估以及提升用戶體驗(yàn)的標(biāo)準(zhǔn)。HEART模型包括五個(gè)維度,分別為:愉悅度(Happiness)、參與度(Engagement)、接受度(Adoption)、留存度(Retention)、完成度(Task success)。通過這種方式將數(shù)據(jù)分為五個(gè)維度,可以更有效的明白不同類型的數(shù)據(jù)所體現(xiàn)的真實(shí)含義。



3.3.1 愉悅度(Happiness)

什么是愉悅度?關(guān)于這個(gè)問題,大概一千個(gè)人會(huì)有一千個(gè)回答吧,因此愉悅度更偏向于用戶在產(chǎn)品使用過程中直觀的主觀感受,例如滿意度、產(chǎn)品體驗(yàn)感受、推薦指數(shù)、易用性感知等等體驗(yàn)指標(biāo),通過這一類的數(shù)據(jù)可以有效的了解用戶對(duì)于產(chǎn)品或者某個(gè)功能的喜好程度。

可以利用定性研究的方式獲取用戶在體驗(yàn)和感知上愉悅程度,例如一對(duì)一訪談、觀察小組、可行性測(cè)試等。也可以通過定量調(diào)查中的問卷、數(shù)據(jù)反饋、AB測(cè)試等了解用戶的使用情況以及推薦指數(shù)等。



3.3.2 參與度(Engagement)

指用戶在使用產(chǎn)品功能時(shí)的參與深度,衡量指標(biāo)即為有效活躍用戶的數(shù)量。用戶參與度并沒有統(tǒng)一的可量化的界定標(biāo)準(zhǔn),但大致上可以分為以下幾個(gè)指標(biāo),產(chǎn)品訪問頻次、平均訪問時(shí)長(zhǎng)、訪問頁(yè)面數(shù)量、產(chǎn)品使用間隔。

數(shù)據(jù)的衡量只是最基礎(chǔ)的一步,更重要的是如何提升用戶的參與度,對(duì)于新用戶而言,可以通過引導(dǎo)、幫助等建立良好的第一印象;對(duì)于老用戶,需要合理的推送相關(guān)優(yōu)惠與活動(dòng),也可以利用游戲化運(yùn)營(yíng)建立長(zhǎng)期關(guān)系,這些都是比較有效的提升參與度的方法。



3.3.3 接受度(Adoption)

當(dāng)一個(gè)新的產(chǎn)品與功能出現(xiàn)時(shí),由于陌生感,用戶短時(shí)間內(nèi)很難接受,而接受度就是指用戶在特定時(shí)間內(nèi)真正開始習(xí)慣并使用。

為了快速得到用戶的認(rèn)可,往往產(chǎn)品設(shè)計(jì)中會(huì)通過競(jìng)品分析的方式確??蚣軆?nèi)容與市場(chǎng)的同類產(chǎn)品保持一致,滿足用戶的使用習(xí)慣。而針對(duì)大部分的新用戶也會(huì)使用新功能引導(dǎo)以及相關(guān)通知推送等加快新用戶的接受度。



3.3.4 留存度(Retention)

在產(chǎn)品運(yùn)營(yíng)中,留存是最關(guān)鍵的數(shù)據(jù)指標(biāo),它也是產(chǎn)品獲利與增長(zhǎng)中最主要因素之一,留存直接決定了用戶是否愿意繼續(xù)使用,它是最真實(shí)的數(shù)據(jù)表現(xiàn),而留存通常體現(xiàn)在,多日留存率、回訪率、不同平臺(tái)的使用重合率等。

針對(duì)這一數(shù)據(jù)我們需要關(guān)注的核心問題就是如何提升用戶留存率,大致的方法可以分為以下兩個(gè)維度:

(1) 產(chǎn)品維度

產(chǎn)品功能決定是決定用戶留存的關(guān)鍵。在需求設(shè)計(jì)上,通過挖掘潛在需求,刺激用戶長(zhǎng)期使用,并且通過拓展應(yīng)用場(chǎng)景,不斷提供細(xì)分服務(wù),進(jìn)一步滿足用戶;甚至我們也會(huì)發(fā)現(xiàn)在大多數(shù)產(chǎn)品中,通過建立社區(qū),打造社交圈子,強(qiáng)化用戶的粘性。

(2) 運(yùn)營(yíng)維度

產(chǎn)品使用過程中,合理的運(yùn)營(yíng)也是提升用戶留存的關(guān)鍵之一,常用的方法有定期舉辦活動(dòng)、例如砍價(jià)、助力、簽到、每日任務(wù)等;也可以通過消息推送挽留用戶。



3.3.5 完成度(Task success)

完成度主要是指用戶對(duì)于關(guān)鍵任務(wù)的完成率,常常用來(lái)衡量交互流程是否合理。主要包括以下維度:首次點(diǎn)擊時(shí)間、操作完成時(shí)間、完成點(diǎn)擊次數(shù)、完成率、失敗率、出錯(cuò)率等。

A: 任務(wù)完成度的衡量指標(biāo)該怎么計(jì)算呢?

(1) 任務(wù)完成時(shí)間

用戶在整個(gè)任務(wù)過程中,所花費(fèi)的時(shí)間即為任務(wù)完成時(shí)間。

(2) 完成率

完成率=完成的操作次數(shù)/開始操作的次數(shù)


產(chǎn)品設(shè)計(jì)中,為了提升完成率,需要輔助用戶進(jìn)行交互并進(jìn)行引導(dǎo)設(shè)計(jì),不僅需要符合不同場(chǎng)景變化以及用戶的心智模型,還要給予用戶體驗(yàn)流程中的舒適感受,進(jìn)一步輔助其完成任務(wù)。


B: 如何提升任務(wù)的完成率呢?

(1) 降低理解成本

利用設(shè)計(jì)手法,降低任務(wù)流程中的理解成本,切入到實(shí)際的場(chǎng)景中,幫助用戶快速完成任務(wù)。

例如在列表模塊中,默認(rèn)狀態(tài)下的輸入框內(nèi),展示灰色的提醒文案,提前告知用戶該區(qū)域應(yīng)該填寫的內(nèi)容;比如說高德地圖通過AR技術(shù)結(jié)合導(dǎo)航,快速幫助用戶完成導(dǎo)航任務(wù);再類似于可視化數(shù)據(jù)看板,幫助用戶快速獲取信息結(jié)果。


(2) 精簡(jiǎn)任務(wù)流程

降低理解成本只能單一的滿足用戶操作前的理解,而操作過程中的步驟長(zhǎng)短也起到非常關(guān)鍵的作用。優(yōu)化任務(wù)流程,目的就是為了提升完成率。

例如用戶在進(jìn)行登錄注冊(cè)時(shí),可以點(diǎn)擊右上角的文案即可實(shí)現(xiàn)登錄注冊(cè)狀態(tài)的快速切換,減少用戶切換的流程步驟。再比如說表單填寫類的產(chǎn)品,還可以將相同的內(nèi)容進(jìn)行整合,減少操作。甚至電商產(chǎn)品中,可以通過找相似減少用戶的篩選成本。



(3) 系統(tǒng)智能預(yù)判,提供幫助

結(jié)合用戶的場(chǎng)景與行為,進(jìn)行合理的預(yù)判設(shè)計(jì),有助于縮短用戶操作路徑、引導(dǎo)用戶轉(zhuǎn)化。例如下面的案例,在表單信息填寫中,通過智能判斷關(guān)聯(lián)內(nèi)容,提供幫助,甚至通過判斷用戶的行為,進(jìn)行精準(zhǔn)內(nèi)容推送。



3.4 常用的數(shù)據(jù)

通過以上數(shù)據(jù)的五個(gè)維度,可以發(fā)現(xiàn)數(shù)據(jù)的覆蓋面是十分廣泛的,不同的數(shù)據(jù)反映不同的內(nèi)容。在工作中我們也會(huì)接觸到復(fù)雜且多樣的數(shù)據(jù),對(duì)于設(shè)計(jì)師而言,常用的數(shù)據(jù)大致可以劃分為用戶數(shù)據(jù)、行為數(shù)據(jù)、業(yè)務(wù)數(shù)據(jù)這三大類別。



3.4.1 用戶數(shù)據(jù)

從字面上理解用戶數(shù)據(jù)即為與用戶有關(guān)的數(shù)據(jù),這種數(shù)據(jù)常常用來(lái)描述用戶人群、用戶基礎(chǔ)屬性等。通過一系列的“用戶數(shù)據(jù)”進(jìn)行支撐,可以快速梳理關(guān)于產(chǎn)品的基礎(chǔ)用戶群體,構(gòu)建用戶的畫像。

不同的產(chǎn)品屬性,有不同的用戶人群畫像。比如說美柚這款記錄類APP,主要的用戶人群是年輕的女性,對(duì)生活有一定的追求;再比如說英語(yǔ)流利說這款產(chǎn)品,主要的用戶人群是年輕的、有明確學(xué)習(xí)英語(yǔ)需求的人群。

用戶數(shù)據(jù)主要包括兩大類別:用戶基本屬性與用戶生命周期數(shù)據(jù)。


a、用戶基本屬性

用戶基本屬性通俗解釋即為關(guān)于用戶自身最基本的屬性,包括性別、地域、年齡、職業(yè)、學(xué)歷、收入、婚姻狀況等等......通過這一系列的屬性,我們可以對(duì)用戶有一個(gè)更深刻、更全面的認(rèn)知。

只有更好的了解用戶,我們才能進(jìn)行針對(duì)化的設(shè)計(jì)產(chǎn)出、精準(zhǔn)投放,從而推動(dòng)產(chǎn)品更好的發(fā)展。這就好比兩個(gè)人談戀愛,只有清楚對(duì)方的想法、習(xí)慣、喜好,才能減少吵架的幾率,實(shí)現(xiàn)和諧發(fā)展。



b、用戶生命周期數(shù)據(jù)

生命周期指的是從開始到結(jié)束,用戶都會(huì)經(jīng)歷著從接觸到流失的階段,我們通過生命周期結(jié)合用戶數(shù)據(jù)可以簡(jiǎn)單分為新增、活躍、留存、流失。


1、新增用戶數(shù)

新增用戶從字面上拆解開來(lái)即為新、增,廣泛意義上來(lái)說,我們可以將一段時(shí)間內(nèi)打開產(chǎn)品的新用戶人數(shù)算作新增用戶,但是更嚴(yán)謹(jǐn)一點(diǎn)的話,則表示某產(chǎn)品一段時(shí)間內(nèi)新增加的注冊(cè)用戶數(shù)量。

通常我們將下載且訪問過產(chǎn)品的用戶稱為訪客,這部分人群是潛在的注冊(cè)用戶。


2、活躍用戶數(shù)

活躍用戶在體驗(yàn)產(chǎn)品的過程中會(huì)花費(fèi)更多的時(shí)間與精力,相比普通用戶而言他們更加認(rèn)可平臺(tái),對(duì)于平臺(tái)的發(fā)展有著重要的地位。那什么是活躍用戶?如何具體的去定義活躍用戶呢?

通常來(lái)說,用戶在規(guī)定的時(shí)間周期內(nèi),有打開過產(chǎn)品,這就算做一個(gè)活躍用戶。當(dāng)然,不同平臺(tái)對(duì)于活躍用戶的定義存在一定差異。而活躍用戶主要也分為兩類:新用戶與老用戶,而從商業(yè)的角度上還可以劃分為低價(jià)值用戶與高價(jià)值用戶。

活躍用戶數(shù)常見的指標(biāo)有DAU、WAU、MAU。

DAU:Daily Active User,表示日活躍用戶數(shù)量,指的是從0:00-24:00一個(gè)自然日(統(tǒng)計(jì)日)之間,登錄并使用了某一功能的用戶數(shù)量。

例:某個(gè)產(chǎn)品的日活計(jì)算方式為打開該APP即算活躍,2022年1月19日這天打開APP的行為有50次,經(jīng)排重后發(fā)現(xiàn)有30個(gè)用戶打開了APP,那么該產(chǎn)品的DAU就是30。

了解完DAU,我相信大家對(duì)于WAU(周活躍用戶數(shù)量)與MAU(月活躍用戶數(shù)量)應(yīng)該不至于陌生了。WAU與MAU,他們兩者最大的區(qū)別就是計(jì)算周期的不同,但需要注意的是,月活的計(jì)算并不是簡(jiǎn)單的日活相加,我們需要進(jìn)行去重。



3、用戶留存率

在講解用戶留存率之前,我們應(yīng)該了解用戶留存。何為用戶留存?顧名思義,就是最終留下來(lái)的用戶。用戶留存率這一指標(biāo)可以反饋當(dāng)前產(chǎn)品的質(zhì)量如何,這是產(chǎn)品自初期開始就需要持續(xù)關(guān)注的內(nèi)容。常用的用戶留存指標(biāo)有次日留存、3日留存、7日留存、15日留存和30日留存。



4、用戶流失

用戶流失的定義是什么?用戶流失需要結(jié)合時(shí)間(Time)與動(dòng)作(Action)這兩個(gè)指標(biāo)進(jìn)行,即用戶在一段特定時(shí)間內(nèi)未進(jìn)行關(guān)鍵行為的操作。與之常常相關(guān)聯(lián)的因素大致分為產(chǎn)品生命周期、負(fù)面體驗(yàn)、競(jìng)品策略等等。

用戶流失率的存在表明了用戶對(duì)產(chǎn)品的負(fù)面反映,對(duì)于產(chǎn)品發(fā)展有著非常重要的數(shù)據(jù)反饋。

當(dāng)下市場(chǎng)中的獲客成本越來(lái)越高,獲取新用戶的成本要比留住現(xiàn)有用戶的成本高出5倍。因此降低用戶流失率,就顯得尤為重要。



3.4.2 行為數(shù)據(jù)

行為數(shù)據(jù)常用來(lái)描述用戶使用方式,指的是用戶在使用產(chǎn)品過程中所產(chǎn)生的一系列交互相關(guān)的數(shù)據(jù),通過分析快速了解用戶特征,為流程優(yōu)化、精細(xì)化運(yùn)營(yíng)、產(chǎn)品體驗(yàn)等設(shè)計(jì)措施提供判斷依據(jù)、輔助設(shè)計(jì)。

行為數(shù)據(jù)的指標(biāo)主要包括轉(zhuǎn)化率、平均停留時(shí)長(zhǎng)、跳出率、PV、UV等等。

1、轉(zhuǎn)化率

什么是轉(zhuǎn)化率?轉(zhuǎn)化率就是下一頁(yè)面與當(dāng)前頁(yè)面的訪問占比。它常常被用來(lái)衡量產(chǎn)品路徑中的用戶體驗(yàn)是否合理,從而進(jìn)一步推動(dòng)流程優(yōu)化以及設(shè)計(jì)迭代。

以下圖為例,有200個(gè)人來(lái)到了頁(yè)面A,其中有100人點(diǎn)擊頁(yè)面A的按鈕進(jìn)入頁(yè)面B,那么頁(yè)面A按鈕的轉(zhuǎn)化率則為(100/200)*100%=50%。


2、啟動(dòng)次數(shù)

通常指的是某一特定時(shí)間段內(nèi)用戶啟動(dòng)應(yīng)用的次數(shù)。與之相關(guān)的兩大指標(biāo)分別為用戶總啟動(dòng)次數(shù)與人均啟動(dòng)次數(shù),常用來(lái)反映用戶粘性與活躍度。


3、使用時(shí)長(zhǎng)

使用時(shí)長(zhǎng)是指某一特定時(shí)間段內(nèi)用戶從打開到關(guān)閉產(chǎn)品的使用時(shí)間。使用時(shí)長(zhǎng)需關(guān)注的指標(biāo)為用戶總使用時(shí)長(zhǎng)、人均使用時(shí)長(zhǎng)、單次使用時(shí)長(zhǎng)。這些指標(biāo)常用來(lái)衡量用戶粘性與活躍度,常常需要與啟動(dòng)次數(shù)一起結(jié)合進(jìn)行分析。


4、訪問分析

頁(yè)面訪問分析包括頁(yè)面訪問次數(shù)、停留時(shí)長(zhǎng)、跳出/退出率、用戶訪問頁(yè)面數(shù)和用戶訪問路徑。


(1) 訪問次數(shù)

訪問次數(shù)是指訪客完整打開頁(yè)面進(jìn)行訪問的次數(shù),常用來(lái)衡量產(chǎn)品的訪問速度。

(2) 停留時(shí)長(zhǎng)

停留時(shí)長(zhǎng)表示用戶進(jìn)入產(chǎn)品中,呆了多長(zhǎng)時(shí)間后離去。這一指標(biāo)是考量用戶粘性以及貢獻(xiàn)度的重要指標(biāo)。

(3) 跳出率/退出率

跳出率,指的是只訪問了入口頁(yè)面即退出的次數(shù)與入口頁(yè)面訪問次數(shù)的占比數(shù)。

跳出率越低,說明流量越好,用戶對(duì)產(chǎn)品的興趣越高。

計(jì)算公式為:跳出率=訪問一個(gè)頁(yè)面后離開的次數(shù)/總訪問次數(shù)*100%

 

退出率是指從該頁(yè)面退出的頁(yè)面訪問數(shù)與進(jìn)入該頁(yè)面的頁(yè)面訪問數(shù)之比。

計(jì)算公式為:退出率=退出次數(shù)/總訪問次數(shù)*100%


跳出率為(2/8)*100%=25%

退出率為{(2+2)/(8+2)}*100%=40%

 

注意:跳出率與退出率較高,也不全部都是壞事。我們需要具體問題具體分析。比如說某些下單頁(yè)面,點(diǎn)擊提交后會(huì)進(jìn)入第三方支付平臺(tái),該頁(yè)面跳出率高則為正常。



(4) 用戶訪問頁(yè)面數(shù)

用戶訪問頁(yè)面數(shù)常常離不開兩方面的指標(biāo),PV值與UV值。

PV(Page View):指的是在一個(gè)特定周期內(nèi),頁(yè)面訪問量或點(diǎn)擊量,側(cè)重瀏覽量。

用戶每訪問一次就算作一個(gè)PV。

UV(User View):指的是在一個(gè)特定周期內(nèi),訪問頁(yè)面的人數(shù)之和,側(cè)重訪客數(shù)。

一天內(nèi)同個(gè)用戶多次訪問僅算作一個(gè)UV。



(5) 用戶訪問路徑

用戶訪問路徑是統(tǒng)計(jì)用戶從進(jìn)入產(chǎn)品到離開產(chǎn)品整個(gè)過程中的路徑與頁(yè)面訪問情況,不同的用戶路徑是不同的,我們需要去定位關(guān)鍵節(jié)點(diǎn),針對(duì)性的產(chǎn)出優(yōu)化方案。

如下圖所示,用戶在進(jìn)行針對(duì)性的查找歌曲時(shí),通過首頁(yè)的搜索入口進(jìn)入,在搜索引導(dǎo)頁(yè)面中輸入歌名,最終出現(xiàn)結(jié)果頁(yè)。通過用戶的訪問路徑分析,可以為我們進(jìn)行優(yōu)化提供合理的切入點(diǎn)。





3.4.3 業(yè)務(wù)數(shù)據(jù)


1、ARPU

ARPU是 “The average revenue per user” 的縮寫,是指在某一周期內(nèi)用戶產(chǎn)生的平均收入,用來(lái)衡量單個(gè)用戶為企業(yè)所帶來(lái)的效益。

注意:ARPU值是有時(shí)間屬性的,我們?cè)谟?jì)算的時(shí)候需要有清楚的時(shí)間定義,不同的定義方法,計(jì)算出來(lái)的結(jié)果是有很大差異的。



2、付費(fèi)率

不同業(yè)務(wù)模式之間的付費(fèi)率計(jì)算方式是不同的,在進(jìn)行分析之前,我們就需要弄清楚分析的維度。

(1) 注冊(cè)用戶付費(fèi)率

注冊(cè)用戶付費(fèi)率=付費(fèi)人數(shù)/注冊(cè)人數(shù)

(2) 活躍用戶付費(fèi)率

活躍用戶付費(fèi)率=付費(fèi)人數(shù)/活躍用戶人數(shù)



3、GMV (成交金額

GMV (Gross Merchandise Volume),即成交金額。這個(gè)指標(biāo)常用在電商行業(yè),是用來(lái)衡量電商企業(yè)綜合實(shí)力的核心指標(biāo)。

GMV=真實(shí)成交金額+未付款訂單金額+拒收訂單金額+退貨訂單金額。簡(jiǎn)而言之就是GMV為已付款訂單與未付款訂單兩者之和。



4、LTV (用戶終身價(jià)值)

LTV(Life Time Value),為用戶生命周期價(jià)值。一般常用指標(biāo)為3日、5日、7日、30日、60日、90日LTV。常用來(lái)衡量用戶從開始使用到不再使用產(chǎn)品的整個(gè)生命周期內(nèi),為企業(yè)貢獻(xiàn)了多少收入。

它的計(jì)算方式由兩部分組成:LTV=LTxARPU,LT為用戶生命周期,ARPU為每用戶平均收入。




四、數(shù)據(jù)分析思維

數(shù)據(jù)分析不僅僅是擺數(shù)據(jù),同時(shí)深度的結(jié)論也非常重要??沼袛?shù)據(jù),沒有結(jié)論,對(duì)于決策者而言并沒有什么明確的用處。那么,面對(duì)一堆數(shù)據(jù),我們?cè)撊绾畏治龅贸錾疃鹊慕Y(jié)論,從而驅(qū)動(dòng)決策?


4.1 數(shù)據(jù)來(lái)源

數(shù)據(jù)的獲取渠道有很多種方式,接下來(lái)分享幾個(gè)我在工作中經(jīng)常使用的方法。


4.1.1、數(shù)據(jù)分析平臺(tái)

注意:同一關(guān)鍵詞,不同平臺(tái)的搜索結(jié)果可能存在一定差異



4.1.2、內(nèi)部咨詢

平時(shí)的工作中,我們不能僅僅是沉浸在自己的世界,需要加強(qiáng)與其他同事之間的溝通交流。通過與用戶運(yùn)營(yíng)、數(shù)據(jù)分析師的交流,可以了解到最新的數(shù)據(jù)情況,時(shí)刻保持敏感度。

如果公司沒有專門的數(shù)據(jù)分析師,也可以從客服人員下手,他們無(wú)疑是與客戶打交道最直接的人了,他們對(duì)于用戶的痛點(diǎn)會(huì)更及時(shí)感知??梢酝ㄟ^詢問客服人員,更好的了解用戶的痛點(diǎn)需求,輔助我們?cè)O(shè)計(jì)方案的執(zhí)行。




4.1.3、用戶反饋

我們可以通過多種方式了解用戶對(duì)于產(chǎn)品的反饋,比如說Feedback用戶反饋,Twitter、Facebook等社交媒體,以及Google Play應(yīng)用商店評(píng)論等。



4.1.4、數(shù)據(jù)埋點(diǎn)

針對(duì)想要查看相關(guān)數(shù)據(jù)的模塊內(nèi)容,提交關(guān)鍵數(shù)據(jù)指標(biāo)給到數(shù)據(jù)分析師、開發(fā)等,從而進(jìn)行一個(gè)定制化的內(nèi)容獲取。

注意:說到這里就不得不提到數(shù)據(jù)埋點(diǎn),有一個(gè)需要我們注意的地方,那就是在進(jìn)行埋點(diǎn)時(shí),一定要在設(shè)計(jì)階段就提前告知開發(fā)以及數(shù)據(jù)分析師,做好溝通工作,針對(duì)需要的數(shù)據(jù)進(jìn)行埋點(diǎn)處理。



4.1.5、需求評(píng)審

在需求評(píng)審前,設(shè)計(jì)師可以提前了解相關(guān)數(shù)據(jù),幫助我們對(duì)于設(shè)計(jì)層面有個(gè)更深刻的理解。在評(píng)審過程中,通過溝通碰撞了解到更多的數(shù)據(jù),也能依據(jù)之前項(xiàng)目的數(shù)據(jù)資料作為參考,輔助本次設(shè)計(jì)優(yōu)化。



4.1.6、復(fù)盤分享

在一些大的項(xiàng)目上線一段時(shí)間后需要進(jìn)行數(shù)據(jù)反饋,大家針對(duì)結(jié)果做一個(gè)項(xiàng)目復(fù)盤,開展相關(guān)會(huì)議。在這結(jié)果之外,我們還需要關(guān)注是否產(chǎn)生了新問題以及是否有新的機(jī)會(huì)發(fā)掘點(diǎn)。在復(fù)盤之后,針對(duì)知識(shí)點(diǎn)進(jìn)行共享,設(shè)計(jì)師可以通過這種方式了解更多信息,方便后期迭代。




4.2 甄別數(shù)據(jù)

數(shù)據(jù)的呈現(xiàn)往往告訴我們已經(jīng)發(fā)生了什么,但它沒有告訴我們將會(huì)發(fā)生什么。我們應(yīng)該利用數(shù)據(jù),從歷史中吸取教訓(xùn),也可以依據(jù)過去的趨勢(shì)預(yù)測(cè)未來(lái),甚至可能是非常準(zhǔn)確的預(yù)測(cè)。我們需要對(duì)數(shù)據(jù)有一個(gè)理性的判斷,進(jìn)行甄別。

4.2.1 虛榮數(shù)據(jù)

什么是虛榮數(shù)據(jù)?如果空有一個(gè)數(shù)據(jù),盡管該數(shù)字看起來(lái)很美,卻無(wú)法依靠該數(shù)據(jù)去進(jìn)行設(shè)計(jì)驅(qū)動(dòng)以及提供具體價(jià)值,那么該數(shù)據(jù)就是一個(gè)虛榮數(shù)據(jù),毫無(wú)意義。

以下幾個(gè)指標(biāo)則是常見的虛榮數(shù)據(jù),我們需要引起注意。


1、點(diǎn)擊量

無(wú)論什么網(wǎng)站,只要頁(yè)面上存在的可點(diǎn)擊區(qū)域多,那么該頁(yè)面的整體點(diǎn)擊量數(shù)字必然都比較高。相比之下,我們更應(yīng)該關(guān)注的是點(diǎn)擊人數(shù),而不是點(diǎn)擊次數(shù)。100個(gè)用戶每人點(diǎn)擊1次,與1個(gè)人點(diǎn)擊100次,后續(xù)帶來(lái)的結(jié)果是必然不同的。


2、下載量 

下載量的多少有時(shí)候會(huì)影響產(chǎn)品在應(yīng)用商店中的排名,但是這個(gè)數(shù)據(jù)指標(biāo)并不能帶來(lái)實(shí)際價(jià)值。反觀下載之后的注冊(cè)轉(zhuǎn)化率、付費(fèi)轉(zhuǎn)化率等等才是我們關(guān)注的重點(diǎn)。


3、用戶數(shù)

用戶數(shù)量越大,這個(gè)產(chǎn)品聽起來(lái)似乎就越成功。但是產(chǎn)品的成功與否,并不僅僅取決于這一個(gè)數(shù)字,而是與之相關(guān)的一系列指標(biāo)。

比如說A、B兩款產(chǎn)品的用戶量分別為100萬(wàn)以及50萬(wàn),用戶活躍度分別為1%與30%,其他都是沉默用戶,那么就一定能說A產(chǎn)品要比B產(chǎn)品好嗎?

用戶數(shù)量再大,沒有體現(xiàn)出對(duì)應(yīng)的價(jià)值,那么就是虛擬數(shù)據(jù)。我們不能被這些虛擬數(shù)字所欺騙,還沾沾自喜。


4、停留時(shí)長(zhǎng)

用戶的停留時(shí)間越長(zhǎng)就說明這個(gè)產(chǎn)品越好嗎?真的是由于產(chǎn)品的用戶體驗(yàn)做的足夠好而讓用戶產(chǎn)生了沉浸式的體驗(yàn)從而一直停留嗎?

用戶的停留時(shí)長(zhǎng)并不是越長(zhǎng)越好,這個(gè)指標(biāo)也無(wú)法直觀反映用戶對(duì)產(chǎn)品的粘性。我們更應(yīng)該結(jié)合完成度、內(nèi)容跳出率等數(shù)據(jù)進(jìn)行綜合判斷。




4.2.2 異常數(shù)據(jù)

數(shù)據(jù)分析過程中,也會(huì)存在很多異常數(shù)據(jù),需要從多個(gè)角度看待數(shù)據(jù),一般來(lái)說,產(chǎn)品的部分?jǐn)?shù)據(jù)指標(biāo)存在固定的波動(dòng)周期,當(dāng)某項(xiàng)數(shù)據(jù)指標(biāo)突然不符合常規(guī)波動(dòng)變化的時(shí)候,我們就需要去進(jìn)行深入的研究,挖掘異常背后的原因。


1、幸存者偏差

幸存者偏差是數(shù)據(jù)分析中常見的邏輯錯(cuò)誤,那么簡(jiǎn)單來(lái)說是什么意思呢?

通過以上幾個(gè)例子,想必大家對(duì)于幸存者偏差都有一定的理解了吧。所謂幸存者偏差,即我們?cè)谶M(jìn)行統(tǒng)計(jì)的時(shí)候忽略了樣本的隨機(jī)性與全面性,用局部樣本代替總體樣本。歸根到底這就是由于獲取信息知識(shí)的不全導(dǎo)致的認(rèn)知偏差。這啟示我們?cè)诓榭磾?shù)據(jù)的時(shí)候,不能只看顯而易見的信息,同時(shí)還要找出沉默信息。否則,一定會(huì)存在著巨大偏差。


2、數(shù)據(jù)樣本不夠

在進(jìn)行數(shù)據(jù)提取的過程中,除了需要注意上面所描述的樣本選擇問題上,還需保證足夠多的樣本數(shù)量來(lái)進(jìn)行支撐。按照常規(guī)定律來(lái)說,數(shù)據(jù)樣本達(dá)到一定的數(shù)量程度,才能展示出相對(duì)真實(shí)的規(guī)律。

例:比如說我們?cè)诋a(chǎn)品中新增了一個(gè)功能,但是由于預(yù)算、人力資源等原因在前期的推廣宣傳階段并沒有多少曝光,只有一部分老用戶知道,這就說明這個(gè)功能很失敗,沒有存在的意義嗎?答案未必是這樣。

所以在進(jìn)行數(shù)據(jù)提取時(shí),我們就需要盡可能的保證有足夠多的樣本數(shù)據(jù),這樣才能保證最終輸出的數(shù)據(jù)結(jié)果是最客觀的。


3、存在臟數(shù)據(jù)

臟數(shù)據(jù),也被稱為壞數(shù)據(jù),常常是指不合理、對(duì)于業(yè)務(wù)毫無(wú)用處的數(shù)據(jù)。

臟數(shù)據(jù)產(chǎn)生的原因有多種,數(shù)據(jù)統(tǒng)計(jì)過程中可能是由于輸入了多余空格、重復(fù)插入多余數(shù)據(jù)等等。在前期數(shù)據(jù)收集分析階段,例如問卷調(diào)查,往往會(huì)存在很多無(wú)意義的問卷,為了保證問卷的準(zhǔn)確性,可以通過設(shè)置分支題目、陷阱題目等等方式來(lái)進(jìn)一步篩選問卷,做好對(duì)臟數(shù)據(jù)的防控與清洗。



4.3 分析方法

接下來(lái)給大家分享幾個(gè)平時(shí)工作中常用的數(shù)據(jù)分析方法,包括以下幾種:漏斗分析法、矩陣分析法、對(duì)比分析法。


4.3.1 漏斗分析法

漏斗分析法是數(shù)據(jù)分析過程中非常重要的一種分析模型,能夠科學(xué)的反映用戶行為狀態(tài)以及從起點(diǎn)到終點(diǎn)各階段之間的用戶轉(zhuǎn)化情況。

常用的指標(biāo)包含轉(zhuǎn)化率與流失率。通過層層的分析,觀察流程中是否存在提高轉(zhuǎn)化率的機(jī)會(huì)點(diǎn),挖掘設(shè)計(jì)。(后面會(huì)結(jié)合實(shí)際項(xiàng)目為例進(jìn)行詳細(xì)闡述,這里就不做過多講解)


4.3.2 對(duì)比分析法

所謂的對(duì)比分析,就是給孤零零的數(shù)據(jù)一個(gè)合理的參考,否則這種數(shù)據(jù)是沒有意義的。在利用對(duì)比分析法進(jìn)行數(shù)據(jù)分析時(shí),需要關(guān)注兩個(gè)方面內(nèi)容:對(duì)比對(duì)象與對(duì)比維度。

在產(chǎn)品迭代測(cè)試的過程中,為了增強(qiáng)說服力,擇決出最佳方案,往往會(huì)采用對(duì)比分析,也就是常說的A/B Test。A/B Test最核心的思想是要保證單一變量,其他條件保證相同?;氐皆O(shè)計(jì)本身,一般來(lái)說每個(gè)方案應(yīng)該大體上相同,只是某一個(gè)地方有所不同,比如某處文案、顏色、圖標(biāo)等。然后針對(duì)不同的用戶展示不同方案,統(tǒng)計(jì)并對(duì)比不同方案的轉(zhuǎn)化率、留存率等指標(biāo),從而確定最優(yōu)方案。


4.3.3 矩陣分析法

矩陣分析法常常是通過兩個(gè)指標(biāo)的交叉,利用分析矩陣劃分為四個(gè)象限,找出問題的優(yōu)先級(jí)。

例:如下圖所示,為某個(gè)運(yùn)營(yíng)活動(dòng)點(diǎn)擊的四象限分布情況。X軸自左向右,Y軸自下而上,分別代表了從低到高。

通過矩陣分析的方式,我們可以快速定位當(dāng)前最值得的MVP優(yōu)化方式,指引我們?cè)趶?fù)雜的數(shù)據(jù)中正確前行。



五、數(shù)據(jù)驅(qū)動(dòng)設(shè)計(jì)

作為一名設(shè)計(jì)師,在了解了數(shù)據(jù)基礎(chǔ)的內(nèi)容后,就需要掌握通過數(shù)據(jù)驅(qū)動(dòng)設(shè)計(jì)最關(guān)鍵的內(nèi)容,接下來(lái)我將通過用戶、行為、業(yè)務(wù)三個(gè)角度來(lái)給大家分享幾個(gè)不錯(cuò)的設(shè)計(jì)案例。


5.1 用戶增長(zhǎng)

通過上面的分析,我們了解到用戶數(shù)據(jù)涉及到兩個(gè)方面,用戶的基礎(chǔ)屬性數(shù)據(jù)可以很好的輔助設(shè)計(jì),通過數(shù)據(jù)對(duì)用戶進(jìn)行分層,例如性別、年齡、地域,這些都是常見的用戶基礎(chǔ)屬性;

除此之外,與用戶相關(guān)并關(guān)聯(lián)產(chǎn)品的重要數(shù)據(jù)還包括新增用戶、用戶活躍度、用戶留存率、用戶流失率等數(shù)據(jù),我們可以通過這些數(shù)據(jù)的表現(xiàn)挖掘背后的原因,進(jìn)而通過設(shè)計(jì)手法深入優(yōu)化促進(jìn)用戶數(shù)據(jù)增長(zhǎng),形成閉環(huán)。簡(jiǎn)單分享以下幾個(gè)方法。


5.1.1 產(chǎn)品拉新

關(guān)于產(chǎn)品拉新,并不只是產(chǎn)品上線后需要考慮的事情,在產(chǎn)品設(shè)計(jì)的每一環(huán)節(jié)中,都是需要去進(jìn)行考慮的。產(chǎn)品拉新可以通過邀請(qǐng)碼、新手福利、邀請(qǐng)好友等幾個(gè)方面進(jìn)行。


1、邀請(qǐng)碼

邀請(qǐng)碼通常是由企業(yè)發(fā)放,優(yōu)先發(fā)放給種子用戶,然后通過種子用戶的社交圈去進(jìn)行擴(kuò)散,進(jìn)而吸引更多的用戶參與進(jìn)來(lái)。

前段時(shí)間爆火的一款國(guó)外音頻社交軟件Clubhouse,便是利用了這種方式進(jìn)行擴(kuò)散傳播。與Facebook、Instagram、Twitter等社交軟件有所區(qū)別,Clubhouse并沒有對(duì)全部用戶開放,而是需要得到其他用戶發(fā)出的邀請(qǐng)碼驗(yàn)證后才能進(jìn)行使用。邀請(qǐng)碼的稀缺性將Clubhouse的熱度炒得越來(lái)越高,使得參與其中的用戶能產(chǎn)生一種自我滿足感,同時(shí)這種模式大大保證了音頻內(nèi)容的質(zhì)量。


2、新手福利

一些產(chǎn)品針對(duì)未注冊(cè)或者未使用過產(chǎn)品的新用戶,會(huì)發(fā)放專屬福利,促進(jìn)用戶轉(zhuǎn)化。

新手福利通常是以開屏頁(yè)、Banner、彈窗、活動(dòng)頁(yè)、新手任務(wù)等形式進(jìn)行領(lǐng)取,隨著市場(chǎng)環(huán)境的緊張,獲客成本越來(lái)越高,新手福利的成本的也在逐漸增加。


3、邀請(qǐng)好友

針對(duì)注冊(cè)或使用過產(chǎn)品的用戶而言,通過發(fā)掘他們自身的社交圈子,促使老用戶自覺邀請(qǐng)新用戶,提升產(chǎn)品的用戶數(shù)量增長(zhǎng)。

邀請(qǐng)好友有以下兩個(gè)常見方式:

(1) 增加分享入口

老用戶可通過點(diǎn)擊分享圖標(biāo)的形式直接分享給相應(yīng)的好友。比如說,網(wǎng)易云音樂這款產(chǎn)品,用戶可以邀請(qǐng)好友一同在線聽歌,或者是單獨(dú)分享給特定的人。這種方式主要是利用了人的分享和展示心理。

(2) 福利刺激

平臺(tái)發(fā)放一定的優(yōu)惠券、獎(jiǎng)勵(lì)等給到用戶,新老用戶都可以通過這種方式獲得對(duì)應(yīng)的獎(jiǎng)勵(lì)。這種方式主要是利用了人的獲利心理。


5.1.2 活躍運(yùn)營(yíng)

活躍運(yùn)營(yíng)可以提升沉默用戶的活躍度,對(duì)于產(chǎn)品的發(fā)展有著非常重要的作用,常常通過一系列的方式來(lái)進(jìn)行布局。

1、用戶積分體系

積分體系如果運(yùn)用的好,那么對(duì)于增加用戶粘性以及提升活躍度是非常有幫助的。這個(gè)積分體系是否能夠吸引到用戶,就在于積分所兌換的產(chǎn)品是否有足夠價(jià)值。

比如說常見的外賣平臺(tái)——餓了么的積分體系,其核心就是圍繞下單行為而展開,下單之后返還吃貨豆,吃貨豆可兌換紅包,紅包再次消費(fèi)抵扣。整個(gè)操作流程,圍繞用戶的核心行為構(gòu)建獎(jiǎng)勵(lì)并形成閉環(huán)。


2、簽到

很多產(chǎn)品都設(shè)置了簽到功能,希望借此方式提升用戶粘性。這一功能的常見名稱為“簽到”“打卡”,或者根據(jù)運(yùn)營(yíng)活動(dòng)的場(chǎng)景來(lái)進(jìn)行命名,比如說螞蟻莊園、新浪種樹等。

一種良好的簽到模式對(duì)于用戶習(xí)慣的培養(yǎng)是有著積極的正向作用的,但是關(guān)于在產(chǎn)品中是否增加該功能,也是要根據(jù)自身的產(chǎn)品特性去進(jìn)行更細(xì)致的考量。

簽到的方式主要有自動(dòng)簽到與手動(dòng)簽到這兩種。

(1)自動(dòng)簽到

登錄自動(dòng)簽到的方式常見于游戲類應(yīng)用中,比如說王者榮耀這款產(chǎn)品,用戶打開即以彈窗形式告知用戶,領(lǐng)取相應(yīng)的獎(jiǎng)勵(lì)。

(2)手動(dòng)簽到

用戶點(diǎn)擊簽到入口,即可完成簽到。相比自動(dòng)簽到而言,這種簽到方式應(yīng)用范圍更加廣泛。


3、社區(qū)

現(xiàn)如今越來(lái)越多的產(chǎn)品開始打造自己的社區(qū),比如說淘寶的逛逛,咸魚的會(huì)玩等等。為什么社區(qū)功能越來(lái)越普遍呢?社區(qū)的存在,可以讓用戶在產(chǎn)品有一個(gè)屬于自己的社交圈子,這樣有助于用戶產(chǎn)生粘性,從而提升產(chǎn)品活躍度。

例:Keep通過打造高品質(zhì)的UGC內(nèi)容社區(qū),滿足新老用戶的價(jià)值需求。頂部Tab分為關(guān)注、精選、圈子三個(gè)模塊。關(guān)注一欄方便用戶快速查看自己感興趣的人,滿足社交需求。精選一欄承載了KOL與內(nèi)容生產(chǎn)者的分享內(nèi)容、用戶社交留存功能。圈子一欄更好的滿足用戶想要一群人打卡的情感訴求。


5.1.3 留存

留存的本質(zhì)是要滿足用戶的核心需求,只有滿足了這個(gè)條件后用戶才會(huì)持續(xù)使用。它應(yīng)該貫穿于整個(gè)用戶生命周期,而不僅僅是局限于其中某一個(gè)節(jié)點(diǎn)。好了,廢話不多說,直接上例子。

1、流暢的首次體驗(yàn)

用戶首次使用該產(chǎn)品時(shí)是否順暢,能否在第一時(shí)間找到自己所需要的內(nèi)容,很大程度上會(huì)影響用戶后續(xù)的留存情況。

比如說現(xiàn)如今很多產(chǎn)品為了降低用戶的登錄注冊(cè)成本,通過手機(jī)號(hào)一鍵注冊(cè)即可實(shí)現(xiàn)快速登錄。若未注冊(cè)過,在登錄時(shí)系統(tǒng)會(huì)自動(dòng)判斷并為其創(chuàng)建賬號(hào)。這種方式極大的降低了用戶記憶成本,同時(shí)還有安全性的保障。


2、降低學(xué)習(xí)成本

通常來(lái)說一款產(chǎn)品的學(xué)習(xí)成本越高,用戶理解起來(lái)就越困難,那么用戶長(zhǎng)期留在該平臺(tái)的概率就會(huì)降低,故而我們應(yīng)該通過一些設(shè)計(jì)手法去降低用戶的學(xué)習(xí)成本。

例如一些金融產(chǎn)品,其晦澀難懂的專業(yè)知識(shí)對(duì)于新手小白來(lái)說真的是非常困難,基本的認(rèn)知都存在困難的前提下,更別說指望用戶轉(zhuǎn)化了?;诖吮尘?,新手引導(dǎo)提示、新手教學(xué)視頻、在線客服服務(wù)、模擬交易等等方案,都會(huì)極大的降低用戶理解成本,為后續(xù)用戶的下單轉(zhuǎn)化提供有力的幫助。


3、遷移成本

何為用戶遷移成本?用戶選擇新產(chǎn)品的行為需承擔(dān)的代價(jià)。隨著遷移成本的增加,用戶長(zhǎng)期使用該產(chǎn)品的概率也會(huì)相應(yīng)增加。

例如有道云筆記這款產(chǎn)品,用戶在該平臺(tái)創(chuàng)作了大量的內(nèi)容后,就很有可能會(huì)長(zhǎng)期留在該平臺(tái),因?yàn)橹匦聯(lián)Q平臺(tái)的成本著實(shí)有點(diǎn)高。




5.1.4 挽留機(jī)制

挽留機(jī)制是留住用戶、促進(jìn)用戶轉(zhuǎn)化的最后一道程序。

常見的挽留機(jī)制有以下幾種形式:

1、提供解決方案

當(dāng)淘寶用戶在進(jìn)行退款時(shí),若原因是地址填寫錯(cuò)誤,那么頁(yè)面會(huì)自動(dòng)出現(xiàn)彈窗提醒用戶修改即可,避免用戶取消訂單,從而降低退款率。


2、利益刺激

當(dāng)用戶退出購(gòu)買頁(yè)面關(guān)鍵節(jié)點(diǎn)時(shí),會(huì)以彈窗形式進(jìn)行挽留。

例:知乎會(huì)員購(gòu)買頁(yè)面退出時(shí),系統(tǒng)會(huì)自動(dòng)出現(xiàn)二次確認(rèn)彈窗,將價(jià)值點(diǎn)信息以動(dòng)效形式展示在視覺中心,并對(duì)支付按鈕進(jìn)行突出設(shè)計(jì),吸引用戶注意,再次挽留。

例:拼多多的二次挽留同樣以彈窗形式展示,突出利益點(diǎn),同時(shí)有時(shí)間維度,使得用戶產(chǎn)生緊迫感,刺激用戶下單。


3、操作警告

操作警告類的文案二次提示,可以讓用戶對(duì)當(dāng)前行為有更清楚的認(rèn)知,并仔細(xì)思考。用戶會(huì)考慮到一些時(shí)間成本、花費(fèi)精力等因素,可能會(huì)取消放棄的念頭。

例:全民K歌這款應(yīng)用,用戶想要?jiǎng)h除之前發(fā)布過的創(chuàng)作內(nèi)容,點(diǎn)擊刪除之后,會(huì)出現(xiàn)二次警示確認(rèn)彈窗,對(duì)用戶的行為進(jìn)行一個(gè)挽留。就算最終用戶刪除了創(chuàng)造內(nèi)容,還可以在最新刪除列表中恢復(fù)。這樣既可以避免用戶誤操作引起的后果,還能最大程度的保護(hù)創(chuàng)作內(nèi)容的多樣化存在。




5.2 行為優(yōu)化

行為數(shù)據(jù)描述用戶使用方式,雖然與用戶相關(guān),但更加關(guān)注的是使用的流程、方式與產(chǎn)品體驗(yàn),其中重點(diǎn)關(guān)注的數(shù)據(jù)包含點(diǎn)擊率、轉(zhuǎn)化率、訪問分析等。


5.2.1 行為場(chǎng)景復(fù)現(xiàn)

深入分析用戶的訪問數(shù)據(jù),模擬行為場(chǎng)景,更好的把握用戶當(dāng)下的心理,從用戶角度出發(fā)去設(shè)計(jì)。下面,我將以一個(gè)工作中的實(shí)際項(xiàng)目為例,詳細(xì)闡述如何從設(shè)計(jì)側(cè)推動(dòng)項(xiàng)目迭代。

例如我們接到一個(gè)需求,需要進(jìn)行注冊(cè)流程的優(yōu)化,提升這一模塊的轉(zhuǎn)化率。很多時(shí)候,我們往往會(huì)陷于視覺層面進(jìn)行調(diào)整,但這并不能從根本上解決問題。我們需要靜下心來(lái)仔細(xì)思考,真正找到這個(gè)需求背后的目的以及當(dāng)前存在的問題。

那么我們可以怎樣去進(jìn)行呢?首先,為了對(duì)用戶行為有更直觀的理解與感受,可以利用用戶體驗(yàn)地圖的形式將用戶行為場(chǎng)景復(fù)現(xiàn),通過對(duì)用戶的情緒曲線、想法的剖析,從中找到合適的機(jī)會(huì)點(diǎn),為后續(xù)設(shè)計(jì)的迭代優(yōu)化提供一定思路。

通過對(duì)用戶的旅程進(jìn)行分析,可以發(fā)現(xiàn)在不同關(guān)鍵階段中所對(duì)應(yīng)的數(shù)據(jù)指標(biāo)也不同。因此在設(shè)計(jì)的過程中可以針對(duì)不同的行為場(chǎng)景,制定對(duì)應(yīng)的數(shù)據(jù)優(yōu)化目標(biāo),從而提升整體的產(chǎn)品價(jià)值。



5.2.2 行為路徑優(yōu)化

用戶的行為是決策的重要因素,了解用戶的行為和意圖后,會(huì)發(fā)現(xiàn)大部分用戶的行為與設(shè)計(jì)會(huì)存在很大的偏差,所以需要更多關(guān)注用戶的行為數(shù)據(jù),揣摩用戶行為下的真實(shí)心理與訴求,才能做出用戶滿意的產(chǎn)品。

緊接著上面的案例,咱們繼續(xù)通過漏斗模型進(jìn)行深入分析,優(yōu)化用戶在登錄注冊(cè)路徑上的體驗(yàn),提升轉(zhuǎn)化率。

原有的登錄流程轉(zhuǎn)化率如下圖所示


1、快速定位問題環(huán)節(jié)

通過數(shù)據(jù)反饋,發(fā)現(xiàn)從注冊(cè)頁(yè)面到點(diǎn)擊注冊(cè)按鈕這頁(yè)面之間存在較高的流失率,其次再是安全驗(yàn)證頁(yè)面。我們需要對(duì)這一流程中的關(guān)鍵節(jié)點(diǎn)進(jìn)行梳理,同時(shí)將主要的精力聚焦于該模塊的優(yōu)化。針對(duì)流失率較高的主要頁(yè)面進(jìn)行著重設(shè)計(jì)。


2、分析問題

通過數(shù)據(jù)分析可知,用戶很大一部分都在點(diǎn)擊注冊(cè)按鈕這一頁(yè)面流失掉了,當(dāng)前頁(yè)面的停留時(shí)長(zhǎng)較長(zhǎng),那么我們是否可以縮短停留時(shí)長(zhǎng),幫助用戶快速注冊(cè)呢?該怎樣設(shè)計(jì)才能提高用戶的操作效率呢?


3、方案輸出

通過聚焦問題后,發(fā)現(xiàn)最終我們的落腳點(diǎn)應(yīng)該在如何提升用戶的操作效率,幫助用戶快速完成注冊(cè)。

針對(duì)此設(shè)計(jì)目標(biāo),運(yùn)用競(jìng)品分析、用戶體驗(yàn)地圖等方式對(duì)于該模塊進(jìn)行了思維拓展。提出了一些可行性方案,比如在輸入郵箱時(shí)增加常用高頻郵箱格式后綴,減少用戶手動(dòng)輸入的步驟;比如增加用戶輸入錯(cuò)誤之后的快捷刪除圖標(biāo),方便用戶一鍵操作.....等等(詳細(xì)的可見之前項(xiàng)目復(fù)盤)。


4、數(shù)據(jù)驗(yàn)證

在設(shè)計(jì)上線一段時(shí)期后,查看數(shù)據(jù)情況。

經(jīng)過一段時(shí)間的驗(yàn)證,漏斗模型的數(shù)據(jù)轉(zhuǎn)化有了很大提升。再次驗(yàn)證,此次改版方案較為成功。

以上案例大致展示了工作中如何運(yùn)用數(shù)據(jù)驅(qū)動(dòng)設(shè)計(jì)的常規(guī)流程與方法。從整體漏斗分析原因,定位關(guān)鍵問題節(jié)點(diǎn),進(jìn)而推動(dòng)問題環(huán)節(jié)的優(yōu)化,最終解決問題。



5.3 價(jià)值體現(xiàn)

數(shù)據(jù)會(huì)給到我們一定的指導(dǎo)作用,我們需要對(duì)數(shù)據(jù)進(jìn)行深入思考,從設(shè)計(jì)的層面去賦能業(yè)務(wù)。從宏觀的角度去看待業(yè)務(wù)價(jià)值的增長(zhǎng)點(diǎn),尋找設(shè)計(jì)機(jī)會(huì)。那么我們?cè)撊绾瓮ㄟ^設(shè)計(jì)手段提升業(yè)務(wù)價(jià)值呢?產(chǎn)品價(jià)值的實(shí)現(xiàn)離不開用戶,從用戶的角度進(jìn)行拆解分析,可以更好的洞察到機(jī)會(huì)點(diǎn)。

例如我們需要提升會(huì)員模塊的開卡率,該怎么進(jìn)行落地執(zhí)行呢?


5.3.1 目標(biāo)拆解

我們將用戶的行為路徑劃分為感知——決策——行動(dòng)——傳播這幾個(gè)主要階段,通過體驗(yàn)地圖,深挖可優(yōu)化的空間。

通過流程的梳理,將目標(biāo)進(jìn)行拆解,我們可以從中找到一些值得優(yōu)化的地方。



5.3.2 設(shè)計(jì)方案

有明確的設(shè)計(jì)目標(biāo)之后,我們就需要針對(duì)每一節(jié)點(diǎn)進(jìn)行針對(duì)性的設(shè)計(jì)。

1、感知階段-用戶觸達(dá)

當(dāng)前會(huì)員購(gòu)買的入口隱藏的過深,很多用戶都對(duì)該模塊的存在缺少認(rèn)知。要想會(huì)員卡的購(gòu)買率有所提升,最基本的舉措就是要加大對(duì)其宣傳力度。因此,我們需要增強(qiáng)用戶感知。常見的形式有Push推送、郵件、短信等等,吸引用戶去查看相關(guān)的內(nèi)容,并引導(dǎo)后續(xù)轉(zhuǎn)化。

我們需要提升關(guān)于會(huì)員內(nèi)容的用戶感知,就可以嘗試在首頁(yè)增加會(huì)員入口。宣傳的形式可以采用Banner圖,方便用戶直接點(diǎn)擊就可進(jìn)入了解詳情。另外,產(chǎn)品頁(yè)面還可增加氣泡文案引導(dǎo),底部懸浮彈窗等等,增強(qiáng)用戶的感知。

有一個(gè)需要特別注意的地方,就是在進(jìn)行宣傳引導(dǎo)時(shí),一定要考慮到產(chǎn)品自身的屬性,進(jìn)行差異化設(shè)計(jì)。比如說海外產(chǎn)品的用戶一般都很討厭廣告,那么我們?cè)谶M(jìn)行設(shè)計(jì)的時(shí)候就要做到克制。在滿足運(yùn)營(yíng)需求的前提下,盡量減少對(duì)用戶造成不好的體驗(yàn)。


2、決策階段-價(jià)值觸達(dá)

用戶受吸引來(lái)查看會(huì)員相關(guān)內(nèi)容時(shí),我們需要對(duì)會(huì)員的價(jià)值進(jìn)行一個(gè)高效快捷的輸出傳遞。只有讓用戶在該階段感受到價(jià)值大于價(jià)格,才會(huì)有后續(xù)的購(gòu)買行動(dòng)。在會(huì)員權(quán)益模塊,需要根據(jù)用戶的狀態(tài)進(jìn)行區(qū)分,針對(duì)化展示。人群大致劃分為普通用戶、會(huì)員與過期會(huì)員。

我們可以通過一些設(shè)計(jì)手法,強(qiáng)化用戶的價(jià)值觸達(dá)感知。

(1)文案刺激。告訴用戶辦會(huì)員卡一年預(yù)計(jì)能省下多少錢。

(2)增加計(jì)算器功能,讓用戶根據(jù)自己的習(xí)慣輸入預(yù)計(jì)交易額,更智能的感知優(yōu)惠。

(3)向用戶發(fā)放一定的優(yōu)惠券,并增加倒計(jì)時(shí),出于沉沒成本,用戶轉(zhuǎn)化的幾率很有可能會(huì)增加。

(4)人數(shù)比例展示,利用人的從眾心理,促進(jìn)購(gòu)買。



3、行動(dòng)階段-購(gòu)買轉(zhuǎn)化

到了行動(dòng)階段,用戶的整體購(gòu)買流程是否高效、是否順暢則成了我們需要關(guān)注的重點(diǎn)。我們?cè)诂F(xiàn)階段的設(shè)計(jì)策略,可通過以下方式進(jìn)行展開:


(1)避免用戶過多選擇

原有的會(huì)員頁(yè)面將三種會(huì)員模式全都展示出來(lái)讓用戶自己選擇,對(duì)于很多新手來(lái)說這無(wú)疑是非常困難的,會(huì)員的購(gòu)買率也比較低。更新后,我們將會(huì)員的價(jià)值點(diǎn)簡(jiǎn)單的羅列出來(lái),讓用戶可以直觀的了解會(huì)員卡的優(yōu)勢(shì),同時(shí)會(huì)員卡按照時(shí)間周期與價(jià)格劃分為3個(gè)不同的層級(jí),針對(duì)平臺(tái)主推的年卡,增加標(biāo)簽,強(qiáng)化感知。


(2)減少頁(yè)面跳轉(zhuǎn)

用戶在進(jìn)行購(gòu)買時(shí),無(wú)需跳轉(zhuǎn)頁(yè)面,只需在當(dāng)前頁(yè)面操作即可。懸浮收銀臺(tái)的形式,可以避免用戶在跳轉(zhuǎn)頁(yè)面之間可能帶來(lái)的數(shù)據(jù)流失,最大化的保障用戶購(gòu)買行為的完成。


4、分享階段-持續(xù)正向裂變

用戶完成分享即可獲得相對(duì)的獎(jiǎng)勵(lì),被分享的新用戶再進(jìn)入產(chǎn)品進(jìn)行體驗(yàn),即可獲得新用戶獎(jiǎng)勵(lì)。在進(jìn)行分享的操作中,有以下優(yōu)化方向。

(1) 增加分享引導(dǎo)

可以通過文案引導(dǎo)、運(yùn)營(yíng)位的形式進(jìn)行宣傳,吸引用戶進(jìn)行分享操作。

(2) 優(yōu)化分享體驗(yàn)

增加分享的渠道,引入常用的Twitter、Facebook、Telegram等社交平臺(tái);

增加用戶分享圖的制作,為用戶提供更多的選擇空間。




六、總結(jié)

數(shù)據(jù)驅(qū)動(dòng)是一項(xiàng)長(zhǎng)期的工作,需要去不斷的跟蹤、反饋,通過不斷的數(shù)據(jù)驅(qū)動(dòng),才能推動(dòng)設(shè)計(jì)的更優(yōu)發(fā)展。在日常的工作中,我們需要對(duì)數(shù)據(jù)保持敏感,從這些數(shù)據(jù)背后找出真正的原因,并進(jìn)行針對(duì)性的優(yōu)化。設(shè)計(jì)師了解一定的數(shù)據(jù)知識(shí),可以更好的輔助我們進(jìn)行設(shè)計(jì)產(chǎn)出,使得我們的方案更有說服度。

感謝閱讀,以上就是我要分享的如何利用數(shù)據(jù)驅(qū)動(dòng)設(shè)計(jì)的全部?jī)?nèi)容。


文章來(lái)源:站酷  作者:甜西瓜汁



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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)



App 信息架構(gòu):如何讓用戶始終有掌控感

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

信息架構(gòu)是產(chǎn)品的骨架。具體而言,就是一款產(chǎn)品有幾個(gè)一級(jí)頁(yè)面,以及支撐起整個(gè)產(chǎn)品的一級(jí)頁(yè)面、二級(jí)頁(yè)面各有幾種內(nèi)容樣式。所謂一級(jí)頁(yè)面,微信的“發(fā)現(xiàn)”頁(yè)就是一個(gè)一級(jí)頁(yè)面;在“發(fā)現(xiàn)”頁(yè)點(diǎn)“朋友圈”,進(jìn)去的就是一個(gè)二級(jí)頁(yè)面。所謂內(nèi)容樣式,Banner 是一種內(nèi)容樣式,九宮格是一種內(nèi)容樣式,設(shè)置頁(yè)面那種列表也是一種內(nèi)容樣式。

 

這樣的信息架構(gòu),有什么價(jià)值?

 

 

01 信息架構(gòu)的價(jià)值:掌控感與健康迭代

 

對(duì)用戶而言,信息架構(gòu)的主要價(jià)值在于掌控感;對(duì)產(chǎn)品而言,信息架構(gòu)的主要價(jià)值在于健康迭代。

 

1. 掌控感

 

如果房間里很亂,到處都堆滿了東西,常穿的衣服也找不到了,我們就很容易變得煩躁不安。相反,如果混亂的房間被收拾得很整潔,我們的心情也會(huì)隨之變得愉悅起來(lái)。

 

這中間的原因是什么?

 

個(gè)人覺得,從原始社會(huì)到 21 世紀(jì),我們?nèi)祟愐恢鄙钤诟?jìng)爭(zhēng)中,所以一直在追求一種對(duì)生活的掌控感。這種掌控感,會(huì)讓我們找到一種存在感和價(jià)值感,從而給身處競(jìng)爭(zhēng)中的我們一種安全感。一個(gè)收拾得井然有序的房間,會(huì)讓我們覺得一切盡在掌握中;一個(gè)胡亂塞滿東西的房間,則會(huì)讓我們覺得這個(gè)房間處于失控狀態(tài),從而引發(fā)煩躁不安。

 

一款 App,如果主要的幾個(gè)一級(jí)頁(yè)面也都塞滿了各式各樣的內(nèi)容,那么用戶通常也會(huì)感到煩躁不安。這是因?yàn)橛脩舨荒荞R上理出頭緒,不能馬上獲得那種掌控感。另外,如果大的改版經(jīng)常讓用戶體會(huì)到這種煩躁不安,用戶就會(huì)對(duì)這款 App 感到不滿和失望,甚至失去信心和期待。

 

所以說,信息架構(gòu)的第一個(gè)價(jià)值,就是讓用戶始終有掌控感。

 

2. 健康迭代

 

產(chǎn)品的更新迭代,有時(shí)會(huì)出現(xiàn)“發(fā)?!焙汀拔⒄巍钡那闆r。這都屬于不健康的迭代。

 

所謂發(fā)福,就是變得臃腫了,比如一級(jí)頁(yè)面突然增加了很多內(nèi)容樣式。所謂微整形,就是和之前比有點(diǎn)亂套了,比如有的一級(jí)頁(yè)面突然消失了、有的一級(jí)頁(yè)面突然出現(xiàn)了、有些常用的功能突然找不到了,諸如此類。

 

一款產(chǎn)品,如果大的改版總是通過發(fā)福、甚至微整形的方式實(shí)現(xiàn),用戶就很難獲得掌控感。

 

反過來(lái),一個(gè)優(yōu)秀的信息架構(gòu),是接近“凍齡”的。也就是說,不管產(chǎn)品怎么更新、怎么加新功能,都能簡(jiǎn)單如初,都能讓用戶馬上獲得掌控感。典型的例子是微信:微信已經(jīng)加了很多功能,但整體給人的感覺依然是簡(jiǎn)單的。

 

這樣的信息架構(gòu),很少發(fā)福,也幾乎不做微整形,所以能讓用戶永遠(yuǎn)有掌控感,從而確保產(chǎn)品能夠健康迭代。

 

 

02 怎樣實(shí)現(xiàn)信息架構(gòu)的價(jià)值

 

什么樣的信息架構(gòu),能夠?qū)崿F(xiàn)“掌控感”和“健康迭代”?

 

其實(shí)參考答案剛才已經(jīng)出現(xiàn)了,那就是接近凍齡的信息架構(gòu)?;蛘吒_切地說,是一種“以不變應(yīng)萬(wàn)變”的信息架構(gòu)。

 

這里的不變,是指信息架構(gòu)看起來(lái)永遠(yuǎn)沒有明顯變化,永遠(yuǎn)都很簡(jiǎn)單。萬(wàn)變,是指不斷新增的功能,不斷變化的功能。

 

如何做到以不變應(yīng)萬(wàn)變?一級(jí)頁(yè)面和二級(jí)頁(yè)面都很關(guān)鍵,其中最核心的是一級(jí)頁(yè)面。這里也順便拋一個(gè)問題:一級(jí)頁(yè)面,用來(lái)干啥?

 

一級(jí)頁(yè)面主要用來(lái)干三件事,分別是:提供掌控感、提供常用功能、提供小入口。也就是說,一級(jí)頁(yè)面尤其要把掌控感給到用戶,要讓用戶快速找到常用功能,同時(shí)還要為不常用的功能提供一個(gè)小入口。需要說明的是,這個(gè)理念可能不太適合一些商店類產(chǎn)品,比如淘寶這樣的電商產(chǎn)品,所以僅供參考。

 

那如何完成這三件事?主要有以下四個(gè)要點(diǎn)。

 

1. 不要超過 4 個(gè)一級(jí)頁(yè)面

 

4 個(gè)和 5 個(gè),它倆之間存在微妙的區(qū)別。比如我們給手機(jī)號(hào)或銀行卡號(hào)分段時(shí),更喜歡每段最多分 4 個(gè)數(shù)字,而不是 5 個(gè),直觀對(duì)比見下圖。


4 個(gè)還是 5 個(gè)

 

很多 App 的底部導(dǎo)航欄,也是只有 4 個(gè)Tab,即 4 個(gè)一級(jí)頁(yè)面。受生活經(jīng)驗(yàn)等因素影響,當(dāng)我們看到 App 有 4 個(gè)一級(jí)頁(yè)面時(shí),內(nèi)心或潛意識(shí)里可能會(huì)覺得:哦,4 個(gè),還算簡(jiǎn)單,基本能記??;而當(dāng)看到有 5 個(gè)一級(jí)頁(yè)面時(shí),可能會(huì)感到一絲壓力:5 個(gè)啊,有點(diǎn)多了。

 

總的來(lái)說,我們更偏愛只有 4 個(gè)一級(jí)頁(yè)面的產(chǎn)品,因?yàn)?4 個(gè)仍在簡(jiǎn)潔的范疇內(nèi),5 個(gè)就已經(jīng)開始走向復(fù)雜。在《微信背后的產(chǎn)品觀》這場(chǎng)分享中,張小龍也提到過:“微信保證只有 4 個(gè)底部 Tab?!?

 

2. 不要超過 3 種內(nèi)容樣式

 

Keep 6.0 系列的“探索”頁(yè)面有 5 種內(nèi)容樣式,顯得很復(fù)雜。微信的 4 個(gè)一級(jí)頁(yè)面中,“發(fā)現(xiàn)”和“我”頁(yè)面只有 1 種內(nèi)容樣式,“微信”和“通訊錄”頁(yè)面只有 2 種內(nèi)容樣式(加上頂部的搜索框),顯得非常簡(jiǎn)單,和 Keep 的對(duì)比如下圖所示。

 

Keep 6.0 系列與微信的內(nèi)容樣式數(shù)量

 

像微信這種內(nèi)容樣式數(shù)量上的極簡(jiǎn),可能很多產(chǎn)品難以做到。那么,我們不妨退而求其次,早期先從 1 種、2 種內(nèi)容樣式開始。后期加功能了,可以考慮第 3 種,謹(jǐn)慎考慮第 4 種,盡量不要增加第 5 種,因?yàn)橐欢〞?huì)變得復(fù)雜。

 

大家可能會(huì)說,產(chǎn)品的功能很多,3 種內(nèi)容樣式不夠用。

 

針對(duì)這種情況,只要邏輯上不存在大的問題(比如把“支付”放到“通訊錄”頁(yè)面),就可以嘗試把不同內(nèi)容合并成一種樣式。微信在這方面就做得很好,大家可以參考它的設(shè)計(jì)。比如下圖的“通訊錄”頁(yè)面,聯(lián)系人上方那些內(nèi)容,和聯(lián)系人不是同一類內(nèi)容,但它們共用一種內(nèi)容樣式——一個(gè)簡(jiǎn)單的圖文列表。

 

微信“通訊錄”頁(yè)面:不同內(nèi)容合并成一種樣式

 

3. 不為二成需求,去打擾八成用戶

 

產(chǎn)品設(shè)計(jì)里存在一個(gè)比較常見的問題,就是往一級(jí)頁(yè)面塞很多內(nèi)容或功能,其中有相當(dāng)一部分是用戶日常用不到的,這種設(shè)計(jì)容易讓人覺得臃腫。比如 Keep 6.0 系列的“運(yùn)動(dòng)”頁(yè)面,就用了較大空間來(lái)推薦付費(fèi)計(jì)劃和運(yùn)營(yíng)活動(dòng),如下圖所示。

 

用較大空間來(lái)推薦付費(fèi)計(jì)劃和運(yùn)營(yíng)活動(dòng)的 Keep 頁(yè)面

 

相信有相當(dāng)一部分用戶是不需要這些內(nèi)容的,所以這其實(shí)也是一種打擾。這種打擾會(huì)影響到這些用戶對(duì)這個(gè)界面的掌控感。

 

這種現(xiàn)象有兩個(gè)可能的原因。一是企業(yè)擔(dān)心用戶不用這些功能,所以就在一級(jí)頁(yè)面用很多空間來(lái)展示它們,Keep 的例子應(yīng)該屬于此類。二是有部分用戶提建議,所以企業(yè)就加了這些功能。

 

關(guān)于第一個(gè)原因,個(gè)人觀點(diǎn),有些功能本身就屬于二成需求,在一級(jí)頁(yè)面占用太多空間不僅改變不了這個(gè)現(xiàn)實(shí),還會(huì)對(duì)用戶形成打擾。

 

關(guān)于第二個(gè)原因,個(gè)人看法,用戶的建議通常只代表個(gè)人立場(chǎng),而企業(yè)至少要代表大部分用戶的立場(chǎng)。比如,網(wǎng)上就有人建議微信在朋友圈加一個(gè)屏蔽別人的功能,實(shí)際上微信有這個(gè)功能,只是一直隱藏,沒有放出來(lái)——因?yàn)橛玫娜松?,它屬于二成需求,放出?lái)的話會(huì)對(duì)八成用戶形成打擾。

 

總的來(lái)說,理想情況是接受現(xiàn)實(shí)、尊重規(guī)律:是八成需求就提供八成空間,是二成需求就提供二成空間。具體參考如下圖所示。

 

是八成需求就提供八成空間,是二成需求就提供二成空間

 

4. 盡量不在標(biāo)題欄使用 Tab 或下拉框,增加維度

 

這其實(shí)是張小龍分享過的一個(gè)觀點(diǎn),我個(gè)人很贊同,就直接引用一下。下面直接看兩個(gè)例子。Keep 6.0 系列的前三個(gè)一級(jí)頁(yè)面,標(biāo)題欄都使用了 Tab,就顯得內(nèi)容很多,有點(diǎn)復(fù)雜,如下圖所示(僅展示前兩個(gè))。

 

使用了 Tab 的標(biāo)題欄

 

微信中擁有標(biāo)題欄的前三個(gè)一級(jí)頁(yè)面,其標(biāo)題欄都沒有使用 Tab 或下拉框,就顯得簡(jiǎn)單、內(nèi)容少,如下圖所示(僅展示前兩個(gè))。這也是微信保持簡(jiǎn)單的一個(gè)重要原因。

 

沒有使用 Tab 的標(biāo)題欄

 

 

結(jié)語(yǔ)

 

一般情況下,產(chǎn)品都需要更新迭代:增加新功能,完善舊功能。

 

用戶則是一個(gè)矛盾體:一方面對(duì)新功能和新事物懷有好奇心;另一方面又希望每次打開常用的產(chǎn)品時(shí),都有一種回到家一樣的熟悉感和一種家里井然有序的掌控感。

 

好的做法,就是類似微信那樣:盡管加了新功能,但是看起來(lái)沒有明顯變化。也就是說,以“不變”的信息架構(gòu),來(lái)應(yīng)對(duì)萬(wàn)變的功能。


文章來(lái)源:站酷  作者:Snow Design

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

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

藍(lán)藍(lán)設(shè)計(jì)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ù)


日歷

鏈接

個(gè)人資料

存檔