首先說(shuō)明,競(jìng)品調(diào)研的方法有很多,本文只提供一種方法供參考,建議大家活學(xué)活用。
建議從下面4個(gè)方面入手:
1)調(diào)研背景
主要說(shuō)一些為什么要調(diào)研,希望通過(guò)調(diào)研答達(dá)到什么樣的目的?是視覺(jué)升級(jí)、體驗(yàn)升級(jí)還是為了提升轉(zhuǎn)化率?只有了解為什么做調(diào)研這件事情,才能知道從哪幾個(gè)維度調(diào)研。
2)調(diào)研樣本
建議選幾個(gè)直接競(jìng)品,再選幾個(gè)優(yōu)秀的次要競(jìng)品也是可以的,可以幫助補(bǔ)齊盲點(diǎn)。
3)調(diào)研維度
調(diào)研維度要根據(jù)調(diào)研目的來(lái)確定,例如如果是為了視覺(jué)升級(jí),那么調(diào)研維度主要就集中在視覺(jué)效果上,如果是體驗(yàn)升級(jí),那么調(diào)研維度主要集中在交互體驗(yàn)層面。
所以維度的選擇一定是和此次調(diào)研的目的緊密相關(guān)的,不過(guò),倒也不是說(shuō)如果是視覺(jué)升級(jí)就只調(diào)研視覺(jué)方面的內(nèi)容,而是咱們要有一個(gè)主要的調(diào)研方向,啥都想要,最后啥都做不好。
4)結(jié)論
結(jié)論是最重要的,畢竟,做這次的調(diào)研不就是為了這份結(jié)論嗎?所以最后一定要有結(jié)論,也就是咱們通過(guò)調(diào)研得到了什么結(jié)論。
我公司這個(gè)項(xiàng)目是做一個(gè)官網(wǎng)的改版,官網(wǎng)主要就改版主要目標(biāo)有兩個(gè):
第一個(gè)目標(biāo)是視覺(jué)體驗(yàn)升級(jí),拆解下來(lái)就是界面更好看,內(nèi)容更好找。
第二個(gè)目標(biāo)是提升用戶(hù)轉(zhuǎn)化率,更細(xì)致的拆解一下就是讓更多的用戶(hù)點(diǎn)擊【咨詢(xún)】按鈕。
可以得到關(guān)鍵詞:界面更好看、內(nèi)容更好找、咨詢(xún)客服的人數(shù)更多。
好,咱們繼續(xù),下一步是找樣本。
前面提到過(guò),樣本最好是直接競(jìng)品+間接競(jìng)品(主要是一線大廠競(jìng)品)。
所以這次調(diào)研我選擇了幾個(gè)直接競(jìng)品的官網(wǎng),以及華為、飛書(shū)等這樣的做的比較優(yōu)秀的產(chǎn)品進(jìn)行輔助分析。
調(diào)研維度又可以分為兩大部分:整體結(jié)構(gòu)、內(nèi)容拆解。
了解整體架構(gòu)是每個(gè)競(jìng)品調(diào)研都離不開(kāi)的步驟,可以幫助我們快速了解行業(yè)內(nèi)的通識(shí)性做法,畢竟站在巨人的肩膀上才能看得更遠(yuǎn)嘛。
1)整體架構(gòu)
我當(dāng)時(shí)的做法是把主要競(jìng)品的官網(wǎng)都截圖下來(lái),然后一個(gè)模塊一個(gè)模塊的去分析,其實(shí)看下來(lái)你會(huì)發(fā)現(xiàn),大家的做法都是有跡可循的。
看下面的圖片,我把他們類(lèi)似的模塊用同樣的顏色框出來(lái),框出來(lái)后就會(huì)發(fā)現(xiàn),哦,原來(lái),這就是行業(yè)內(nèi)的通識(shí)性做法。
然后我把這種通識(shí)性做法歸納總結(jié)出來(lái),發(fā)現(xiàn),其實(shí)官網(wǎng)首頁(yè)可以劃分為四大板塊:
你看,看似有很多復(fù)雜內(nèi)容的官網(wǎng), 其實(shí)也就這幾個(gè)模塊,這樣看是不是就清晰多了。
既然咱們通過(guò)架構(gòu)梳理來(lái)了官網(wǎng)的內(nèi)容,下一步就進(jìn)行內(nèi)容的拆解了,拆解什么內(nèi)容?就是拆解上面總結(jié)出來(lái)的規(guī)律呀。
2)內(nèi)容拆解
為啥要拆解內(nèi)容呢?
因?yàn)樵蹅兏?jìng)品分析的目的不就是要做到“人有我優(yōu)”嘛,咱們競(jìng)品分析是為了青出于藍(lán)而勝于藍(lán)呀,所以咱們不能直接抄人家的內(nèi)容,這是無(wú)效設(shè)計(jì),咱們要做的是分析他們的優(yōu)點(diǎn),然后借鑒,然后超越。
進(jìn)行內(nèi)容拆解的時(shí)候,建議先定幾個(gè)拆解維度,不然會(huì)沒(méi)有方向,這里我分了三個(gè)維度來(lái)進(jìn)行拆解:
我就拿【建立認(rèn)知】板塊來(lái)舉例。
官網(wǎng)首頁(yè)的建立認(rèn)知是什么?
是讓進(jìn)來(lái)的用戶(hù)對(duì)整個(gè)網(wǎng)站有一個(gè)基礎(chǔ)的認(rèn)知,顧客來(lái)了,對(duì)店鋪總要有一個(gè)第一印象吧。
通過(guò)前面的架構(gòu)拆解我們發(fā)現(xiàn),首頁(yè)一般使用4種方法來(lái)對(duì)用戶(hù)建立認(rèn)知,哪四種?
banner、產(chǎn)品介紹、解決方案、產(chǎn)品優(yōu)勢(shì)
一個(gè)用戶(hù)看了banner,瀏覽了產(chǎn)品介紹和解決方案,看了產(chǎn)品優(yōu)勢(shì),是不是對(duì)咱們的產(chǎn)品有了一個(gè)認(rèn)知了,這就是建立認(rèn)知的過(guò)程。
那么咱們?nèi)绾稳シ治瞿兀?br />
我的做法是一個(gè)個(gè)板塊分析,有些麻煩啊,但是相信我,值得。
下面我就拿建立認(rèn)知里面的“產(chǎn)品介紹”來(lái)舉例子,看看如何去分析產(chǎn)品介紹這個(gè)板塊。
使用3個(gè)維度來(lái)分析:
維度1:用戶(hù)訴求(用戶(hù)進(jìn)來(lái)之后的訴求)
產(chǎn)品介紹內(nèi)容是否有我需要的產(chǎn)品和功能?是否滿足我的需求?
維度2:業(yè)務(wù)策略(針對(duì)用戶(hù)訴求,業(yè)務(wù)是怎么解決的)
講清楚三個(gè)問(wèn)題,即“我們的產(chǎn)品是什么”、“我們能做什么”、“我們有什么優(yōu)勢(shì)“
維度3:常用表達(dá)形式(用什么樣的表達(dá)方式來(lái)實(shí)現(xiàn)策略)
拆解下來(lái),是不是對(duì)產(chǎn)品介紹板塊很了解了,產(chǎn)品介紹板塊主要的目的就是為了講清楚咱們是誰(shuí),咱們的優(yōu)勢(shì)啊。王婆賣(mài)瓜,瓜雖好,但是咱們得讓來(lái)的人知道咱們的瓜好呀,所以表達(dá)方式也是至關(guān)重要的,用什么形式去表達(dá)這個(gè)板塊呢?其實(shí)競(jìng)品已經(jīng)有了很好的解決方案,那就是上面描述的。
你看,這樣一通分析,其實(shí)你的方案就自然而出來(lái)了,你知道往哪個(gè)方向去使勁了,而不是看別人有啥咱們就做啥。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
先問(wèn)你一個(gè)問(wèn)題。
拼多多、淘寶、京東這三家購(gòu)物平臺(tái),你認(rèn)為它們的區(qū)別是什么?
或者換個(gè)方式問(wèn)你。
買(mǎi)電器你去哪個(gè)平臺(tái)?
買(mǎi)衣服你去哪個(gè)平臺(tái)? 買(mǎi)垃圾袋你去哪個(gè)平臺(tái)?
是不是有了答案了?
沒(méi)猜錯(cuò)的話, 大部分人的答案是:買(mǎi)電器去京東、買(mǎi)衣服去淘寶、買(mǎi)垃圾袋去拼多多。
你看,這就是一個(gè)購(gòu)物心智模型,你的心里對(duì)這三家平臺(tái)已經(jīng)產(chǎn)生了固有的心智,如果讓你去京東買(mǎi)衣服,你會(huì)不會(huì)覺(jué)得,有些別扭?
沒(méi)錯(cuò),這就是心智模型。
百度百科對(duì)心智模型的定義是:
“深植我們心中關(guān)于我們自己、別人、組織及周?chē)澜缑總€(gè)層面的假設(shè)、形象和故事。并深受習(xí)慣思維、定勢(shì)思維、已有知識(shí)的局限?!?br />
關(guān)鍵詞是:故事、習(xí)慣、局限。
淘寶一開(kāi)始就我們講了一個(gè)故事,一個(gè)萬(wàn)能的集市,我們習(xí)慣在上面買(mǎi)衣服,但是也產(chǎn)生了局限性,那就是,當(dāng)我們想買(mǎi)大額電器的時(shí)候,還是會(huì)選擇京東。
我個(gè)人對(duì)心智模型的理解是:
我們內(nèi)心深處對(duì)一個(gè)事物的看法。
空口聊天多沒(méi)意思,下面舉個(gè)例子。
這是一尊陶俑,第一眼你覺(jué)得她像什么?
是不是覺(jué)得像米老鼠?
為什么?
因?yàn)樘召傅念^上的發(fā)髻和米老鼠標(biāo)志性的耳朵很像。
如果你從沒(méi)見(jiàn)過(guò)米老鼠,你還會(huì)覺(jué)得她像米老鼠嗎?
一定不會(huì)。
這就是心智模型,你對(duì)頭頂?shù)拇髨A形的心智是“米老鼠”,所以一旦你看到類(lèi)似的形狀,米老鼠的形象就會(huì)浮現(xiàn)出來(lái),這個(gè)發(fā)髻的形狀和你心里對(duì)米老鼠的形象產(chǎn)生了匹配。
對(duì)心智模型有沒(méi)有一點(diǎn)印象了?
下面我們接著聊。
我不想用具體的界面來(lái)聊,那樣的話太散,我認(rèn)為要想理解一個(gè)概念,最好還是從“面”的角度來(lái)說(shuō),所以下面我會(huì)舉一些商業(yè)上的案例來(lái)輔助理解。
心智模型有哪三種運(yùn)用方式?
第一種:創(chuàng)建新的心智模型
第二種:改變舊的心智模型
第三種:匹配現(xiàn)有的心智模型
可以理解成一件事情的新生、改變和延續(xù)。
下面咱們一個(gè)個(gè)來(lái)。
第一種:創(chuàng)建新的心智模型
難度指數(shù):難啊。
記得《盜夢(mèng)空間》里最難的是什么嗎?
最難的不是盜夢(mèng),而是植入一個(gè)想法。
創(chuàng)建新的心智模型有異曲同工之妙,都是讓別人內(nèi)心接收一個(gè)事物,需要刻意培養(yǎng)。
舉幾個(gè)例子。
當(dāng)年外賣(mài)剛開(kāi)始的時(shí)候,家家搞補(bǔ)貼,很多時(shí)候幾乎不花錢(qián)就可以點(diǎn)外賣(mài),后來(lái)這些福利沒(méi)有了,為啥?
因?yàn)辄c(diǎn)外賣(mài)的心智已經(jīng)培養(yǎng)好了,你離不開(kāi)它了,所以平臺(tái)可以“不慣著你了”。
還有唯品會(huì)的正品低價(jià)、瑞幸一開(kāi)始的星巴克平替,這些都是他們想要植入到用戶(hù)大腦中的心智。
為什么要費(fèi)勁植入一個(gè)新的想法?
因?yàn)橐坏┲踩肓耍秃茈y改變。
現(xiàn)在我身邊的很多朋友想買(mǎi)一些低價(jià)的品牌都會(huì)上唯品會(huì),買(mǎi)咖啡會(huì)喝瑞幸,一旦用戶(hù)的習(xí)慣養(yǎng)成就很難改變,意味著什么?
意味著留存和轉(zhuǎn)化的成本更低了。
第二種:改變舊的心智模型
難度指數(shù):也難。
《盜夢(mèng)空間》里小李子的妻子被他植入了一個(gè)想法“你不在現(xiàn)實(shí)世界里”,當(dāng)他和他妻子回到現(xiàn)實(shí)世界后,他妻子仍舊認(rèn)為自己不在現(xiàn)實(shí)世界里,這個(gè)被植入的想法已經(jīng)根深蒂固,很難改變。
所以改變舊的心智也不簡(jiǎn)單。
例如小米最初主打極致性?xún)r(jià)比,后來(lái)想往高端路線走,很難,大家心里已經(jīng)認(rèn)準(zhǔn)了小米就是“性?xún)r(jià)比之王”,也就是你的產(chǎn)品不僅要好還要便宜。
這就導(dǎo)致小米一漲價(jià),大家就罵他們忘了初心……所以小米拆分出了紅米主攻性?xún)r(jià)比,小米往高端發(fā)展,但是仍舊很難。
拼多多的百億補(bǔ)貼也是一樣的道理,一開(kāi)始的砍一刀深入人心,大家對(duì)拼多多的心智已經(jīng)成型:便宜,質(zhì)量一般。拼多多想改變這個(gè)心智,推出百億補(bǔ)貼,并承諾假一賠十,就是想告訴大家,我拼多多,也是有正品好貨的。不過(guò),效果嘛,見(jiàn)仁見(jiàn)智。
第三種:匹配現(xiàn)有的心智模型
難度指數(shù):相對(duì)簡(jiǎn)單。
其實(shí)匹配現(xiàn)有的心智模型,是相對(duì)最簡(jiǎn)單的方法,市場(chǎng)已經(jīng)幫你把用戶(hù)習(xí)慣培養(yǎng)好了,你直接使用,那肯定事半功倍,省時(shí)省力啊。
舉個(gè)例子,大家最近有關(guān)注小米的 13 Ultra 嗎?
小米和徠卡聯(lián)合研發(fā)的,主打徠卡調(diào)色的相機(jī)。
我有一個(gè)同事就直接把手里的微單換成了 13 Ultra ,因?yàn)榕恼兆銐蚝每炊冶銛y。
這里不是要推銷(xiāo)手機(jī)啊,是想讓你們了解 13 Ultra 是個(gè)什么東西。
然后給大家看看它的手柄(一個(gè)配角,可以拆卸)。
是不是有些熟悉?
和相機(jī)像不像?
這個(gè)手柄就是沿用了相機(jī)的心智模式。
小結(jié)一下:
心智模型有3種用法:
新建:創(chuàng)建新的心智模型
改變:改變舊的心智模型
延續(xù):匹配現(xiàn)有的心智模型
下面聊聊,咱們?cè)趺醋霾拍芨悠ヅ溆脩?hù)的心智模型?
同樣的,我不會(huì)拿具體頁(yè)面來(lái)舉例,還是希望把思考方式分享給大家,而不是某一個(gè)頁(yè)面的設(shè)計(jì)。
要想匹配用戶(hù)的心智模型其實(shí)就三步:
了解業(yè)務(wù)、了解用戶(hù)、競(jìng)品調(diào)研。
或者可以這么說(shuō), 在懂業(yè)務(wù)、懂用戶(hù)的基礎(chǔ)上,還要了解行業(yè)內(nèi)的通用做法。
1)了解業(yè)務(wù)
一定要了解業(yè)務(wù),為什么?
因?yàn)楹玫脑O(shè)計(jì)方案千千萬(wàn),但是匹配你的業(yè)務(wù)的方案才是好方案,如果不了解業(yè)務(wù),可能設(shè)計(jì)出來(lái)的方案就是自嗨,例如網(wǎng)上很多的dribble風(fēng)設(shè)計(jì)。
又比如說(shuō)手機(jī)瀏覽器一般都把搜索框放到屏幕頂部,而夸克瀏覽器卻把搜索框放到了下面。
為什么?
因?yàn)榭淇讼胪品瓊鹘y(tǒng)的瀏覽器,想打造一款更年輕更好用的瀏覽器,把搜索框放到下面也是滿足他們的業(yè)務(wù)訴求,現(xiàn)在手機(jī)屏幕越來(lái)越大,搜索框放在下面手指操作更加方便。
所以,一定要先去了解業(yè)務(wù)。
拼多多和淘寶同樣都是電商平臺(tái),可它們的用戶(hù)心智相差甚大,因?yàn)樽詈蠓桨冈O(shè)計(jì)是服務(wù)于最初的業(yè)務(wù)目標(biāo)的,業(yè)務(wù)不同,呈現(xiàn)的方案也不一樣,最后讓用戶(hù)形成的心智也不同。
2)了解用戶(hù)
為啥?給老人和小孩設(shè)計(jì)的界面能一樣嗎?
就拿顏色和文字來(lái)說(shuō)。
小孩喜歡高飽和、豐富的顏色,而老人則需要考慮在各種場(chǎng)景下都能看得清楚信息的顏色。
小孩喜歡圓潤(rùn)的卡通字體,而老人需要識(shí)別度更高的字體,更大的字號(hào)。
不同的用戶(hù),采用的設(shè)計(jì)一定是不同的,只有了解了他們的喜好和痛點(diǎn),才能做出符合他們心智模型的設(shè)計(jì)。
3)競(jìng)品調(diào)研
為啥要競(jìng)品調(diào)研呢?
因?yàn)楦?jìng)品和我們的產(chǎn)品類(lèi)似,那么意味著用戶(hù)大概率重合度也高,甚至業(yè)務(wù)上都有一定相似度,那么意味著,競(jìng)品的方案,大概率是經(jīng)過(guò)市場(chǎng)驗(yàn)證的符合用戶(hù)心智模型的方案。
你看,既然競(jìng)品已經(jīng)給咱們打了個(gè)樣,為何還要自己悶頭造輪子呢?
咱們目的是解決問(wèn)題,又不是為了證明自己很厲害。
但是,不要誤解,我不是說(shuō)照著競(jìng)品抄,而是取長(zhǎng)補(bǔ)短,所以不僅要調(diào)研,還要分析,分析就是把競(jìng)品的優(yōu)劣勢(shì)找出來(lái),好的地方咱們可以酌情借鑒,不好的地方,咱們也要避個(gè)雷嘛。
好了,小結(jié)一下,要想匹配用戶(hù)的心智模型,一定要了解業(yè)務(wù)、了解用戶(hù),還要做競(jìng)品調(diào)研了解市場(chǎng)的通識(shí)性做法。
以上。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
進(jìn)入喜茶小程序的時(shí)候給我的感受是簡(jiǎn)潔、時(shí)尚、極致的設(shè)計(jì)風(fēng)格,截了兩張小程序內(nèi)的兩個(gè)界面。 確實(shí)做的還挺不錯(cuò)的,為什么給人感受不一樣?接下來(lái)我們分析分析
1.首先從下面的頁(yè)面我們能發(fā)現(xiàn),界面的排版只有卡片左邊距留了20的安全距離,而卡片右邊安全距離為0,這樣特別的版式設(shè)計(jì)給人不對(duì)稱(chēng)的感覺(jué),這樣的設(shè)計(jì)能讓用戶(hù)記住,同時(shí)又有一點(diǎn)時(shí)尚范的感覺(jué),很符合喜茶目標(biāo)用戶(hù)年輕人的審美。
2.同時(shí)產(chǎn)品的banner是3:2的比例,較為靠近黃金比例的尺寸。
1.點(diǎn)單頁(yè)面,喜茶新增了新品推廣位,一些新上的產(chǎn)品都會(huì)在推廣位呈現(xiàn),尺寸比例4:3,給人的感受像是線下海報(bào)一樣,同時(shí)第三個(gè)廣告位露出部分,讓用戶(hù)知道后面還可以左滑查看。同時(shí)推廣頁(yè)的右下角有個(gè)箭頭指引,告知用戶(hù)可點(diǎn)擊。
2.看完這幾個(gè)頁(yè)面會(huì)發(fā)現(xiàn),喜茶的基本上都是純直角的設(shè)計(jì)語(yǔ)言,推廣頁(yè)是直角、標(biāo)簽是直角、按鈕微圓角,直角的設(shè)計(jì)語(yǔ)言給人的感受是時(shí)尚、極致、極簡(jiǎn)的設(shè)計(jì)感受,個(gè)人非常喜歡。
3.但是點(diǎn)單頁(yè)面的有點(diǎn)亂,標(biāo)簽的顏色過(guò)多,不夠統(tǒng)一,圖標(biāo)的也非常的多,這樣給人的感受就會(huì)比較凌亂,盡可能少的去表現(xiàn),這樣更加能提高用戶(hù)的效率。
1.在點(diǎn)單頁(yè)面用戶(hù)上滑,推廣位漸漸的往上消失,這樣產(chǎn)品的展示會(huì)更多,利于用戶(hù)挑選和尋找。
2.用戶(hù)在選口味界面,發(fā)現(xiàn)每一個(gè)標(biāo)簽的內(nèi)的文字左右的安全距離一致,依次排列,具有節(jié)奏感,頁(yè)面給人感受簡(jiǎn)潔、易操作,同時(shí)用戶(hù)可以選自己的口味,可進(jìn)行保存,下次點(diǎn)直接就可以選擇自己的口味。
在喜茶的百貨界面能清晰發(fā)現(xiàn)每一個(gè)模塊的都是不一樣的,很多產(chǎn)品的商場(chǎng)頁(yè)面都是一致的,而喜茶在產(chǎn)品的展示會(huì)以不一樣的形式出現(xiàn),每一個(gè)模塊都有尺寸和排版的差異,這樣給用戶(hù)有種落錯(cuò)感,更加有設(shè)計(jì)。
1.喜茶的會(huì)員頁(yè)給我眼前一亮的感覺(jué),會(huì)員的背景用色都是明度高、純度低的漸變給人的感受清新、淡雅的感覺(jué)。
2.會(huì)員頁(yè)用戶(hù)在切換的同時(shí)圖標(biāo)的顏色會(huì)跟著會(huì)員的顏色變化,特權(quán)的內(nèi)容也會(huì)有不一樣的變化,讓用戶(hù)有明顯的等級(jí)感知。
3.切換到“黑卡”的時(shí)候,會(huì)發(fā)現(xiàn)會(huì)員頁(yè)的“喜”字加上了質(zhì)感。
4.會(huì)員卡上“喜”字提取了“喜茶”中的“喜”,跟其他產(chǎn)品的會(huì)員做了區(qū)分的同時(shí)又加深了品牌印象。
喜茶有兩種不同風(fēng)格的圖標(biāo),一種是比較極簡(jiǎn),線性,差異性沒(méi)有那么強(qiáng),而另一種則是插畫(huà)風(fēng)格的圖標(biāo),給人感受比較有趣,更有差異,極簡(jiǎn)則符合喜茶整體小程序的調(diào)性,而插畫(huà)又豐富了頁(yè)面的單調(diào)性。
1.喜茶頂部的banner做非常不錯(cuò),例如跟FENDI合作的會(huì)在首屏加入視頻,用戶(hù)一進(jìn)入小程序就能看到能很好的吸引用戶(hù)的注意。
2.用戶(hù)在左右切換banner時(shí),文字會(huì)先出現(xiàn)然后底部的圖片漸漸出現(xiàn),給用戶(hù)感受自然、流暢的感受,好的動(dòng)畫(huà)效果能給產(chǎn)品加分,給用戶(hù)留下好的感受。
1.喜茶的數(shù)字字體是NeutraText-DemiAlt,每次進(jìn)去喜茶看到他們的數(shù)字字體非常有獨(dú)特性,給人的感受時(shí)尚、極致、有設(shè)計(jì)。
2.部分界面和海報(bào)喜茶會(huì)用上方正悠宋,有點(diǎn)中國(guó)風(fēng)、古風(fēng)的韻味在里面,而且也非常有獨(dú)特的設(shè)計(jì)美感,喜茶會(huì)應(yīng)用在國(guó)風(fēng)的海報(bào)以及會(huì)員頁(yè)的“喜”字上,突出風(fēng)格化。
3.好的字體能很好的提高產(chǎn)品的品牌感和設(shè)計(jì)美感,更能傳達(dá)該品牌想傳達(dá)的東西。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
近年來(lái),行業(yè)內(nèi)不斷探索廣告的新玩法,激勵(lì)視頻廣告成為一種愈加流行的廣告形式,當(dāng)前已經(jīng)是媒體主流變現(xiàn)模式之一,以滿足廣告主營(yíng)銷(xiāo)效果、媒體變現(xiàn)效率最大化。對(duì)用戶(hù)而言,觀看激勵(lì)視頻廣告能夠獲得相應(yīng)獎(jiǎng)勵(lì);對(duì)于客戶(hù),激勵(lì)視頻廣告通過(guò)獎(jiǎng)勵(lì)機(jī)制,得到更長(zhǎng)時(shí)間的曝光來(lái)提升轉(zhuǎn)化率;對(duì)于平臺(tái),有更高的變現(xiàn)效率能帶來(lái)更高的收益。
百度激勵(lì)視頻廣告承載著百度APP任務(wù)系統(tǒng)、權(quán)益場(chǎng)景、活動(dòng)場(chǎng)景等的重要變現(xiàn)任務(wù),本文將從激勵(lì)視頻廣告的框架、提升轉(zhuǎn)化效果兩個(gè)方面,來(lái)闡述容器結(jié)構(gòu)設(shè)計(jì)與提升轉(zhuǎn)化效果的設(shè)計(jì)思考。
框架:建立場(chǎng)景核心轉(zhuǎn)化流程
激勵(lì)視頻廣告是獨(dú)立的視頻場(chǎng)景,場(chǎng)景內(nèi)的元素布局、容器結(jié)構(gòu)不依賴(lài)于所在的宿主場(chǎng)景,在整個(gè)交互鏈路中能夠采用更有創(chuàng)新的設(shè)計(jì)形式。
1、布局跨場(chǎng)景橫向一致
基于激勵(lì)視頻廣告的元素來(lái)明確內(nèi)容分區(qū),考慮元素作用與通用性可分為頂部框架區(qū)、附加掛載區(qū)、內(nèi)容信息區(qū)、轉(zhuǎn)化決策區(qū),在結(jié)構(gòu)設(shè)計(jì)上,將核心獎(jiǎng)勵(lì)計(jì)時(shí)組件置于頂部框架區(qū)并保持穩(wěn)定展現(xiàn),保證百度APP內(nèi)的視頻廣告在布局上橫向一致性,同時(shí)也有利于場(chǎng)景之間創(chuàng)意交叉驗(yàn)證與復(fù)用。
2、容器、元素組件選型
從激勵(lì)視頻的鏈路流程出發(fā),結(jié)合主動(dòng)交互行為的各類(lèi)組件狀態(tài):獎(jiǎng)勵(lì)計(jì)時(shí)與完成、視頻播放與完播、瀏覽落地頁(yè)、退出挽留四種核心狀態(tài)。
1)獎(jiǎng)勵(lì)計(jì)時(shí)與完成:考慮獎(jiǎng)勵(lì)計(jì)時(shí)器會(huì)存在于多種不同場(chǎng)景情況,需要具備橫向統(tǒng)一的計(jì)時(shí)形式來(lái)穩(wěn)定用戶(hù)預(yù)期,以及通過(guò)視覺(jué)反饋給予用戶(hù)明確的狀態(tài)變化感知,來(lái)降低不同場(chǎng)景下的理解成本,通過(guò)ABtest的方式,最終選用場(chǎng)景元素圖標(biāo)與文本計(jì)時(shí)形式,圖標(biāo)能夠根據(jù)獎(jiǎng)勵(lì)的不同支持靈活配置,滿足多元化場(chǎng)景的適配訴求,同時(shí)選用視覺(jué)感知較弱的樣式與動(dòng)畫(huà)形式,盡可能避免與點(diǎn)擊、轉(zhuǎn)化無(wú)關(guān)的元素動(dòng)畫(huà)稀釋用戶(hù)對(duì)內(nèi)容的注意力,從而影響廣告效果。
2)視頻播放與完播:播放狀態(tài)下,為盡量降低對(duì)視頻內(nèi)容的遮擋,在轉(zhuǎn)化組件的呈現(xiàn)上,采用“延遲展現(xiàn)吸引觀看,漸進(jìn)式增強(qiáng)吸引點(diǎn)擊”的手段,視頻完播狀態(tài)下呈現(xiàn)視頻尾幀,尾幀增加再看一個(gè)視頻功能,為想要獲得金幣的用戶(hù)縮短操作步長(zhǎng),提升激勵(lì)視頻廣告的分發(fā)。
3)瀏覽落地頁(yè):瀏覽落地頁(yè)過(guò)程中也需明示獎(jiǎng)勵(lì)計(jì)時(shí),為了保證視頻場(chǎng)景和落地頁(yè)場(chǎng)景的計(jì)時(shí)延續(xù)與組件統(tǒng)一性,采用避讓計(jì)時(shí)組件的面板化落地頁(yè)容器。
4)退出挽留:當(dāng)用戶(hù)在不同獎(jiǎng)勵(lì)狀態(tài)下會(huì)在退出的主動(dòng)行為,挽留彈窗承載挽留與再看功能的重要作用,彈窗作為前后鏈路場(chǎng)景的共性組件,在彈窗設(shè)計(jì)上頂部承載所在場(chǎng)景主視覺(jué)IP,以滿足多元化場(chǎng)景的下活動(dòng)主視覺(jué)的延續(xù),使激勵(lì)視頻廣告更契合所在活動(dòng)場(chǎng)景。
3、轉(zhuǎn)化鏈路降步長(zhǎng)
在原有的基礎(chǔ)路徑上,獎(jiǎng)勵(lì)計(jì)時(shí)與倒計(jì)時(shí)結(jié)束的兩個(gè)環(huán)節(jié)僅有計(jì)時(shí)器形態(tài)的變化,元素變化是容易起到聚焦視覺(jué)的作用的,以倒計(jì)時(shí)結(jié)束為節(jié)點(diǎn),將用戶(hù)從"視頻場(chǎng)景"帶入到"決策場(chǎng)景",通過(guò)容器結(jié)構(gòu)形態(tài)的變化來(lái)解放停留在計(jì)時(shí)器上的視覺(jué)焦點(diǎn),面板結(jié)構(gòu)能承載更多的增益內(nèi)容,延展信息載量,視頻完播是判斷用戶(hù)對(duì)內(nèi)容感興趣的重要契機(jī),在視頻完播狀態(tài)自動(dòng)調(diào)起落地頁(yè),通過(guò)縮短轉(zhuǎn)化步長(zhǎng)提升轉(zhuǎn)化效率。
激勵(lì)視頻廣告容器每一步迭代都伴隨大量的前置思考、歸因分析、嚴(yán)謹(jǐn)實(shí)驗(yàn),經(jīng)歷多輪迭代最終完成流程框架搭建,后面我們?nèi)砸伎既绾瓮ㄟ^(guò)設(shè)計(jì)方法,在現(xiàn)有的框架上進(jìn)一步提升轉(zhuǎn)化效果。
提轉(zhuǎn):內(nèi)容化與獎(jiǎng)勵(lì)玩法助決策
在廣告創(chuàng)意視角下,通過(guò)內(nèi)容信息命中用戶(hù)訴求、滿足心理期望能夠提升轉(zhuǎn)化效果;在用戶(hù)目標(biāo)視角下,我們希望充分發(fā)揮激勵(lì)機(jī)制,給予用戶(hù)更多豐富的獎(jiǎng)勵(lì)交互與玩法,持續(xù)獲取收益與滿足感。
1、增益信息前置,助力轉(zhuǎn)化決策
輪播推薦詞:推薦詞輪播的形式來(lái)營(yíng)造場(chǎng)景內(nèi)互動(dòng)氛圍,在一些節(jié)日期間通過(guò)契合節(jié)日的情感化文案,讓內(nèi)容更貼合節(jié)日營(yíng)銷(xiāo)氛圍,同時(shí)將落地頁(yè)中的優(yōu)質(zhì)廣告賣(mài)點(diǎn)、數(shù)據(jù)生成的熱度等多元的營(yíng)銷(xiāo)信息前置,助力用戶(hù)決策。
行動(dòng)號(hào)召詞:不同廣告內(nèi)容之間的轉(zhuǎn)化文案存在差異化的表達(dá),通過(guò)符合廣告內(nèi)容的決策性文案披露,將固定文案升級(jí)為營(yíng)銷(xiāo)目標(biāo)及類(lèi)型特征文案,輔助轉(zhuǎn)化決策,在容器內(nèi)每一個(gè)元素都應(yīng)該作為廣告創(chuàng)意的一部分。
2、分段獎(jiǎng)勵(lì)計(jì)時(shí),引導(dǎo)視頻完播
點(diǎn)擊率、轉(zhuǎn)化率隨視頻播放時(shí)長(zhǎng)的數(shù)據(jù)變化,發(fā)現(xiàn)呈現(xiàn)正相關(guān)的趨勢(shì),我們希望用戶(hù)能夠選擇看完視頻,核心思路是將用戶(hù)從低變現(xiàn)效率場(chǎng)景,引導(dǎo)至高變現(xiàn)效率的場(chǎng)景,由此我們通過(guò)兩段計(jì)時(shí)獎(jiǎng)勵(lì)的設(shè)計(jì)形式,激勵(lì)用戶(hù)可以拿到更多獎(jiǎng)勵(lì)并將視頻看完,考慮多種不同場(chǎng)景以及理解成本的問(wèn)題,最終選用兩段獎(jiǎng)勵(lì)計(jì)時(shí)組件的方式。
3、彩蛋營(yíng)造驚喜,提升轉(zhuǎn)化
為了更好的匹配各大電商平臺(tái)調(diào)起類(lèi)廣告的預(yù)算,大促期間的突然出現(xiàn)的禮物彩蛋為用戶(hù)營(yíng)造節(jié)日驚喜感,在點(diǎn)擊行為后,紅包元素的彈窗與彩帶動(dòng)畫(huà)形式來(lái)承載金幣獎(jiǎng)勵(lì)與氛圍,獎(jiǎng)勵(lì)感知的觸達(dá)能夠提升用戶(hù)的獲得感,同時(shí)在獎(jiǎng)勵(lì)彈窗上進(jìn)一步承載調(diào)起任務(wù),從而更好的滿足客戶(hù)營(yíng)銷(xiāo)訴求。
4、強(qiáng)化轉(zhuǎn)化組件,增強(qiáng)獎(jiǎng)勵(lì)觸達(dá)
延續(xù)以上驚喜感獎(jiǎng)勵(lì)滿足促轉(zhuǎn)化的思路,針對(duì)下載類(lèi)廣告,我們?cè)谵D(zhuǎn)化組件上進(jìn)行與獎(jiǎng)勵(lì)內(nèi)容的結(jié)合,在任務(wù)計(jì)時(shí)完成但并沒(méi)有形成轉(zhuǎn)化的時(shí)機(jī)下,通過(guò)變色與光效視覺(jué)吸引來(lái)傳遞獎(jiǎng)勵(lì)信息,通過(guò)強(qiáng)化獎(jiǎng)勵(lì)感知和轉(zhuǎn)化組件來(lái)助力轉(zhuǎn)化決策。
寫(xiě)在最后
激勵(lì)視頻廣告至今經(jīng)歷了多個(gè)不同的階段,如何在商業(yè)效果與用戶(hù)感知之間選取一個(gè)平衡點(diǎn),一直都是激勵(lì)視頻廣告的長(zhǎng)久的設(shè)計(jì)課題,目前也只是一個(gè)開(kāi)始,還有很多的設(shè)計(jì)提轉(zhuǎn)機(jī)會(huì)點(diǎn)等待我們?nèi)ド钔冢嘈旁诓痪玫膶?lái)能夠探索更加多元的激勵(lì)玩法,發(fā)現(xiàn)更多契合用戶(hù)訴求的場(chǎng)景,為更好的價(jià)值生產(chǎn)不斷迭代功能與體驗(yàn),我們希望能夠給予用戶(hù)、客戶(hù)、平臺(tái)更多的價(jià)值增益,做用戶(hù)喜歡、客戶(hù)滿意、平臺(tái)有利的商業(yè)設(shè)計(jì)。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
19世紀(jì)末,意大利經(jīng)濟(jì)學(xué)家和工程師維爾弗雷多·帕累托(Vilfredo Pareto)發(fā)現(xiàn),自家花園中80%的豌豆產(chǎn)自于20%的豌豆莢,在隨后研究土地所有權(quán)和財(cái)富不平等的問(wèn)題中,再次發(fā)現(xiàn)意大利 80%的土地屬于 20%的人。
20世紀(jì)初,由管理學(xué)家約瑟夫·朱蘭(Joseph Juran)將其命名為帕累托法則,即80%的結(jié)果是20%的原因造成的,并且號(hào)召關(guān)注「重要的少數(shù)」而不是在「瑣碎的多數(shù)」當(dāng)中投注精力。后續(xù)在經(jīng)濟(jì)學(xué)中得出結(jié)論(80%的財(cái)富掌握在20%的人手里)更加證實(shí)了帕累托法則的觀點(diǎn)。
帕累托法則有很多不同的叫法,如帕列托法則、關(guān)鍵少數(shù)法則、二八法則、巴萊特定律、最省力的法則、不平衡原則等,后續(xù)筆者將其稱(chēng)為「80/20法則」。
其實(shí),80/20法則是一個(gè)較為抽象的概念,可以理解為:大部分的效果由少數(shù)幾項(xiàng)關(guān)鍵的因素來(lái)決定。在實(shí)際的場(chǎng)景中,“大部分”不是精確的80%,“幾項(xiàng)關(guān)鍵因素”也不是固定的20%,數(shù)據(jù)會(huì)有所浮動(dòng),可能是70%+30%或者90%+10%,但不管這些數(shù)字如何波動(dòng),其背后蘊(yùn)含的規(guī)律(集中的投入將產(chǎn)出大于預(yù)期的結(jié)果)是不變的,并且生活中存在的許多不平衡現(xiàn)象,都與這個(gè)規(guī)律相當(dāng)接近。
80/20法則并不受人為直接控制,更多時(shí)候是自然而然的形成,其適用領(lǐng)域非常廣泛。早期大多數(shù)用于社會(huì)、經(jīng)濟(jì)、管理以及工程等領(lǐng)域,而在80年代末就已經(jīng)有設(shè)計(jì)師將其設(shè)計(jì)領(lǐng)域,在各行各業(yè)中,已經(jīng)有大量的案例證明了 80/20原則:
70年代中期出現(xiàn)圖形化界面,而到80年代末,80/20法則就已經(jīng)被設(shè)計(jì)師引用在設(shè)計(jì)規(guī)范當(dāng)中,后續(xù)經(jīng)過(guò)不斷的發(fā)展及優(yōu)化,現(xiàn)已深入設(shè)計(jì)中的方方面面,PM用來(lái)處理KPI、UX用來(lái)劃分權(quán)重、UI用來(lái)決策版面布局等。
界面設(shè)計(jì)中該如何應(yīng)用80/20法則,這就需要設(shè)計(jì)師時(shí)刻注意如何讓用戶(hù)更快找到目標(biāo)、如何更順暢的完成任務(wù)以及如何擁有更愉悅的心理感受。例如80%的用戶(hù)只會(huì)用到20%的功能,那么設(shè)計(jì)師就應(yīng)該將80%的時(shí)間、精力集中在這20%的功能上,不斷迎合用戶(hù)需求以及使用體驗(yàn)。
80/20法則能夠幫助我們提供決策思路、梳理設(shè)計(jì)方向,通過(guò)前面的了解,我們應(yīng)該清楚了產(chǎn)品80%的用戶(hù)只會(huì)用到20%的功能,而80%的收益也恰恰來(lái)自于20%的付費(fèi)用戶(hù),甚至低于20%。
雖然一直呼吁盡量滿足所有用戶(hù),但產(chǎn)品團(tuán)隊(duì)的重心始終要圍繞著20%來(lái)進(jìn)行,從產(chǎn)品到設(shè)計(jì)、再到開(kāi)發(fā)測(cè)試,都能以此為方向制定問(wèn)題的解決方案。
任何一款產(chǎn)品都不能忽略主次,每隔一段時(shí)間就要重新評(píng)估功能價(jià)值,以備后續(xù)的更新迭代,針對(duì)非關(guān)鍵性的80%切勿耗費(fèi)過(guò)多的精力,以免喧賓奪主,不僅得到不好的反饋、還會(huì)帶來(lái)不必要的損失,吃力不討好。
對(duì)于已經(jīng)過(guò)期的核心(曾經(jīng)20%)功能,需要及時(shí)降低權(quán)重以及精力的消耗,不然即便是掌聲一片、也可能無(wú)法變現(xiàn)。
用20%的部分創(chuàng)造80%的價(jià)值,并不意味著只關(guān)注20%的關(guān)鍵性指標(biāo)、其它的就可以被忽略,這樣做表面上看是挺誘人,但會(huì)讓其他很多指標(biāo)停滯,呈現(xiàn)出產(chǎn)品過(guò)度優(yōu)化的情況,造成短時(shí)間內(nèi)隱藏的負(fù)面影響。
團(tuán)隊(duì)?wèi)?yīng)該要有眾覽全局的眼光,考慮到各指標(biāo)間的相互影響,可視情況而定將時(shí)間和精力合理分配,如90%+10%、80%+20%、70%+30%等,只要是將大部分用在關(guān)鍵性指標(biāo)上即可。
在UI設(shè)計(jì)中,我們會(huì)將主要精力花費(fèi)在20%的頁(yè)面設(shè)計(jì)上,例如APP底部標(biāo)簽欄的幾大主頁(yè)或其它重要的一/二級(jí)頁(yè)面,會(huì)花費(fèi)更多的心思去構(gòu)思不一樣的布局、表現(xiàn)手法,將設(shè)計(jì)功底凸顯出來(lái)。而剩下80%的頁(yè)面就相對(duì)機(jī)械化,會(huì)使用一些常規(guī)樣式以及復(fù)用的方式像搭積木一樣快速完成,成本之低、效率之高毋庸置疑。
同一個(gè)頁(yè)面的設(shè)計(jì)方式也是如此,設(shè)計(jì)師將大量心思放在首屏及位置靠上的功能上,待超過(guò)一屏后下滑時(shí),設(shè)計(jì)也會(huì)逐漸輕量、組件化,這有助于節(jié)省產(chǎn)品、設(shè)計(jì)、開(kāi)發(fā)更多的時(shí)間。
用戶(hù)瀏覽屏幕時(shí),眼球移動(dòng)的順序通常都是從左到右、從上到下(基于網(wǎng)頁(yè)瀏覽眼動(dòng)測(cè)試),這種移動(dòng)軌跡很像字母「F」,這也讓F型布局成為網(wǎng)頁(yè)設(shè)計(jì)中效率最高的方式之一,所以設(shè)計(jì)師通常會(huì)將重要的信息放在左上角或左側(cè),不重要的信息放在右側(cè)。
如下面這張眼動(dòng)測(cè)試圖,F(xiàn)型布局也正好詮釋了80/20法則合理性與可行性,在頁(yè)面中20%的關(guān)鍵區(qū)域,吸引了用戶(hù)80%的注意力。
很多產(chǎn)品因?yàn)闃I(yè)務(wù)功能的龐大,一股腦的將信息全部展示出來(lái),看起來(lái)十分臃腫,用戶(hù)不能快速找到自己想要的信內(nèi)容,就會(huì)失去信心。
優(yōu)酷APP首頁(yè)將熱門(mén)頻道和點(diǎn)擊頻率較高的頻道顯示在頂部導(dǎo)航中,如精選、電視劇、電影、最新院線等,而其他更多的分類(lèi)則隱藏在頻道選項(xiàng)卡中,將少量(≈20%)重要的內(nèi)容放在明顯的位置,目的就是為了讓大部分用戶(hù)更快觸達(dá),提高了產(chǎn)品的易用性。
在一些選項(xiàng)列表中,由于選項(xiàng)數(shù)量的龐大,會(huì)給用戶(hù)增加使用難度。
例如,使用美團(tuán)購(gòu)買(mǎi)火車(chē)票在選擇地址時(shí),面對(duì)超長(zhǎng)的地址列表,逐個(gè)查看或通過(guò)字母篩選,都要花費(fèi)一定的時(shí)間和操作成本,即便可以通過(guò)碼字搜索來(lái)完成,但因?yàn)樽孕休斎胗泻芏嗟牟豢煽匦裕茏層脩?hù)選擇的就不要讓其輸入。對(duì)于地址列表,除開(kāi)自動(dòng)定位和搜索歷史,運(yùn)用80/20法則就能很好的解決這一問(wèn)題,系統(tǒng)將約20%高頻選擇的熱門(mén)城市作為單獨(dú)的模塊放在全部列表之前,提高了大部分用戶(hù)的搜索效率。
極簡(jiǎn)風(fēng)格的界面設(shè)計(jì)跟80/20法則在精神上保持著高度的一致,剔除多余、無(wú)用的元素,而保留的每一個(gè)元素都是有目的、有針對(duì)性的,也是絕對(duì)必要的存在。在極簡(jiǎn)主義設(shè)計(jì)中,視覺(jué)上簡(jiǎn)單干凈,大部分都是通過(guò)通過(guò)留白來(lái)襯托關(guān)鍵性元素的存在,讓用戶(hù)更加聚焦于主要功能/信息。
奧卡姆剃刀指出「如無(wú)必要,勿增實(shí)體」,需知頁(yè)面中每多一個(gè)元素都會(huì)增加視覺(jué)“噪聲”,意味著用戶(hù)需要花費(fèi)額外的時(shí)間和理解成本,對(duì)用戶(hù)體驗(yàn)的影響是很大的。那么問(wèn)題來(lái)了,當(dāng)產(chǎn)品需要增加一項(xiàng)需求量小但確實(shí)存在的功能,該怎么處理?
這時(shí)我們可以將奧卡姆剃刀原則作為最終的評(píng)判標(biāo)準(zhǔn),是否需要增加上述所說(shuō)的功能,就要看看能否很好的控制團(tuán)隊(duì)開(kāi)發(fā)成本和用戶(hù)體驗(yàn)成本。其實(shí)在80/20法則中,很多小眾但確實(shí)存在的功能需求基本很難抵消所造成的用戶(hù)體驗(yàn)損失,所以即便實(shí)現(xiàn)了這個(gè)需求,也很難分配出20%的精力去維護(hù)與迭代,甚至“俺耳盜鈴”般的將其遺忘,但這個(gè)視覺(jué)“噪聲”一直存在,如果事先能分析出這種結(jié)果,這個(gè)需求根本不需要增加。
在2004年長(zhǎng)尾模型才被提出來(lái)的時(shí)候,很多人認(rèn)為這是在顛覆80/20法則,它們的曲線長(zhǎng)得很像,但結(jié)論完全相反,那條長(zhǎng)長(zhǎng)的“尾巴”(非關(guān)鍵的80%)所占據(jù)的長(zhǎng)度幾乎與頭部的(關(guān)鍵的20%)高度相當(dāng),這說(shuō)明收益雖低,但這么多數(shù)量的累積,依然值得重點(diǎn)關(guān)注。所以有很多企業(yè)在采集差異化戰(zhàn)略時(shí)運(yùn)用了長(zhǎng)尾理論,例如小米搭建的全品類(lèi)商城用的是長(zhǎng)尾理論。
乍一聽(tīng)好像很有道理,難道80/20法則被推翻了嗎?事實(shí)并非如此,長(zhǎng)尾理論的成立必須要滿足兩個(gè)條件,第一是尾巴真的足夠長(zhǎng)(小眾需求確實(shí)非常多),第二長(zhǎng)尾巴能被用戶(hù)發(fā)現(xiàn)(龐大的用戶(hù)量),這兩個(gè)條件缺一不可。例如京東、淘寶、微信、支付寶等,其前提都是建立在大規(guī)模、且海量的用戶(hù)資源之上,不管多么隱蔽、多小的動(dòng)能,總能擁有一些不錯(cuò)的曝光度,所以才能發(fā)揮長(zhǎng)尾模型的作用。
說(shuō)道這里,大家應(yīng)該就明白了,那些中小型的產(chǎn)品對(duì)長(zhǎng)尾模型大多是望塵莫及,所以在你的產(chǎn)品規(guī)模、用戶(hù)量沒(méi)有達(dá)到一定的級(jí)別之前,就不要妄捧長(zhǎng)尾模型,用好80/20法則就好。
80/20法則在實(shí)際工作中是一個(gè)相對(duì)普遍的定律,它能讓我們靈活思考設(shè)計(jì)問(wèn)題,更好的為用戶(hù)服務(wù),雖然80/20法則也存在一定的爭(zhēng)議,但還是適用于覺(jué)絕大多數(shù)的場(chǎng)景,在關(guān)鍵時(shí)候使用,能幫助我們準(zhǔn)確的找到問(wèn)題點(diǎn),在有限的時(shí)間和精力下快速作出優(yōu)化決策并、關(guān)注核心功能,最終達(dá)成目標(biāo)。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
一、項(xiàng)目背景
虛擬形象產(chǎn)品形態(tài)現(xiàn)已逐步成熟,“捏臉+社區(qū)” 的模式逐漸成為年輕人的虛擬社交游樂(lè)場(chǎng),競(jìng)品Q(chēng)Q、Soul、淘寶等產(chǎn)品先后融入虛擬形象,探索年輕、有趣的社交模式。
貼吧在這一方向上進(jìn)行了創(chuàng)意玩法探索,希望可以通過(guò)特色互動(dòng)形式,拉近與年輕用戶(hù)的關(guān)系,為后續(xù)開(kāi)拓社交場(chǎng)景奠定基礎(chǔ)。
二、視覺(jué)風(fēng)格滿足年輕用戶(hù)喜好
通過(guò)用戶(hù)調(diào)研,了解年輕用戶(hù)喜好個(gè)性十足和精致細(xì)膩的設(shè)計(jì),同時(shí)希望可以有更多的搭配空間,我們針對(duì)設(shè)計(jì)成本與用戶(hù)喜好,建立十字坐標(biāo)軸篩選設(shè)計(jì)方向,匹配不同用戶(hù),帶來(lái)差異化感知。
1、潮流、漫畫(huà)雙風(fēng)格設(shè)定,滿足用戶(hù)自我表達(dá)
潮流風(fēng)格具備年輕時(shí)髦感,漫畫(huà)風(fēng)格質(zhì)感更細(xì)膩,打造出產(chǎn)品的精致度,雙風(fēng)格設(shè)計(jì)可以最大程度滿足用戶(hù)的多元自我表達(dá)需求。
2、形象工程量產(chǎn),滿足搭配的豐富度
為了達(dá)到玩法多變的目標(biāo),我們對(duì)形象進(jìn)行工程化文件拆分,以發(fā)型區(qū)為例,通過(guò)層層分區(qū)來(lái)實(shí)現(xiàn)顏色、素材的靈活搭配。
拆分不同的發(fā)片,與身體、面部相互穿插,可以搭配出不同發(fā)型,對(duì)底色、陰影、描邊的拆分,實(shí)現(xiàn)代碼著色改變發(fā)色,每個(gè)形象完成36層拆解,達(dá)到顏色、素材的多元展現(xiàn)。
漫畫(huà)風(fēng)格,在表現(xiàn)上相比潮流風(fēng)格更加細(xì)膩,采用同樣的裸模坐標(biāo)與拆分標(biāo)準(zhǔn),實(shí)現(xiàn)雙風(fēng)格靈活搭配。
針對(duì)兩種風(fēng)格我們批量化產(chǎn)出了服飾、發(fā)型、配飾、五官等標(biāo)準(zhǔn)化素材,實(shí)現(xiàn)全部素材多變量靈活搭配,形象設(shè)計(jì)從軟萌可愛(ài)到年輕潮流,貼合了年輕用戶(hù)的多重喜好,為了提升與研發(fā)的對(duì)接效率,同步制定了工程文件產(chǎn)出規(guī)范,通過(guò)對(duì)坐標(biāo)軸、熱區(qū)的定位,圖層規(guī)范化的命名,實(shí)現(xiàn)所有素材快速開(kāi)發(fā)上線,降低產(chǎn)研溝通走查成本。
三、創(chuàng)新交互玩法增加可玩性
1、點(diǎn)選切換展示區(qū)讓創(chuàng)作更便捷
從0-1搭建基礎(chǔ)框架,為了降低學(xué)習(xí)操作成本,讓用戶(hù)可以快速上手,框架采用上部展示區(qū)、下部選擇區(qū)的形象制定產(chǎn)品通用布局。
在交互形態(tài)上,我們進(jìn)行了創(chuàng)意玩法創(chuàng)新,新增點(diǎn)選切換形式提升便捷度,用戶(hù)能通過(guò)點(diǎn)選展示區(qū)當(dāng)前部位快速定位操作,簡(jiǎn)化使用,縮短裝扮時(shí)長(zhǎng)。
2、靈活手勢(shì)創(chuàng)新實(shí)現(xiàn)玩法多變
針對(duì)貼吧用戶(hù)腦洞大開(kāi)、鬼馬個(gè)性的特點(diǎn),提供靈活操作,提升形象創(chuàng)意度,以下圖為例,可以看到眼睛、嘴巴等元素通過(guò)用戶(hù)的旋轉(zhuǎn)、縮放、位移等操作產(chǎn)生了很多鬼畜搞笑的形象,更有阿凡達(dá)、小岳岳、一眼丁真等形象加持,趣味十足。
3、豐富表態(tài)吸引用戶(hù)快速參與
通過(guò)動(dòng)態(tài)輕互表情帶來(lái)驚喜感,同時(shí)增加長(zhǎng)按觸發(fā)連擊效果,提升用戶(hù)互動(dòng)爽感,狀態(tài)表達(dá)幫助用戶(hù)快速選擇當(dāng)時(shí)狀態(tài),更低成本參與自我表達(dá)。
四、強(qiáng)化感知多場(chǎng)景觸達(dá)虛擬形象
為了讓貼吧用戶(hù)快速玩起來(lái),提升用戶(hù)滲透,我們?cè)谫N吧全場(chǎng)景進(jìn)行傳播。
1、串聯(lián)核心場(chǎng)景實(shí)現(xiàn)用商聯(lián)動(dòng)變現(xiàn)
串聯(lián)端內(nèi)成長(zhǎng)體系這一核心任務(wù),打通多場(chǎng)景閉環(huán),形象設(shè)定之后,在首頁(yè)、圖文詳情頁(yè)、個(gè)人主頁(yè)等核心場(chǎng)景展示個(gè)人形象,形成全場(chǎng)景滲透,有效擴(kuò)大虛擬形象在端內(nèi)的傳播。
高定裝扮聯(lián)通會(huì)員權(quán)益與成長(zhǎng)值,通過(guò)漲、兌、買(mǎi)路徑,實(shí)現(xiàn)會(huì)員權(quán)益激勵(lì)、成長(zhǎng)體系、形象變現(xiàn)的三方激勵(lì)串聯(lián)。
采用細(xì)膩手繪技法為對(duì)魔域游繪制精品形象,吸引游戲深度用戶(hù)完成形象裝扮,同時(shí)實(shí)現(xiàn)設(shè)計(jì)變現(xiàn)。
2、建立分享回流機(jī)制實(shí)現(xiàn)社區(qū)裂變
通過(guò)端外引流和影響力擴(kuò)散,吸引用戶(hù)產(chǎn)生回流,增加用戶(hù)粘性,持續(xù)增加用戶(hù)量。
五、結(jié)語(yǔ)
以上就是虛擬形象設(shè)計(jì)在整個(gè)創(chuàng)新玩法探索中的思路與舉措。
回顧設(shè)計(jì)過(guò)程,我們探索了更加貼切用戶(hù)的快捷交互體驗(yàn),提升操控效率、縮減觸發(fā)路徑;我們緊跟設(shè)計(jì)趨勢(shì),時(shí)刻關(guān)注年輕用戶(hù)需求,通過(guò)多風(fēng)格、工程化、輕互動(dòng)等手段,打造年輕化產(chǎn)品;我們通過(guò)與貼吧核心場(chǎng)景串聯(lián)融合,給老產(chǎn)品帶來(lái)全新社區(qū)體驗(yàn)。
虛擬形象上線后滲透率持續(xù)增長(zhǎng)到15%,用戶(hù)累積佩戴數(shù)達(dá)百萬(wàn)級(jí)別,效果超預(yù)期,吧友們?cè)谔摂M形象吧里進(jìn)行深入的評(píng)價(jià)與討論。定制出了高顏值、個(gè)性化、輕幽默等不同風(fēng)格的形象。
最后也期待廣大吧友們可以通過(guò)對(duì)貼吧虛擬形象的關(guān)注和喜愛(ài)來(lái)到貼吧,在我們的特色平臺(tái)定制出獨(dú)一無(wú)二的自己。
未來(lái)我們也將不斷探索、創(chuàng)新更多年輕化創(chuàng)意玩法,讓貼吧成為用戶(hù)喜愛(ài)具有歸屬感的繁榮社區(qū)。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
“系統(tǒng)應(yīng)該在合理的時(shí)間內(nèi)通過(guò)適當(dāng)?shù)姆答?,始終讓用戶(hù)了解正在發(fā)生的事情” --尼爾森。
用戶(hù)都希望產(chǎn)品是可控的、狀態(tài)是可預(yù)測(cè)的,所以無(wú)論用戶(hù)在界面上做了什么,系統(tǒng)應(yīng)該在合適的時(shí)間給予合理的反饋,始終保持界面的狀態(tài)可見(jiàn)、變化可見(jiàn)、內(nèi)容可見(jiàn),讓用戶(hù)對(duì)已經(jīng)發(fā)生的、正在進(jìn)行的、以及后續(xù)走向都有所了解,以避免在后續(xù)的轉(zhuǎn)化決策中出現(xiàn)錯(cuò)誤。
界面不僅僅是為了把信息呈現(xiàn)給用戶(hù),還需要引導(dǎo)用戶(hù)來(lái)操作,讓用戶(hù)清楚的知道當(dāng)前在什么位置,以及操作時(shí)最想要知道的信息。
例如,訂單頁(yè)頂部的導(dǎo)航分欄,不僅將字體加大加粗、色彩加深,還添加了主題色的形狀,為的就是強(qiáng)化用戶(hù)當(dāng)前所在位置。購(gòu)買(mǎi)產(chǎn)品VIP時(shí),按鈕中會(huì)顯示金額,也是為了讓用戶(hù)的視線停留在CTA按鈕上,避免用戶(hù)想要查看價(jià)格時(shí)將視線從CTA按鈕上移開(kāi)。
對(duì)于同一操作,系統(tǒng)需要搭配不同的時(shí)間場(chǎng)景給予不同的反饋,確保反饋的及時(shí)性,避免讓用戶(hù)產(chǎn)生焦慮或不安。例如在跳轉(zhuǎn)頁(yè)面時(shí),即時(shí)跳轉(zhuǎn),用戶(hù)通??床坏饺魏翁D(zhuǎn)中的狀態(tài),時(shí)間稍長(zhǎng)會(huì)看到加載動(dòng)效,若長(zhǎng)時(shí)間沒(méi)有響應(yīng),則會(huì)提示其他問(wèn)題,如網(wǎng)絡(luò)問(wèn)題、跳轉(zhuǎn)失敗等。
用戶(hù)需要清晰感知到已經(jīng)發(fā)生、正在發(fā)生以及即將發(fā)生的事情,以便于他們進(jìn)行下一步?jīng)Q策。每當(dāng)用戶(hù)進(jìn)行交互后,系統(tǒng)應(yīng)將當(dāng)前狀態(tài)、位置、進(jìn)度以及操作結(jié)果適當(dāng)?shù)姆答伣o用戶(hù),以減少不確定性。如果用戶(hù)存在失誤,更應(yīng)加以正確方向上的引導(dǎo),避免用戶(hù)產(chǎn)生疑惑或重復(fù)操作。
例如在電商應(yīng)用中,將商品收藏、添加到購(gòu)物車(chē)等,這種操作行為不會(huì)造成任何損失,系統(tǒng)在反饋時(shí)盡量不要打斷用戶(hù),使用類(lèi)似toast簡(jiǎn)短彈窗提示即可。但對(duì)于金額支付、內(nèi)容刪除等,會(huì)涉及用戶(hù)利益或安全方面的操作,就需要通過(guò)彈窗打斷用戶(hù)當(dāng)前操作,讓其二次確認(rèn)后再作決策,以減少不必要的損失。
“系統(tǒng)應(yīng)該說(shuō)用戶(hù)的語(yǔ)言,用戶(hù)熟悉的單詞,短語(yǔ)和概念,而不是系統(tǒng)導(dǎo)向的術(shù)語(yǔ)。遵循現(xiàn)實(shí)世界的約定,使信息以自然和合乎邏輯的順序出現(xiàn)”--尼爾森。
設(shè)計(jì)師需要站在用戶(hù)的角度去做設(shè)計(jì),但并不能就此代表用戶(hù),不要將自己對(duì)產(chǎn)品的理解、行業(yè)中的專(zhuān)業(yè)術(shù)語(yǔ)代入用戶(hù)場(chǎng)景中,因?yàn)橛脩?hù)的認(rèn)知大多來(lái)源于多周?chē)h(huán)境的感知,我們需要使用最貼近目標(biāo)用戶(hù)群體生活場(chǎng)景的表達(dá)方式,讓信息表現(xiàn)的自然,用戶(hù)能更容易理解。
對(duì)于環(huán)境貼切原則,直接點(diǎn)就是“說(shuō)人話”,蘋(píng)果之父「喬布斯」和微信之父「張小龍」的產(chǎn)品核心理念便是如此,用最簡(jiǎn)單直白的語(yǔ)言、用戶(hù)最熟悉的概念呈現(xiàn)信息,盡量貼近真實(shí)的世界,將產(chǎn)品做到傻瓜也能操作,才能保證與用戶(hù)溝通交流的順暢。
產(chǎn)品的設(shè)計(jì)語(yǔ)言需要針對(duì)不同的用戶(hù)群體以及不同的使用習(xí)慣,使用該群體所熟知的文字、圖形、版式、配色以及設(shè)計(jì)風(fēng)格等,讓用戶(hù)覺(jué)得這個(gè)產(chǎn)品能解決自己的問(wèn)題,不會(huì)有認(rèn)知上的困難。
從大了講,例如微信的標(biāo)準(zhǔn)模式符合大多數(shù)常規(guī)用戶(hù)的操作,但又另外設(shè)計(jì)了一套關(guān)懷模式,將文字、按鈕變的更大,色彩變的更強(qiáng),這就是為老年人的視覺(jué)障礙而準(zhǔn)備的一套解決方案。還可以開(kāi)啟聽(tīng)文字消息,在會(huì)話框中只要點(diǎn)擊一下文字消息,系統(tǒng)就可以直接閱讀,將信息的傳達(dá)從視覺(jué)轉(zhuǎn)移至聽(tīng)覺(jué),更大程度的解決了視覺(jué)障礙問(wèn)題。其實(shí),不管是微信的標(biāo)準(zhǔn)模式、關(guān)懷模式,還是其他的鄉(xiāng)村模式、青少年模式、大學(xué)生模式等,都是為了迎合不同的用戶(hù)群體。
將范圍縮小至產(chǎn)品的某個(gè)功能,如高德地圖視覺(jué)障礙模式(色盲/色弱用戶(hù)的專(zhuān)屬配色)、首頁(yè)設(shè)置(搜索框位置的調(diào)整)等也是為了滿足不同用戶(hù)群體或同一用戶(hù)群體的不同使用習(xí)慣而設(shè)計(jì)。
將現(xiàn)實(shí)世界中的物體映射至產(chǎn)品設(shè)計(jì)中,能讓用戶(hù)通過(guò)對(duì)現(xiàn)實(shí)環(huán)境的認(rèn)知感受到產(chǎn)品的真實(shí)易懂,很大程度上降低了學(xué)習(xí)成本,幫助用戶(hù)更快的理解并輕松掌握其使用方式。模擬現(xiàn)實(shí)世界的物體并不僅僅局限其外形,對(duì)于其動(dòng)態(tài)效果、聲音以及其他屬性特征等都可以加以融合,打造更真實(shí)的用戶(hù)體驗(yàn)。
iOS系統(tǒng)早期的桌面圖標(biāo)就是如此,即便后來(lái)逐漸過(guò)渡到扁平化,但很多地方依然保留了擬物化的設(shè)計(jì),如同步變化的動(dòng)態(tài)時(shí)鐘表盤(pán)、接近于物品外觀的相機(jī)、計(jì)算器圖標(biāo)等。網(wǎng)易云音樂(lè)播放頁(yè)面中,復(fù)古的黑膠唱片,不僅模仿了早期的留聲機(jī),還融入的懷舊情感,與其他同類(lèi)產(chǎn)品的差異性也即刻凸顯。
產(chǎn)品不僅可以使用人們對(duì)真實(shí)物體的視覺(jué)感知,還可以利用文化觀念進(jìn)行隱喻。
例如,紅色意味著危險(xiǎn)、禁止,綠色則代表安全、通過(guò),而產(chǎn)品中的審核結(jié)果就可以用顏色醒目的圖標(biāo)強(qiáng)化提示,紅色表示審核未通過(guò)、綠色表示審核通過(guò)。另外在現(xiàn)實(shí)生活中,“+、-”符號(hào)代表增加和減少,對(duì)于互聯(lián)網(wǎng)產(chǎn)品,同樣可以使用“+、-”來(lái)表示內(nèi)容的增加與減少,常見(jiàn)的有購(gòu)買(mǎi)商品數(shù)量調(diào)整、自定義內(nèi)容布局等。
“用戶(hù)通常會(huì)錯(cuò)誤地選擇了系統(tǒng)的某個(gè)功能,并且需要一個(gè)明確標(biāo)記的「緊急出口」來(lái)離開(kāi)不想要的狀態(tài),而不必進(jìn)行擴(kuò)展對(duì)話。支持撤消和重做”--尼爾森。
用戶(hù)需要擁有控制系統(tǒng)和來(lái)去自由的權(quán)利,且產(chǎn)品要在用戶(hù)可能犯錯(cuò)誤之前及時(shí)警示并給予正確的引導(dǎo),但總有些特殊場(chǎng)景,用戶(hù)發(fā)生主觀上的失誤不可避免,為了不讓用戶(hù)進(jìn)入到錯(cuò)誤的場(chǎng)景,這時(shí)系統(tǒng)應(yīng)該提供一個(gè)“緊急出口”,便于用戶(hù)撤銷(xiāo)和重做。
在使用產(chǎn)品的過(guò)程中,系統(tǒng)檢測(cè)到用戶(hù)有可能出現(xiàn)操作失誤的情況,應(yīng)給予明確的提示和指引,關(guān)閉/返回就是最為常見(jiàn)的“緊急出口”,即便大部分用戶(hù)知道向右側(cè)滑返回,但“緊急出口”依然要明確顯示。
另外,在刪除某些信息時(shí),系統(tǒng)給予的確認(rèn)彈窗也是為了減少用戶(hù)操作失誤,以免造成不必要的損失。
用戶(hù)的失誤行為已不可避免的發(fā)生,應(yīng)當(dāng)提供撤銷(xiāo)、取消或重做等相關(guān)功能。
在社交類(lèi)應(yīng)用中,短時(shí)間內(nèi)發(fā)出的消息可撤回重新編輯,便是給了用戶(hù)可以反悔的權(quán)利,辦公類(lèi)產(chǎn)品中的回收站亦是如此。
“不應(yīng)該讓用戶(hù)懷疑不同的話語(yǔ)、場(chǎng)景或行為是否在表達(dá)同樣的一件事情。系統(tǒng)設(shè)計(jì)需遵循平臺(tái)慣例,保持一致性”--尼爾森。
對(duì)用戶(hù)來(lái)說(shuō),同一產(chǎn)品需要統(tǒng)一的設(shè)計(jì)規(guī)范,其視覺(jué)樣式、交互形式都應(yīng)該遵循基本的用戶(hù)習(xí)慣,保持功能、操作的一致性為確保用戶(hù)對(duì)界面的學(xué)習(xí)使用至關(guān)重要。
設(shè)計(jì)規(guī)范就是為保持產(chǎn)品內(nèi)部的一致性而生,不管是色彩間距、還是組件模塊,保持一致性不僅能讓用戶(hù)感覺(jué)使用的是同一個(gè)產(chǎn)品,還有助于品牌傳播,給用戶(hù)留下一定的印象。
對(duì)于業(yè)務(wù)非常復(fù)雜的大型產(chǎn)品,雖然各元素組件樣式繁多,但會(huì)從視覺(jué)風(fēng)格和交互形式上來(lái)確保產(chǎn)品的一致性,這都可以減少用戶(hù)的思考負(fù)擔(dān)和學(xué)習(xí)成本。
雖然很多產(chǎn)品都在呼吁創(chuàng)新、去同質(zhì)化,但差異化較大的設(shè)計(jì)雖然達(dá)到了去同質(zhì)化的目的,卻給用戶(hù)增加了更多的學(xué)習(xí)及思考成本。這里意思請(qǐng)大家不要誤解,并不是說(shuō)不去創(chuàng)新,而是除非你的產(chǎn)品有足夠的影響力,對(duì)于較大的變動(dòng),企業(yè)能承擔(dān)起試錯(cuò)成本、以及增加了額外學(xué)習(xí)成本可能造成的用戶(hù)流失,否則只能進(jìn)行一些小的改動(dòng),循序漸進(jìn)的跟隨主流。
對(duì)于同類(lèi)型的產(chǎn)品,我們依然需要參考競(jìng)品的一些設(shè)計(jì)形式,如下圖是音樂(lè)APP的播放頁(yè)面,其主要功能的優(yōu)先級(jí)排列、頁(yè)面布局基本相同,即便是創(chuàng)新也是從設(shè)計(jì)風(fēng)格、氛圍以及微動(dòng)效等方面做出差異化。
先舉個(gè)例子,之前有不少產(chǎn)品引用費(fèi)茨定律“任意一點(diǎn)移動(dòng)到目標(biāo)中位置距離越短,所花費(fèi)的時(shí)間就越少”這一原則,于是將左上角的返回按鈕搬到了左下角(側(cè)滑返回操作沒(méi)有影響),沒(méi)錯(cuò),對(duì)于現(xiàn)在的大屏手機(jī)來(lái)說(shuō),返回效率確實(shí)提升了,但卻違背了用戶(hù)的使用習(xí)慣,增加了誤操作的可能性。
返回按鈕放置左上角,與絕大多數(shù)產(chǎn)品保持一致的使用習(xí)慣,這意味著用戶(hù)只需付出更少的學(xué)習(xí)成本甚至無(wú)需學(xué)習(xí)即可快速上手。
“系統(tǒng)要么消除容易出錯(cuò)的情況,要么檢查它們,并在用戶(hù)采取行動(dòng)之前向用戶(hù)提供確認(rèn)選項(xiàng)”--尼爾森。
用戶(hù)的很多操作都是比較隨意、無(wú)意識(shí)性的,也因此造成了一些不可挽回的錯(cuò)誤。系統(tǒng)應(yīng)該在用戶(hù)出錯(cuò)之前采取一定的措施,這并沒(méi)有多么復(fù)雜,或許只是一個(gè)走心的設(shè)計(jì),如使用引導(dǎo)用戶(hù)、溫馨提示、有效控制等方式以減少錯(cuò)誤的發(fā)生。
主動(dòng)引導(dǎo)的目的就是為了給用戶(hù)提供明確的路徑,減少錯(cuò)誤操作。很多APP首次下載或更新迭代之后就會(huì)提供新手引導(dǎo),還有表單的占位符提供的格式規(guī)范、內(nèi)容描述也是如此。
在用戶(hù)操作時(shí),系統(tǒng)對(duì)用戶(hù)錄入的已有信息進(jìn)行預(yù)判并提供相匹配的內(nèi)容讓用戶(hù)選擇,也是一種常用的防錯(cuò)方式。如搜索聯(lián)想詞、商品錯(cuò)誤文字自動(dòng)修正等。
對(duì)于一些較為敏感、可能存在危險(xiǎn)或不可逆轉(zhuǎn)的操作時(shí),系統(tǒng)需要提供二次確認(rèn)引起用戶(hù)注意,以起到警示作用。例如注銷(xiāo)賬號(hào)、刪除某些內(nèi)容或中途退出流程,都會(huì)有彈窗提醒用戶(hù),避免誤操作帶來(lái)不必要的損失。
從表面來(lái)看,限制用戶(hù)似乎并不友好,但為了避免用戶(hù)錯(cuò)誤理解,利用明確的限制阻止用戶(hù)犯錯(cuò)也是一個(gè)不錯(cuò)的選擇。例如無(wú)效內(nèi)容置灰、未達(dá)到操作條件的限制,都能很好的防止用戶(hù)無(wú)效操作。
筆者曾使用過(guò)一個(gè)產(chǎn)品,在選擇出生年齡時(shí),往前的年份能滑到清朝時(shí)期(一百多歲玩不動(dòng)智能手機(jī)了),往后面能滑到今年之后的幾十年(我還沒(méi)出生呢),這并不是在質(zhì)疑設(shè)計(jì)的合理性,而是無(wú)效或過(guò)于冷門(mén)的選項(xiàng)越多,用戶(hù)可能會(huì)有選擇性困難「綜合癥」、也可能會(huì)提高隨意性以及選擇錯(cuò)誤的幾率,這對(duì)后期用戶(hù)數(shù)據(jù)分析的精準(zhǔn)度有很大影響。
適當(dāng)?shù)南拗撇僮鞣秶?,?duì)產(chǎn)品來(lái)說(shuō)也是一個(gè)很好的防錯(cuò)策略。例如:美團(tuán)定酒店的日歷限制在半年以?xún)?nèi)、在手機(jī)號(hào)碼表項(xiàng)中限制輸入11位數(shù)字等,都可以降低用戶(hù)出錯(cuò)的概率。
對(duì)于隨意性較強(qiáng)的用戶(hù),通常都是「做多錯(cuò)多」,所以在部分場(chǎng)景下,如果對(duì)用戶(hù)的操作需求明確可控,可根據(jù)實(shí)際場(chǎng)景提供符合目標(biāo)的默認(rèn)值,以減少用戶(hù)操作成本。
添加銀行卡時(shí),輸入卡號(hào)后會(huì)自動(dòng)匹配對(duì)應(yīng)的銀行、購(gòu)物下單時(shí)系統(tǒng)也會(huì)自動(dòng)選擇一個(gè)默認(rèn)收貨地址,這些默認(rèn)值的存在都或多或少的減少了用戶(hù)操作步驟,即便不是用戶(hù)所需,也不會(huì)造成什么負(fù)擔(dān),這本該就是用戶(hù)完成任務(wù)的必要流程。
在數(shù)字信息輸入場(chǎng)景中,可以利用一些特定格式,不僅能減少出錯(cuò),還能有效避免將錯(cuò)誤信息帶入下一步流程。
例如,輸入手機(jī)號(hào)、銀行卡號(hào)、身份證號(hào)等,可以將幾個(gè)數(shù)字分為一組,以此類(lèi)推,這樣更有利于用戶(hù)自查。
“通過(guò)使用對(duì)象、動(dòng)作和選項(xiàng)的可視化表達(dá),最大限度地減輕用戶(hù)的記憶負(fù)擔(dān)”--尼爾森。
在產(chǎn)品設(shè)計(jì)的時(shí)候,需保證組件、按鈕以及選項(xiàng)的可見(jiàn)性,用戶(hù)不需要去動(dòng)腦筋,產(chǎn)品應(yīng)該把用戶(hù)當(dāng)傻瓜對(duì)待,盡可協(xié)助其記憶。在特殊情況下,用戶(hù)離開(kāi)當(dāng)前頁(yè)面,產(chǎn)品可提供關(guān)鍵信息讓其確認(rèn),而不是讓用戶(hù)去回憶,徒增記憶負(fù)荷。
產(chǎn)品能做決定的就不要讓用戶(hù)去選擇、能讓用戶(hù)選擇的就不要讓他們自己輸入。其實(shí)選擇和輸入的操作成本相差巨大,很多用戶(hù)都不愿意在輸入上面花費(fèi)過(guò)多時(shí)間。
問(wèn)個(gè)比較現(xiàn)實(shí)的問(wèn)題,如果你申請(qǐng)信用卡的意愿不是很明確、在辦與不辦之間猶豫徘徊時(shí),有多少人是被幾頁(yè)超長(zhǎng)表單勸退的?需要用戶(hù)提供的信息我們無(wú)權(quán)刪減,但可以利用設(shè)計(jì)手段降低操作成本,如果將部分輸入框變成選擇框,讓任務(wù)變的更容易完成,用戶(hù)的抵觸心理自然也會(huì)降低。例如:微信添加銀行卡時(shí),手機(jī)號(hào)、銀行卡號(hào)都能從相應(yīng)的接口獲取,減少了很多操作。
與其讓用戶(hù)逐步完成任務(wù),不如讓用戶(hù)只進(jìn)行一步簡(jiǎn)單操作,產(chǎn)品就智能化的將信息提取出來(lái)、自動(dòng)拆分并送到用戶(hù)手中,不僅節(jié)省了大量的交互步驟和瀏覽時(shí)間,也降低了用戶(hù)因自行輸入信息可能出錯(cuò)而帶來(lái)的不可控感,大大提高了產(chǎn)品的易用性。
新建收貨地址時(shí),將地址信息粘貼至輸入框,產(chǎn)品即可自動(dòng)拆分省/市/區(qū)、詳細(xì)地址及個(gè)人信息;綁定信用卡時(shí),只需掃描卡片就能自動(dòng)提取卡號(hào)、開(kāi)戶(hù)行、有效期等信息。
特別是一些隱藏的交互操作,一定要使用用戶(hù)最熟悉的方式,避免浪費(fèi)時(shí)間去回憶或手動(dòng)試錯(cuò),要保證用戶(hù)在最短的時(shí)間內(nèi)有效識(shí)別、理解。
例如,左滑列表中的某個(gè)內(nèi)容可進(jìn)行刪除操作、屏幕邊緣右滑返回上一頁(yè)、雙擊短視頻點(diǎn)贊等。
眾所周知,文字表意明確,也是最能讓用戶(hù)理解的方式,不過(guò)它的信息傳達(dá)效率遠(yuǎn)遠(yuǎn)不如圖形,所以在眾多UI設(shè)計(jì)中,有圖標(biāo)的出現(xiàn),就會(huì)搶占信息組中的主視覺(jué),但這并不代表可以完全替代文字,很多時(shí)候,我們應(yīng)該讓文字成為輔助的存在,以加深用戶(hù)的理解。圖標(biāo)+文字組合表意更加明確,能迎合更廣泛的用戶(hù)群體,避免少數(shù)用戶(hù)產(chǎn)生疑惑。
這里要說(shuō)明一點(diǎn),圖標(biāo)并非不能單獨(dú)出現(xiàn),而是要慎用。就如搜索圖標(biāo),全球99%都在用這個(gè)放大鏡造型,無(wú)可厚非。花瓣APP底部標(biāo)簽欄也使用了純圖標(biāo)形式,因?yàn)樗鎸?duì)的用戶(hù)絕大多數(shù)都是設(shè)計(jì)師,而設(shè)計(jì)師對(duì)圖標(biāo)的識(shí)別和理解自然沒(méi)什么難度。
針對(duì)一些需要用戶(hù)記住或?qū)τ脩?hù)來(lái)說(shuō)較為重要的信息,即便已進(jìn)入下一步流程,產(chǎn)品有必要二次呈現(xiàn)用給用戶(hù)確認(rèn),避免用戶(hù)回憶(想不起來(lái)就會(huì)離開(kāi))。
在購(gòu)物下單頁(yè)面,會(huì)提供商品的關(guān)鍵信息給用戶(hù)確認(rèn);部分產(chǎn)品的表單任務(wù)完成后,點(diǎn)擊提交,也會(huì)彈出之前輸入的內(nèi)容給用戶(hù)自查。
系統(tǒng)應(yīng)該提供用戶(hù)最近的訪問(wèn)項(xiàng),幫助他們提供未完成或想要重復(fù)完成的任務(wù),即便是跨系統(tǒng)、設(shè)備,再次使用也不用來(lái)回調(diào)整,歷史記錄功能便是這個(gè)需求的最佳體現(xiàn)。
例如騰訊視頻的觀看歷史模塊,按照時(shí)間排序,提供了看過(guò)的內(nèi)容以及進(jìn)度,點(diǎn)進(jìn)去之后會(huì)從上次退出時(shí)的位置節(jié)點(diǎn)接著播放,視頻、音樂(lè)、閱讀類(lèi)應(yīng)用都是如此。
“好的產(chǎn)品需要同時(shí)兼顧新用戶(hù)和資深用戶(hù)的需求,對(duì)新用戶(hù)來(lái)說(shuō),需要功能明確、清晰,對(duì)于老用戶(hù)需要快捷高效使用高頻功能。不可迎合某一種用戶(hù),把不必要的信息占據(jù)重要部分”--尼爾森。
靈活高效原則旨在滿足多樣化的使用群體,通過(guò)對(duì)他們的使用場(chǎng)景、任務(wù)流程進(jìn)行深挖,讓其在最短的路徑以最快的速度完成目標(biāo)需求。
系統(tǒng)要同時(shí)照顧新老用戶(hù)的使用體驗(yàn),對(duì)于新手用戶(hù),要盡量降低學(xué)習(xí)成本,能讓其快速上手是留住他們的必要手段。而對(duì)老用戶(hù)來(lái)說(shuō),對(duì)產(chǎn)品的信任度有一定的基礎(chǔ),能快捷高效、心情愉悅的使用至關(guān)重要。
沒(méi)有什么能比提供快捷操作更能節(jié)省時(shí)間成本了,但凡使用過(guò)手機(jī)、電腦辦公的用戶(hù)都用該知道Ctrl+C、Ctrl+V、Ctrl+S這三組合的神奇之處,提升的效率真的不是一星半點(diǎn)兒。
在UI設(shè)計(jì)中,很多快捷的入口、操作方式都相對(duì)降低了用戶(hù)使用門(mén)檻,例如快捷登錄(QQ、微信、手機(jī)號(hào)一鍵登錄)減少操作步驟,節(jié)省用戶(hù)很多時(shí)間;另外,在一些產(chǎn)品截圖后就會(huì)彈出分享、反饋入口,這也是通過(guò)行為預(yù)判為用戶(hù)提供便捷操作的體現(xiàn)。
一些頻繁使用的功能,可在不同的頁(yè)面重復(fù)顯示,當(dāng)用戶(hù)有使用需求時(shí),能隨時(shí)通過(guò)就近的操作入口進(jìn)入。微信的掃一掃在會(huì)話列表、通訊錄、個(gè)人信息等頁(yè)面都有操作入口,非常方便;支付寶首頁(yè)的花唄、借唄、芝麻信用等功能在我的頁(yè)面幾乎都重復(fù)了一遍,觸手可及,對(duì)產(chǎn)品轉(zhuǎn)化也有很大的幫助。
「功能自定義」意味著用戶(hù)可以對(duì)自己常用或喜歡的功能進(jìn)行隨意排列、增減,兼顧了不同用戶(hù)對(duì)不同功能的使用需求,提高產(chǎn)品的靈活性。
支付寶讓用戶(hù)根據(jù)自己的喜好選擇13個(gè)常用功能放在首頁(yè),操作起來(lái)更加方便,滿足了用戶(hù)的自定義需求。網(wǎng)易云音樂(lè)則更個(gè)性化,不僅能對(duì)功能模塊、底部導(dǎo)航自定義,系統(tǒng)還提供了3種不同的版式風(fēng)格,對(duì)于這種靈活的調(diào)整,不管是“蘿卜”還是“青菜”,總有一款是你的最?lèi)?ài)。
提供默認(rèn)選項(xiàng)上述有提到過(guò),通過(guò)減少多余操作,不僅對(duì)防止用戶(hù)出錯(cuò)有極大的幫助,對(duì)于提升任務(wù)完成效率也尤為明顯。
不同的用戶(hù)就有不同的需求、不同的喜好、不同的使用習(xí)慣,產(chǎn)品需要做到千人千面,以最大化的程度滿足多種用戶(hù)群體。
這種類(lèi)似的案例非常之多,且不說(shuō)各大電商通過(guò)背后隱藏的算法為各種用戶(hù)匹配不同的內(nèi)容,就說(shuō)明面上能看到的如關(guān)愛(ài)模式、鄉(xiāng)村模式、青少年模式等,還有高德地圖搜索框上/下位置調(diào)整、京東商品頁(yè)的宮格樣式/列表樣式等,都在為滿足絕大多數(shù)的用戶(hù)的使用需求而付出了最大努力。
“不要包含不相關(guān)或低頻次的信息/操作。頁(yè)面中的每個(gè)額外信息都會(huì)降低主要內(nèi)容的相對(duì)可見(jiàn)性”--尼爾森。
在設(shè)計(jì)頁(yè)面時(shí),需要注意信噪比(有效信息與無(wú)效信息的比例),處理好信息層級(jí),方便用戶(hù)能快速捕捉到自己想要知道、或產(chǎn)品想讓用戶(hù)知道的信息。因?yàn)橛脩?hù)的注意力有限,任何低頻次或不相關(guān)的信息都將成為視覺(jué)“噪音”,導(dǎo)致原本重要的信息被用戶(hù)忽略。
不管是模塊與模塊之間、還是單個(gè)模塊內(nèi)的各個(gè)類(lèi)容,都有其一定的等級(jí)權(quán)重,劃分好信息層級(jí)能集中用戶(hù)注意力,更好的引導(dǎo)用戶(hù)操作,避免用戶(hù)分不清重點(diǎn)而徒增使用成本。需知什么內(nèi)容都想突出,其結(jié)果必定是什么也突出不了。
產(chǎn)品的視覺(jué)效果需要和諧統(tǒng)一,富有設(shè)計(jì)感、獨(dú)具一格的效果能給人眼前一亮個(gè)感覺(jué)。這就是為什么很多小而美產(chǎn)品能頻頻登上App Store的榜單的原因。例如,躺平(已下線)、即刻、小宇宙等應(yīng)用獲得了用戶(hù)的一致好評(píng)。
不管一個(gè)頁(yè)面中信息量的多少,但是一定要有“主角”,很多時(shí)候,我們會(huì)通過(guò)添加次要信息或背景裝飾來(lái)襯托這個(gè)“主角”的存在。設(shè)計(jì)之前一定要權(quán)衡視覺(jué)重點(diǎn),應(yīng)弱化或去除頁(yè)面中的無(wú)關(guān)信息,減少信息“噪音”的干擾,使用體驗(yàn)?zāi)艿玫搅己玫奶嵘?
所有的設(shè)計(jì)都應(yīng)該遵循產(chǎn)品設(shè)計(jì)四大原則,即親密、對(duì)齊、重復(fù)、對(duì)比。很多時(shí)候,頁(yè)面設(shè)計(jì)不夠精致,總感覺(jué)差點(diǎn)意思,但又找不出真正的原因,就是基礎(chǔ)原則沒(méi)有掌握好,或許只是間距、字號(hào)、大小的一個(gè)微調(diào),即可達(dá)到意想不到的視覺(jué)效果。關(guān)于設(shè)計(jì)四原則,暫不多做贅述,后續(xù)會(huì)單獨(dú)出具詳細(xì)的文章。
“錯(cuò)誤的信息應(yīng)該用通俗易懂的語(yǔ)言表達(dá),較準(zhǔn)確的指出問(wèn)題,并且提出解決方案。避免通過(guò)代碼等用戶(hù)難以理解的形式”--尼爾森。
筆者相信有很多人見(jiàn)過(guò)這樣的問(wèn)題,在遇到網(wǎng)絡(luò)問(wèn)題時(shí)過(guò)了幾分鐘后的頁(yè)面還是一片白板、很多錯(cuò)誤反饋就顯示什么錯(cuò)誤404/505/321之類(lèi)的代碼,真心搞不懂,很讓人抓狂。
用戶(hù)在使用過(guò)程中,有時(shí)候出錯(cuò)不可避免,系統(tǒng)應(yīng)該通過(guò)明確的提示性文字或插圖來(lái)提醒用戶(hù),并附上解決方案,而不是給一堆看不懂的代碼草草了事,需要幫助用戶(hù)從識(shí)別、診斷、并從錯(cuò)誤中恢復(fù)過(guò)來(lái)。
用戶(hù)在操作前(預(yù)判)、操作中、操作后都可能出錯(cuò),系統(tǒng)可通過(guò)前端驗(yàn)證(優(yōu)先使用)和后端驗(yàn)證明確告知出錯(cuò)的原因以及解決方法。
例如手機(jī)號(hào)碼表單項(xiàng)都是限制在11位數(shù),如果用戶(hù)手滑少輸了一位數(shù)字,在離開(kāi)輸入框時(shí),系統(tǒng)應(yīng)及時(shí)通過(guò)前端驗(yàn)證告知用戶(hù)。這里要吐槽一點(diǎn),一些產(chǎn)品是等用戶(hù)完成所有表單內(nèi)容并提交后才統(tǒng)一反饋,這并不太友好。還有產(chǎn)品在用戶(hù)未達(dá)到表單要求的情況下,始終將下一步按鈕處于置灰狀態(tài),期間并沒(méi)有任何提示,這就需要用戶(hù)反復(fù)查看每個(gè)表單項(xiàng)的內(nèi)容是否達(dá)標(biāo),無(wú)故浪費(fèi)大量的時(shí)間成本,實(shí)則不可取。
當(dāng)網(wǎng)絡(luò)出現(xiàn)問(wèn)題或長(zhǎng)時(shí)間無(wú)響應(yīng),系統(tǒng)會(huì)給出明確的提示,并提供重新加載、刷新、設(shè)置網(wǎng)絡(luò)等操作入口,讓用戶(hù)知道問(wèn)題出現(xiàn)的原因以及如何解決。
當(dāng)錯(cuò)誤已經(jīng)發(fā)生,系統(tǒng)應(yīng)盡可能的幫助用戶(hù)從錯(cuò)誤中恢復(fù),將損失降到最低。
發(fā)布微信朋友圈,如果內(nèi)容有問(wèn)題刪除后,系統(tǒng)會(huì)提供“重新編輯”入口,并保留了原先所有內(nèi)容,能很輕松的、以最小的操作成本就完成了二次編輯。iPhone相冊(cè)中的回收站會(huì)保留30天內(nèi)所刪除的內(nèi)容,方便隨時(shí)恢復(fù),這都用戶(hù)犯錯(cuò)后能及時(shí)止損的最佳體現(xiàn)。
“如果系統(tǒng)能讓用戶(hù)不需要閱讀文檔就會(huì)使用那是最好的,但通常情況下還是需要幫助文檔的。任何信息應(yīng)該容易被搜索,且專(zhuān)注于用戶(hù)的目標(biāo)任務(wù),并列出具體的步驟來(lái)告知用戶(hù)”--尼爾森。
雖然很多時(shí)候,用戶(hù)并不需要幫助或稍加摸索便能上手,但要考慮到意外情況的發(fā)生,系統(tǒng)有必要提供一份幫助文檔,方便用戶(hù)有需要時(shí)能隨時(shí)了解,以便接下來(lái)專(zhuān)注于完成任務(wù)。
能進(jìn)行清晰直觀、符合用戶(hù)習(xí)慣的設(shè)計(jì)再好不過(guò)了,無(wú)需任何幫助,用戶(hù)也能順暢的完成任務(wù)。如組件庫(kù)的打造,就是為了讓設(shè)計(jì)更簡(jiǎn)單、用戶(hù)更容易理解與使用。
對(duì)于那些用戶(hù)只需花費(fèi)少量的時(shí)間就能熟練使用的功能,產(chǎn)品為了實(shí)現(xiàn)快速轉(zhuǎn)化或給少數(shù)的特定人群提供幫助,會(huì)提供一次性幫助。如首次進(jìn)入App的新手引導(dǎo)、迭代后的部分新功能指引等。
對(duì)于較為復(fù)雜的操作流程或存在必須要用戶(hù)注意的問(wèn)題,產(chǎn)品會(huì)在必要的位置提供說(shuō)明,方便用戶(hù)在需要時(shí)能及時(shí)獲得幫助。
例如粵通卡ETC激活流程,對(duì)于這種冷門(mén)卻又必須要用的功能,即便使用過(guò)的老用戶(hù)也未必能記住所有步驟,所以每次進(jìn)入激活功能,首先看到的便是操作指引。其他如綁定信用卡時(shí),輸入簽約手機(jī)號(hào)、安全碼,對(duì)應(yīng)位置都有固定的幫助入口。
對(duì)于一些常見(jiàn)的使用問(wèn)題,系統(tǒng)會(huì)提供一個(gè)「幫助中心」功能入口,將所有問(wèn)題集合在一起,方便用戶(hù)隨時(shí)查看。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
在市面上有各種各樣的方法論,但我們重中會(huì)發(fā)現(xiàn)答案是如此的相像。
【 發(fā)現(xiàn)問(wèn)題 —— 定義問(wèn)題 —— 解決方案 ——上線 —— 復(fù)盤(pán) 】
以下是我總結(jié)的思維模型;
設(shè)計(jì)模型分為五個(gè)階段,分別是:
1、定義問(wèn)題:確定需要解決的問(wèn)題,如果發(fā)現(xiàn)問(wèn)題不需要解決,需要重新尋找問(wèn)題。
2、正確的做事:在確定問(wèn)題后,需要展開(kāi)多維度挖掘,并確立核心目標(biāo)。
3、用正確的方法做:圍繞核心目標(biāo),通過(guò)UE交互、UI設(shè)計(jì)等方法解決問(wèn)題,進(jìn)行可行性預(yù)測(cè)并提前進(jìn)行數(shù)據(jù)埋點(diǎn)。
4、真的做對(duì)了嗎:上線后進(jìn)行設(shè)計(jì)驗(yàn)證,進(jìn)行數(shù)據(jù)分析和反饋,了解用戶(hù)需求,度量產(chǎn)品是否符合預(yù)期。
5、規(guī)劃:根據(jù)驗(yàn)證結(jié)果開(kāi)展新的設(shè)計(jì)指標(biāo)調(diào)整和后續(xù)迭代。
這些階段的設(shè)計(jì)模型可幫助您更好的解決問(wèn)題。
在職場(chǎng)上,很多情況下接到需求同時(shí)已經(jīng)把方案確認(rèn)來(lái)。所以我們前置問(wèn)題。以下兩個(gè)理論很好的詮釋為什么要整明白事情后做事。【黃金圈法則】【第一性原理】我們應(yīng)該多問(wèn)為什么直擊問(wèn)題本質(zhì)。
5Why分析法
5Why分析法是一種用于解決問(wèn)題的方法,通過(guò)不斷問(wèn)“為什么”來(lái)找到問(wèn)題的根本原因,從而采取相應(yīng)的解決措施。該方法主要包含以下步驟:
1、確定問(wèn)題:明確問(wèn)題的具體表現(xiàn)和影響,將問(wèn)題定義清晰。
2、提出第一個(gè)為什么:從問(wèn)題的表面原因開(kāi)始,問(wèn)“為什么”出現(xiàn)這個(gè)問(wèn)題。
3、進(jìn)一步提出為什么:根據(jù)第一個(gè)為什么的回答,追問(wèn)“為什么”這個(gè)回答是如此,找到更深層次的原因。
4、重復(fù)以上步驟:根據(jù)第二個(gè)為什么的回答,再次追問(wèn)“為什么”,直到找到問(wèn)題的根本原因。
5、制定解決方案:針對(duì)問(wèn)題的根本原因,提出相應(yīng)的解決措施。
通過(guò)追問(wèn)層層遞進(jìn),直至得到問(wèn)題本質(zhì)。抓住關(guān)鍵點(diǎn),排除信息干擾。MECE法則,相互獨(dú)立、完全窮盡通過(guò)不斷追問(wèn)“為什么”,可以找到問(wèn)題的真正原因,避免只解決表面問(wèn)題而忽略了更深層次的問(wèn)題。
我們可以通過(guò)體驗(yàn)走查、競(jìng)品分析、數(shù)據(jù)分析、用戶(hù)分析、專(zhuān)家訪談、圓桌會(huì)議、用戶(hù)體驗(yàn)地圖、產(chǎn)品體驗(yàn)報(bào)告。可以根據(jù)項(xiàng)目需求的不同篩選出更適公司的策略,從而更好的解決問(wèn)題。
體驗(yàn)走查:通常情況下由體驗(yàn)設(shè)計(jì)進(jìn)行專(zhuān)業(yè)性的走查發(fā)現(xiàn)體驗(yàn)問(wèn)題
競(jìng)品分析:防止閉門(mén)造車(chē),發(fā)現(xiàn)競(jìng)品亮點(diǎn)。統(tǒng)一固有的交互方式增強(qiáng)易用性。
用戶(hù)分析:用戶(hù)類(lèi)型分析,對(duì)人群劃分。
專(zhuān)家訪談:專(zhuān)家訪談也叫用戶(hù)方案,主要針對(duì)反饋問(wèn)題進(jìn)行進(jìn)一步的了解。
圓桌會(huì)議:通過(guò)調(diào)研報(bào)告二手資料審視產(chǎn)品問(wèn)題。
用戶(hù)體驗(yàn)地圖:用戶(hù)體驗(yàn)地圖又稱(chēng)體驗(yàn)地圖、旅程圖主要是圍繞用戶(hù)主流程洞察用戶(hù)痛點(diǎn),從痛點(diǎn)形成設(shè)計(jì)目標(biāo)。
產(chǎn)品體驗(yàn)報(bào)告:公司內(nèi)部對(duì)產(chǎn)品調(diào)研反饋的報(bào)告文件,可以是第三方可以是不同崗位的調(diào)研報(bào)告。
聚焦,顧名思義根據(jù)上一步我們挖掘出來(lái)的「問(wèn)題」、「機(jī)會(huì)點(diǎn)」進(jìn)行聚集。實(shí)際上我們很容易的先入為主從用戶(hù)體驗(yàn)上推論出可行性設(shè)計(jì)解決方案,而忽略了業(yè)務(wù)目標(biāo)形成有效的商業(yè)價(jià)值。所以我們應(yīng)該從業(yè)務(wù)目標(biāo)為前提解決用戶(hù)訴求。
設(shè)計(jì)日標(biāo) = 用【某設(shè)計(jì)策略】給目標(biāo)用戶(hù)帶來(lái)【某價(jià)值】,以助力【某變現(xiàn)方式】
在設(shè)計(jì)思路的探索階段,我們需要采用發(fā)散思維的方式,嘗試不同的方案,以激發(fā)更多的可能性。通過(guò)設(shè)計(jì)工作坊、競(jìng)品分析、頭腦風(fēng)暴等形式,圍繞著設(shè)計(jì)目標(biāo),我們使用不同的設(shè)計(jì)策略對(duì)產(chǎn)品進(jìn)行改進(jìn)和優(yōu)化。在主要負(fù)責(zé)產(chǎn)品迭代優(yōu)化并滿足業(yè)務(wù)需求的過(guò)程中,我們需要不斷地探索和嘗試,以達(dá)到更好的效果。
設(shè)計(jì)策略是解決設(shè)計(jì)問(wèn)題的核心方法,它幫助設(shè)計(jì)師建立正確的思維框架,從合適的維度去思考和檢驗(yàn)設(shè)計(jì)方案。它是基于設(shè)計(jì)目標(biāo)、用戶(hù)需求、市場(chǎng)分析等因素而制定的指導(dǎo)性原則,指導(dǎo)我們選擇合適的設(shè)計(jì)方法、工具和技術(shù),以達(dá)成最佳設(shè)計(jì)效果。設(shè)計(jì)師在于是否熟練掌握了相關(guān)的設(shè)計(jì)策略并正確地實(shí)施。因此,我們不能生搬硬套固定的設(shè)計(jì)方案,而要根據(jù)不同的情境和問(wèn)題,靈活運(yùn)用設(shè)計(jì)策略。
我們可以通過(guò)設(shè)計(jì)預(yù)演、可行性測(cè)試、設(shè)計(jì)評(píng)審設(shè)計(jì)流程來(lái)進(jìn)行設(shè)計(jì)最終評(píng)審。
這一階段我們可以從不同角度來(lái)審視自己的設(shè)計(jì)是否可行。甚至可以把一些不確定的設(shè)計(jì)方案進(jìn)行拋磚引玉。最重要的是設(shè)計(jì)闡述,通過(guò)什么設(shè)計(jì)手段來(lái)達(dá)到我們的目標(biāo),來(lái)支撐我們的設(shè)計(jì)方案,需要有空杯的心包容其他人提出的問(wèn)題。最終形成設(shè)計(jì)方案,這個(gè)過(guò)程并不是一次完成,有可能進(jìn)行多輪討論完成。
產(chǎn)品上線后我們需要驗(yàn)證產(chǎn)品的最終是否符合我們?cè)O(shè)計(jì)預(yù)期。首先我們需要根據(jù)設(shè)計(jì)預(yù)期統(tǒng)計(jì)上線后的數(shù)據(jù)表現(xiàn)。
灰度測(cè)試
灰度測(cè)試和A/B測(cè)試都是軟件測(cè)試中的一種測(cè)試方法,但是它們的目的和實(shí)現(xiàn)方式有所不同。灰度測(cè)試是指在軟件發(fā)布之前,先將新功能或者新版本的軟件發(fā)布到一部分用戶(hù)中進(jìn)行測(cè)試,以收集用戶(hù)反饋,然后再逐步擴(kuò)大范圍,直到全面推廣上線。而A/B測(cè)試則是將同一個(gè)功能或者頁(yè)面設(shè)計(jì)出兩個(gè)或多個(gè)版本,然后將不同版本的頁(yè)面隨機(jī)分配給不同的用戶(hù),通過(guò)比較不同版本的用戶(hù)行為數(shù)據(jù)來(lái)確定哪個(gè)版本更優(yōu)秀。
數(shù)據(jù)驗(yàn)證
前期在設(shè)想目標(biāo)轉(zhuǎn)化流程,然后通過(guò)數(shù)據(jù)埋點(diǎn)數(shù)據(jù)采集,來(lái)收集用戶(hù)行為數(shù)據(jù)、應(yīng)用數(shù)據(jù)、網(wǎng)站數(shù)據(jù)等等。構(gòu)建數(shù)據(jù)指標(biāo)體系,進(jìn)行事件分析,查看數(shù)據(jù)是否符合預(yù)期。如:轉(zhuǎn)化率、用戶(hù)停留時(shí)長(zhǎng)、跳出率等等。
除此以外,我們還可以參考行業(yè)其他的度量方式:如(谷歌Heart模型、阿里巴巴五度模型)
用戶(hù)反饋
不同行業(yè)收集渠道都不一樣可以根據(jù)成本、可行性出發(fā)選擇一個(gè)能快速執(zhí)行的方案。
1、內(nèi)部渠道,比如客服咨詢(xún)、反饋投訴,可以直接了解用戶(hù)的問(wèn)題、建議、需求等。
2、比如在線問(wèn)卷、彈窗調(diào)查、用戶(hù)評(píng)論等,可以主動(dòng)邀請(qǐng)用戶(hù)提供反饋。
通過(guò)數(shù)據(jù)埋點(diǎn),構(gòu)建數(shù)據(jù)指標(biāo)體系,進(jìn)行事件分析,查看數(shù)據(jù)是否符合預(yù)期。如轉(zhuǎn)化率、用戶(hù)停留時(shí)長(zhǎng)、跳出率等等如五度模型
復(fù)盤(pán)
復(fù)盤(pán)是一個(gè)對(duì)整個(gè)設(shè)計(jì)過(guò)程進(jìn)行回顧、總結(jié)和反思的過(guò)程,主要目的是為了發(fā)現(xiàn)問(wèn)題、優(yōu)化流程、提升設(shè)計(jì)質(zhì)量和工作效率。它通常包括三個(gè)階段:準(zhǔn)備階段、設(shè)計(jì)復(fù)盤(pán)階段和知識(shí)共享階段。
在準(zhǔn)備階段,需要明確復(fù)盤(pán)的目標(biāo)和范圍,梳理并整理在整個(gè)設(shè)計(jì)過(guò)程中產(chǎn)生的調(diào)研內(nèi)容、分析結(jié)果、設(shè)計(jì)成果物等。這樣有助于在復(fù)盤(pán)階段更加有針對(duì)性地收集和整理相關(guān)信息,以更好地發(fā)現(xiàn)問(wèn)題和優(yōu)化方案。
在設(shè)計(jì)復(fù)盤(pán)階段,可以從自身出發(fā),對(duì)整個(gè)設(shè)計(jì)過(guò)程進(jìn)行回顧、總結(jié)和反思,進(jìn)一步發(fā)現(xiàn)問(wèn)題和提升設(shè)計(jì)質(zhì)量和工作效率。同時(shí),也可以從外部出發(fā),收集項(xiàng)目組成員、真實(shí)用戶(hù)等各方反饋,進(jìn)一步驗(yàn)證設(shè)計(jì)質(zhì)量、工作質(zhì)量等。在復(fù)盤(pán)階段,可以采用面談、問(wèn)卷調(diào)查、數(shù)據(jù)分析等方法,對(duì)設(shè)計(jì)過(guò)程和成果進(jìn)行評(píng)估。
在知識(shí)共享階段,可以分享得出的結(jié)論、總結(jié)和優(yōu)化方案,以便其他人可以從中受益。同時(shí),還可以將得出的結(jié)論、總結(jié)和優(yōu)化方案進(jìn)行知識(shí)沉淀,以便以后的設(shè)計(jì)過(guò)程可以更好地避免犯同樣的錯(cuò)誤。知識(shí)共享和沉淀是復(fù)盤(pán)的重要結(jié)果之一,也是大家共同進(jìn)步的關(guān)鍵。
總之,充足的前期準(zhǔn)備會(huì)讓之后的復(fù)盤(pán)過(guò)程更加順利,復(fù)盤(pán)結(jié)果更加準(zhǔn)確。復(fù)盤(pán)是一個(gè)持續(xù)改進(jìn)的過(guò)程,通過(guò)反復(fù)的復(fù)盤(pán)和優(yōu)化,可以不斷提升設(shè)計(jì)質(zhì)量和工作效率,實(shí)現(xiàn)更好的效果和成果。
5.1 產(chǎn)品規(guī)范
在新版產(chǎn)品發(fā)布后,通過(guò)數(shù)據(jù)驗(yàn)證進(jìn)一步了改版后是否達(dá)到預(yù)期。改版的價(jià)值是否能體現(xiàn)?如果不是我們應(yīng)該如果重新調(diào)整方向。
總之,針對(duì)電商產(chǎn)品新版發(fā)布后的項(xiàng)目規(guī)劃和調(diào)整,需要通過(guò)數(shù)據(jù)分析來(lái)了解用戶(hù)需求和反饋,制定相應(yīng)的項(xiàng)目計(jì)劃和調(diào)整方案,并在實(shí)施過(guò)程中不斷監(jiān)控和評(píng)估,以便及時(shí)進(jìn)行必要的調(diào)整和優(yōu)化。
結(jié)語(yǔ)
優(yōu)秀的體驗(yàn)設(shè)計(jì)師是鳳毛麟角,但每個(gè)人都可以提出一些建議。本文介紹了一些方法,希望能啟發(fā)讀者,成為優(yōu)秀的用戶(hù)體驗(yàn)設(shè)計(jì)師。作為一名用戶(hù)體驗(yàn)設(shè)計(jì)師,需要掌握以下幾個(gè)技巧:
1、溝通技巧:用戶(hù)體驗(yàn)設(shè)計(jì)師需要具備與團(tuán)隊(duì)成員、利益相關(guān)方和用戶(hù)進(jìn)行高效溝通和協(xié)作的技巧。
2、用戶(hù)理解力:深刻理解用戶(hù)需求,準(zhǔn)確把握目標(biāo)受眾,并站在他們的角度思考問(wèn)題,以設(shè)計(jì)出符合用戶(hù)需求的產(chǎn)品和服務(wù)。
3、數(shù)據(jù)分析能力:能夠運(yùn)用數(shù)據(jù)挖掘技術(shù),客觀論證假設(shè),提高決策正確性,以評(píng)估設(shè)計(jì)效果并提出改進(jìn)方案,不斷優(yōu)化產(chǎn)品的用戶(hù)體驗(yàn)。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
為什么要做精細(xì)化設(shè)計(jì)
1)不同圈層用戶(hù)需求不同,如股票小白、一般散戶(hù)、專(zhuān)業(yè)用戶(hù)群體,特點(diǎn)不同,需求也不同,充分對(duì)用戶(hù)進(jìn)行挖掘、細(xì)分才能更好的理解用戶(hù)。
2)在產(chǎn)品同質(zhì)化嚴(yán)重背景下,精細(xì)化設(shè)計(jì)是一條能持續(xù)產(chǎn)生創(chuàng)新收益路徑。
3)互聯(lián)網(wǎng)新流量獲取困難,比起搶占流量,當(dāng)下更重要的,是提升用戶(hù)粘性、更好的服務(wù)用戶(hù)、打造精細(xì)化服務(wù)體系。
精細(xì)化設(shè)計(jì)方法優(yōu)勢(shì)
精細(xì)化設(shè)計(jì)是可以被復(fù)用的標(biāo)準(zhǔn)化流程方法,設(shè)計(jì)師可以通過(guò)精細(xì)化用戶(hù)/場(chǎng)景/時(shí)段分析后更好的理解用戶(hù)多樣化需求,從而轉(zhuǎn)換角色發(fā)現(xiàn)用戶(hù)痛點(diǎn),基于痛點(diǎn)制定設(shè)計(jì)策略,展開(kāi)具體設(shè)計(jì),設(shè)計(jì)方向精耕、細(xì)致,更關(guān)注效果,重視投入產(chǎn)出比。
一、精細(xì)化需求分析
用戶(hù)分層及需求分析
用戶(hù)分層:方法包含多種,包括按用戶(hù)價(jià)值、生命周期、RFM模型、AARRR模型、使用經(jīng)驗(yàn)分層等方法,需結(jié)合需求目標(biāo)及業(yè)務(wù)類(lèi)型選擇匹配的方法。
以搜索金融垂類(lèi)為例,目標(biāo)是更好的滿足用戶(hù)的需求,而不同分層下的用戶(hù)需求不同,因此結(jié)合金融垂類(lèi)下不同使用經(jīng)驗(yàn)用戶(hù)需求不同的特征,按用戶(hù)使用經(jīng)驗(yàn)由淺入深分為:小白用戶(hù)、一般散戶(hù)、專(zhuān)業(yè)用戶(hù),基于大盤(pán)用戶(hù)分析報(bào)告發(fā)現(xiàn)用戶(hù)類(lèi)型主要以小白用戶(hù)和一般散戶(hù)為主,小白用戶(hù)占比最高。
需求分析:方法包括問(wèn)卷調(diào)研、用戶(hù)訪談、焦點(diǎn)小組、數(shù)據(jù)分析等方法,此項(xiàng)目需求分析結(jié)論來(lái)源于用戶(hù)分析報(bào)告,主要是通過(guò)問(wèn)卷方式調(diào)研用戶(hù)需求,將不同分層用戶(hù)的需求進(jìn)行分類(lèi)整合,得出以下需求特征:
小白用戶(hù):入門(mén)學(xué)習(xí)資料、百科基礎(chǔ)知識(shí)、新聞資訊、行情、社區(qū)內(nèi)容。
一般散戶(hù):行情、自選、新聞資訊、投資建議。
專(zhuān)業(yè)用戶(hù):自選、行情、資訊、社區(qū)、更高級(jí)的策略組合。
場(chǎng)景分類(lèi)分析
輔助挖掘分場(chǎng)景的細(xì)化需求并提供對(duì)應(yīng)設(shè)計(jì)解法
不同場(chǎng)景下用戶(hù)需求不同,設(shè)計(jì)解決方案會(huì)有差異,金融品類(lèi)需求豐富包括股票/基金/期貨/外匯/貴金屬,需求類(lèi)型包括實(shí)體需求/問(wèn)答需求/轉(zhuǎn)化需求,需通過(guò)數(shù)據(jù)分析了解各類(lèi)需求占比,可以作為后續(xù)優(yōu)化優(yōu)先級(jí)的判斷指標(biāo),經(jīng)過(guò)數(shù)據(jù)分析后得出結(jié)論股票品類(lèi)需求及用戶(hù)占比遠(yuǎn)高于其他品類(lèi),以股票品類(lèi)舉例細(xì)化用戶(hù)需求,列舉搜索詞,便于后續(xù)進(jìn)行線上問(wèn)題走查挖掘設(shè)計(jì)機(jī)會(huì)點(diǎn)。
使用時(shí)段分析
輔助挖掘分時(shí)效的細(xì)化需求并提供對(duì)應(yīng)設(shè)計(jì)解法
股票交易時(shí)段有固定的交易周期,包括盤(pán)前/早盤(pán)盤(pán)中/午休/午盤(pán)盤(pán)中/盤(pán)后幾個(gè)固定時(shí)段,不同時(shí)段用戶(hù)需求不同,了解不同時(shí)段的用戶(hù)需求可以更好的滿足用戶(hù),比如開(kāi)盤(pán)過(guò)程中用戶(hù)想看到更實(shí)時(shí)更專(zhuān)業(yè)的行情信息、實(shí)時(shí)的資訊動(dòng)態(tài),而在盤(pán)前/盤(pán)后用戶(hù)更想看到的是今日大盤(pán)的走勢(shì)預(yù)測(cè)/收盤(pán)后的大盤(pán)總結(jié),除了固定周期的用戶(hù)需求,突發(fā)的新聞資訊類(lèi)時(shí)效性?xún)?nèi)容對(duì)用戶(hù)做決策分析也很重要。
二、機(jī)會(huì)點(diǎn)挖掘
綜合分析判斷設(shè)計(jì)優(yōu)先級(jí)
由于開(kāi)發(fā)資源有限,不能一次做完所有產(chǎn)品設(shè)計(jì)優(yōu)化,因此需針對(duì)優(yōu)化內(nèi)容排布優(yōu)先級(jí),對(duì)高優(yōu)場(chǎng)景進(jìn)行優(yōu)化,這里的方法是結(jié)合用戶(hù)分類(lèi)規(guī)模、產(chǎn)品品類(lèi)規(guī)模、發(fā)展目標(biāo)、體驗(yàn)收益高低明確優(yōu)化優(yōu)先級(jí),通過(guò)上述精細(xì)化分析得出結(jié)論股票場(chǎng)景用戶(hù)規(guī)模大,且小白用戶(hù)占比高,因此在股票場(chǎng)景下針對(duì)偏小白用戶(hù)高優(yōu)進(jìn)行設(shè)計(jì)優(yōu)化。
結(jié)合分析結(jié)論洞察機(jī)會(huì)點(diǎn)
結(jié)合小白用戶(hù)需求特征在股票需求場(chǎng)景下挖掘設(shè)計(jì)機(jī)會(huì)點(diǎn),結(jié)合股票場(chǎng)景需求分類(lèi)結(jié)論列舉搜索詞,針對(duì)搜索詞下的需求滿足情況進(jìn)行挖掘分析,可以從以下三點(diǎn)著重分析:
1)結(jié)合用戶(hù)需求結(jié)論分析是否存在未滿足的使用需求。
2)結(jié)合競(jìng)品分析已滿足需求是否有提升空間,如在滿足效率上、信息理解成本上。
3)結(jié)合競(jìng)品分析交互、布局、視覺(jué)樣式上是否存在優(yōu)化空間。
以大盤(pán)詞下的股市行情搜索詞為例:
1)當(dāng)前僅滿足了用戶(hù)單一市場(chǎng)的行情需求:僅展示了A股下的上證指數(shù)行情,缺少美股/港股等多市場(chǎng)滿足、缺少重要行情動(dòng)態(tài)信息包括大盤(pán)最新消息、大盤(pán)整體漲跌情況、大盤(pán)特殊異動(dòng)等信息。
2)數(shù)據(jù)圖表復(fù)雜理解成本高,滿足效率低:橫縱坐標(biāo)數(shù)據(jù)多、圖表內(nèi)包含分時(shí)、五日、日K等專(zhuān)業(yè)行情功能切換,小白用戶(hù)難以理解。
3)內(nèi)容布局及樣式上相對(duì)單一:由于滿足卡片使用了通用的股票行情設(shè)計(jì)模板、且需求滿足有缺失,導(dǎo)致了內(nèi)容及布局上相對(duì)單一,與競(jìng)品相比在內(nèi)容豐富度及視覺(jué)樣式上差距較大。
按照以上方法對(duì)列舉搜索詞場(chǎng)景進(jìn)行逐一分析挖掘,最后整理分類(lèi)總結(jié)設(shè)計(jì)機(jī)會(huì)點(diǎn)。
三、制定設(shè)計(jì)優(yōu)化策略
明確設(shè)計(jì)準(zhǔn)則及發(fā)力點(diǎn)
基于小白用戶(hù)經(jīng)驗(yàn)少、金融垂類(lèi)專(zhuān)業(yè)知識(shí)多晦澀難懂、數(shù)據(jù)復(fù)雜難理解的背景,制定易觸達(dá)、易理解2個(gè)策略,通過(guò)信息可視化外顯、圖表圖形化表達(dá)、關(guān)鍵信息外顯等方式降低用戶(hù)消費(fèi)門(mén)檻,提高信息獲取效率,強(qiáng)時(shí)效是基于股票特有的盤(pán)前/盤(pán)中/盤(pán)后周期性交易特征擬定的,可通過(guò)此特征打造更加差異化的滿足。
四、落地應(yīng)用驗(yàn)證
股票大盤(pán)場(chǎng)景
1)分析用戶(hù)需求及業(yè)務(wù)訴求
典型搜索詞:如大盤(pán)行情、今日股市動(dòng)態(tài)等大盤(pán)泛搜索詞。
用戶(hù)需求:結(jié)合用戶(hù)高頻使用功能分析發(fā)現(xiàn)小白用戶(hù)、一般散戶(hù)、專(zhuān)業(yè)用戶(hù)均對(duì)行情功能有高頻率的使用需求,具體需求包括了解多市場(chǎng)、關(guān)鍵指數(shù)行情、了解最新快訊、重要行情動(dòng)態(tài)、盤(pán)前/盤(pán)中/盤(pán)后簡(jiǎn)報(bào),再結(jié)合小白用戶(hù)占比高且對(duì)百科內(nèi)容有需求的現(xiàn)狀,知識(shí)科普信息也是相關(guān)待滿足需求。
業(yè)務(wù)訴求:增加自選股入口、開(kāi)戶(hù)轉(zhuǎn)化導(dǎo)流入口。
2)競(jìng)品分析挖掘優(yōu)化點(diǎn)
搜索競(jìng)品分析:普遍用一張晦澀難懂的數(shù)據(jù)結(jié)果卡滿足全部用戶(hù)的復(fù)雜檢索需求,可獲取信息很有限,對(duì)小白用戶(hù)來(lái)說(shuō)復(fù)雜的數(shù)據(jù)圖更是難以消化。
垂類(lèi)競(jìng)品分析:更專(zhuān)業(yè),信息滿足更豐富,但頁(yè)面內(nèi)容較繁雜,對(duì)于小白用戶(hù)來(lái)說(shuō)入門(mén)成本較高。
設(shè)計(jì)優(yōu)化思路:結(jié)合競(jìng)品優(yōu)劣勢(shì)可得出,需要在提高信息豐富度的同時(shí),考慮小白用戶(hù)的入門(mén)成本,用更可視化及簡(jiǎn)潔的設(shè)計(jì)語(yǔ)言輔助用戶(hù)快速獲取有效需求信息。
3)結(jié)合策略展開(kāi)設(shè)計(jì)
結(jié)合用戶(hù)需求優(yōu)先級(jí)對(duì)信息模塊進(jìn)行分區(qū),強(qiáng)需內(nèi)容放在頭部,弱需滿足放在中部,附加轉(zhuǎn)化放在底部,如多市場(chǎng)TAB+指數(shù)模塊作為搜索強(qiáng)需置于上方,關(guān)鍵指數(shù)信息置于頭部,市場(chǎng)總覽及簡(jiǎn)報(bào)內(nèi)容置于中部,開(kāi)戶(hù)轉(zhuǎn)化等激發(fā)需求入口置于下方輔助展現(xiàn),并結(jié)合設(shè)計(jì)策略進(jìn)行詳細(xì)設(shè)計(jì)。
易觸達(dá):優(yōu)化前的搜索結(jié)果卡片僅支持上證指數(shù)數(shù)據(jù)的展示,更豐富的行情信息都承載在落地頁(yè)內(nèi),通過(guò)前卡與落地頁(yè)的聯(lián)動(dòng)優(yōu)化,外顯滿足需求的關(guān)鍵信息,幫助用戶(hù)提升消費(fèi)效率。
易理解:通過(guò)數(shù)據(jù)結(jié)構(gòu)化、圖形可視化、標(biāo)簽化字體等用戶(hù)更易理解的設(shè)計(jì)表達(dá)語(yǔ)言,幫助用戶(hù)更簡(jiǎn)單快捷的獲取信息。
強(qiáng)時(shí)效:增加快報(bào)簡(jiǎn)訊等時(shí)效性?xún)?nèi)容、周期性?xún)?nèi)容展示。
4)實(shí)驗(yàn)上線驗(yàn)證
通過(guò)最終上線實(shí)驗(yàn)數(shù)據(jù)分析發(fā)現(xiàn),設(shè)計(jì)改版后由于更高效的滿足了用戶(hù)多樣化內(nèi)容需求,搜索量、點(diǎn)擊率大幅提升,也驗(yàn)證了整個(gè)設(shè)計(jì)方法思路的正確性。
開(kāi)戶(hù)轉(zhuǎn)化場(chǎng)景
設(shè)計(jì)方法流程相同
分析需求:典型搜索詞股票開(kāi)戶(hù)等轉(zhuǎn)化詞,線上僅有開(kāi)戶(hù)入口列表,但實(shí)際搜索用戶(hù)有潛在的查找開(kāi)戶(hù)方式需求未滿足,因此需先滿足用戶(hù)了解開(kāi)戶(hù)流程的需求,再提供轉(zhuǎn)化入口。
競(jìng)品分析:搜索競(jìng)品包括今日頭條、夸克、QQ瀏覽器、必應(yīng)、谷歌均以滿足用戶(hù)查找需求為主,信息以純文本形式展現(xiàn),消費(fèi)成本較高,且未滿足用戶(hù)潛在的開(kāi)戶(hù)需求,垂類(lèi)競(jìng)品開(kāi)戶(hù)頁(yè)對(duì)流程、材料介紹均不完整、缺少完整的介紹及問(wèn)題解答。
策略設(shè)計(jì) :結(jié)合用戶(hù)需求優(yōu)先級(jí)對(duì)信息模塊進(jìn)行分區(qū),可視化外顯優(yōu)先滿足開(kāi)戶(hù)流程需求,再提供優(yōu)質(zhì)券商開(kāi)戶(hù)入口,考慮到搜索結(jié)果頁(yè)卡片展示屏效,完整開(kāi)戶(hù)指南配合在落地頁(yè)內(nèi)呈現(xiàn)。
驗(yàn)證收益:產(chǎn)品上線后開(kāi)戶(hù)轉(zhuǎn)化率提升,用戶(hù)需求和轉(zhuǎn)化需求得到了較好的平衡,再次驗(yàn)證精細(xì)化設(shè)計(jì)方法的有效性。
總結(jié)與展望
精細(xì)化設(shè)計(jì)方法應(yīng)用落地主要分為四步:1)分用戶(hù)、場(chǎng)景、時(shí)效的精細(xì)化需求分析;2)VS競(jìng)品分析問(wèn)題挖掘設(shè)計(jì)機(jī)會(huì)點(diǎn);3)結(jié)合分析制定設(shè)計(jì)優(yōu)化策略;4)高優(yōu)場(chǎng)景設(shè)計(jì)及收益驗(yàn)證。該方法不僅適用于搜索金融垂類(lèi)體驗(yàn)持續(xù)優(yōu)化,同時(shí)也可應(yīng)用至搜索全局啟發(fā)設(shè)計(jì)優(yōu)化思路。
藍(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)加微信ban_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢(xún)、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德,皆悉回向給文章原作者及眾讀者. 免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.88yangsc.com )蘭亭妙微,是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶(hù)體驗(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咨詢(xún)、用戶(hù)體驗(yàn)公司、軟件界面設(shè)計(jì)公司。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.88yangsc.com