點(diǎn)贊和評(píng)論對(duì)于內(nèi)容型產(chǎn)品來(lái)說(shuō)是一個(gè)基礎(chǔ)功能 , 但對(duì)于產(chǎn)品設(shè)計(jì)師來(lái)說(shuō) , 深藏一些值得深挖和思考的細(xì)節(jié) 。本文作者對(duì)此進(jìn)行了分析 , 希望對(duì)你有幫助 。

文章插圖
對(duì)于設(shè)計(jì)師來(lái)說(shuō) , 這個(gè)界面看似沒(méi)有任何挑戰(zhàn) , 可能覺(jué)得「不就一列表嘛分分鐘搞定」 , 但其中卻深藏一些值得深挖和思考的細(xì)節(jié) 。
之前在做類(lèi)似需求時(shí) , 我花了些時(shí)間去挖掘這個(gè)界面背后的邏輯 , 并將思考過(guò)程和成果沉淀成文章 , 希望對(duì)你有所啟發(fā) 。
【關(guān)注點(diǎn)贊評(píng)論轉(zhuǎn)發(fā)背后邏輯】這個(gè)功能入口一般在個(gè)人中心 , 并且和其他功能聚合在獨(dú)立的版塊中 , 比如「消息私信」、「我的收藏」、「瀏覽歷史」、「下載管理」等等 。
「我的評(píng)論」功能優(yōu)先級(jí)一般弱于「我的點(diǎn)贊」 , 因此有的產(chǎn)品不會(huì)外顯 , 而是和「我的點(diǎn)贊」聚合到二級(jí)頁(yè)的tab上 , 便于用戶橫劃手勢(shì)切換 。

文章插圖
從業(yè)務(wù)屬性上看 , 貌似是單純的體驗(yàn)導(dǎo)向型功能 , 和業(yè)務(wù)并不搭嘎(其實(shí)并不是) 。
用戶需求上看 , 主要滿足用戶「信息的獲取、調(diào)用和刪除」 。比如瀏覽或查找之前贊、評(píng)過(guò)的內(nèi)容 , 或者刪除自己的評(píng)論 。
根據(jù)BJ Fogg提出的福格行為模型 , 一個(gè)人行為的發(fā)生至少要滿足三個(gè)條件:動(dòng)機(jī)、能力和觸發(fā) 。這個(gè)場(chǎng)景下 , 用戶動(dòng)機(jī)是「信息的獲取、調(diào)用和刪除」 , 觸發(fā)通常是用戶的內(nèi)部觸發(fā)(也就是主動(dòng)發(fā)起的決策和行為) , 能力即用戶在此付出的成本 。
動(dòng)機(jī)和觸發(fā)的可發(fā)揮空間小 , 因此設(shè)計(jì)師能夠發(fā)力的點(diǎn) , 就是降低用戶在此頁(yè)面的能力要求 , 幫助用戶高效得完成查找、閱讀和點(diǎn)擊行為 。

文章插圖
要實(shí)現(xiàn)這個(gè)目標(biāo) , 無(wú)非是縮短路徑、層級(jí)清晰、建少視噪等等 。但是一開(kāi)始的布局框架又該如何搭建?下面 , 我結(jié)合市面主流的內(nèi)容型競(jìng)品 , 從宏觀角度上來(lái)探索是否存在一個(gè)萬(wàn)用的、固定的框架類(lèi)型 。
二、關(guān)于布局框架
因?yàn)闃?biāo)題具有最高的決策權(quán)重 , 因此信息流側(cè)重長(zhǎng)文本展示 。另外 , 「我的點(diǎn)贊、評(píng)論」必定遵循時(shí)間排序來(lái)符合用戶習(xí)慣 , 所以這兩個(gè)因子決定了這個(gè)界面 , 只能以縱向的內(nèi)容流展示 。
但這樣太籠統(tǒng)了 , 通過(guò)內(nèi)容型競(jìng)品的研究拆分 , 我發(fā)現(xiàn)這個(gè)場(chǎng)景下的框架基本分為兩大類(lèi):動(dòng)態(tài)流和列表流 。再細(xì)分的話 , 又可以根據(jù)「用戶模塊」和「互動(dòng)模塊」的有無(wú)分為五類(lèi) , 先來(lái)說(shuō)說(shuō)「我的評(píng)論」 。
1. 我的評(píng)論-雙模塊動(dòng)態(tài)流這個(gè)框架的特征 , 除了必要的內(nèi)容區(qū)外 , 同時(shí)包含了「用戶模塊」和「互動(dòng)模塊」

文章插圖
用戶模塊即包含了用戶頭像、用戶昵稱和發(fā)布時(shí)間的版塊 。這個(gè)模塊符合功能預(yù)期 , 通過(guò)自身信息的露出來(lái)強(qiáng)化「我的」掌控感 。另外頭像錨點(diǎn)也利于視覺(jué)錨定 , 快速瀏覽 。
而互動(dòng)模塊即用戶對(duì)內(nèi)容的操作集合 , 包括點(diǎn)贊、評(píng)論、分享等等 。這個(gè)模塊多是為了強(qiáng)調(diào)互動(dòng) , 引導(dǎo)用戶繼續(xù)參與到內(nèi)容中;
另外 , 騰訊直接把評(píng)論的刪除按鈕外顯并強(qiáng)化了 , 雖說(shuō)對(duì)內(nèi)容有明顯的視覺(jué)干擾 , 但基本符合大部分用戶來(lái)到這里的動(dòng)機(jī) , 對(duì) , 就是來(lái)刪評(píng)的 , 所以倒沒(méi)什么可說(shuō)的 。

文章插圖

文章插圖
2. 我的評(píng)論-單模塊動(dòng)態(tài)流這個(gè)框架的特征 , 是只包含了「用戶模塊」 , 不存在「互動(dòng)模塊」 。競(jìng)品中只有UC這一個(gè)例子 , 互動(dòng)屬性被截?cái)?nbsp;, 讓界面整體更加沉浸 。另外 , 相比前一個(gè)框架 , 屏效也有明顯的提升 。

文章插圖

文章插圖
3. 我的點(diǎn)贊-雙模塊動(dòng)態(tài)流此處可以再細(xì)分兩類(lèi) , 一類(lèi)是共同包含了「用戶模塊」和「互動(dòng)模塊」 , 另一類(lèi)則把「用戶模塊」給替換成了「創(chuàng)作者模塊」 。

文章插圖
前者一共2個(gè)競(jìng)品使用了此框架:知乎和qq瀏覽器 。除了表現(xiàn)層的樣式、布局外基本沒(méi)有什么差別 。

文章插圖
后者則包括頭條和微博 。他們直接保留了原創(chuàng)作者的模塊 , 而且一旦內(nèi)容對(duì)應(yīng)的創(chuàng)作者沒(méi)被你關(guān)注 , 還直接外顯關(guān)注按鈕 。并且樣式上看 , 微博很明顯在特意強(qiáng)化創(chuàng)作者模塊 , 不論是較大的頭像尺寸、還是主色強(qiáng)顯的昵稱和關(guān)注按鈕 。
至于為什么這么搞 , 后面會(huì)說(shuō) 。

文章插圖
4. 我的點(diǎn)贊-單模塊列表流這個(gè)框架的特征 , 是只包含了「用戶模塊」 , 不存在「互動(dòng)模塊」 。和「我的評(píng)論」一樣 , 只有uc一個(gè)競(jìng)品 。相比前者 , 同樣提升了內(nèi)容的沉浸 。

文章插圖

文章插圖
5. 我的點(diǎn)贊-零模塊列表流這個(gè)框架只保留了內(nèi)容模塊 , 因此可以完全聚焦于某一類(lèi)型內(nèi)容的聚合 , 強(qiáng)調(diào)瀏覽效率 , 所以模塊上更加精簡(jiǎn)和單一 。優(yōu)勢(shì)上無(wú)疑是更加沉浸 , 效率更高 , 屏效更高 。

文章插圖
競(jìng)品中 , 網(wǎng)易、騰訊新聞均使用了此框架 。雖然輔助信息用文字的形式標(biāo)明了來(lái)源和評(píng)論數(shù) , 但整體依舊歸屬于內(nèi)容 。

文章插圖
那么問(wèn)題來(lái)了 , 這些框架的背后有什么客觀依據(jù)可以支持?它們和各自產(chǎn)品的業(yè)務(wù)本身主張又有什么關(guān)聯(lián)?
三、框架背后的邏輯
任何內(nèi)容型平臺(tái)的正向循環(huán) , 都離不開(kāi)三個(gè)方面:內(nèi)容創(chuàng)作者、內(nèi)容和內(nèi)容消費(fèi)者 。宏觀上說(shuō) , 內(nèi)容平臺(tái)需要做的就是去不斷得強(qiáng)化這個(gè)閉環(huán) , 讓三者互相賦能 , 以此收獲長(zhǎng)期穩(wěn)定的收益 。

文章插圖
比如平臺(tái)通過(guò)各類(lèi)激勵(lì)政策(如流量包、現(xiàn)金獎(jiǎng)勵(lì))、創(chuàng)作工具(如剪映、各色各樣的道具模板)和對(duì)優(yōu)質(zhì)內(nèi)容的扶持 , 來(lái)激勵(lì)創(chuàng)作者生產(chǎn)內(nèi)容 。優(yōu)質(zhì)內(nèi)容又可以反向提升創(chuàng)作者影響力 。
另外 , 通過(guò)鼓勵(lì)消費(fèi)者對(duì)創(chuàng)作者的關(guān)注 , 來(lái)沉淀關(guān)系鏈 , 一方面內(nèi)容供給滿足個(gè)性化訂閱的需要 , 另一方面反向激勵(lì)創(chuàng)作者持續(xù)產(chǎn)出 。雙方收獲了各自的利益 , 也就更難以離開(kāi)平臺(tái) 。
而創(chuàng)作者和消費(fèi)者之間 , 又是滿足和反哺的關(guān)系 。因此正是這樣的背后邏輯支撐了內(nèi)容型產(chǎn)品的發(fā)展 。
當(dāng)然 , 對(duì)于「我的點(diǎn)贊、評(píng)論」來(lái)說(shuō) , 因?yàn)橛脩舻膭?dòng)機(jī)導(dǎo)致內(nèi)容成分占主導(dǎo)地位 。所以 , 社交屬性、內(nèi)容互動(dòng)的增減與否 , 主要受產(chǎn)品自身定位、以及業(yè)務(wù)方向的影響 。

文章插圖
這也可以解釋為什么微博保留了up主信息模塊 , 就是由于微博本身定位強(qiáng)社交 , 絕大部分的內(nèi)容生產(chǎn)、傳播基于產(chǎn)品內(nèi)沉淀的社交鏈 , 甚至你關(guān)注的人點(diǎn)贊了什么內(nèi)容 , 都會(huì)通過(guò)底tab的紅點(diǎn)來(lái)吸引你去點(diǎn)擊 。

文章插圖
也正因此 , 微博在「我的點(diǎn)贊」界面中 , 采用的是「創(chuàng)作者模塊」來(lái)表達(dá)社交屬性 , 以此鼓勵(lì)、引導(dǎo)用戶去社交互動(dòng) 。此框架下 , 除了內(nèi)容外 , 還強(qiáng)調(diào)了消費(fèi)者對(duì)創(chuàng)作者、及其內(nèi)容的關(guān)系 。
而頭條本身定位是個(gè)性化資訊服務(wù) , 但后續(xù)的業(yè)務(wù)方向也開(kāi)始向社交傾斜 , 不論是早前就有的新人推薦卡片、微頭條還是創(chuàng)作者門(mén)檻的降低 , 都意味著頭條正在朝著微博社交化的道路不斷邁進(jìn) 。
頭條目的很明顯 , 將過(guò)去松散的用戶關(guān)系 , 通過(guò)社交鏈的沉淀來(lái)轉(zhuǎn)化為關(guān)注+粉絲的強(qiáng)關(guān)系 。(提一嘴 , 頭條和微博一開(kāi)始其實(shí)是互惠抱團(tuán)的關(guān)系 , 后來(lái)頭條開(kāi)始涉足社交后 , 因?yàn)橛|碰到了微博對(duì)市場(chǎng)的獨(dú)有控制 , 兩家就開(kāi)始不斷互撕 , 其實(shí)歸根究底還是為了利益)
也正因此 , 頭條的框架和微博一致 , 都采用了「創(chuàng)作者模塊」 , 而非常規(guī)的「用戶模塊」 。
而其他的雙模塊框架 , 即「用戶模塊」+「互動(dòng)模塊」 , 除了內(nèi)容外 , 則只強(qiáng)調(diào)消費(fèi)者和內(nèi)容的互動(dòng)關(guān)系 , 這和產(chǎn)品本身并非強(qiáng)社交的定位有關(guān) 。
單模塊框架 , 除了內(nèi)容外 , 只強(qiáng)調(diào)消費(fèi)者個(gè)人身份 , 此時(shí)缺失了和內(nèi)容、創(chuàng)作者的關(guān)系 , 互動(dòng)感弱化 , 沉浸感開(kāi)始強(qiáng)化 。
零模塊框架 , 則讓用戶完完全全得聚焦到內(nèi)容當(dāng)中 , 沉浸感最高 。此時(shí)「我的點(diǎn)贊」更多得類(lèi)似收藏功能 , 來(lái)作為承載個(gè)性化內(nèi)容的容器 。
四、使用場(chǎng)景總結(jié)
最后 , 來(lái)大致梳理下每種框架的使用場(chǎng)景 。
如果產(chǎn)品當(dāng)前定位與微博類(lèi)似都傾向于強(qiáng)社交 , 或者業(yè)務(wù)方向開(kāi)始向社交偏移 , 那么可以使用內(nèi)容+創(chuàng)作者模塊+互動(dòng)模塊的框架(「我的評(píng)論」涉及用戶自己的評(píng)論 , 需要用用戶模塊);
如果產(chǎn)品當(dāng)前對(duì)社交沒(méi)有那么重的需求 , 那么可以根據(jù)實(shí)際場(chǎng)景細(xì)分兩類(lèi):
1.希望強(qiáng)調(diào)用戶對(duì)內(nèi)容的互動(dòng):可使用內(nèi)容+用戶模塊+互動(dòng)模塊的框架;
2.希望用戶沉浸于內(nèi)容中 , 可以使用內(nèi)容+用戶模塊 , 或者純內(nèi)容的框架 。前者的優(yōu)勢(shì)在于保留互動(dòng)以及通過(guò)自身信息的露出來(lái)強(qiáng)化「我的」掌控感 , 另外頭像錨點(diǎn)也利于視覺(jué)錨定 , 快速瀏覽;后者的優(yōu)勢(shì)在于高屏效和完完全全的沉浸感 。
一句話 , 根據(jù)產(chǎn)品當(dāng)前的狀態(tài)和訴求 , 框架沒(méi)有絕對(duì)的對(duì)錯(cuò)之分 , 只是適不適合而已 。
五、最后
任何的設(shè)計(jì)形式 , 任何看似簡(jiǎn)單的細(xì)節(jié) , 必然存在一個(gè)客觀依據(jù)作為支撐 , 要么是業(yè)務(wù)、要么是用戶 。所以 , 我們?cè)O(shè)計(jì)師要做的 , 就是多從這兩個(gè)維度 , 不斷得去理性思考、深挖背后的邏輯 , 從而做出更合理的決策 , 讓設(shè)計(jì)有理有據(jù) 。
希望這篇干貨對(duì)你有所啟發(fā) 。
我是Andrew , 我們下期見(jiàn) 。
專(zhuān)欄作家
Andrewchen;微信公眾號(hào):轉(zhuǎn)行人的設(shè)計(jì)筆記 , 人人都是產(chǎn)品經(jīng)理專(zhuān)欄作家 。中科院碩士自學(xué)轉(zhuǎn)行 , 擅長(zhǎng)通過(guò)文字幫助年輕設(shè)計(jì)師成長(zhǎng)和提效 。延遲滿足、長(zhǎng)期主義 。
題圖來(lái)自 Unsplash , 基于CC0協(xié)議 。
該文觀點(diǎn)僅代表作者本人 , 人人都是產(chǎn)品經(jīng)理平臺(tái)僅提供信息存儲(chǔ)空間服務(wù) 。
推薦閱讀
- 贊美美女的句子
- 贊美牡丹花的語(yǔ)句
- 快手作者贊過(guò)怎么顯示
- 朋友圈晚安贊多的說(shuō)說(shuō)簡(jiǎn)短 睡前發(fā)個(gè)朋友圈晚安語(yǔ)
- 很多贊的晚安朋友圈的句子
- 王小波的文學(xué)評(píng)論
- 好雨知時(shí)節(jié)當(dāng)春乃發(fā)生贊美了什么
- 贊美過(guò)客的句子 形容過(guò)客的說(shuō)說(shuō)
- 優(yōu)酷評(píng)論怎么刪
- 抖音怎么回復(fù)評(píng)論又不@別人,抖音評(píng)論位置怎么定位到其它城市
