UI設(shè)計師該有的排行榜

2024-9-20    資深UI設(shè)計者

 

在互聯(lián)網(wǎng)中,許多產(chǎn)品都有排行榜,但是排行榜應(yīng)該怎么設(shè)計,如何根據(jù)具體產(chǎn)品思考交互框架、信息?這篇文章會告訴你。

上次,同事在我旁邊點(diǎn)奶茶,我推薦了一家感覺還不錯的奶茶,但他很嫌棄地和我說這家排名不高。我轉(zhuǎn)念一想,好像沒什么不對,因?yàn)?ldquo;排行榜”在我們生活無處不在。 

 

小時候讀書,每次出成績,老師都喜歡給我們的成績排名次,第一名就是別人家的孩子。 

每次看新聞,要看看什么新聞熱度最高。 

每次買東西,要看看什么商品排名最高。

每次吃東西,要看看什么商家評分最高。

每次看電影,要看看什么電影點(diǎn)評最高。

 

當(dāng)你對某種事物沒有主見,開始詢問別人的意見時,你就已經(jīng)遵循了別人的看法,而那個人會在心里將這種事物排個序,這是看不見的排行榜。 

 

于是我開始思考,大家為什么相信排行榜? 

 

一、排行榜的作用

效率:—— 快

我們無法想象,做什么東西都需要親自去仔細(xì)對比會浪費(fèi)多少時間和精力。不用動腦,直接看別人幫你篩選好的不香嗎?人們往往都很懶,用戶不可能憑個人精力去比較之后再找到適合自己的,所以最高效的方式就是看排行榜。

 

權(quán)威:——狠 

我們認(rèn)同的排行榜,基礎(chǔ)的屬性就是“權(quán)威性”,排行榜往往會基于對應(yīng)的客觀數(shù)據(jù),是群體、權(quán)威都認(rèn)同的產(chǎn)物,相對而言真實(shí)、公正,所以權(quán)威性來源于真實(shí)可信。雖然現(xiàn)在的許多排行榜都是摻雜著商業(yè)利益,但是本質(zhì)上不影響我們對排行榜的認(rèn)同。當(dāng)然,假如某個排行榜很離譜,大家也都不會信。 

 

從眾:——準(zhǔn) 

絕大多數(shù)人都有從眾心理,當(dāng)人們對某種事物缺乏足夠的認(rèn)知,從眾心理就會特別明顯。假如你要去旅游,要做攻略,一般都會看看別人都推薦什么,這就是從眾心理。但是從眾心理并非不好,它可以在人們在處理信息不對稱的情況下,做出一種理性的選擇。隨大流,但比較穩(wěn)!采取某種行為的人越多,我們就會認(rèn)為這種行為越正確,羊群效應(yīng)已經(jīng)向我們詮釋過這種心理。 

 

二、排行榜對其他角色的作用

 

上面的效率、權(quán)威、從眾(一般具有準(zhǔn)確性)主要是對于用戶側(cè)的。此外,排行榜對“平臺”、“上榜主體”也有很強(qiáng)的作用。

對平臺:

 

a.熱度:如果排行榜讓用戶都接受和信服,反過來會推動“上榜主體”和粉絲參與(比如音樂平臺的打榜),進(jìn)而提升平臺熱度。

 

b.決策:排行某種程度上是群體意見的結(jié)果,其他用戶較容易接受,然后快速決策,避免浪費(fèi)太多時間篩選和糾結(jié)而造成用戶流失。選擇越多,用戶越難選擇,所以給到用戶明確的推薦排行,可以讓不了解的用戶更快決策。

 

c.權(quán)威:結(jié)果可靠,內(nèi)容真實(shí)的排行榜,對于提升平臺權(quán)威性方面的作用是毋庸置疑的。

 

對上榜主體:

 

上榜主體可能是人(如:歌手)或物(如:音樂、電影)

 

a.流量:用戶看排行榜,大部分情況下想看到的就是排名靠前的內(nèi)容,所以在排行榜前列的主體更容易受到關(guān)注以及流量。

 

b.榮譽(yù):想想福布斯富豪榜之類的,榮譽(yù)感很好理解。

 

c.獲益:獲益主要指商業(yè)或經(jīng)濟(jì)利益,主要基于流量。

 

三、排行榜的信息構(gòu)成 

常見的排行榜信息主要由以下幾方面構(gòu)成:

 

1.榜單名稱

 

榜單名稱應(yīng)該足夠精煉且清晰,要讓用戶一眼知道這是什么榜。切忌使用假大空而用戶看不懂的榜單,因?yàn)檫@毫無信服力。 

 

2.上榜主體

 

包含多種信息:主體信息、排序、推薦理由、排名變化、熱度信息。

 

這些信息并非所有都是必需的,但主體信息和排序是構(gòu)成上榜主體的基本單位。推薦理由、排名變化、熱度信息等都是根據(jù)不同產(chǎn)品類型以及產(chǎn)品策略決定是否展示。

 

a.主體信息:上榜主體必須有清晰的基本信息,一般是圖片、標(biāo)題、描述以及產(chǎn)品特有信息構(gòu)成。

 

b.排序:通用的展示方式都是按照數(shù)字,排序最根本目的就是告訴別人,上榜的人/物很強(qiáng),所以需要十分清晰。

 

c.推薦理由:推薦理由是針對上榜的每個主體的,側(cè)重于簡練介紹上榜理由。

 

d.排名變化:排名變化一般包含上升、下降、維持,常常是為了制造榜單的活躍感,讓用戶知道是時刻變動的。另外,也是為了刺激上榜主體通過競爭提升或維持排名。對于有打榜屬性的排行榜,還具有反映實(shí)時變化的緊張感。

 

e.熱度信息:通常是榜單平臺通過活躍等各種指標(biāo)計算的信息,反映上榜主體的關(guān)注程度。由于熱度本身信息規(guī)則不透明,所以平臺控制的自主性較強(qiáng)。

 

 

3.榜單規(guī)則

 

榜單規(guī)則是對某排行榜的排行規(guī)則的描述。根據(jù)情況,可以分成一句話描述和長段描述,依據(jù)榜單性質(zhì)而定。這是權(quán)威性的一部分體現(xiàn),便于用戶理解榜單的排序方式。大部分榜單列表都會有榜單描述或規(guī)則說明。 

 

4.更新信息

 

更新信息反映排行榜更新及維護(hù)的頻率,一般常見的有每日/每周更新,表現(xiàn)榜單是活躍且變動的。

 

四、排行榜的權(quán)威性

 

一般來說,排行榜最重要的就是權(quán)威性(除了娛樂的排行榜等)。權(quán)威性一般有兩個層面構(gòu)成,分別是外在的呈現(xiàn)方式,內(nèi)在的真實(shí)性。這二者缺一不可,并且某種程度上也是相互融合的! 

 

1.內(nèi)在的真實(shí)性。 

真實(shí)性除了來自平臺的客觀數(shù)據(jù)(如熱搜榜的真實(shí)數(shù)據(jù)就是大量用戶搜索),也來自于用戶評價(如好評榜,來自于用戶的好評),當(dāng)這些權(quán)衡因素保持相對穩(wěn)定且可信的時候,榜單就有了真實(shí)性。 

 

那么問題來了,假如榜單是真實(shí)的,那用戶怎么知道呢?表現(xiàn)榜單的真實(shí)性,可以通過規(guī)則介紹、上榜理由、實(shí)際評價信息的展示等方式體現(xiàn)。 

 

2.外在的呈現(xiàn)方式。

呈現(xiàn)方式會很考驗(yàn)視覺的表現(xiàn)能力,榜單設(shè)計的色彩、排榜方式,甚至標(biāo)簽(如熱度標(biāo)簽、皇冠標(biāo)簽)的設(shè)計,都會影響呈現(xiàn)方式的權(quán)威性。人都是視覺動物,榜單的設(shè)計表現(xiàn)對于權(quán)威性是很大的影響因素。 

 

 

五、常見的排行榜結(jié)構(gòu) 

 

一個平臺的榜單,往往不會只有一個,一般都至少有3個榜單。像音樂、閱讀類的應(yīng)用,榜單更是數(shù)不勝數(shù)。

 

這時候,就涉及榜單列表的結(jié)構(gòu)設(shè)計問題。一般可以根據(jù)榜單類型數(shù)量的多少、呈現(xiàn)榜單類型與榜單詳情二者哪個優(yōu)先級更高來判斷。

 

當(dāng)榜單類型多時

 

當(dāng)榜單類型較多,一般排行榜結(jié)構(gòu)會分成榜單列表(主要展示不同榜單類型)和榜單詳情(主要展示單個榜單的詳細(xì)內(nèi)容)。

 

當(dāng)榜單類型少時

 

當(dāng)榜單類型較少,榜單類型一般只占據(jù)頂部的位置,作為功能性入口,點(diǎn)擊進(jìn)入某個榜單詳情。甚至,榜單類型和榜單詳情可以融合成一個頁面。

 

常見的榜單詳情結(jié)構(gòu)

 

假如有多個榜單詳情頁,榜單詳情的排列盡量保持相同結(jié)構(gòu),結(jié)構(gòu)清晰,不讓用戶產(chǎn)生疑慮。因?yàn)榘駟闻帕蟹绞經(jīng)Q定著排名在用戶心目中的位置關(guān)系。 

 

六、排行榜思考 

 

用戶瀏覽榜單的場景,往往是沒有明確的需求,易于接受推薦。對于許多產(chǎn)品而言,榜單對于商業(yè)化有著不小的商業(yè)價值。榜單本身具有客觀屬性,如果加入太多商業(yè)化干預(yù),容易引起內(nèi)容的不客觀性,此時需要仔細(xì)權(quán)衡。

 

設(shè)計榜單時,需要注意這個榜單能否滿足用戶需求,相對明確的榜單而不是只有寬泛的榜單對用戶有更大的價值。比如你要聽歌,你的口味一定不是什么歌都聽,所以你不只是聽整個平臺最火的那些歌。你可能還喜歡動漫歌曲,所以動漫歌曲的排行對你也有很大價值。 

 

榜單的交互框架上有多種結(jié)構(gòu),信息呈現(xiàn)上也各有不同。需要根據(jù)自身產(chǎn)品采用適合的設(shè)計方式,結(jié)構(gòu)上避免散亂、信息上避免過多的信息干擾。

 

 

 

作者:熱風(fēng)_
鏈接:https://www.zcool.com.cn/article/ZMTIxOTQ3Mg==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請注明出處。

 

 

 

藍(lán)藍(lán)設(shè)計(yvirxh.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標(biāo)定制、用戶體驗(yàn)設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

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

銀行金融軟件UI界面設(shè)計、能源及監(jiān)控軟件UI界面設(shè)計氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計、醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計、企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)軟件wpf開發(fā)軟件vue開發(fā)

日歷

鏈接

個人資料

存檔