首頁

如何強(qiáng)化圖標(biāo)設(shè)計(jì)的細(xì)節(jié)?我總結(jié)了12個關(guān)鍵點(diǎn)!

seo達(dá)人



1.清晰

圖片

大家先想想圖標(biāo)在APP里的主要作用是什么呢?可以作為功能和信息的提示標(biāo)識,引導(dǎo)用戶的操作。

而且我們通過看圖獲取信息的速度要比閱讀文字獲取快得多,圖標(biāo)作為一種通用化的視覺語言,讓頁面更容易被閱讀。

圖片

▲ 圖標(biāo)代表的隱喻越準(zhǔn)確,就越容易被用戶準(zhǔn)確識別。

 

2.簡潔

圖片

圖標(biāo)本身的尺寸就特別小,如果在里面摻雜著大量沒必要的裝飾性元素,會讓圖標(biāo)的閱讀變得很困難。

可以通過使用盡可能簡單的設(shè)計(jì)元素來創(chuàng)建圖標(biāo),保證形狀的簡潔易懂。

圖片

▲ 如果在設(shè)計(jì)過程中發(fā)現(xiàn)圖標(biāo)變得很復(fù)雜,大膽嘗試去做減法,刪除不必要的細(xì)節(jié),只留下最重要的部分。

 

3.風(fēng)格統(tǒng)一

圖片

在Dribbble中搜索“icons”,會看到很多不同風(fēng)格的圖標(biāo)樣式,但同一個集合中的圖標(biāo)都會保持統(tǒng)一的設(shè)計(jì)風(fēng)格。

圖片

▲ 不同風(fēng)格的圖標(biāo)可以在設(shè)計(jì)中穿插使用。例如在APP底部導(dǎo)航中,使用線形風(fēng)格的圖標(biāo)作為基本狀態(tài),點(diǎn)擊選中時可以變換為面性風(fēng)格,用來區(qū)分不同的狀態(tài)。

 

4.基礎(chǔ)網(wǎng)格

圖片

網(wǎng)格有助于我們建立一個明確的尺寸規(guī)范,常見的網(wǎng)格尺寸有16×16、24×24、32×32、48×48、64×64、96×96。

圖片

▲ 所有的圖標(biāo)都將建立在基礎(chǔ)網(wǎng)格之上,圖標(biāo)的每個部分都應(yīng)該放在像素網(wǎng)格內(nèi)。

 

5.安全區(qū)域

圖片

圖標(biāo)的主體部分應(yīng)該保持在安全區(qū)域內(nèi),這種情況適用于大多數(shù)的場景。

安全區(qū)域可以作為設(shè)計(jì)建議,而不是一項(xiàng)必須的規(guī)則,如果有需要,我們完全可以在安全區(qū)域外擴(kuò)展圖標(biāo)的形狀。

圖片

 

6.關(guān)鍵形狀

圖片

如果想讓一組圖標(biāo)放在一起看起來很和諧,那這些圖標(biāo)的視覺權(quán)重應(yīng)該保持一致。

在設(shè)計(jì)前首先確定圖標(biāo)的基本形狀,例如圓形、正方形、矩形等,能有效幫助我們確定圖標(biāo)的比例關(guān)系。

可以用數(shù)學(xué)面積公式來計(jì)算一下不同形狀圖標(biāo)的權(quán)重,找出近似值。

來吧,先從圓形開始:

圖片

▲ 在這個例子中,直徑d是20px,半徑r是10px,圓的面積約等于314px2。

 

把圓的面積開個根號√,方形的邊長a大約為17.7px,四舍五入到整數(shù),那么邊長a為18px,接下來算算方形的面積:

圖片

▲ 邊長a為18px,方形的面積為324px2。

 

最后算一下矩形的面積:

圖片

▲ 邊長b為20px,邊長c為16px。

 

最后我們根據(jù)這些科學(xué)的尺寸設(shè)計(jì)一組相對和諧的圖標(biāo):

圖片

 

7.描邊寬度

圖片

除了保持相同的視覺權(quán)重,圖標(biāo)的描線寬度也應(yīng)該保持一致,達(dá)到像素級統(tǒng)一,這里我建議描邊使用整數(shù)值,這樣更便于設(shè)計(jì)。

圖片

▲ 另外,不要忘記元素之間的最小間距,應(yīng)該大于或等于描邊的寬度。

 

8.圓角

圖片

圖標(biāo)的和諧還在于邊角的統(tǒng)一。尖角不用說了,保持統(tǒng)一的垂直90度就可以。

這里需要重要說的是圓角,不能所有的形狀都使用同一個圓角度數(shù),而是要根據(jù)圖標(biāo)形狀的不同靈活調(diào)節(jié)圓角度數(shù)。

圖片

▲ 例如一個圖標(biāo)有里外兩個平行的圓角時,不能里外都使用1px的圓角,這樣會讓圖標(biāo)看起來不統(tǒng)一。

 

正確的做法是讓外面的圓角更大,設(shè)置為3px,里面的圓角為1px,讓圖標(biāo)看起來更和諧。

圖片

▲ 根據(jù)對象大小,設(shè)置不同的圓角數(shù),保證視覺統(tǒng)一。

 

9.角度

圖片

同一組圖標(biāo)保持相同的傾角設(shè)計(jì),可以讓圖標(biāo)看起來更統(tǒng)一。

圖片

▲ 圖標(biāo)中所有傾斜的線條都限定為45度角,會讓圖標(biāo)看起來更嚴(yán)謹(jǐn)和規(guī)范。

 

10.視覺平衡

圖片

在設(shè)計(jì)圖標(biāo)時,既要利用作圖軟件把握嚴(yán)格的對稱和尺寸標(biāo)準(zhǔn),也要注意多用眼睛去觀察圖標(biāo)的視覺平衡,保證圖標(biāo)看起來很統(tǒng)一。

圖片

▲ 最典型的情況就是繪制“播放”圖標(biāo)時,使用軟件去調(diào)節(jié)三角形左右兩邊的完全對稱,圖標(biāo)看起來反而會有點(diǎn)不平衡,看著感覺離左邊近,離右邊遠(yuǎn)(右圖)。

在這種情況下,我們就要在對稱的基礎(chǔ)上,將三角形向右移動一點(diǎn),來保證視覺上的平衡(左圖)。

 

11.透視 (2D/3D)

圖片

除了扁平的2D風(fēng)格圖標(biāo)外,也可以考慮使用3D風(fēng)格的圖標(biāo)樣式,讓圖標(biāo)的體積感和空間感更強(qiáng)。

圖片

▲ 無論使用哪一種,同一組的圖標(biāo)要保持統(tǒng)一的樣式,比如要用3D樣式,那么這一組3D圖標(biāo)要使用相同角度的透視。

 

12.設(shè)計(jì)常識

圖片

上面提到了圖標(biāo)設(shè)計(jì)的很多規(guī)則,在日常設(shè)計(jì)中建議大家將這些規(guī)則作為指導(dǎo)。

但是任何規(guī)則都有例外,如果有必要,我們可以打破規(guī)則。

圖片

▲ 左邊的圖標(biāo)使用了不同的圓角和角度,來保證圖標(biāo)像素級的完美;在右邊的圖標(biāo)中,右下角的圖形雖然超出了安全區(qū)域,卻保證了整個圖標(biāo)的平衡。

 

結(jié)論

圖標(biāo)設(shè)計(jì)是看著容易,做起來卻很難的一類設(shè)計(jì),把握這些關(guān)鍵細(xì)節(jié)能讓我們的圖標(biāo)設(shè)計(jì)水平提升更多。

最后為大家精心挑選了700+圖標(biāo)合集源文件,可以直接用在移動端、網(wǎng)頁端設(shè)計(jì)中!

圖片

參考: Design principles for creating the perfect icon set

 

領(lǐng)取方式:

關(guān)注公眾號,后臺回復(fù)【圖標(biāo)】獲取下載鏈接。

 

原文地址:Clip設(shè)計(jì)夾(公眾號)

作者:Clippp

轉(zhuǎn)載請注明:學(xué)UI網(wǎng)》如何強(qiáng)化圖標(biāo)設(shè)計(jì)的細(xì)節(jié)?我總結(jié)了12個關(guān)鍵點(diǎn)!

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

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ù)



競品分析的7個視角

資深UI設(shè)計(jì)者

知彼知己,百戰(zhàn)不殆。
——《孫子兵法》

產(chǎn)品經(jīng)理的崗位職責(zé)之一是在市場中建立和維護(hù)產(chǎn)品的競爭優(yōu)勢,競品分析是產(chǎn)品經(jīng)理的一項(xiàng)常規(guī)工作,分析質(zhì)量決定著決策質(zhì)量,影響著對業(yè)務(wù)取長補(bǔ)短的效果。但在競品分析時,常遇到以下問題:

  • 沒有養(yǎng)成日常習(xí)慣,分析時無從下手
  • 企圖以此尋找需求或印證自己的觀點(diǎn)
  • 由領(lǐng)導(dǎo)發(fā)起,找模板套公式,交作業(yè)
  • 分析維度雜亂淺顯,結(jié)論無參考價值

那么,競品分析應(yīng)該怎么做呢?

當(dāng)我剛剛喜歡上一個姑娘時,卻發(fā)現(xiàn)已經(jīng)有人喜歡她了,而且張三已經(jīng)表白,李四也有好感,怎么辦呢?

大腦會在荷爾蒙的牽動下情不自禁做起了分析和策略。先從人類視角思考一下世界觀、人生觀、價值觀、婚戀觀,確定一下自己要談一場什么樣的戀愛。

再從戀愛角度來了解姑娘,哪里人呀?啥家庭呀?啥衣食住行呀?啥愛好?啥性格呀?符合夢中情人的樣子么?這么一通觀察下來,那多久約一次會、吃什么飯、唱什么歌、送什么禮也就心里有數(shù)了。張三李四都干啥了就得有差異化。

進(jìn)一步了解之后又要返回到婚戀觀,問自己真誠否?關(guān)系合適否?只有對自己真誠,對姑娘真誠才能情投意合。既然雙方感覺都不錯,繼續(xù)更深一步互動,少了一些遮掩,偶有矛盾,知道雙方喜歡啥,雷區(qū)是啥。如此,言談舉止便要有所分類,分類即尊重,相容即相愛。

咔,到這里,沒有張三李四的事了。良久,兩人有了結(jié)婚的想法,要雙方家長見面聊聊呀,聊聊兩個大家庭的想法,聊聊小家庭的打算,真心地切合實(shí)際地聊??孔V!

咔,姑娘到手。結(jié)婚的過程又一次鞏固了小家庭的使命、愿景、價值觀,那就過日子吧??傊?,在與姑娘相處的每個階段、每個事上都要真誠以待。競品分析更是如此了,要與用戶談戀愛。

當(dāng)然,更準(zhǔn)確地來說是競爭分析,產(chǎn)品只是價值的載體。做一款產(chǎn)品時,卻發(fā)現(xiàn)已經(jīng)有直接競爭者、替代競爭者、潛在競爭者、預(yù)算競爭者了,而且還有一些可參考的友商。就從7個角度觀察分析:

  1. 從上帝視角看市場,了解產(chǎn)業(yè)和行業(yè)的運(yùn)作模式、所處環(huán)境和市場數(shù)據(jù),便于篩選目標(biāo)市場;
  2. 從市場角度看用戶,了解目標(biāo)市場中全部用戶的分層及畫像,便于篩選目標(biāo)用戶;
  3. 用研發(fā)角度看產(chǎn)品,了解開發(fā)生命周期中的差異;
  4. 從市場角度看產(chǎn)品,了解產(chǎn)品生命周期中的差異;
  5. 從產(chǎn)品角度看用戶,了解產(chǎn)品中存量用戶的細(xì)分,便于精細(xì)化運(yùn)營;
  6. 從用戶角度看產(chǎn)品,了解用戶不同的體驗(yàn)和評價;
  7. 從產(chǎn)品背后看企業(yè),了解競爭者的資源配置情況。

在頻率上可以日常分析、定期分析、突發(fā)性地專項(xiàng)分析;在分析粒度上可以大到對行業(yè)趨勢的分析,中到對競品方案的分析,小到對競品功能點(diǎn)的分析;在呈閱對象上,可以是BOSS、PM、設(shè)計(jì)師、研發(fā)人員等。

總之,PM做競爭分析時要在產(chǎn)品所處的每個階段、工作的每個細(xì)節(jié)上都真誠以待,這樣才能得到客觀有用的結(jié)論。這是對競品分析的工作思想,開始分析吧!

  • 分析目的有哪些?
  • 分析對象有哪些?
  • 分析角度有哪些?
  • 競品信息的來源有哪些?
  • 競品信息的處理流程有哪些?
  • 分析方法有哪些?
  • 結(jié)論如何呈現(xiàn)?

一、7個分析目的

用戶價值、商業(yè)價值、用戶價值與商業(yè)價值間平衡,這三類的預(yù)期和現(xiàn)狀之間有所差距,想找到解決方案減少差距唄,那還是會遇到7種不同的情況:

  1. 知道差距,沒方案,尋找方案
  2. 知道差距,有方案,不知道方案對不對
  3. 知道差距,有方案,不知道方案如何實(shí)施
  4. 知道差距,有方案,但方案行不通,咋辦
  5. 知道差距,多種方案,不知道選擇哪個最好
  6. 知道現(xiàn)狀不是想要的,說不清預(yù)期,沒方案
  7. 知道預(yù)期就是想要的,不清楚現(xiàn)狀,沒方案

往細(xì)來說,大概會在開拓市場時,尋找市場切入點(diǎn)、尋求差異化、規(guī)劃業(yè)務(wù)、策劃運(yùn)營方案等;在挖掘用戶需求時,分析用戶和分析需求等;在觀測市場時,做行業(yè)預(yù)測、競爭預(yù)測等;在……時,進(jìn)行……

二、5個分析對象

以“目標(biāo)用戶類型”、“核心需求”、“產(chǎn)品或服務(wù)的特征”和“用戶購買預(yù)算”為依據(jù)大致可以劃分為5類競品。

競合

★代表相似,?代表不同,- 代表可有可無

三、7個分析角度

3.1 從上帝視角看市場

從整體上看,市場的構(gòu)成如下圖要素構(gòu)成。在這個視角,我們主要做產(chǎn)業(yè)分析、行業(yè)分析和市場分析。

競合

3.1.1 產(chǎn)業(yè)分析

產(chǎn)業(yè)是指由利益相互聯(lián)系的、具有不同分工的、由各個相關(guān)行業(yè)所組成的業(yè)態(tài)總稱。一個產(chǎn)業(yè)可以跨越(包含)幾個行業(yè)。產(chǎn)業(yè)結(jié)構(gòu)、產(chǎn)業(yè)分類、技術(shù)結(jié)構(gòu)、技術(shù)分類一般都有國際或國家的分類標(biāo)準(zhǔn),百度可見;其中產(chǎn)業(yè)結(jié)構(gòu)中各角色的互動關(guān)系如下圖所示:

競合

圖中的互動關(guān)系也可稱之為“產(chǎn)業(yè)鏈”中的“供需鏈”。

產(chǎn)業(yè)布局是指產(chǎn)業(yè)在一國或一地區(qū)范圍內(nèi)的空間分布和組合的經(jīng)濟(jì)現(xiàn)象。在靜態(tài)上看是指形成產(chǎn)業(yè)的各部門、各要素、各鏈環(huán)在空間上的分布態(tài)勢和地域上的組合。在動態(tài)上表現(xiàn)為各種資源、各生產(chǎn)要素甚至各產(chǎn)業(yè)和各企業(yè)為選擇最佳區(qū)位而形成的在空間地域上的流動、轉(zhuǎn)移或重新組合的配置與再配置過程??捎谩爱a(chǎn)業(yè)地圖”來表示:

示例一:按資源、生成要素的流動展示

競合

圖中的流動關(guān)系也可稱之為“產(chǎn)業(yè)鏈”中的“價值鏈”,而完整的價值鏈如下圖:

競合
示例二:按在各產(chǎn)業(yè)和各企業(yè)的流動展示

競合
圖中的企業(yè)關(guān)系也可稱之為“產(chǎn)業(yè)鏈”中的“企業(yè)鏈”。

示例三:按地理空間展示

競合

圖中的地理關(guān)系也可稱之為“產(chǎn)業(yè)鏈”中的“空間鏈”。

匯總一下,對產(chǎn)業(yè)的了解可從時間、空間和程度三個方面來研究,如圖所示:

競合

3.1.2 行業(yè)分析

行業(yè)指一組提供同類相互密切替代商品或服務(wù)的公司。選定行業(yè)就一定能看到我們的競爭者有哪些。從供需關(guān)系上看,就是研究目標(biāo)市場的供給側(cè)的生產(chǎn)者有哪些?

競合

當(dāng)然了,分類的話,還是分為競爭分析的5個對象。

競合

那么,對行業(yè)分析,有哪些維度呢?

3.1.2.1 生命周期

即老生常談的引入期、成長期、成熟期、衰退期。

競合

3.1.2.2 競爭類型

分為完全競爭、壟斷競爭、寡頭競爭和完全壟斷。

競合

3.1.2.3 行業(yè)要素

分析一個行業(yè)的主要影響要素及要素密集度。包括五類:

  1. 資本型,如房地產(chǎn)
  2. 技術(shù)型,如制造業(yè)
  3. 勞動型,如防治業(yè)
  4. 知識型,如創(chuàng)意設(shè)計(jì)
  5. 資源型,如煤炭、發(fā)電

3.1.2.4 經(jīng)濟(jì)周期

分為三類:

  1. 增長型,如人工智能、云計(jì)算、物聯(lián)網(wǎng)
  2. 周期型,如鋼鐵、煤炭、金融產(chǎn)品
  3. 防守型,如醫(yī)藥、旅游、家電

3.1.2.5 行業(yè)結(jié)構(gòu)

常從三個維度分析:

  1. 各產(chǎn)品的市場規(guī)模及結(jié)構(gòu)變化
  2. 各地區(qū)的市場規(guī)模及結(jié)構(gòu)變化
  3. 各消費(fèi)群體的規(guī)模及結(jié)構(gòu)變化

競合

3.1.2.6 主要數(shù)據(jù)

行業(yè)的發(fā)展分析時經(jīng)?;仡櫄v史、分析現(xiàn)狀和預(yù)測未來。

回顧、分析和預(yù)測哪些數(shù)據(jù)呢?

主要有市場規(guī)模、毛利率、銷售增長率和凈資產(chǎn)收益率等。

3.1.3 市場分析

市場泛指商品交換的領(lǐng)域。

3.1.3.1 分析對象

  • 針對產(chǎn)業(yè)做分析
  • 針對行業(yè)做分析
  • 針對企業(yè)做分析

3.1.3.2 分析范圍:

  • 全局的
  • 細(xì)分的

3.1.3.3 市場概覽

  • 過去近十年的數(shù)據(jù):市場規(guī)模、GDP占比、復(fù)合增長率(GAGR)、線上化率(=線上市場規(guī)模/總市場規(guī)模)
  • 現(xiàn)狀分析:宏觀環(huán)境因素分析(PEST)、對標(biāo)其他國家和相近行業(yè)
  • 判斷未來趨勢:數(shù)據(jù)擬合預(yù)測

3.1.3.4 市場集中程度:

CRn(concentration ratio)n一般用10。也就是在這個市場市占前10的公司,加起來的總和占整個市場的百分比,百分比越高,證明這個市場的集中度也就越高。

競合

3.1.3.5 市場消費(fèi)模式

  • 價格型
  • 理智型
  • 沖動型
  • 想象型
  • 習(xí)慣型
  • 隨意型

3.1.3.6 上下游市場分析

  • 上游:政策、上游原材料構(gòu)成、原材料價格走勢、主要供應(yīng)企業(yè)的供應(yīng)量
  • 下游:政策、下游消費(fèi)市場構(gòu)成、消費(fèi)市場結(jié)構(gòu)變化趨勢、主要消費(fèi)群體的消費(fèi)量

3.1.3.7 市場數(shù)據(jù)

① 規(guī)模

  • 市場整體規(guī)模
  • 線上市場規(guī)模
  • 我司市場規(guī)模(市場占有率)

② 數(shù)據(jù)

  • 量(用戶數(shù)):下載量、注冊量、活躍用戶量、付費(fèi)用戶量等
  • 次(訂單數(shù))
  • 額(交易額)
  • 利(營收、毛利潤、凈利潤)
  • 率(轉(zhuǎn)化率、毛利率、增長率、凈資產(chǎn)收益率)

③ 趨勢

  • 增長
  • 持平
  • 下降

3.2 從市場角度看用戶

從供需上看,就是研究目標(biāo)市場的需求側(cè)的消費(fèi)者有哪些,該角度一般是在做新產(chǎn)品前對所有的消費(fèi)者進(jìn)行研究。

競合

3.2.1 分析對象

目標(biāo)市場中的消費(fèi)者。

3.2.2 分析目的

  • 消費(fèi)者分層,即市場細(xì)分,或是叫用戶分層
  • 找準(zhǔn)目標(biāo)用戶

3.2.3 分析范圍

更多是全局分析

3.2.4 分析方法

3.2.4.1 定性調(diào)研:訪談、焦點(diǎn)小組、卡片分類、參與式設(shè)計(jì)

3.2.4.2 定量調(diào)研:調(diào)查問卷

3.2.4.3 場景調(diào)研:分為三類場景

  • 用戶場景:用戶遇到問題、產(chǎn)生想法,發(fā)現(xiàn)解決方案的場景
  • 使用場景:用戶使用產(chǎn)品時的場景
  • 營銷場景:用戶看到產(chǎn)品、選擇產(chǎn)品、購買產(chǎn)品時的場景

3.2.5 分析維度

① 口碑調(diào)查

  • 口碑結(jié)構(gòu)
  • 口碑的地域性差異
  • 品牌滿意度
  • 凈推薦值

② 產(chǎn)品價格

客戶希望為這個產(chǎn)品支付多少錢?競品價格如何?

③ 購買動機(jī),購買的影響因素及比重

④ 購買習(xí)慣,如購買渠道、購買時段等等

⑤ 產(chǎn)品感知及體驗(yàn)

3.2.6 分析產(chǎn)出

產(chǎn)出一:用戶故事版,或是用戶畫像之User Persona

競合

產(chǎn)出二:價格分析圖

競合

產(chǎn)出三:滿意度和凈推薦值

競合

產(chǎn)出四:購買因素及比重競合

產(chǎn)出五:購買習(xí)慣

競合

3.3 用研發(fā)角度看產(chǎn)品

想要了解競品是如何研發(fā)出來的,就需要關(guān)注和比較雙方的開發(fā)什么周期的各個動作。要“比、學(xué)、趕、超”不斷迭代,當(dāng)然也要“你打你的,我打我的”,堅(jiān)持自己得定位。

競合

3.3.1 產(chǎn)品定位

  • 我是一個什么樣的產(chǎn)品
  • 什么背景基因下產(chǎn)生
  • 為哪些目標(biāo)市場服務(wù)
  • 服務(wù)的邊界是什么

3.3.2 產(chǎn)品定義

① 定義用戶:

  • 選擇哪類用戶作為目標(biāo)用戶
  • 目標(biāo)用戶畫像之User Persona特征

② 定義場景:

  • 用戶場景:問題、想法、發(fā)現(xiàn)解決方案
  • 使用場景:使用
  • 營銷場景:看到、選擇、購買

③ 定義價值:

  • 用戶價值
  • 商業(yè)價值
  • 用戶價值與商業(yè)價值的平衡

④ 全局思考:

  • 產(chǎn)品的持續(xù)性
  • 產(chǎn)品的增長性

3.3.3 戰(zhàn)略規(guī)劃

  • 組織架構(gòu)從上到下的戰(zhàn)略傳遞
  • 產(chǎn)品組合策略
  • 產(chǎn)品路線圖

3.3.4產(chǎn)品設(shè)計(jì)

  • 基于場景和需求拆分用戶的任務(wù)
  • 基于任務(wù)拆分為功能和交互、內(nèi)容和信息架構(gòu)
  • 基于全局考慮業(yè)務(wù)閉環(huán)、產(chǎn)品結(jié)構(gòu)的可拓展性

3.3.5產(chǎn)品研發(fā)

  • 界面設(shè)計(jì)(設(shè)備、交互、UI等)
  • 技術(shù)研發(fā)
  • 可用性測試及用戶體驗(yàn)測試等
  • 持續(xù)迭代

3.3.6 產(chǎn)品運(yùn)營

上線前基于產(chǎn)品的運(yùn)營計(jì)劃

3.3.7 分析產(chǎn)出

  • 用戶畫像之User Persona
  • 用戶旅程圖
  • 產(chǎn)品階段戰(zhàn)略
  • 產(chǎn)品路線圖
  • 應(yīng)用架構(gòu)圖
  • 產(chǎn)品功能框架圖
  • 界面對比結(jié)論

3.4 從市場角度看產(chǎn)品

在新產(chǎn)品推向市場后的銷售營銷、運(yùn)營、根據(jù)需求演變的產(chǎn)品迭代,也要經(jīng)過進(jìn)入期、成長期、成熟期和衰退期是個階段。

競合

在不同的產(chǎn)品生命周期階段,企業(yè)經(jīng)營行為的側(cè)重點(diǎn)不同。

競合

3.4.1 產(chǎn)品商業(yè)模式

競合

3.4.2 產(chǎn)品/市場匹配(PMF)

PMF是Product Market Fit的簡寫,是指產(chǎn)品和市場達(dá)到最佳的契合點(diǎn)。象征著產(chǎn)品正好滿足市場的需求,令客戶滿意,這是產(chǎn)品成功的第一步。

競合

競合

PMF的實(shí)現(xiàn)標(biāo)準(zhǔn)(臨界點(diǎn))的判斷,各行各業(yè)因其特性均不同,網(wǎng)上有些判斷方法僅供參考:

  • 財(cái)務(wù)狀況增長率+利潤率大于40%
  • 次日留存大于30%
  • 每周使用天數(shù)超過3天
  • 付費(fèi)轉(zhuǎn)化率大于5%
  • LTV/CAC>3
  • 用戶月流失低于5%
  • 用戶獲取成本的回本時間少于12個月
  • 不能再使用該產(chǎn)品會感覺非常失望的用戶量占比大于40%(調(diào)研分四擋:非常失望、有點(diǎn)失望、沒有失望和不適用)

3.4.3 產(chǎn)品功能

  • 主要功能
  • 次要功能
  • 附加功能

3.4.4 所用技術(shù)

  • 技術(shù)類型
  • 技術(shù)架構(gòu)
  • 技術(shù)水平

競合

3.4.5 運(yùn)營推廣

3.4.5.1 內(nèi)容運(yùn)營

3.4.5.1.1 企業(yè)介紹

3.4.5.1.2 企業(yè)新聞

  • 融資信息
  • 客戶簽約信息
  • 戰(zhàn)略合作信息
  • 產(chǎn)品動態(tài)信息

3.4.5.1.3 產(chǎn)品手冊

3.4.5.1.4 客戶成功案例

3.4.5.1.5 行業(yè)白皮書

3.4.5.1.6 行業(yè)解決方案

3.4.5.1.7 行業(yè)報(bào)告、干貨資料

  • 行業(yè)熱點(diǎn)分析
  • 行業(yè)趨勢解讀

3.4.5.1.8 期刊、書籍等出版物

3.4.5.1.9 電子書

3.4.5.1.10 課程講義

  • 老板專欄/高管專欄/大咖專欄
  • 特定選題的課程

3.4.5.2 活動運(yùn)營

3.4.5.2.1 線上

  • 微課
  • 直播

3.4.5.2.2 線下

  • 主辦型活動
  • 聯(lián)合型活動
  • 贊助型活動
  • 企業(yè)參訪活動
  • 會銷活動
  • 培訓(xùn)活動、沙龍活動
  • 游學(xué)活動
  • 線下公開課

3.4.5.3 渠道運(yùn)營

3.4.5.3.1 官網(wǎng)媒體

3.4.5.3.2 自媒體:公眾號、頭條、搜狐號等等

3.4.5.3.3 全員營銷

3.4.5.3.4 聯(lián)合推廣渠道

  • 自媒體大號聯(lián)盟
  • 行業(yè)俱樂部及協(xié)會
  • 行業(yè)媒體、雜志體

3.4.5.3.5 貢獻(xiàn)線索渠道

  • 廣告渠道、SEM
  • 垂直行業(yè)網(wǎng)站
  • 同客異業(yè)合作
  • 產(chǎn)業(yè)上下游企業(yè)合作

3.4.5.3.6 代理商渠道

  • 渠道加盟商
  • 交易平臺,如用友云市場

3.4.5.3.7 社群運(yùn)營

3.4.5.3.8 運(yùn)營體系及風(fēng)格

3.4.5.3.9 運(yùn)營事件分析,關(guān)注和研究顯著的增長點(diǎn)

3.4.5.3.10 關(guān)注各類運(yùn)營數(shù)據(jù)及轉(zhuǎn)化率

3.4.6 銷售/營銷

3.4.6.1 定價策略

3.4.6.2 市場營銷

3.4.6.3 銷售模式

  • 直銷
  • 代銷
  • 經(jīng)銷
  • 網(wǎng)絡(luò)銷售
  • 電話銷售

3.4.6.4 銷售渠道及渠道策略

3.4.6.5 品牌管理

關(guān)于定價方法,UCPM的總結(jié)比較全面到位,這里羅列一下,百度即可。重在比較不同競爭者的定價策略。

競合

競合

3.5 從產(chǎn)品角度看用戶

當(dāng)產(chǎn)品中沉淀了一些存量用戶之后,為了實(shí)現(xiàn)用戶需求的異質(zhì)性、并集中有限資源進(jìn)行有效市場競爭的行為。企業(yè)在明確的戰(zhàn)略業(yè)務(wù)模式和特定的市場中,根據(jù)用戶的屬性,行為等因素對用戶進(jìn)行分類,并提供有針對性的產(chǎn)品、服務(wù)、銷售、運(yùn)營模式,達(dá)到用戶價值和產(chǎn)品目標(biāo)的最大化。

系統(tǒng)實(shí)施層面,是在抽象理論的指導(dǎo)下,用算法進(jìn)行標(biāo)簽化統(tǒng)計(jì)、分類,并以用戶畫像的形式表現(xiàn),最后在策略上、界面上、運(yùn)營方式上進(jìn)行“量體裁衣”。

競合

3.5.1 分析對象:產(chǎn)品中現(xiàn)有的用戶

3.5.2 分析目的:對用戶細(xì)分,精細(xì)化運(yùn)營,不同用戶采用不同的運(yùn)營策略

3.5.3 分析內(nèi)容:

  • 用戶畫像之User Profile
  • 標(biāo)簽分析、標(biāo)簽標(biāo)注
  • 用戶相關(guān)方利益分析
  • 不同用戶消費(fèi)特點(diǎn)
  • 用戶習(xí)慣
  • 用戶同理心分析
  • 用戶行為旅程
  • 用戶體驗(yàn)

越來越多的產(chǎn)品也逐漸從更多細(xì)致的維度來分析消費(fèi)者,對2C用戶的分析維度分為以下五類:

競合

對2B企業(yè)的分析維度,大致分為以下三類:

競合

3.5.4 分析方法

  • 定性:人種學(xué)現(xiàn)場調(diào)查、眼動跟蹤、可用性實(shí)驗(yàn)室研究、用戶反饋分析
  • 定量:埋點(diǎn)數(shù)據(jù)分析、A/B測試、用戶體驗(yàn)調(diào)查問卷

3.6 從用戶角度看產(chǎn)品

我們通常需要以不同的角色來體驗(yàn)和感受產(chǎn)品,而且能在各個角色之間切換自如。角色可以分以下幾類:

  • 用戶、商家、廣告商
  • 小白用戶、普通用戶、專家用戶
  • 決策者、購買者、使用者、影響者、信息管理者
  • 界面設(shè)計(jì)面向的主要人物、次要人物、補(bǔ)充人物、客戶人物、接受服務(wù)人物、負(fù)面人物

3.6.1 產(chǎn)品覆蓋的場景有哪些?能滿足哪些需求?能給我?guī)硎裁磧r值?

3.6.2 多端比較:

  • Android
  • IOS
  • WP

3.6.3 多商業(yè)入口分析:

  • APP
  • H5
  • PC
  • 公眾號
  • 小程序

3.6.4 功能:

  • 主要功能
  • 次要功能
  • 附加功能

3.6.5 UI與交互

  • 主要功能入口是否清晰明確?
  • 各入口間跳轉(zhuǎn)是否會迷失?
  • 最重要的頁面有沒有直接展示?

3.6.6 其他

  • 安全性
  • 性能:是否穩(wěn)定,不卡頓,響應(yīng)速度
  • 獲得性:客戶能否方便的獲得服務(wù)
  • 易用性:操作便利性、學(xué)習(xí)的難易程度
  • 后續(xù)服務(wù):不斷升級,維護(hù)報(bào)修服務(wù)的便利性
  • 用戶評價

3.7 從產(chǎn)品背后看企業(yè)

企業(yè)本質(zhì)上是“一種資源配置的機(jī)制”,其能夠?qū)崿F(xiàn)整個社會經(jīng)濟(jì)資源的優(yōu)化配置,降低整個社會的“交易成本”。從產(chǎn)品背后看企業(yè),才能看到產(chǎn)品的基因與營養(yǎng)。

3.7.1 分析對象:產(chǎn)品所屬的企業(yè)

3.7.2 分析目的:分析競品所屬企業(yè)的資源配置機(jī)制

3.7.3 分析方法

  • 定性:歷史追蹤法、主觀體驗(yàn)與評價
  • 定量:特征羅列、要素列舉

3.7.4 分析領(lǐng)域

3.7.4.1 企業(yè)背景

3.7.4.2 企業(yè)歷程及重大節(jié)點(diǎn)

3.7.4.3 企業(yè)定位

3.7.4.4 企業(yè)愿景

3.7.4.5 發(fā)展戰(zhàn)略

  • 進(jìn)攻
  • 防御
  • 橫向擴(kuò)張

3.7.4.6 業(yè)務(wù)模式

  • 上游
  • 下游

3.7.4.7 產(chǎn)品矩陣

  • 波士頓產(chǎn)品矩陣
  • 產(chǎn)品組合策略

3.7.4.8 產(chǎn)品戰(zhàn)略

  • 組織架構(gòu)從上到下的戰(zhàn)略傳遞
  • 產(chǎn)品路線圖

3.7.4.9 商業(yè)模式(商業(yè)畫布)

3.7.4.10 人力資源:

  • 創(chuàng)始人概括
  • 核心骨干人員優(yōu)勢
  • 團(tuán)隊(duì)背景
  • 組織架構(gòu)
  • 人員數(shù)量

3.7.4.11 財(cái)務(wù)資源:

  • 投融資情況
  • 盈利能力
  • 運(yùn)營投入

3.7.4.12 實(shí)物資源:

  • 工廠車間
  • 機(jī)器設(shè)備
  • 工具器具
  • 生產(chǎn)資料
  • 土地
  • 房屋等具有物質(zhì)形態(tài)的固定資產(chǎn)

3.7.4.13 技術(shù)資源:

  • 技術(shù)專利
  • 影響用戶體驗(yàn)的技術(shù)
  • 市場發(fā)展的技術(shù)

3.7.4.14 社會資源:

  • 政府關(guān)系
  • 合作伙伴
  • 社會名人
  • 重要事件

3.7.4.15 其他資源

  • 時空資源
  • 信息資源
  • 品牌資源
  • 文化資源
  • 管理資源

四、4類信息來源

4.1 來自分析者自身的信息

1)成為用戶

2)體驗(yàn)產(chǎn)品

3)輪崗實(shí)習(xí)

4.2 來自用戶的信息

1)用戶調(diào)研

2)用戶反饋

3)用戶數(shù)據(jù)分析

4.3 來自競爭者的信息

4.3.1 公司官網(wǎng)

  • 財(cái)務(wù)報(bào)表
  • 融資情況
  • 活動線索:產(chǎn)品發(fā)布會、行業(yè)峰會,展覽會,推廣活動
  • 媒體線索:官網(wǎng)、微博、公眾號、媒體報(bào)道、高管訪談、產(chǎn)品的運(yùn)營事件和運(yùn)營信

4.3.2 產(chǎn)品使用

產(chǎn)品體驗(yàn)、產(chǎn)品文檔

4.3.3 競爭者的員工

  • 客服人員:作為消費(fèi)者給競品客服打電話咨詢問題
  • 離職人員:在合法范圍內(nèi)做咨詢

4.3.4 互動交流

4.4 來自第三方的信息

1)政府機(jī)構(gòu):查看政府的工作統(tǒng)計(jì)報(bào)告

2)行業(yè)研究機(jī)構(gòu):行業(yè)報(bào)告、案例研究和論文,能了解行業(yè)現(xiàn)狀和市場格局

3)第三方調(diào)研機(jī)構(gòu)

4)專利機(jī)構(gòu):可檢索競品涉及的專利

5)合作伙伴:從合作伙伴處了解競品

6)應(yīng)用商店的數(shù)據(jù)統(tǒng)計(jì)平臺:查看產(chǎn)品排名、用戶評價、下載量統(tǒng)計(jì)、活躍用戶規(guī)模、版本迭代記錄等

五、3個信息處理步驟

5.1 信息收集

1)編寫

2)爬取

3)問卷、訪談

4)數(shù)據(jù)庫調(diào)取

5)購買

5.2 信息清洗

5.2.1 重復(fù)信息

  • 合并
  • 刪除重復(fù)項(xiàng)

5.2.2 殘缺信息

  • 補(bǔ)全。補(bǔ)全缺失的信息
  • 估算。用樣本統(tǒng)計(jì)的估算值代替缺失信息
  • 推導(dǎo)。用樣本模型計(jì)算出來的值代替缺失信息
  • 忽略。忽略掉與分析目標(biāo)相關(guān)度小的信息
  • 遺留。做缺失記錄,暫時不做處理。

5.2.3 錯誤信息

  • 更正
  • 刪除

5.2.4 不一致信息

  • 相互關(guān)聯(lián)
  • 相互統(tǒng)一

5.3 信息加工

將清洗過的信息加工成我們想要的信息:

  • 提取。從多段信息中提取某個專題需要的信息
  • 計(jì)算。利用已有數(shù)據(jù)按公式計(jì)算出另一數(shù)據(jù)
  • 分組。合理分組,合并同類項(xiàng),排列組合
  • 轉(zhuǎn)化。信息類型間的轉(zhuǎn)化,格式統(tǒng)一

5.4 信息抽樣

個別信息,尤其數(shù)據(jù)類的信息,需要抽樣檢查。

5.5 信息更新

市場變化快,信息須及時更新。

六、6類分析方法

6.1 主觀與客觀

1)主觀:體驗(yàn)、描述、評價

2)客觀:特征羅列、流程呈現(xiàn)、要素列舉、公式計(jì)算

6.2 定性與定量

競合

6.3 理論模型

有一些現(xiàn)成的理論模型是可以直接套用的,列舉如下:

  • PEST
  • STP理論
  • 波特五力模型
  • 波士頓矩陣分析
  • 用戶體驗(yàn)五要素
  • $APPEALS
  • SWOT

6.4 分析方法

6.4.1 對比分析法

最簡單的對比是羅列要素,進(jìn)行Yes/No的打鉤。

  • 同一時空,同樣條件下,不同指標(biāo)的比較
  • 同樣條件,同樣指標(biāo),在不同時空的比較

6.4.2 綜合評價分析(權(quán)重評分法)

  • 專家訪談法
  • 德爾菲法

6.4.3 結(jié)構(gòu)分析法

  • 漏斗分析
  • 杜邦分析

6.4.4 四象限法(矩陣分析法)

一般選擇兩個關(guān)鍵競爭要素,通過四象限來分析競品之間關(guān)鍵指標(biāo)的分布情況。如波士頓矩陣法也屬于四象限法。

6.4.5 歷史跟蹤法

  • 迭代版本的追蹤
  • 運(yùn)營手法的追蹤

七、報(bào)告模板

競合

參考資料:

  1. 海比研究院《2021年中國SaaS市場研究報(bào)告》
  2. 艾瑞咨詢部分行業(yè)報(bào)告、《UCPM產(chǎn)品管理知識體系》
  3. 《ToB運(yùn)營-低成本獲客與續(xù)費(fèi)》
  4. 《產(chǎn)品經(jīng)理裝備書》
  5. 《交互設(shè)計(jì)精髓4》。

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

文章來源:人人都是產(chǎn)品經(jīng)理  作者:七牛

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)者

令很多產(chǎn)品新人非常頭疼的會議就是需求評審,害怕在會上“懟”不過研發(fā),也害怕被“懟”的“體無完膚”。本篇文章里,作者圍繞需求評審會議的五個方面為我們?nèi)轿唤庾x要如何才能不被“懟”,一起來看看吧。

對于產(chǎn)品新人而言,日常最頭疼的會議就是需求評審。

在做產(chǎn)品的這幾年,筆者開過上百場需求評審會,曾經(jīng)被研發(fā)在會上懟哭過一次,也遇到過研發(fā)和產(chǎn)品大吵半小時、最終有一方摔門而出的情況。

但這都是剛開始一段時間的慘案了,那時一想到要一個人面對近10個研發(fā)就戰(zhàn)戰(zhàn)兢兢瑟瑟發(fā)抖。而如今,幾乎每一次的需求評審都變得相當(dāng)順利,時間和結(jié)果都能達(dá)到預(yù)期,甚至都不需要太多額外的準(zhǔn)備。

很多產(chǎn)品新人擔(dān)心自己懟不過研發(fā),但事實(shí)上,「懟」這個詞就把自己和研發(fā)置于了對立面。很多需求評審中的爭吵和爭論在會后看來是沒必要的,大多都源自于信息差和溝通能力的問題。

因此,今天想和大家分享下如何做好需求評審、不再怕被懟。本文將從產(chǎn)品、研發(fā)和團(tuán)隊(duì)等多個角度來談,以下為目錄,希望大家能提前在心里有一個框架:

  • 需求評審的意義到底在哪?
  • 一次標(biāo)準(zhǔn)需求評審的階段和流程
  • 如何很好地進(jìn)行需求評審的會議管理
  • 需求評審會上,前端、后端和測試分別都關(guān)注什么?
  • 3個壓箱底的需求評審技巧!

一、需求評審的意義到底在哪?

直接用一堆正確的話來告訴大家需求評審的意義,可能并不會有太深刻的體會。所以我們不妨另辟蹊徑,一起來試想一下:如果一次迭代沒有任何需求評審、研發(fā)完全按照產(chǎn)品需求文檔進(jìn)行開發(fā),會有什么樣的結(jié)果?

看起來貌似節(jié)約了大量的溝通時間,也避免了團(tuán)隊(duì)內(nèi)的爭論和爭吵,但實(shí)際開工之后呢?

一方面,在開發(fā)過程中,研發(fā)發(fā)現(xiàn)出現(xiàn)了部分需求遺漏、有些看似一句話的需求實(shí)現(xiàn)起來成本反而非常高、有些需求未考慮到數(shù)據(jù)修復(fù)、數(shù)據(jù)查詢量過載的風(fēng)險等,這時候,經(jīng)驗(yàn)豐富一些的研發(fā)會主動找到產(chǎn)品進(jìn)行討論并要求進(jìn)行需求變更,而另外一些研發(fā)新人可能就埋頭照做了,到真正上線后才發(fā)現(xiàn)實(shí)際有一大堆問題,甚至可能造成不可挽回的損失。

另一方面,產(chǎn)品上線之后,銷售和售后部門的同事發(fā)現(xiàn)需求是滿足了,但卻一點(diǎn)都沒法用,這時候,客戶也接二連三的反饋系統(tǒng)怎么越改越難用了,根本沒法解決他們的問題!

這樣看來,省去了需求評審之后,產(chǎn)品經(jīng)理的工作雖然「單純」了很多,但卻很難兼顧全局,也無形中將所有的風(fēng)險和壓力擔(dān)在了自己一個人身上,浪費(fèi)了團(tuán)隊(duì)的智慧和經(jīng)驗(yàn)。

因此,一場好的需求評審能夠幫助我們很好地管理需求方(業(yè)務(wù)/銷售/售后部門)的預(yù)期,同時也能通過一次次評審和糾偏,幫助整個產(chǎn)研團(tuán)隊(duì)就需求場景和優(yōu)先級達(dá)成一致,及早進(jìn)行風(fēng)險評估及查缺補(bǔ)漏,有效提升團(tuán)隊(duì)開發(fā)效率和產(chǎn)品可用性。

那么,接下來我們就來看看一次完整的需求評審是怎樣的?

需求評審的本質(zhì)分為2個維度:其內(nèi)容是用于需求評審,其性質(zhì)則是有組織的連續(xù)性會議。因此我們把需求評審拆解為:需求評審+會,即需求評審流程和會議管理2個方面來講。

二、需求評審流程

不同公司不同業(yè)務(wù)不同客戶的需求評審流程都有所不同,有些只有1次,有些要開3、4次。但是,無論開幾次,其本質(zhì)都是在主要和2類人開會:需求方和研發(fā)。

B端產(chǎn)品經(jīng)理的需求方一般是老板、甲方爸爸、業(yè)務(wù)部門、銷售部門和售后部門等,無論你們公司具體業(yè)務(wù)如何,需求評審的第一步都是要和需求方確定5W1H中的為什么做(why)、什么時候做(when)以及大致做什么(what)。

第二步則是先和研發(fā)部門同步前面討論好的why、when和what,再和大家一起討論具體做什么(what)、誰來做(who)和怎么做(how)。

那么,下面提供一個較為通用的標(biāo)準(zhǔn)評審模板,分為范圍評審、低保真評審和方案評審3次。

1. 范圍評審

  • 評審目標(biāo):明確需求范圍,難點(diǎn)在于明確不做什么
  • 文檔準(zhǔn)備:內(nèi)容需要包含需求場景、需求清單、客戶調(diào)研報(bào)告、競品調(diào)研報(bào)告等
  • 參會人員:產(chǎn)品、需求方(業(yè)務(wù)、銷售、售后、老板等)
  • 評審產(chǎn)出:達(dá)成一致的需求范圍清單

(Axure頁面列表)

(通過用例圖描述需求場景)

2. 低保真評審

  • 評審目標(biāo):初步明確大致的樣式交互及業(yè)務(wù)邏輯方案,難點(diǎn)在于做好需求和成本間的衡量
  • 文檔準(zhǔn)備:低保真稿(包含核心業(yè)務(wù)邏輯說明及核心頁面交互)
  • 參會人員:產(chǎn)品、需求方、研發(fā)(前端、后端)、UI/UE
  • 評審產(chǎn)出:就核心業(yè)務(wù)邏輯及核心頁面交互達(dá)成一致

3. 方案評審(或稱高保真評審)

  • 評審目標(biāo):關(guān)注粒度更細(xì)的方案細(xì)節(jié),難點(diǎn)在于邏輯覆蓋的全面程度
  • 文檔準(zhǔn)備:高保真稿(包含全部業(yè)務(wù)邏輯說明和頁面樣式交互說明),是可以直接開始研發(fā)的終稿
  • 參會人員:產(chǎn)品、研發(fā)(前端、測試)、UI/UE
  • 評審產(chǎn)出:理想狀態(tài)下,就全部業(yè)務(wù)邏輯和頁面交互達(dá)成一致

以上就是較為常見的3次需求評審流程。但是需求評審只是一個里程碑,產(chǎn)品經(jīng)理大部分的時間都花在每兩次會議之間的文檔準(zhǔn)備中,要不是在和需求方掰頭,要不就是在和研發(fā)掰頭。

三、如何很好地進(jìn)行會議管理?

第二部分就來看看需求評審相關(guān)的會議管理內(nèi)容。

大部分人在做產(chǎn)品經(jīng)理之前,極少有會議組織的機(jī)會和經(jīng)驗(yàn),更多都是在被動參會。而一旦入行產(chǎn)品,就需要開始頻繁組織各種各樣的會議,而需求評審就是其中最不可避免的一類會議。

曾經(jīng)有同事分享過羅伯特議事規(guī)則,也有一類專門做會議組織研究的咨詢公司。由此可見,會議組織其實(shí)是一門非常高深的學(xué)問。

羅伯特議事規(guī)則》(Robert’s Rules of Order,RONR)是一本由美國將領(lǐng)亨利·馬丁·羅伯特于1876年出版的手冊,搜集并改編美國國會的議事程序,使之普及于美國民間組織,也是目前美國最廣為使用的議事規(guī)范。

作品內(nèi)容非常詳細(xì),包羅萬象,有專門講主持會議的主席的規(guī)則,有針對會議秘書的規(guī)則,當(dāng)然大量是有關(guān)普通與會者的規(guī)則,有針對不同意見的提出和表達(dá)的規(guī)則,有關(guān)辯論的規(guī)則,還有非常重要的、不同情況下的表決規(guī)則。

但這里不展開來講(筆者自己也沒有掌握那么深),就只和大家分享一些較為基礎(chǔ)的會議管理方法,只要能夠很好地服務(wù)于需求評審和日常工作即可。

從時間角度來看,一場會議可以分為會前、會中和會后3個階段。那么每個階段我們都需要做什么呢?

1. 會前準(zhǔn)備

  • 準(zhǔn)備會議資料:需求評審則需要按照評審內(nèi)容提前準(zhǔn)備好文檔,并根據(jù)實(shí)際情況提醒大家提前閱讀并做好問題整理
  • 創(chuàng)建會議:盡量提前2-3天拉會,給參會人留有充足時間調(diào)整其他日程和準(zhǔn)備本次會議;并在日程中提前告知會議目標(biāo)、會議資料地址等信息

2. 會中把控

需求評審過程中,最主要的3個點(diǎn)就在于節(jié)奏把控、爭論處理和情緒管理。

節(jié)奏把控:

一般而言,產(chǎn)品是會議主持人,那么自然就擔(dān)當(dāng)著會議節(jié)奏把控和主持的角色。當(dāng)角色眾多時,其實(shí)是比較容易出現(xiàn)討論內(nèi)容溢出的問題,大家一聊開就上頭了,結(jié)果導(dǎo)致會議開了足足幾個小時都還沒有產(chǎn)生定論。

所以,需求評審中產(chǎn)品要做的第一件事就是把控整個會議的節(jié)奏,既要及時把聊得起興的大家拉回評審中,還要盡量按照參會人的精力去做好節(jié)奏的規(guī)劃,讓整場會議高效而輕松。

如果你剛剛?cè)腴T,還不知道怎樣能夠很好地把控節(jié)奏,那么可以嘗試提前根據(jù)評審內(nèi)容進(jìn)行時間和會議內(nèi)容規(guī)劃。

例如,前10分鐘同步信息和背景,中間10分鐘講權(quán)限業(yè)務(wù)邏輯模塊,然后預(yù)留5分鐘時間討論,接下來繼續(xù)講權(quán)限配置的頁面交互,再預(yù)留5分鐘時間討論等。全程盡量嚴(yán)格按照自己的議程來,看看實(shí)際情況和自己規(guī)劃是否相符,如果出現(xiàn)不符合,那么問題出在哪里?后續(xù)怎么進(jìn)行改進(jìn)?

多來幾次,你就會有不錯的節(jié)奏把控能力了,甚至于整個會議實(shí)際開完的時間和你預(yù)期的時間相差不了幾分鐘。

爭論處理和情緒管理:

需求評審中出現(xiàn)爭吵的原因常見于以下幾點(diǎn):

  • 表達(dá)或理解不準(zhǔn)確,導(dǎo)致出現(xiàn)了信息差
  • 情緒管理不佳,一上頭就開始對人不對事
  • 會前就需求溝通不足,導(dǎo)致會上出現(xiàn)較大分歧

既然是團(tuán)隊(duì)中很多角色坐一起評審,每個角色的視角和關(guān)注點(diǎn)不同,那么自然會出現(xiàn)很多討論點(diǎn)甚至于爭論點(diǎn)。那么,當(dāng)會上有2個人產(chǎn)生了爭論時(通常是產(chǎn)品經(jīng)理和其他人),怎樣處理才比較妥善呢?

首先最重要的一點(diǎn),做好自己的情緒管理。

在一場需求評審過程中,產(chǎn)品經(jīng)理既是會議主持人,又是參會人。如果你自己都亂了,那么整個會就尬在那里沒人收場了。所以,一個成熟的產(chǎn)品經(jīng)理需要盡量顧全大局、擺正自己的心態(tài),盡量以結(jié)果為導(dǎo)向、對事不對人。

其次,換位思考,嘗試先根據(jù)對方表達(dá)的看法去梳理他的思路,然后用自己的理解復(fù)述一遍,看對方是否認(rèn)可你的理解。接下來,再根據(jù)你的理解去進(jìn)行判斷并闡述自己的觀點(diǎn),看是否能夠得到對方的認(rèn)可。

最后,如果實(shí)在在會上沒法溝通,那就告知大家:自己會先記錄下待討論的問題,會后再進(jìn)行討論,后續(xù)的議程繼續(xù)。「下來再討論」真的是一句解決會上沖突的萬能金句。

3. 會后同步和跟進(jìn)

會議結(jié)束之后,確實(shí)可以長舒一口氣,開始準(zhǔn)備下一階段的工作了,但注意:會后還是需要做好會議紀(jì)要、會議同步和后續(xù)問題的跟進(jìn)。

筆者的需求評審會議紀(jì)要一般分為3部分:待討論、待完善、已確認(rèn)。

  • 待討論:指會上的遺留問題
  • 待完善:指會上確認(rèn)要改的問題,后續(xù)自己要完善在文檔中
  • 已確認(rèn):指會上討論得出要做/不做的結(jié)論的點(diǎn)

整理好會議紀(jì)要后,及時將內(nèi)容同步好發(fā)給參會同事,如果后續(xù)還有待討論的問題,則與相關(guān)人員定一個討論的待辦,避免大家忘記。

這里其實(shí)想分享一個筆者和UI小姐姐之間蠻有意思的小故事。

低保真評審時,我們還會順路確認(rèn)好UI出圖的范圍。因?yàn)榇蠖鄶?shù)都是產(chǎn)品帶電腦投屏,所以自己會順手記錄下UI出圖的范圍并發(fā)給UI小姐姐。本意是為了更好地把控會議后續(xù)質(zhì)量,沒想到這個順手的行為得到了UI小姐姐的肯定。

從這個小故事中,筆者發(fā)現(xiàn),如果日常能夠在需求評審中的灰色地帶稍微多做一些、多為對方思考一些,那么,整個團(tuán)隊(duì)互相之間的信任和協(xié)作會越來越nice~

四、評審時,前后端/測試都關(guān)注什么?

前面和大家分享了完整的需求評審流程,現(xiàn)在就來帶大家換個思路,看看前端、后端、測試在一次需求評審中都關(guān)注什么?

以下素材來源于筆者和研發(fā)同事們的親身采訪

后端:

  • 關(guān)注方案可行性的評估,重點(diǎn)在需求邏輯可行性、技術(shù)難度、工作量和改動成本上;
  • 關(guān)注需求邏輯的覆蓋度,幫助產(chǎn)品經(jīng)理做好邏輯的查漏補(bǔ)缺
  • 關(guān)注研發(fā)過程中的實(shí)現(xiàn)風(fēng)險

前端:

  • 關(guān)注需求場景及業(yè)務(wù)合理性
  • 關(guān)注頁面樣式交互,為產(chǎn)品經(jīng)理提出一些更合理的樣式交互建議
  • 關(guān)注技術(shù)方案和成本評估,尤其關(guān)注新頁面中交互與已有統(tǒng)一標(biāo)準(zhǔn)組件的評估

測試:

  • 關(guān)注需求的邏輯性及合理性
  • 關(guān)注需求描述的準(zhǔn)確程度、是否排除二義性等(認(rèn)為好的需求文檔應(yīng)該是一把標(biāo)準(zhǔn)的尺子)
  • 關(guān)注整個迭代的質(zhì)量風(fēng)險及進(jìn)度,保證交付的穩(wěn)定性

從上面的回答中能夠很明顯的看出不同角色看待需求的視角。當(dāng)我們要將需求講給不同的人聽時,就要提前站在他們的視角和關(guān)注點(diǎn)去思考問題,獲得更多溝通的前提信息,從而更順暢地進(jìn)行溝通。

五、3個壓箱底的需求評審技巧!

從被懟到在現(xiàn)場止不住的哭,再到現(xiàn)在可以輕輕松松開玩笑回懟研發(fā),筆者踩了很多坑、也積累了一些經(jīng)驗(yàn)。所以,最后就和大家分享3個壓箱底的需求評審技巧!

1. 先零售溝通,再批發(fā)溝通

此處標(biāo)題來自邱岳《產(chǎn)品訓(xùn)練營》中的內(nèi)容,指我們在做需求評審的時候,不能把各式各樣的問題全部都堆到1-2h的需求評審會上來解決,而是應(yīng)當(dāng)先和相關(guān)人私下進(jìn)行討論(零售溝通),取得共識后再和相關(guān)角色統(tǒng)一進(jìn)行討論(批發(fā)溝通)。

因?yàn)?,一場需求評審中往往會出現(xiàn)來自不同部門的不同崗位和角色,每個人的關(guān)注點(diǎn)都有所不同。如果,所有問題都在會上一并討論,那么不僅容易范圍溢出、干擾討論,也容易耽誤他人時間、讓聽眾失去了耐心。

例如,本次迭代中課次和班級的關(guān)系到底應(yīng)該如何設(shè)計(jì)?班級和課次是1對n還是n對n的關(guān)系?這明顯是與后端直接相關(guān)的問題,那么,在需求評審前,這類問題就需要提前與后端同學(xué)溝通確認(rèn)好,會上只討論大家公共關(guān)注和需要共同確認(rèn)的問題。

這樣一來,整個會議中大部分時間都在做同步,小部分時間在討論一些公共問題及小問題,整個會議的效率會得到極大的提升。

2. 識別并搞定關(guān)鍵人

項(xiàng)目管理中有一類管理叫做「干系人管理」,指的是我們需要識別項(xiàng)目中的干系人stakeholders,并對他們進(jìn)行一定的管理。

而我們則可以把需求評審當(dāng)作一次小型的項(xiàng)目,項(xiàng)目如果要順利推進(jìn),就需要對其中的干系人做好管理。而干系人中,又可以根據(jù)話語權(quán)及意見影響程度分為關(guān)鍵人和追隨者,用一句互聯(lián)網(wǎng)黑話來形容就是找到關(guān)系人中的「抓手」人物。

因?yàn)椋枨笤u審中不僅角色眾多,人員也很復(fù)雜,很難兼顧和滿足每一個人的想法。因此,在大方向上,我們就需要提前去搞定關(guān)鍵人,因?yàn)樗麄儞碛懈嗟囊曇昂妥鰶Q策的信息,某種程度上,也是意見領(lǐng)袖。

如果你的想法和大部分人都不一致,那可以先嘗試和關(guān)鍵人進(jìn)行溝通。在取得關(guān)鍵人認(rèn)可后,再去推進(jìn)那些想法搖擺不定或者沒有太多主觀想法的人,整個過程相對就會順利一些。

3. 適當(dāng)放權(quán),避免太過獨(dú)斷

不知道大家有沒有做過DISC性格測試,筆者身邊大多數(shù)產(chǎn)品經(jīng)理都是D型居多,即支配型/控制者Dominance。

D型行為風(fēng)格的關(guān)鍵詞是:積極進(jìn)取、爭強(qiáng)好勝、強(qiáng)勢、愛追根究底、直截了當(dāng)、主動的開拓者、堅(jiān)持意見、自信和直率。

但是這類人也往往具有以下這些缺點(diǎn):

不知道你有沒有躺槍,D型人格的產(chǎn)品經(jīng)理在需求評審中一些問題的討論上難免會有些過于強(qiáng)勢。當(dāng)然,大家都知道天才產(chǎn)品經(jīng)理喬布斯就是一個極度強(qiáng)勢和獨(dú)斷專行的人,但我們大部分人都難以達(dá)到那樣的高度,如果真的像喬幫主那樣處事,可能最后就只能被迫做一個全棧產(chǎn)品了吧。

因此,在需求評審中我們需要對自己的決策做出一些取舍。大方向上一定要堅(jiān)持自己的想法和意見,而一些優(yōu)先級低的需求和細(xì)節(jié)可以適當(dāng)放權(quán),給予團(tuán)隊(duì)一些發(fā)揮空間,這也算能夠堅(jiān)持自我想法的一種迂回之策吧。

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

文章來源:人人都是產(chǎn)品經(jīng)理  作者:冰冰醬

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ù)


常見科技風(fēng)格分類

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

老板:給我來一套科技風(fēng),要炫酷,要眼前一亮的感覺

    你:好嘞~(叮叮當(dāng)當(dāng)咚咚當(dāng)當(dāng))

    老板:哎呀,我要的不是這種太花了,不夠高端

    你:給您改(叮叮當(dāng)當(dāng)咚咚當(dāng)當(dāng))

    老板:哎呀,也不是這種太素了

    你:行,改....(我刀呢)


    沒做過科技風(fēng)格的新人缺乏對常見科技風(fēng)格的了解,很容易根據(jù)甲方模糊的描述及要求,主觀性的設(shè)計(jì),還會在甲方要改的情況下十分委屈,我做的就是你描述的炫酷科技風(fēng)啊??萍硷L(fēng)格大類本身特征就是炫酷,眼前一亮的感覺,甲方?jīng)]有了解只能粗略的表述。設(shè)計(jì)師主動了解市面常見的科技風(fēng)格細(xì)分及其使用場景。就能夠問出甲方爸爸更細(xì)化的需求,更客觀的根據(jù)使用場景選擇恰當(dāng)?shù)募?xì)分科技風(fēng),減少不斷重改的成本。


FUI:

    FUI 就是 Fictional User Interfaces (Fictional GUI),就是 Fantasy User Interfaces,就是 Fake User Interfaces,就是 Futuristic User Interfaces,這些用戶界面它們是科幻的,是未來派的,是奇幻的,是虛假的.觀賞性大于實(shí)用性。

    并不是所有風(fēng)格的FUI都適合應(yīng)用于現(xiàn)實(shí)中,比如——半透明介質(zhì)且信息復(fù)雜的的UI,只適合出現(xiàn)在影視作品里面(和一些視頻游戲當(dāng)中)。它們的表現(xiàn)性強(qiáng),看起來復(fù)雜精密,但對于信息展示功能很弱。其存在的目的是更好的配合場景,不會遮擋演員的臉部。想想看主角對復(fù)雜的數(shù)據(jù)一頓操作猛如虎,讓觀眾眼花繚亂,對主角更加崇拜。


1.商務(wù)科技風(fēng):

     精致、高端、輕質(zhì)感;簡約干凈、形體線條精細(xì);功能感強(qiáng)

     應(yīng)用:

    車載UI;金融UI;各種科技工具類產(chǎn)品的登錄注冊或官網(wǎng)Banner;商務(wù)海報(bào)等

    特征:

    1.商務(wù)科技配色較為嚴(yán)肅,低調(diào)。背景以深藍(lán)色,深灰色背景居多。

    2.元素的形狀并不復(fù)雜、外輪廓整體規(guī)則,周圍的細(xì)碎裝飾較少。

    3.強(qiáng)調(diào)品質(zhì)感,會模擬一些較為細(xì)膩玻璃、金屬或啞光的微質(zhì)感。對于光的使用較為克制,較少大范圍的使用輝光,多在邊緣使用較細(xì)的流光,看起來更加的犀利精致。

(偏商務(wù)科技風(fēng)格例子-圖片來源于網(wǎng)絡(luò))

2.扁平科技風(fēng):

    整體風(fēng)格偏向機(jī)械、直觀,其扁平特征是元素扁平純色塊或漸變,弱化圖表空間感及體積感。多組扁平的數(shù)據(jù)可    視化圖表,在空間層次的表現(xiàn)上更多是在同一平面上。

    非常適合多數(shù)據(jù)后臺數(shù)據(jù)展示,強(qiáng)調(diào)信息數(shù)據(jù)的清晰展示,較多使用純色面元素作為底板,減少了環(huán)境的背景外擾因素。且數(shù)據(jù)分組展示,功能分區(qū)明顯。

    設(shè)計(jì)成本及實(shí)現(xiàn)成本較低,為目前大多數(shù)數(shù)據(jù)可視化大屏展示所選擇。


(偏扁平科技風(fēng)格例-圖片來源于網(wǎng)絡(luò))

3.HUD(儀表盤)科技風(fēng):

    視覺多使用單色,點(diǎn)線元素??梢耘c現(xiàn)實(shí)背景結(jié)合度高。

    應(yīng)用:

    電影(漫威系列FUI)、游戲、企業(yè)產(chǎn)品宣傳視頻、AR等展示型為主

    特征:

    1.顏色使用上單色居多,尤其多亮色白,亮色藍(lán),同色相多透明梯度變化。無質(zhì)感或毛玻璃質(zhì)感。

    2.簡潔而不簡單,層次豐富,典型風(fēng)格HUD。空間層次感豐富,使用半透的結(jié)構(gòu)線3D模型或晶格模型,顯得輕        巧而精致,用戶能夠透過信息層看到場景層,

    3.極簡科技風(fēng)需要設(shè)計(jì)師把控好細(xì)碎元素的體量和數(shù)量,對信息不會進(jìn)行過多的視覺干擾。

    ps:

   極簡科技風(fēng)數(shù)據(jù)的展示容量大于扁平科技風(fēng),看起來很復(fù)雜高端但通常實(shí)用性差。如果使用過多的數(shù)據(jù),則顯示    相似類型的圖表展示相似的數(shù)據(jù)集在視覺上可能會缺乏新鮮感,但更易于理解和理解。具有不同的圖表在視覺上是令人興奮的,但用戶需要花費(fèi)更多時間閱讀。


(偏極簡科技風(fēng)格例-圖片來源于網(wǎng)絡(luò))

4.賽博炫酷科技風(fēng):

    賽博朋克又稱數(shù)字朋克、網(wǎng)絡(luò)朋克。

    應(yīng)用:游戲、H5、運(yùn)營banner配圖等需要強(qiáng)視覺氛圍的運(yùn)營。代表電影如:攻殼機(jī)動隊(duì)、頭號玩家、銀翼殺手等

    特征:

    1.張揚(yáng)奇幻的娛樂感,技能風(fēng)、故障風(fēng)、視覺沖擊強(qiáng)烈。常見元素:全息投影、義體、立體城市、高達(dá)機(jī)械元素  等。

    2.人造光是賽博朋克在視覺上最大的特征,背景暗色,常用熒光黃、紫、藍(lán)、粉 、綠燈內(nèi)外發(fā)光,模擬霓虹燈管自發(fā)光效果,重點(diǎn)元素高亮輝光。

    3.色彩冷暖撞色對比強(qiáng)烈,如:紅藍(lán)對比青紫對比黃橙對比等。

    4.數(shù)碼屏幕與全息投影是霓虹燈的一種延伸,既能體現(xiàn)未來世界的高科技的感,也能體現(xiàn)出人造和虛擬的概念。部分元素前后疊影色彩錯位,有頻次的閃動,模擬電子科技的偶發(fā)故障。機(jī)械化IP形象和字體設(shè)計(jì)常見金屬感和拼接感。

(偏賽博科技風(fēng)格例-圖片來源于網(wǎng)絡(luò))

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

文章來源:站酷  作者:唐小蔥

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)心理學(xué):用戶心理定律及優(yōu)秀案例分析

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

將普遍存在的人性用戶心理規(guī)律運(yùn)用于設(shè)計(jì),增加設(shè)計(jì)的溫度。

近來對用戶心理比較感興趣,去看相關(guān)設(shè)計(jì)資料的時候發(fā)現(xiàn)相關(guān)內(nèi)容重復(fù)性較高,多方搜集資料結(jié)合自己的一些分析總結(jié)出一篇補(bǔ)充。

定律是鑰匙,在遇到讓我們上癮,持續(xù)付出或獲得情感的APP,多去想一想它背后洞察了哪些人性及心理,能不能為我們的后續(xù)的設(shè)計(jì)吸收。










undefined

undefined

undefined

undefined

undefined

最后想說,設(shè)計(jì)師的價值不僅僅在視覺,好的設(shè)計(jì)必是好用好看好懂用戶的??珙I(lǐng)域?qū)W習(xí)補(bǔ)充自己的視野,多思多想,掌握鑰匙,開啟用戶不同的心門。

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

文章來源:站酷  作者:唐小蔥

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ì)中排行榜設(shè)計(jì)詳解

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

“今天吃什么???”

“不知道啊,看看大眾點(diǎn)評,哪家店比較靠前”

“一會去看什么電影?”

“我看豆瓣上,這部片子評分特別高,我們?nèi)タ催@個吧”

當(dāng)我們每天面對類似“吃什么”“買哪個品牌”“周末去哪玩”等等需要抉擇的問題時,會發(fā)現(xiàn)當(dāng)你面對的選擇越多時卻越不知道該如何做決定,或者當(dāng)下做了決定后會一直思考做的這個決定是不是最好的,這恰恰是當(dāng)代絕大部分用戶在實(shí)際生活中面臨的問題-選擇困難。面對用戶的選擇需求各大平臺都有自己的方式,幫助用戶做決定的同時,引導(dǎo)用戶購買目標(biāo)產(chǎn)品,極大的降低了用戶的選擇成本,其中排行榜就是平臺的常用套路。用戶的選擇成本是什么?排行榜為什么能夠幫助用戶降低選擇成本?如果排行榜僅僅是用來降低用戶的選擇成本,為什么所有商家都對排行榜趨之若鶩?下面帶你了解為什么人人都愛排行榜,及我們生活無處不在的“顯性”“非顯性”排行榜。你可能不知道是我們的生活正在被各種排行榜所支配


排行榜的本質(zhì)是一個沒有感情的信息篩選機(jī)制,將所有相關(guān)的同類事物之間通過比較,從而反映出同類事物的客觀實(shí)力。排行榜建立的基礎(chǔ)在于用戶對信息篩選平臺權(quán)威性的認(rèn)可,比如我們買衣服會首選淘寶,電子類產(chǎn)品會首選京東,看電影會看豆瓣評分,這些都是對平臺某一領(lǐng)域權(quán)威性的認(rèn)可。用戶信任平臺權(quán)威性對信息的篩選,由于錨定效應(yīng)使得用戶降低自己的選擇成本,可以準(zhǔn)確快速的做出選擇。同時由于用戶的從眾心理或者羊群效應(yīng),也會對上榜主體產(chǎn)生強(qiáng)烈的品牌認(rèn)可,為上榜主體帶來更多的利益、強(qiáng)烈的榮譽(yù)感、甚至流量以及平臺背書標(biāo)簽,比如:B站的百大up主,各個平臺排行榜的銷量冠軍、朝陽地區(qū)必吃榜第一名,那么這一切背后的原理是什么?


一個完整的排行榜是由平臺、上榜主體、用戶三大組成部分,俗話說屁股決定腦袋,不同的定位決定了排行對三大組成部分不同的作用,當(dāng)然背后的原理也不盡相同。


1.選擇類排行榜-降低用戶選擇成本

在沒有各種應(yīng)用前,當(dāng)我們決定購買什么東西或去哪家消費(fèi)時,前期需要花費(fèi)大量的人力、物力去搜集相關(guān)的信息進(jìn)行整理集合,對比集合信息后才能做出決定,也就是說用戶需要經(jīng)過信息的搜集-備選集的建立-擇優(yōu)決策3個過程才能等到最終的結(jié)果。在建立備選集后,做出擇優(yōu)決策階段發(fā)生的成本或費(fèi)用都是用戶付出的選擇成本(前兩個階段發(fā)生的成本是交易費(fèi)用,而不是選擇成本)。在備選集的建立過程中,包含的選擇越多,用戶選擇的難度就越大,選擇成本就會越高。

選擇性排行榜在備選集建立完成后,利用沉錨效應(yīng)在用戶心理建立潛意識的目標(biāo)參照,幫助用戶完成擇優(yōu)決策,降低用戶的選擇成本。(另一方面平臺在幫助用戶降低選擇成本的同時,也影響著用戶的最終選擇,在接下來的平臺側(cè)方面會有詳細(xì)的分析)。

比如說:當(dāng)我需要買個耳機(jī)時,如果在沒有各大應(yīng)用的前提下,我需要通過找到我身邊的耳機(jī)發(fā)燒友或數(shù)碼電子方面方面的內(nèi)行人對耳機(jī)進(jìn)行了解,收集信息建立備選集,但由于京東在電子設(shè)備購物方面的權(quán)威性,我會優(yōu)先查看京東的耳機(jī)類排行榜,也就是說京東幫助我完成了前期對于信息的搜集及備選集的建立,而用戶出于對平臺權(quán)威性的信任,根據(jù)平臺給出的維度參照、品牌參照、價格、標(biāo)簽參照等信息,最終快速的完成自己的選擇。整個過程就是用戶在對錨的尋找,以及用戶對信息確定性的尋找過程。

2.信息類排行榜-滿足社交需求

在馬斯洛需求中,當(dāng)個人的生理需求和安全需求被滿足時,與他人建立情感聯(lián)系或關(guān)系成為人們最強(qiáng)烈的需求,即社交需求。社交又分為:為達(dá)到某種目的產(chǎn)生的功利社交或?yàn)楂@得情感連接及體驗(yàn)的共情社交需求。例如:QQ音樂新增的撲通社區(qū)、微博的明星超話打榜等功能模塊的火熱正是滿足了擁有共同興趣愛好的用戶對于共情社交的需求。

無論是“功利社交”還是“共情社交”首先需要的是溝通,溝通的本質(zhì)則是信息的流通,但當(dāng)雙方都沒有可以溝通的信息時則社交不成立,而類似:微博熱搜、今日頭條、澎湃新聞等信息類排行榜,則給有社交需求的用戶提供了可以展開話題相通的談資

選擇類排行榜中,提到的從眾心理(又稱羊群效應(yīng)),是指人類由于對信息壓力規(guī)范壓力,會希望融入到群體中尋求安全感的特性,即便此類信息與自己無關(guān)。大部分人由于對未獲得及時信息的焦慮感,會熱衷于瀏覽此類排行榜來獲取實(shí)時信息,融入群體生活。每天早上,在通勤的路上用戶利用碎片時間刷微博、瀏覽知乎或今日頭條等應(yīng)用了解最近發(fā)生了什么社會事件,在上班電梯或工作間隙討論各自掌握的信息,及對事件的見解,甚至在與他人有相同的見解或之后,會對對方產(chǎn)生莫名的親近感等等,這些都是在滿足大眾自己的社交需求。

3.分享類排行榜-自我確認(rèn)需求

過年期間各家app紛紛都推出了自己的用戶年度報(bào)告總結(jié)榜,不知道你有沒有參與到其中,并把這些報(bào)告的截圖分享到自己的朋友圈!在我們的日常生活中也會在朋友圈、B站等看到各種測試自己隱藏能力或性格的小程序,人們對于這類活動的空前熱情其實(shí)是因?yàn)槿祟惓诵枰畔⒌拇_認(rèn)外,還需要清楚自身在大數(shù)據(jù)下的自我確認(rèn),通過各種各樣自我測試類榜單,判斷自身的能力、情緒、價值等等,來達(dá)到自我認(rèn)同,否則就會感到焦慮不安。

加拿大社會學(xué)家歐文·戈夫曼在《日常生活中的自我呈現(xiàn)》中提出他對社會生活的理解是“社會是舞臺,人人皆演員”。 在社會這個舞臺我們需要對外有印象管理的過程,我們想要呈現(xiàn)給觀眾怎樣的形象,需要我們對自身及身邊人有所思考和了解。所以在社會生活中我們呈現(xiàn)的是自己思考管理下被他人和社會接受的自己,為了維持自身的平衡防止崩潰,人類會自發(fā)“忠誠、紀(jì)律、謹(jǐn)慎”的維護(hù)自己的外在形象。而互聯(lián)網(wǎng)平臺大數(shù)據(jù)則折射出“隱形”的自己,讓用戶更加清楚的認(rèn)知自己,同時通過分享,滿足自我確認(rèn)以及他人確認(rèn)的需求。

我目前只總結(jié)出這三種類型的排行榜,如果有小伙伴想到其他類型歡迎在評論區(qū)提出,大家一起參與討論。

無論哪種排行榜,用戶信任的基礎(chǔ)都來自對平臺的信任,那么用戶為什么信任平臺?排行榜對平臺意味著什么?背后原理是什么?下面我們來討論排行中平臺的影響及背后的原因。


對于用戶來說排行榜是為了滿足用戶對于數(shù)據(jù)參數(shù)、社交信息、自我個人的確定性,選擇成本是品牌經(jīng)濟(jì)學(xué)的核心,而用戶對于排行的信任首先要建立在平臺品牌的權(quán)威性下的結(jié)果。

1.平臺權(quán)威性—用戶側(cè)

從我們記事起,我們對世界的認(rèn)識來自我們的父母或老師,而這些教導(dǎo)我們什么是對、什么是錯的長輩或老師,對當(dāng)時剛來到這個世界的我們來說就是權(quán)威的化身。長大后我們對于權(quán)威的認(rèn)可則更傾向于某一領(lǐng)域的專家,比如:醫(yī)生、律師、教授等,認(rèn)為處于權(quán)威地位的人在某一領(lǐng)域相對普通用戶的判斷更可靠,可以幫助普通用戶節(jié)省研究這一領(lǐng)域問題的工作,做出更輕松的決定,雖然不一定是正確的

搜索我們會第一時間想到百度,需要觀看影視、書籍會想到豆瓣,想聽音樂會打開網(wǎng)易云音樂、QQ音樂等等。各大應(yīng)用經(jīng)過長時間的廝殺各自在用戶心中建立了某一領(lǐng)域的權(quán)威性,形成品牌號召力,推動著用戶做出需求決策。另一方面排行榜中也會說明數(shù)據(jù)來源,比如京東會在排行榜頁面有明確的榜單說明,豆瓣根據(jù)平臺數(shù)據(jù)更新,汽車之家依靠外部的權(quán)威數(shù)據(jù)等等方式力證自己榜單的公正、透明,減少用戶做出決定中的思考、猜測,獲得用戶的信任,增強(qiáng)平臺的權(quán)威性。那對于平臺來說權(quán)威性的建立意味著什么?

2.平臺權(quán)威性—平臺側(cè)

  • 影響用戶的決策方向

平臺權(quán)威性對用戶來說意味著說服力和影響力,在減輕用戶的決策壓力的同時,也影響著用戶做出平臺所需的決策方向;

  • 平臺自帶話題性

平臺本身的權(quán)威性也會為平臺承載的內(nèi)容帶來討論的話題度,加大平臺承載內(nèi)容的傳播范圍。比如,每年蘋果發(fā)布會都會帶來范圍極大的熱度討論,而app store內(nèi)的熱門推薦自帶話題度和討論熱度

  • 輸出口優(yōu)化

排行榜作為內(nèi)容輸出口,在平臺權(quán)威性的背書下,產(chǎn)品優(yōu)化自身的價值,而平臺也可以通過排行榜優(yōu)化自身平臺價值。

  • 平臺盈利

平臺權(quán)威性下,可以通過多種方式達(dá)到盈利,比如蘋果app store應(yīng)用商店內(nèi)的付費(fèi)應(yīng)用,百度的鳳巢系統(tǒng)、微博熱搜的第3、4位排名等。

3.平臺權(quán)威性—廣告告知

在平臺完成建立權(quán)威性后,部分平臺開始利用排行榜進(jìn)行商業(yè)變現(xiàn),比如百度、58的競價排名等,現(xiàn)在大部分應(yīng)用會使用明顯的方式告知用戶,防止平臺建立品牌權(quán)威性。比如微博熱搜第3、4位廣告位的“薦”,淘寶、小紅書推薦猜你喜歡的“廣告”。


上榜主體作為整個排行榜的內(nèi)容中心,由于排行榜自帶的競爭機(jī)制、篩選機(jī)制,使得上榜用戶會很樂于分享出去,比如游戲類應(yīng)用王者榮耀的勝利者排位、微信運(yùn)動排行榜。

由于馬太效應(yīng)上榜主體中的頭部用戶會獲得平臺更多的曝光量、絕大部分用戶的關(guān)注度,以及各種潛在資源,比如:流量、資源、人脈、某一領(lǐng)域影響力、平臺背書等等,這些都是潛在的社交貨幣。這種激勵機(jī)制極大的滿足了上榜主體的榮譽(yù)感、及平臺歸宿感,比如bilibili不同粉絲量級會送出相對應(yīng)的粉絲牌。

而平臺方也利用上榜主體挖掘潛在的用戶,為平臺帶來更多的新用戶,加強(qiáng)平臺權(quán)威性,形成平臺和上榜主體的良性循環(huán)。甚至與出現(xiàn)上榜主體自己的流量超過平臺自身流量,帶走平臺用戶的情況。比如去年和熱鬧的“巫師財(cái)經(jīng)推出b站,簽約西瓜視頻”,各大平臺也時不時會出現(xiàn)搶占流量up主的情況。

排行榜資源的建立

排行榜設(shè)計(jì)要達(dá)到用戶攀比的效果,很重要的充分條件就是相同需求好友基數(shù)足夠大,這樣才能構(gòu)成排行榜設(shè)計(jì)成功的必要條件。

  • 同系同門資源導(dǎo)流

對于已有成功產(chǎn)品的公司,可以借助平臺相互間的導(dǎo)流完成初試資源的搭建,比如:微信初期借助QQ好友流量,帶來好友初期的爆發(fā);抖音最初的活躍借助今日頭條的流量輸入。

  • 自建用戶體系

不斷推送已關(guān)注好友的信息流,當(dāng)通訊錄好友開始使用頭條都要發(fā)送系統(tǒng)推送。比如全年年低火爆全網(wǎng)的cloubhouse就是利用的熟人社交,你要先有這個人聯(lián)系方式才能要求好友,關(guān)注的人越多才能解鎖更多的聊天室。通訊錄、地理位置、興趣偏好等等,不斷社區(qū)建設(shè)推送動態(tài)信息流和好友卡片推薦。

  • 偽造

當(dāng)應(yīng)用建立初期,沒有很多的資源和內(nèi)容時,需要平臺自行填充內(nèi)容,使得排行榜信息量大,增加用戶活躍,才能挖掘用戶的需求和個性化。不如一些小編推薦、猜你喜歡等等,或是平臺pgc發(fā)布推送的內(nèi)容。


面對不同的用戶人群及使用場景排行榜的入口表現(xiàn)形式也會千變?nèi)f化,根據(jù)表現(xiàn)形式大體可分為“顯性排行榜”和“隱形排行榜”。

在界面有明顯的榜單名稱、排序、評判規(guī)則、上榜主體、賣點(diǎn)信息等。排序和內(nèi)容主體是這個排行榜的基本構(gòu)成,其他則根據(jù)不同產(chǎn)品類型及產(chǎn)品需求決定是否展示。

1.頁面tab

在首頁底部或頂部tab形式出現(xiàn),多出現(xiàn)在以UGC或文字信息為核心的產(chǎn)品,以內(nèi)容信息為主,常見以信息熱度為主要功能的資訊、新聞類應(yīng)用。比如:知乎、今日頭條、36氪。

知乎熱榜內(nèi)容完全展開;36氪分為話題榜、人氣榜,話題榜僅展示前5條,人氣榜展示10條,僅在前5條有名次圖標(biāo),在36氪熱榜的中部還會出現(xiàn)收藏榜,綜合榜。

而今日頭條僅在整個頁面的1/3處展示部分“頭條熱榜”,點(diǎn)擊“查看更多”后,展開“頭條熱榜”及“今日關(guān)注”“北京熱榜”,整個交互形式類似微博熱搜。

2.圖標(biāo)入口

首頁功能入口處明顯排行榜圖標(biāo),優(yōu)先級較高,常見自帶推薦屬性,能夠幫助用戶快速選擇,減少選擇成本,比較依賴榜單的應(yīng)用。比如:豆瓣、音樂類、騰訊動漫等應(yīng)用。

其中豆瓣、網(wǎng)易云音樂由于各種類型的排行榜很多,在圖標(biāo)點(diǎn)擊開后,在當(dāng)前頁面平鋪不同維度榜單類型,用戶進(jìn)行點(diǎn)擊跳轉(zhuǎn);騰訊動漫相對榜單類型較少,在左邊側(cè)邊欄切換不同的榜單。

3.商品詳情頁榜單入口

用戶查看商品詳情時,可能會希望能夠橫向?qū)Ρ韧惿唐?,才能最終決定購買那件商品。常見于電商類應(yīng)用,比如:京東、拼多多、得物等。點(diǎn)擊后進(jìn)入不同的榜單頁面,獲取更多產(chǎn)品信息進(jìn)行篩選。(淘寶的商品詳情頁沒有排行榜,但在首頁卻存在隱形排行榜,在隱形排行榜模塊會有詳細(xì)說明)。

4.搜索-篩選(無明確搜索目的)

當(dāng)用戶沒有明確搜索目的時,搜索框的下方,平臺會推薦沒有明確指向性但有熱度的產(chǎn)品信息。衡量的標(biāo)準(zhǔn)一般為搜索熱度或信息本身的熱度。利用榜單效應(yīng)留住用戶,比如:微博熱搜、淘寶熱賣、抖音熱榜等。


沒有明顯排名及規(guī)則,但經(jīng)過大數(shù)據(jù)、平臺或榜單制作者篩選后呈現(xiàn)在平臺用戶的面前,位置越靠前,在用戶心目中的默認(rèn)位置越靠前,比如淘寶的“有好貨”、編輯精選等。

1.編輯推薦/小編推薦

在平臺建立初期沒有特別的內(nèi)容供平臺呈現(xiàn),這時候就需要平臺人工有目的的推薦一些內(nèi)容,不同于“猜你喜歡”建立在用戶的行為數(shù)據(jù)下,編輯推薦更多的平臺希望用戶看到的內(nèi)容,一方面作為平臺內(nèi)容的輸出口引導(dǎo)用戶,另一方面內(nèi)容是平臺自己發(fā)布內(nèi)容,也可以保證內(nèi)容的高質(zhì)量。

2.猜你喜歡/相關(guān)推薦

平臺根據(jù)用戶之前的瀏覽量、收藏量、轉(zhuǎn)發(fā)、搜索等用戶行為數(shù)據(jù)推薦給用戶相關(guān)內(nèi)容。這個時候的應(yīng)用基本已度過最初的獲客期,并且存在大量的平臺用戶使用數(shù)據(jù),“猜你喜歡或相關(guān)推薦”模塊用來增加用戶的瀏覽時長及購買的可能性,各大應(yīng)用平臺適用性強(qiáng),一般出現(xiàn)在首頁部分。

3.年度總結(jié)排行榜

朋友圈每年年底都會曬出的各種各樣的生活、音樂、消費(fèi)的排行榜,這些其實(shí)是用戶自己確定了解自己,且喜歡他人了解自己的一種方式。用戶通過網(wǎng)絡(luò)數(shù)據(jù)折射出自我的輪廓,清楚的認(rèn)識自己。

4.TOP排行榜

不知道大家小時候看沒看過《第10放映室》,那是我最早關(guān)于排行榜的印象,里面會有各種最佳動作片總結(jié)、最佳男配角總結(jié)等等,以香港電影偏多,是我早年的電影信息資料庫。現(xiàn)在我們也會在小紅書、抖音、公眾號平臺刷到各種各樣的top推薦,這其實(shí)也是排行榜的一種。TOP類是已經(jīng)經(jīng)過人為篩選的排行榜,從眾多選擇中選擇出部分答案,給出理由,而用戶只需在已被篩選過的內(nèi)容中進(jìn)行決定,節(jié)省選擇成本,比如豆瓣每年都會舉行的豆瓣電影。另外一種TOP榜并不能幫助用戶做決定,但可以迎合用戶對確定性需求的各種盤點(diǎn)性質(zhì)的排行榜,比如抖音的TOP榜哥就是盤點(diǎn)各種內(nèi)容,人物。

5.搜索-篩選(有明確搜索目的)

相比其他排行榜,篩選后的內(nèi)容已經(jīng)體現(xiàn)了用戶的具體需求,高效明確的給用戶提供選項(xiàng),引導(dǎo)用戶快速選擇。


排行榜一般由必需的榜單頭部、上榜主體,及非必需的榜單規(guī)則、更新信息構(gòu)成;而上榜主體由必需的主體信息、排序,以及非必需的推薦理由、排名變化、熱度信息構(gòu)成。

好的榜單能夠快速吸引用戶快速找到自己的需求點(diǎn),引導(dǎo)用戶點(diǎn)擊排行榜進(jìn)行查看。而榜單頭部也由于功能需求的不同分為唯一性榜單頭部、可復(fù)用性榜單頭部。

1.唯一性榜單頭部

當(dāng)排行榜在整個應(yīng)用中有且只有一個時,通常會對榜單頭部的背景及榜單名稱進(jìn)行個性化、品牌化設(shè)計(jì)。比如微博的微博熱搜、知乎的鹽選榜單、今日頭條的頭條熱榜、大眾點(diǎn)評的大眾點(diǎn)評榜單等。其中微博、頭條、大眾點(diǎn)評都在名稱上有做品牌漏出,增加平臺的品牌權(quán)威性。

2.可復(fù)用性榜單頭部

有些應(yīng)用平臺會存在內(nèi)容需要多種不同緯度的排行榜展示的情況,為了平臺的統(tǒng)一性、降低后期的維護(hù)成本,一般會使用可復(fù)用的榜單頭部,如豆瓣、京東、QQ音樂等。

得物通過替換左右切換商品進(jìn)行宣傳。豆瓣、微博、馬蜂窩雖然都是通過替換圖片及文案的形式達(dá)到適配,但根據(jù)場景又有不同。豆瓣、微博因榜單效應(yīng)根據(jù)榜單第一位的變化更換底圖及文案;馬蜂窩沿用自己品牌的蜂窩形狀及“馬蜂窩榜單”的標(biāo)簽設(shè)計(jì)形式,通過更換文案底圖達(dá)到適用不同主題;京東就相對比較簡單,只是更換標(biāo)題的文案達(dá)到多主題適配。


排行榜上榜主體由于不同的場景業(yè)務(wù)需求,一般有純文字形式、圖文結(jié)合形式、橫排+列表結(jié)構(gòu)3種表現(xiàn)形式,其中主體信息及排序為排行榜必須信息,而推薦理由、排名變化、熱度信息、評分等等非必須信息則根據(jù)用戶關(guān)注信息點(diǎn)選擇漏出。

1.純文字形式

純文字的排行榜一般是以內(nèi)容(或標(biāo)題)加排名的形式出現(xiàn),常見以信息為主的排行榜,比如微博、知乎、今日頭條等以信息為主要關(guān)注點(diǎn)的應(yīng)用,或是搜索列表下方的熱度排行榜。信息類排行榜一般以信息熱度為衡量標(biāo)準(zhǔn),因此會在標(biāo)題及排位外,增加各種突出熱度信息的表現(xiàn)形式,如關(guān)注熱度人數(shù),或是“熱”“新”“爆”等等表示熱度的標(biāo)簽,如抖音、微博。而淘寶搜索熱度則是在標(biāo)簽外增加了上升下降的排名變化。

2.圖文結(jié)合形式

相對于純文字形式,圖文結(jié)合的排行榜因?yàn)閳D片信息的增加,使整個榜單主體占居更多的空間也可以展示更多的產(chǎn)品信息,輔助用戶進(jìn)行選擇。

  • 圖片形式

上榜主體圖片尺寸一般會有橫版、方版、豎版3種形式。頭條、知乎等資訊類應(yīng)用都采用傳統(tǒng)的橫版圖片形式,延續(xù)了用戶閱讀新聞類資訊的習(xí)慣;而豆瓣、騰訊動漫等由于現(xiàn)實(shí)中書籍封面、電影海報(bào)等用戶視覺場景都是豎版構(gòu)圖,因此沿用至線上使用的也是豎版圖片形式;而京東、大眾點(diǎn)評、馬蜂窩則使用方版的圖片形式,大概是因?yàn)楫a(chǎn)品的多樣性需要考慮多種圖片的適配問題。(視頻、游戲類由于使用場景大部分采用橫版圖片形式;但由于游戲封面、宣傳海報(bào)也會有豎版的形式,比如:游民星空、小黑盒)。

  • 左文右圖VS左圖右文

每當(dāng)設(shè)計(jì)圖文結(jié)合的部分,首先要考慮到底是采用左圖右文還是左文右圖的形式呢?可能很多人會說這兩種形式?jīng)]有什么大的區(qū)別啊,有什么可糾結(jié)的!或者認(rèn)為由于視頻、圖片、文字對人類的吸引力是呈遞減形式的,因此應(yīng)該選擇左圖右文的形式。但實(shí)際上這跟我們長久以來的閱讀習(xí)慣以及應(yīng)用希望觸達(dá)的用戶類型有很大的關(guān)系。

人類對畫面的閱讀及掃描方式通常為三種布局方式,包括:古騰堡圖(Gutenberg),Z型(z-pattern)和F型(f-pattern)。其中產(chǎn)品列表頁中最常使用的就是F型布局模式,F型布局是雅各布·尼爾森(Jacob Nielsen)在公司進(jìn)行眼動追蹤研究后首次提出的。與其他模式相同的是,眼睛從上/左,水平移動到上/右,然后回到左邊緣再此進(jìn)行水平掃描。但在F型布局第二次掃頻后,向右掃動的次數(shù)會越來越少,并且會隨著向下移動,眼球會緊貼左邊緣。用戶也傾向于F型模式瀏覽瀏覽整個頁面,即自左向右自上而下的閱讀模式,越向下信息獲取效率會越低

因此今日頭條、知乎等需要通過文字傳遞給用戶準(zhǔn)確、豐富的新聞資訊類應(yīng)用普遍以左文右圖的形式展現(xiàn)。而電影、游戲、動漫等以畫面觸達(dá)用戶需求的應(yīng)用則都采用的是左圖右文的表現(xiàn)形式,比如:騰訊動漫、愛奇藝、得物等等。

3.橫排+列表表現(xiàn)形式

說到排行榜我們一般第一個會想到領(lǐng)獎臺,很多平臺也采用領(lǐng)獎臺這種前三名橫排+其他排名列表的結(jié)構(gòu)。純列表形式的排行榜,平臺用戶的注意力大部分集中在第一名,而領(lǐng)獎臺的形式模仿現(xiàn)實(shí)生活中的獎勵形式和儀式感,將整個排行榜的關(guān)注范圍從第一名擴(kuò)展至3名,另一方面排行榜的競爭關(guān)系從單一爭爭奪一名變成前三名的競爭關(guān)系,增加了第一名的高度。(目前這種形式我只在微博的明星勢力榜及抖音的直播總榜中有看到)


榜單規(guī)則是排行榜規(guī)則的描述,是平臺權(quán)威性的體現(xiàn)。榜單規(guī)則有些平臺本身具有數(shù)據(jù)庫,會有相關(guān)的平臺數(shù)據(jù)支持如京東;而汽車之家則依靠“汽車工業(yè)協(xié)會”外部的數(shù)據(jù)支持,增加平臺的權(quán)威性及榜單的可信度;

信息更新一般存在在榜單頭部和上榜主體的中間,有些是固定時間更新,也有類似微博熱搜是實(shí)時更新的模式,而騰訊動漫的更新作為用戶的痛點(diǎn)會在延續(xù)企鵝形象的側(cè)邊欄頭部標(biāo)明榜單更新周期。


排行榜的成功看似是人們對于選擇困難、信息獲取的解決方案,但歸根到底因?yàn)槿藗儗τ诓淮_定性的懼怕,無論是信息的不確定性或是對自身價值的不確定性。而平臺方利用金錢、名譽(yù)、獎勵的外部激勵方式,結(jié)合滿足感、確定性、社交性的內(nèi)在激勵相互作用使得排行榜成為無論何種平臺都非常受歡迎的產(chǎn)品功能。作為平臺方因產(chǎn)品使用受眾、產(chǎn)品側(cè)重點(diǎn)、宣傳方式的不同,排行榜會以多種入口及展現(xiàn)形式出現(xiàn)。作為設(shè)計(jì)師需要深入了解排行榜等功能背后的產(chǎn)品邏輯,以及用戶操作行為背后的思考及心理效應(yīng),提出合理的設(shè)計(jì),幫助用戶了解產(chǎn)品功能,滿足用戶需求。


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

文章來源:站酷  作者:9號自習(xí)室
分享此文一切功德,皆悉回向給文章原作者及眾讀者.

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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端后臺設(shè)計(jì)風(fēng)格及細(xì)節(jié)優(yōu)化

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

如何選擇合適的B端設(shè)計(jì)風(fēng)格?

1.B端后臺分類:

根據(jù)服務(wù)對象劃分:

一類支持有C端前臺,支持前臺產(chǎn)品管理各種資源。第二類服務(wù)企業(yè),提高企業(yè)工作效率和營收。


根據(jù)后臺功能:

1.監(jiān)控運(yùn)營:時效性強(qiáng),旨在實(shí)時反饋異常情況,快速判斷下達(dá)命令,回復(fù)信息、多用于數(shù)據(jù)控制中心。

2.數(shù)據(jù)分析:數(shù)據(jù)結(jié)果的對比和分析趨勢,時效性要求并不高,了解整體和各部分?jǐn)?shù)據(jù)水平,助力決策。

3.記錄管理類:主要用于人員、設(shè)備、資產(chǎn)等增刪改查,文本信息容量大,頻繁便捷的操作。

4.系統(tǒng)配置:權(quán)限配置、設(shè)備功能配置,操作為主。


2.后臺深淺兩大風(fēng)格分類:

淺色:適合文本信息多密集的表單列表類后臺,淺色更符合人眼白底黑字的閱讀習(xí)慣,瀏覽速度更快,信息獲取效率更高。


深色:圖像信息密集的后臺適合圖片、數(shù)據(jù)可視化圖表等;深色對彩色的圖像信息襯托更強(qiáng)。信息獲取速度較慢,長時間可能視疲勞。


3.作者常向產(chǎn)品方提供的風(fēng)格參考

較常見

  1. 經(jīng)典商務(wù)風(fēng)(導(dǎo)航深、內(nèi)容淺)——專業(yè)、高效、成熟、可信賴(對照深色西裝人物形象)

    優(yōu)點(diǎn):市面最常見的風(fēng)格,普世性高,大多數(shù)用戶可快速接受,層次分明

    缺點(diǎn):視覺缺乏記憶點(diǎn)

 2.輕量科技感(導(dǎo)航淺、內(nèi)容淺)——簡潔、明快、輕量、年輕(對照白襯衫打領(lǐng)帶男性)

      優(yōu)點(diǎn):視覺清新明快更年輕化更輕量,對其他文本及圖形展示包容性高,就像A4白紙一樣容器存在感弱

      缺點(diǎn):純白色導(dǎo)航+頁面層次略曖昧。

 3.藍(lán)色科技風(fēng)(導(dǎo)航中、內(nèi)容中)

      適合:適合科技屬性強(qiáng)的產(chǎn)品界面,圖像圖形展示

      缺點(diǎn):對其他色彩信息有干擾,持續(xù)性長時間觀看易視覺疲勞

 4.暗黑科技風(fēng)(導(dǎo)航深、內(nèi)容深)

      優(yōu)點(diǎn):對色彩表現(xiàn)力強(qiáng)

      缺點(diǎn):密集文本信息獲取速度會下降,持續(xù)性長時間觀看易視覺疲勞



4.精準(zhǔn)選擇風(fēng)格時可以進(jìn)一步的考慮:

1.整體行業(yè)風(fēng)格

比如美妝和科技行業(yè)的整體設(shè)計(jì)基調(diào)就不太相同。


2.產(chǎn)品想要傳達(dá)的氣質(zhì):

理性可靠 or  簡潔輕松輕量 or 關(guān)懷普世 or 酷炫吸睛….這個可以和相關(guān)產(chǎn)品經(jīng)理、銷售共同商討


3.目標(biāo)用戶的群體特點(diǎn)及喜好。

根據(jù)目標(biāo)用戶的性別、年齡層、受教育水平,審美水平考量(可能包含多種角色,選取1.2個核心角色為參考)帶入目標(biāo)用戶工作場景及愛用物常用物品味,去判斷基調(diào)。

如主要用戶群:40+男性用戶,本科以上受教育水平,使用windows電腦進(jìn)行專業(yè)管理操作,審美傾向明確內(nèi)斂。

如主要用戶群:20-40歲,男女比例約6:4;大專;操作水平參差


4.使用場景及高頻的操作。

例如:最常使用數(shù)據(jù)分析管理,需要快速閱覽多條數(shù)據(jù),對數(shù)據(jù)進(jìn)行比對,更適合淺色風(fēng)格展示表單數(shù)據(jù)。


5.判斷獨(dú)立的平臺是否為獨(dú)立開發(fā)

獨(dú)立開發(fā)的,可以采取更獨(dú)特設(shè)計(jì)。若平臺很大需要不同外包公司的合作屬于整合類平臺則更注重設(shè)計(jì)的包容性。


5.如何讓后臺設(shè)計(jì)更具特色:



  1. 重點(diǎn)色的使用



“731配色比例”70%的面板色,30%的導(dǎo)航面板色,10%的強(qiáng)調(diào)色。(這里的用色比例可以根據(jù)內(nèi)容具體再去調(diào)節(jié)只是大概比例)品牌色或重點(diǎn)色:強(qiáng)調(diào)行動關(guān)鍵點(diǎn)、重要信息高亮、圖形化說明等。強(qiáng)調(diào)色用就要用的像蛋糕上的櫻桃。起到畫龍點(diǎn)睛作用即可。

2.圖標(biāo)的優(yōu)化

后臺高頻出現(xiàn)的圖標(biāo),值得我們花時間去統(tǒng)一設(shè)計(jì)打磨,調(diào)整圓角粗細(xì)疏密,符合整體界面氣質(zhì)。從圖標(biāo)庫里拖出的圖標(biāo)很多在線條粗細(xì)上是不統(tǒng)一的,好的設(shè)計(jì)在細(xì)節(jié)處也要動人。

B端工具類圖標(biāo)識別性第一,美觀性第二。B端導(dǎo)航圖標(biāo)更多是在基礎(chǔ)造型上打磨,不需要加花里胡哨的漸變、投影,導(dǎo)航圖標(biāo)一般在24px-16px大小,太復(fù)雜反而看不清。在區(qū)分狀態(tài)的時候可以考慮加點(diǎn)品牌色


3.空狀態(tài)小插畫

空狀態(tài)插畫是B端設(shè)計(jì)師少有能發(fā)揮自己繪畫天賦小巧思的地方。

圖形化狀態(tài)語言,輔助用戶理解內(nèi)容。可以將產(chǎn)品機(jī)械蒼白的文案設(shè)計(jì)表現(xiàn)的更加具有溫度,具有引導(dǎo)性。讓乏味的工作出現(xiàn)一些共情小彩蛋,有趣的插圖動畫可以緩解等待的焦慮。



4.登錄注冊頁

純色背景卡片式:簡單大方更聚焦登錄操作

插畫背景:場景化展示產(chǎn)品的功能及亮點(diǎn),讓用戶更有心理預(yù)期

幾何圖形背景:最后和品牌圖形相關(guān),加深用戶對產(chǎn)品的品牌印象。

照片背景:相關(guān)場景或產(chǎn)品類型,具象圖片信息更直觀


5.圓角的大小

不同大小的圓角傳達(dá)產(chǎn)品不同的氣質(zhì),大圓角親和、小圓角精致、中等圓角大眾中庸。



6.優(yōu)化信息層級

優(yōu)化信息層級,區(qū)分信息主次可以使閱讀更快,操作更快,界面更有節(jié)奏感。

這時候你就是那個考前畫重點(diǎn)的老師

判斷一個頁面里最重要的是那些信息或操作,強(qiáng)化它!并弱化輔助信息;

判斷一個模塊里那些是重要信息,強(qiáng)化它!



6.新人需要避免的雷點(diǎn):

  1. 追求炫酷的視覺效果舍棄操作效率。比如追波風(fēng)滿屏花里胡哨的卡片及面板,滿屏大投影及高飽和色彩。對于B端界面來說信息噪音太多,反而干擾信息獲取效率。


2.反常規(guī)用戶習(xí)慣的操作。尊重用戶習(xí)慣,不要為了個性化去嘗試改變,不要妄圖改變用戶的操作和認(rèn)知的慣性。慣性思維大于設(shè)計(jì)思維,曾經(jīng)遇到過產(chǎn)品因?yàn)橛沂植僮魉砸褜?dǎo)航放在右邊的離譜例子。


3.數(shù)量多,動靜大的夸張的動效。B端與C端不同的地方在于希望操作者沉浸式工作,遵循非必要不打擾。之前看過一個反面例子后臺,在每一步操作后都出現(xiàn)大的場景動效鼓勵完成,如果作為一個長期使用的工作者,我會覺得每次完成任務(wù)都需要等待動畫完成可能只需要2-3s也很浪費(fèi)我的時間。


4.新人建議多看Antdesign和Element等成熟的組件,創(chuàng)新類組件樣式,最好和和開發(fā)商量是否能夠?qū)崿F(xiàn)。


5.在確定主要風(fēng)格及2-5張主要頁面后,就應(yīng)該著手基礎(chǔ)規(guī)范(色彩字體等,不然后面越做越亂)。


6.一段時間一個審美,同一界面中的元素風(fēng)格不統(tǒng)一。


7.避免大面積使用高飽和高明度的色彩,及曖昧含糊的臨近色彩。長時間使用眼睛會累,產(chǎn)生不耐煩焦躁的負(fù)面情緒。

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

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ù)


研究了上百套圖標(biāo),總監(jiān)卻告訴我圖標(biāo)要這樣畫!

seo達(dá)人



01.圖標(biāo)是什么 

圖片

要做好圖標(biāo),首先我們要知道圖標(biāo)是什么?在一般認(rèn)知里,圖標(biāo)可以定義為一種圖形化的符號或標(biāo)識,用于幫助我們理解某些復(fù)雜功能或操作,尤其在數(shù)字化領(lǐng)域里,可視化的圖形符號,更利于高效的展示信息和引導(dǎo)人機(jī)操作交互。也有人稱之為icon或eikan。

a

1.圖標(biāo)的發(fā)展史

圖片

圖標(biāo)的歷史可以上溯到人類文明發(fā)源伊始,最早的象形文字,巖洞壁畫等都可以算作圖標(biāo)的一種,為我們后代研究人類文明產(chǎn)生了珍貴的歷史意義。但今天我們研究的圖標(biāo)主要以計(jì)算機(jī)系統(tǒng)發(fā)明為分界線,看看這短短幾十年間,圖標(biāo)是如何演化的。

圖片

 80年代的初期圖標(biāo)還是黑白單色

圖片

 90年代慢慢多了些色彩,形狀也更豐富

圖片

 到2000年后,隨著顯示技術(shù)的發(fā)展,圖標(biāo)也越來越形象

圖片

 圖為iOS1-8圖標(biāo)變化

從最早的Xerox Sta系統(tǒng)到最新的Mac os10,再到現(xiàn)在人手一臺的移動智能機(jī),每個階段都擁有其獨(dú)特的圖標(biāo)風(fēng)格,2010年已經(jīng)到了智能移動時代,拿最知名的iOS系統(tǒng)每個階段升級,圖標(biāo)的變化來看,也歷經(jīng)了初期的擬物-扁平-微質(zhì)感的好幾個階段。

圖標(biāo)作為UI必不可少的部分,能夠使界面更加精致,今天也分享給大家一些大公司的設(shè)計(jì)規(guī)范,其中包括很多系統(tǒng)的圖標(biāo)規(guī)范和定義,幫助大家更好地參考和學(xué)習(xí)。

圖片

w

02.  圖標(biāo)的分類 

圖標(biāo)因其良好的辨識性和無障礙溝通特性,在各種場景下被廣泛應(yīng)用,同樣,因使用場景的不同,圖標(biāo)所代表的意義也不一樣。

 

1.應(yīng)用圖標(biāo)

圖片

 iOS14桌面應(yīng)用圖標(biāo)

a

應(yīng)用圖標(biāo)指的是我們設(shè)備界面上的應(yīng)用入口,通常具有較強(qiáng)的品牌特性,可能與logo一致或與其核心功能一致, 如instagram 就是一個簡化的相機(jī)正視圖,亞馬遜則是一個購物車形象,國內(nèi)也有不少產(chǎn)品直接使用了能夠代表產(chǎn)品的文字,需要注意的是,界面圖標(biāo)必須遵循對應(yīng)系統(tǒng)下的尺寸規(guī)范。

圖片

 華為EMUI 10應(yīng)用圖標(biāo)

d

2.功能圖標(biāo)

與應(yīng)用圖標(biāo)不同的是,它主要作為界面中的功能入口,一般為簡潔易辨識的符號,根據(jù)不同產(chǎn)品調(diào)性,圖標(biāo)風(fēng)格也可以多種多樣,并且不強(qiáng)制必須為標(biāo)準(zhǔn)形狀,異形圖標(biāo)能讓界面更為生動,整體風(fēng)格的發(fā)揮也有了更多空間。

圖片

d

3.輔助圖標(biāo)

輔助性圖標(biāo)通常存在于有較多長文字時,搭配作為輔助說明,在UI中,可能還具備一定情感化的作用,在提升用戶接收信息效率的同時安撫用戶情緒;所以整體可能需要具備更多細(xì)節(jié),作為畫面補(bǔ)充的一部分。

圖片

 如:缺省圖標(biāo)

s

4.與logo的區(qū)別

雖然這兩者特性極為相似,都是圖形化的符號,但logo是為整體品牌服務(wù)的,具備其獨(dú)一無二的專利特性,甚至可以是IP形象或文字;兩者的關(guān)系可以理解為父子。

圖片

 圖中的圖標(biāo)就很好繼承了logo的特征和風(fēng)格

圖片

 但有的也只是普通的界面輔助,風(fēng)格和樣式并不一致

a

03. 圖標(biāo)的繪制 

能夠繪制出高質(zhì)量的圖標(biāo)是每個UI設(shè)計(jì)師必備的能力,本次我們以功能圖標(biāo)為例,為大家展示具體的幾個繪制步驟和要點(diǎn),希望幫大家在細(xì)節(jié)上避開影響圖 標(biāo)精致度的一些小細(xì)節(jié)。

d

第一步:建立圖標(biāo)網(wǎng)格

圖片

功能圖標(biāo)因形態(tài)結(jié)構(gòu)各異,難免存在尺寸不一的情況,必須考慮其整體視覺的協(xié)調(diào)一致,最好的辦法就是建立圖標(biāo)網(wǎng)格,也可以稱為圖標(biāo)盒子,當(dāng)圖標(biāo)形態(tài)分別為長、方、圓時,有一個合理的比例限制。

圖片

 將常見圖標(biāo)形態(tài)約束在圖標(biāo)盒子內(nèi)

當(dāng)然,網(wǎng)格不是絕對的,要學(xué)會靈活運(yùn)用,當(dāng)與個別圖標(biāo)形態(tài)無法完匹配時,也不必拘泥,一切以達(dá)到視覺和諧為首要。我通常會在圖標(biāo)網(wǎng)格外圍預(yù)留一個安全區(qū)域,可以規(guī)避切圖出現(xiàn)不完整的情況。

a

第二步:具象功能

有了網(wǎng)格,第二步則需要我們根據(jù)功能,找到與之對應(yīng)的實(shí)物形象;如筆記本是記錄,電話是通話,時鐘代表時間,日歷代表日期等等。

圖片

這些功能相對比較容易找到現(xiàn)實(shí)中的實(shí)物,如果是比較抽象的功能呢?就需要我們發(fā)散思維,找與之相近含義的事物。如隱私功能,隱私是沒有實(shí)物的,但是我們可以通過“隱私”這個詞延伸:不公開的、隱藏的、鎖起來的、被保護(hù)的,繼續(xù)根據(jù)這些詞延展:就可能是密碼、盾、鎖、遮眼等等。

圖片

時刻記住一點(diǎn):用大眾都能理解的物體形象去表達(dá)。如果用戶看到某個圖標(biāo)過于復(fù)雜,需要反復(fù)思考它代表的含義,也無法預(yù)測點(diǎn)擊后的結(jié)果,那這個圖標(biāo)就失去了提效的作用。

d

第三步:簡化結(jié)構(gòu)

有了功能的具體形象,下一步就是思考如何讓圖標(biāo)變得更簡潔易辨識。

圖片

 畢加索《公?!?/span>

圖片

畢加索創(chuàng)作《公?!窌r,從初稿到最終成品歷經(jīng)了11個版本,最后只用寥寥幾條線來勾勒,但我們依然能一眼認(rèn)出牛的形態(tài)。繪制圖標(biāo)也一樣,需要我們思考如何省略無用細(xì)節(jié),化繁為簡,提取他們的主要特征。

f

第四步:善用布爾運(yùn)算

有了簡化的圖標(biāo)形象,我們接下去應(yīng)該思考如何讓圖標(biāo)變得更為規(guī)范耐看。

圖片

 如桃心圖標(biāo),就是兩個簡單圓角矩形組合而成

圖片

 桃心圖標(biāo),也可以做的更圓潤

圖片

 不同組合下的布爾運(yùn)算,圖標(biāo)形態(tài)特征也會不一樣

這一步的訣竅就是盡可能使用基礎(chǔ)圖形去組合拼貼,這樣做出來的圖標(biāo),尤其在適配不同尺寸大小切圖時不易拉伸變形。

f

第五步:處理細(xì)節(jié)

統(tǒng)一性

圖片

 風(fēng)格:線性、面性統(tǒng)一

圖片

 斷點(diǎn)細(xì)節(jié)一致:平角、圓角

圖片

 圖標(biāo)氣質(zhì)一致:是圓潤還是尖銳硬朗

隨著功能界面的不斷復(fù)雜化,大家早已不滿足于同一產(chǎn)品或同個界面中單一的使用面性或線性圖標(biāo),而是搭配使用便于層級劃分,故而這里只考慮在同一層級下圖標(biāo)的統(tǒng)一性。

視覺平衡

圖片

如圖,三角形置于中間位置時,視覺重量會偏向左邊,在這個基礎(chǔ)上,我們就需要做出適當(dāng)調(diào)整,以達(dá)到視覺重量平衡。

一致的視角

圖片

當(dāng)你想讓自己的圖標(biāo)變得更加出彩而采用了區(qū)別于正視圖的結(jié)構(gòu),那也一定要確保至少在同等層級下,這些圖標(biāo)視角是一致的。

a

第六步:做出差異化

融入品牌DNA

圖片

 韓國購物App 11 street,就很好的融合了品牌logo的箭頭符號

功能圖標(biāo)因簡潔通俗,比較容易出現(xiàn)市場同質(zhì)化嚴(yán)重的現(xiàn)象,故而很多App選擇在圖標(biāo)中融入品牌基因,不僅做出差異性,還能提升品牌調(diào)性。

跟隨趨勢創(chuàng)新

圖片

圖片

通過對圖標(biāo)風(fēng)格質(zhì)感的創(chuàng)新表達(dá),讓人眼前一亮。這種方式更多需要你了解當(dāng)下的流行趨勢和技法,根據(jù)產(chǎn)品的風(fēng)格調(diào)性,對圖標(biāo)進(jìn)行量身打造。

圖標(biāo)微動效

圖片

隨著5G時代來臨,微動效也早就出現(xiàn)在了大眾視野,基于圖標(biāo)的微動效表達(dá),能讓用戶更快注意到某個功能并去點(diǎn)擊它,如果你的動效還恰好有趣美觀,更能讓用戶感到愉悅。比較常見的loading和tab切換都讓我們有了很充足的發(fā)揮空間。

d

第七步:完善圖標(biāo)庫

通常一個產(chǎn)品的功能圖標(biāo)會多達(dá)幾十甚至幾百個,如何保證這些圖標(biāo)的統(tǒng)一性需要提前去規(guī)劃。繪制的最后一步,就是在完成一部分圖標(biāo)后,及時排列比對,確保整體視覺效果的統(tǒng)一;有條件的可以生成圖標(biāo)庫,便于后續(xù)的團(tuán)隊(duì)協(xié)作。

圖片

 Apple發(fā)布的SF Symbols中圖標(biāo),就劃分了9種寬度和3個比例尺寸

有了圖標(biāo)庫后,協(xié)作設(shè)計(jì)師做到共用功能時可以直接調(diào)用;極大提高自己和團(tuán)隊(duì)的效率,并保持整體規(guī)范的一致。

a

04.最后 

圖標(biāo)繪制看似簡單,要做好卻并不容易;UI處處充滿細(xì)節(jié),想要自己的界面更加精致,就不要忽略每一個可以提升的點(diǎn)。希望今天的這篇文章能夠幫到你。

最后給大家分享一些大公司的設(shè)計(jì)規(guī)范,其中包括很多系統(tǒng)的圖標(biāo)規(guī)范和定義,幫助大家更好地參考和學(xué)習(xí),需要的話可以點(diǎn)個“在看”,添加叮當(dāng)貓回復(fù)“圖標(biāo)”領(lǐng)取,已有叮當(dāng)貓的無需重復(fù)添加。

圖片



s

原文地址:我們的設(shè)計(jì)日記(公眾號)

作者:sky

轉(zhuǎn)載請注明:學(xué)UI網(wǎng)》研究了上百套圖標(biāo),總監(jiān)卻告訴我圖標(biāo)要這樣畫!

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

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ù)


作品集這樣展示,秒出效果

seo達(dá)人

01. 3D素材 

圖片

圖片

圖片

@CANAAN,作品集封面3D素材

 s

02. 樣機(jī)素材 

圖片

圖片

圖片

@嗡嗡嗡起,高質(zhì)量的手持設(shè)備樣機(jī)

f

03. 平面素材 

圖片

圖片

圖片

@南風(fēng)知我意,潮流高級全息海報(bào)模板31款

 g

04. 樣機(jī)素材 

圖片

圖片

圖片

@是瑩瑩啊,蘋果13樣機(jī)+高端場景樣機(jī)合集+iPhone13樣機(jī)

w

05. 3D素材 

圖片

圖片

圖片

@落微,UI素材丨3d丨手勢丨psd

w

06. 3D素材 

圖片

圖片

圖片

@阿軒,11個3D圖標(biāo)+png+3個拍攝角度


原文地址:我們的設(shè)計(jì)日記(公眾號)

作者:sky

轉(zhuǎn)載請注明:學(xué)UI網(wǎng)》作品集這樣展示,秒出效果

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

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ù)



CRM系統(tǒng):線索的獲取和分配

資深UI設(shè)計(jì)者

CRM代表了企業(yè)對客戶的管理理念和運(yùn)營方法,而對客戶生命周期的管理也是大家非常關(guān)心的話題。本篇文章里,作者分別從客戶畫像、線索獲取以及線索分配三個方面分析了售前的最重要步驟,一起來看看吧。


CRM代表了企業(yè)對客戶的管理理念和運(yùn)營方法,所以談到CRM大家最關(guān)心的話題也就是對客戶整個生命周期的管理,而在售前部分最重要的就是:線索的獲取和分配。

一、客戶畫像

說到CRM客戶畫像是繞不過去的一個名詞,客戶畫像是指公司客戶的共性關(guān)鍵特征,如下圖所示:

CRM系統(tǒng):線索的獲取和分配

vipkid為例,他的主要客戶畫像就是:一二線城市且孩子年齡為4—12歲區(qū)間的家長。

客戶畫像使用方法:

1)根據(jù)客戶畫像尋找渠道和方法獲取銷售線索

比如一家做英語培訓(xùn)的機(jī)構(gòu)就可以聯(lián)合鋼琴培訓(xùn)機(jī)構(gòu)聯(lián)合做公開課,兩家公司的客戶畫像相近,就可以互通客戶達(dá)到共贏。

2)根據(jù)客戶畫像快速篩選線索,快速定位高質(zhì)量線索

比如vipkid的電話銷售人員了解到家長雖然有意愿讓孩子學(xué)習(xí)英語,但是孩子年齡為2歲,沒有達(dá)到客戶畫像的標(biāo)準(zhǔn),則可以盡早放棄溝通下一個客戶。

二、線索的獲取

線索的獲取不外乎兩個部門:銷售和市場。

1. 地推團(tuán)隊(duì)

一般TO B的公司的獲客主要渠道為地推團(tuán)隊(duì)例如:

  • 2C流量+2B廣告變現(xiàn)模式 如58同城房產(chǎn)業(yè)務(wù)、安居客
  • 多邊平臺+傭金抽成模式 如美團(tuán)團(tuán)購?fù)赓u業(yè)務(wù)、大眾點(diǎn)評團(tuán)購業(yè)務(wù)

這種公司會在每個城市設(shè)立分公司,培養(yǎng)大量的地推銷售人員,并劃分區(qū)域給到每個銷售人員負(fù)責(zé),銷售人員就是通過掃街的方式獲取及維護(hù)自己的客戶。

2. 客戶轉(zhuǎn)介紹

一般TO C的公司的高質(zhì)量獲客渠道為客戶轉(zhuǎn)介紹例如:

  • 2C產(chǎn)供銷模式 如VIPKID、火花思維、美術(shù)寶等在線教育公司
  • 2C免費(fèi)+增值模式 如游戲軟件王者榮耀、交友軟件網(wǎng)易花田

這些公司會動用電銷人員成單激勵、用戶轉(zhuǎn)介紹活動激勵等方式來促使客戶完成轉(zhuǎn)介紹行為如轉(zhuǎn)發(fā)朋友圈、拉新注冊、拉新購買等來獲得轉(zhuǎn)介紹線索。

3. 廣告流量

通過投放廣告(實(shí)體廣告牌廣告、電視廣告、搜索網(wǎng)站關(guān)鍵詞投放、大V軟文)吸引用戶進(jìn)入到營銷活動頁或官網(wǎng)進(jìn)行注冊,從而收集到的線索。

4. 自媒體

通過內(nèi)容產(chǎn)出如:

客戶成功案例、系列錄播課程、直播課程、行業(yè)解決方案、電子書、行業(yè)白皮書,發(fā)布到抖音、快手、公眾號、頭條、知乎、微博等平臺上,獲得客戶認(rèn)可并吸引客戶持續(xù)關(guān)注。

5. 渠道商資源采買

從渠道商獲取購買,但數(shù)據(jù)準(zhǔn)確度往往很低,需要搭建數(shù)據(jù)清洗團(tuán)隊(duì),清洗數(shù)據(jù)(確認(rèn)客戶信息正確并補(bǔ)全信息、確認(rèn)客戶需求存在)之后才能算線索并提供給到銷售。

6. 商業(yè)合作&資源互換

通過企業(yè)與企業(yè)間的客戶資源的互換,實(shí)現(xiàn)雙方的共贏;建議找目標(biāo)客戶群重疊但又沒有競爭的企業(yè),以最小成本甚至0成本的方式合作,互補(bǔ)資源,實(shí)現(xiàn)雙贏。

7. 市場活動

如行業(yè)會議、論壇峰會、交流活動、線下公開課、展會、促銷活動等。

三、線索分配

線索分配是和銷售模式息息相關(guān)的,主要的銷售模式有三種:電話銷售、地面銷售、社群銷售。

1. 電話銷售

電話銷售依賴于CRM系統(tǒng)分配leads,所以電銷CRM可以從新leads轉(zhuǎn)化到老客戶續(xù)費(fèi)等環(huán)節(jié),做到對于銷售的標(biāo)準(zhǔn)化精細(xì)化管理。

1)新分leads

首次分配:

業(yè)務(wù)增長時期分配策略模型:

這種分配模型是粗放式分配,優(yōu)質(zhì)和低值的leads混合隨機(jī)分配給不同能力的銷售,可能會有一些高質(zhì)量的leads分配給低能力銷售導(dǎo)致轉(zhuǎn)化失敗,但是也是因?yàn)榈娃D(zhuǎn)化的銷售有能接觸到高質(zhì)量leads的機(jī)會帶來了工作的動力。

策略模型方案:

  • 轉(zhuǎn)介紹leads分原CC
  • 優(yōu)質(zhì)leads按標(biāo)分配CC
  • 一般質(zhì)量leads均分CC
  • 支持管理者手動搬動leads

業(yè)務(wù)增速降緩&收縮時期分配模型:

業(yè)務(wù)增速降緩&收縮時期首要考慮的是降本提效,所以首要的會思考如果用更少的人干更多的事情、或是同樣多的線索如何能轉(zhuǎn)化更多,所以使用的策略會更激進(jìn)一些,可能會導(dǎo)致轉(zhuǎn)化低的銷售長時間無法接觸到高質(zhì)量例子,工作積極性降低,從而流失速度增加。

策略模型方案:

  • 建立leads打分模型:按照司齡、轉(zhuǎn)化分層
  • 建立銷售能力打分模型:按照轉(zhuǎn)化對各個渠道分層
  • 嘗試將好的leads分配給好的銷售
  • 全部改為系統(tǒng)自動分配

二次分配 :

  • 二次分配是一種對于銷售的懲罰手段,主要出現(xiàn)在以下兩種場景:
  • 超過規(guī)定時間線索沒轉(zhuǎn)化:掉落公海&二次分配
  • 超過規(guī)定時間銷售沒跟進(jìn) :二次分配

2)庫存leads

激活線索:

庫存leads即無法轉(zhuǎn)化的銷售線索經(jīng)過公司多年的積累數(shù)量龐大,如果人工再次致電確認(rèn)用戶需求則很低效成功率也很低,方法一是有效識別,庫中成交可能性更高的leads,由人工觸達(dá)轉(zhuǎn)化。

而這種方式就是通過推送(短信、郵件、公眾號等渠道)運(yùn)營活動激活客戶,讓客戶主動再次咨詢,系統(tǒng)ke’yi再次分配銷售跟進(jìn)或公海打標(biāo)簽方便銷售主動撈取。

周期掃庫:

庫存leads即無法轉(zhuǎn)化的銷售線索經(jīng)過公司多年的積累數(shù)量龐大,如果人工再次致電確認(rèn)用戶需求則很低效成功率也很低,方法二是通過系統(tǒng)功能提高觸達(dá)效率降低人工售賣成本,周期性的把公海中的leads全部觸達(dá)一遍,避免遺漏漏網(wǎng)之魚。但缺點(diǎn)是需要嚴(yán)格制定外呼策略避免騷擾到客戶。

1、預(yù)測式外呼:

系統(tǒng)代替人工外呼,呼通線路轉(zhuǎn)接給人工溝通,節(jié)省人工外呼等待電話接通的時間浪費(fèi)。

2、智能AI電話:

全部由機(jī)器人外呼及溝通,無人工介入,但往往只溝通確認(rèn)客戶購買意愿是否存在。

2. 地面銷售

前面提到了一般TO B的公司的獲客主要渠道為地推團(tuán)隊(duì)。這種公司會在每個城市設(shè)立分公司,培養(yǎng)大量的地推銷售人員,并劃分區(qū)域給到每個銷售人員負(fù)責(zé),這個銷售人員就是通過掃街的方式獲取及維護(hù)自己的客戶。

所以會有個弊端,CRM無法成為銷售獲取線索的主要來源,所以CRM對于地面銷售的管控程度比較低尤其在于新客戶轉(zhuǎn)化環(huán)節(jié),一般銷售都是在確定客戶購買后才將客戶信息錄入到CRM中,所以地面銷售CRM系統(tǒng)的銷售管控環(huán)節(jié)主要在于客戶的維護(hù)任務(wù)及續(xù)費(fèi)任務(wù)的流程及任務(wù)管控中。

而監(jiān)控方式從電銷人員的電話溝通情況改到地面銷售人員的地點(diǎn)定位打卡簽到的方式。

地面銷售的線索二次分配,不會像電話銷售的那么靈活,一般是整個片區(qū)的商戶,以片區(qū)為維度的重新分配銷售。

3. 社群銷售

社群銷售是在線教育大班課常用的一種銷售手段,也是線下奧數(shù)教育學(xué)而思培優(yōu)使用過的一種比較成功的獲客手段,社群主要是將一群有相似目的或需求的人聚集到一起,在群中沉浸式的接收你的觀點(diǎn),從而形成思維的共振而達(dá)到思想的高度統(tǒng)一對公司想傳遞的價值觀的的認(rèn)可及信任。

上文說到,社群銷售主要是教育機(jī)構(gòu)使用的銷售手段,所以往往和體驗(yàn)課的班期有關(guān),上同一期的體驗(yàn)課程的學(xué)生或者家長會被拉入同一個群中,這個群會有一個專門的銷售負(fù)責(zé)。

所以社群的線索分配是和銷售負(fù)責(zé)的班期排班直接關(guān)聯(lián)的,除非整個班期重新銷售排班一般不會更換銷售。所以主要依賴于銷售對于社群的維護(hù),一般不進(jìn)行二次分配。


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

文章來源:人人都是產(chǎn)品經(jīng)理  作者:東悅思考筆記

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

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

藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(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ù)


日歷

鏈接

個人資料

存檔