這兩天一直在構思36氪評論優化方案，也就整理了行業內做評論的常見方法，這篇文章我們就來聊聊設計評論功能時，需要考慮的那些事兒。

總的來看，評論功能的設計，需要考慮如下10個關鍵點：

• 展示樣式
• 排序規則
• 操作行為
• 跳轉邏輯
• 運營操作
• 被刪除/屏蔽后顯示邏輯
• 防呆設計
• 快捷操作
• 富媒體支持
• 細節支持

一. 展示樣式

目前市面上流行樣式有平鋪式、主題式、蓋樓式、對話式、混合式幾種。

1. 平鋪式

指所有評論都在一個層級，包括原評論，和對評論的回復，并行顯示。對于回復評論樣式，有的是直接顯示回復內容，如微信朋友圈的回復樣式；有的是把原評論顯示出來，如36氪App線上版本的回復樣式。

2. 主題式

指把原評論作為一級評論，對原評論的回復，作為二級評論，排在一級評論下方。也就是說，將一級評論作為「主題」，允許針對某個「主題」展開討論。相比平鋪式評論，主題式評論能讓討論主題更聚焦，讓優質評論更能浮出水面，形成討論氛圍。對運營而言，還可以針對優質評論展開討論，促進曝光，提高運營效果。市面上很多注重評論的內容平臺均選用該樣式，如貼吧、最右、簡書、微博等。

3. 蓋樓式

指每次對原評論的回復，都把原評論內容露出，并帶上自己的評論，以“圈層”樣式呈現，久而久之就形成無限嵌套的方框樣式，叫做「蓋樓」。將這一樣式發揚光大的當屬網易新聞，這也是它的特色之一，由此誕生出很多經典評論效果。但是，蓋樓式評論在樓層多的情況下勢必要進行多層隱藏，且不好對評論進行追蹤，視覺效果也容易引起疲勞，不太建議使用。

4. 對話式

指每次對原評論的回復，就是和評論發布者的一次對話，這種對話本身也可分為一級、二級，乃至多級對話，分別是對評論者、評論回復者，回復評論回復者的人，以此類推。知乎就是典型的對話式評論。對話式會讓評論互動更鮮明，但其樣式的設計卻增加了理解成本，慎用。

5. 混合式

指以上幾種樣式的混合，有的是一級評論用主題式，二級評論用平鋪式；有的是一級評論用主題式，二級評論用對話式；還有的是一級主題、二級對話、三級平鋪。具體用哪種，也是根據用戶理解程度和內容運營傾向性來選擇。

二. 排序規則

主流排序規則有按發布時間、按熱門程度，再加上人工精選。

1. 按發布時間

通常默認是按發布時間倒序，再進一步可支持用戶可選正序、倒序排列。值得注意的是，對主題式評論，通常一級評論默認倒序，目的是讓用戶看到最新評論，一級評論下的二級評論則是默認正序，目的是讓用戶理解討論進展。還有一點，就是一級評論默認倒序的時間，建議取一級評論下，二級評論的最新發布時間，這樣能保證一級評論的排序是按評論本身的討論進展來更新的。

2. 按熱門程度

需要計算所有評論的「熱度值」，根據此來排序。熱度值一般取評論的點贊數、回復數兩個維度，按權重進行線性求和計算，有的還支持「點踩數」、「舉報數」等負面維度。此外，為了避免馬太效應，還要考慮加入時間衰減因子，算法優化方案有很多。

三. 操作行為

主流操作行為有點贊、回復、復制、舉報、刪除、分享。

• 點贊：要考慮點贊、取消點贊后的贊數變更邏輯，是否需要服務端同步更新，點擊后的動效，點贊后的消息提醒機制等。
• 回復：要考慮回復彈窗的出現、收起時機，回復字符限制，回復是否支持換行符，是否支持鍵盤提交，是否允許空字符提交，回復頁面彈窗大小，按鈕布局等。
• 復制：要考慮可復制區域，復制交互（長按/點擊），復制后的提示效果等。
• 舉報：要考慮是舉報文字還是舉報人，舉報后的提示，舉報后的數據審核等。
• 刪除：要考慮發布人支持刪除功能，刪除時是否出現彈窗提醒？刪除后狀態何時同步？刪除是硬刪除還是軟刪除？等等。
• 分享：要考慮可分享平臺，分享文案，分享后的打開樣式，是分享成網頁還是分享成圖片等。

四. 跳轉邏輯

跳轉邏輯，主要是考慮由于發布了評論，或回復了評論，哪些地方會產生相關入口，以及這些入口點擊的跳轉位置，包括以下。

1. 我發布的

通常會在「我的」里面，或者「消息中心」，可查找自己發布過的評論，這些評論點擊后可跳轉到對應評論頁面。如果是主題式評論，對應跳轉到評論二級頁。

2. 回復我的

有人回復我的評論，在「我的」或「消息中心」會收到消息，該消息需要可點擊跳轉到評論頁面。

3. 個人動態

用戶發布評論或回復評論，都屬于個人行為，如果產品存在個人主頁，那應該將該行為記錄在個人主頁，以「動態」形式出現，其他人可在查看用戶動態時，找到該用戶對哪個文章發表了哪些評論，并支持評論頁跳轉和文章頁跳轉。

五. 運營操作

所謂運營操作，是指運營可以從后臺干涉用戶的評論行為和評論結果。正向干涉包括：評論加精、評論置頂；負向干涉包括：評論屏蔽、評論刪除、評論人封禁、敏感詞替換等。

1.?正向干涉

• 評論加精：支持運營挑選優質評論，在前端給予「精華」的標記，有的App也叫「神評論」、「有用」等。
• 評論置頂：如字面意思，將某個評論，置頂到評論列表首位，給予公示。

2.?負向干涉

• 評論屏蔽：將某條評論暫時對他人不可見。體驗更好的做法，還可以通知發布評論人其內容被屏蔽，要求其修改后申請解除屏蔽，經審核后評論可重新出現。
• 評論刪除：直接從后臺將評論刪除，不可恢復。
• 評論人封禁：通常是和「舉報」關聯，對于頻繁發布垃圾評論者予以封禁，令其不可再發評論。當然也應該允許其申請解封。
• 敏感詞替換：通常做法是構建敏感詞庫，如果評論某些文字命中詞庫，則將敏感詞替換為「*」。

六. 被刪除/屏蔽后顯示邏輯

當某條評論被刪除，或屏蔽后，可以有兩種做法，要么是直接刪除，要么是當前區塊保留，被刪除文字變成「評論已刪除」。尤其是主題式評論，由于某條一級評論可能關聯多條二級評論，如果一級評論被刪除，其二級評論是否需要全部刪除，需要產品經理根據評論價值來決策。建議這種情況還是保留二級評論。

七. 防呆設計

所謂防呆設計，是指需要思考如何通過產品設計，防止用戶誤操作。包括：

• 評論草稿箱：也就是說評論框輸入文字，未發送前，如果誤點擊了取消區域，自動替用戶保存當前輸入文字，而再次出現評論框時，還能將之前文字恢復。這個功能還有個降級方案，就是用戶取消輸入框時，彈出Alert告知用戶是否要取消。
• 評論字數提醒：當字數輸入過多時，通過紅字提醒用戶超限，「發送」按鈕置灰。

八. 快捷操作

輸入文字對用戶而言是個高成本的事，而評論本身是個表達態度的渠道，那我們是否可以設計一些簡單的交互行為幫助用戶迅速表態呢？所謂快捷操作，就是針對這點的解決方案。可以是：

• 快速表態：在評論區設計表態按鈕，比如，踩、一般、贊、太棒了，用戶直接點擊即可，類似投票行為。典型案例如天天快報、橘子娛樂。
• 評論區直接輸入表情/顏文字：用戶可在發評論時，選擇表情圖發布，或快速選擇顏文字發布。像搜狐新聞、鳳凰新聞、網易新聞都可以直接發表情。

九. 富媒體支持

對某些UGC向的內容產品，評論區甚至支持發靜態圖、發音頻、發GIF動圖、發視頻，這時也就需要對應的發布流程設計和后臺存儲邏輯。

十. 細節支持

這里就要從用戶體驗角度，考慮各種特殊情況的產品細節了，我能想到的比如下面這些。

1. 評論支持識別超鏈接

• 超鏈接的識別邏輯：需要頭部是http或https，尾部是空格進行識別。
• 超鏈接的字數計算：對于限制字數的輸入框，超鏈接可以統一為10個字符。
• 超鏈接發布后的顯示樣式：簡單的可以直接顯示鏈接地址。
• 好一點的顯示為「鏈接地址」四個字。
• 再好一點的取鏈接地址對于網址的title顯示，如知乎。

2. 發評論時，鍵盤設置問題

評論框輸入評論時，需要考慮是否將「發布」按鈕設置在鍵盤上。如果需要考慮評論換行，那「完成」鍵應該作為換行鍵，否則點擊“完成”應該是直接提交。

3. 評論點擊區域細節

評論區有很多元素，需要告知開發哪些區域可點，點擊跳轉到哪些地方。如下圖所示：

以上就是我能想到的所有做評論功能時，需要注意的方面，希望對大家有幫助。有問題歡迎隨時給我留言。

歡迎關注作者的微信公眾號：「互聯網悅讀筆記」

「好的交互設計還需要注意這些細節」

• 《輕松看懂規范！詳解組件控件結構體系之單元控件類》
• 《輕松看懂規范！詳解組件控件結構體系之提示類》
• 《輕松看懂規范！詳解組件控件結構體系之加載類》
• 《輕松看懂規范！詳解組件控件結構體系之網絡異常類》
• 《輕松看懂規范！詳解組件控件結構體系之引導類》
• 《輕松看懂規范！詳解組件控件結構體系之導航類》
• 《輕松看懂規范！詳解組件控件結構體系之空數據類》
• 《輕松看懂規范！詳解組件控件結構體系之操作類》

================明星欄目推薦================

優優教程網： UiiiUiii.com 是優設旗下優質中文教程網站，分享了大量PS、AE、AI、C4D等中文教程，為零基礎設計愛好者也準備了貼心的知識樹專欄。開啟免費自學新篇章，按照我們的專欄一步步學習，一定可以迅速上手并制作出酷炫的視覺效果。

設計導航：國內人氣最高的設計網址導航，設計師必備： http://hao.uisdc.com