β

10个关键点,告诉你如何设计产品评论模块

优设-UISDC 3 阅读

这两天一直在构思36氪评论优化方案,也就整理了行业内做评论的常见方法,这篇文章我们就来聊聊设计评论功能时,需要考虑的那些事儿。

总的来看,评论功能的设计,需要考虑如下10个关键点:

一. 展示样式

目前市面上流行样式有平铺式、主题式、盖楼式、对话式、混合式几种。

1. 平铺式

指所有评论都在一个层级,包括原评论,和对评论的回复,并行显示。对于回复评论样式,有的是直接显示回复内容,如微信朋友圈的回复样式;有的是把原评论显示出来,如36氪App线上版本的回复样式。

2. 主题式

指把原评论作为一级评论,对原评论的回复,作为二级评论,排在一级评论下方。也就是说,将一级评论作为「主题」,允许针对某个「主题」展开讨论。相比平铺式评论,主题式评论能让讨论主题更聚焦,让优质评论更能浮出水面,形成讨论氛围。对运营而言,还可以针对优质评论展开讨论,促进曝光,提高运营效果。市面上很多注重评论的内容平台均选用该样式,如贴吧、最右、简书、微博等。

3. 盖楼式

指每次对原评论的回复,都把原评论内容露出,并带上自己的评论,以“圈层”样式呈现,久而久之就形成无限嵌套的方框样式,叫做「盖楼」。将这一样式发扬光大的当属网易新闻,这也是它的特色之一,由此诞生出很多经典评论效果。但是,盖楼式评论在楼层多的情况下势必要进行多层隐藏,且不好对评论进行追踪,视觉效果也容易引起疲劳,不太建议使用。

4. 对话式

指每次对原评论的回复,就是和评论发布者的一次对话,这种对话本身也可分为一级、二级,乃至多级对话,分别是对评论者、评论回复者,回复评论回复者的人,以此类推。知乎就是典型的对话式评论。对话式会让评论互动更鲜明,但其样式的设计却增加了理解成本,慎用。

5. 混合式

指以上几种样式的混合,有的是一级评论用主题式,二级评论用平铺式;有的是一级评论用主题式,二级评论用对话式;还有的是一级主题、二级对话、三级平铺。具体用哪种,也是根据用户理解程度和内容运营倾向性来选择。

二. 排序规则

主流排序规则有按发布时间、按热门程度,再加上人工精选。

1. 按发布时间

通常默认是按发布时间倒序,再进一步可支持用户可选正序、倒序排列。值得注意的是,对主题式评论,通常一级评论默认倒序,目的是让用户看到最新评论,一级评论下的二级评论则是默认正序,目的是让用户理解讨论进展。还有一点,就是一级评论默认倒序的时间,建议取一级评论下,二级评论的最新发布时间,这样能保证一级评论的排序是按评论本身的讨论进展来更新的。

2. 按热门程度

需要计算所有评论的「热度值」,根据此来排序。热度值一般取评论的点赞数、回复数两个维度,按权重进行线性求和计算,有的还支持「点踩数」、「举报数」等负面维度。此外,为了避免马太效应,还要考虑加入时间衰减因子,算法优化方案有很多。

三. 操作行为

主流操作行为有点赞、回复、复制、举报、删除、分享。

四. 跳转逻辑

跳转逻辑,主要是考虑由于发布了评论,或回复了评论,哪些地方会产生相关入口,以及这些入口点击的跳转位置,包括以下。

1. 我发布的

通常会在「我的」里面,或者「消息中心」,可查找自己发布过的评论,这些评论点击后可跳转到对应评论页面。如果是主题式评论,对应跳转到评论二级页。

2. 回复我的

有人回复我的评论,在「我的」或「消息中心」会收到消息,该消息需要可点击跳转到评论页面。

3. 个人动态

用户发布评论或回复评论,都属于个人行为,如果产品存在个人主页,那应该将该行为记录在个人主页,以「动态」形式出现,其他人可在查看用户动态时,找到该用户对哪个文章发表了哪些评论,并支持评论页跳转和文章页跳转。

五. 运营操作

所谓运营操作,是指运营可以从后台干涉用户的评论行为和评论结果。正向干涉包括:评论加精、评论置顶;负向干涉包括:评论屏蔽、评论删除、评论人封禁、敏感词替换等。

1. 正向干涉

2. 负向干涉

六. 被删除/屏蔽后显示逻辑

当某条评论被删除,或屏蔽后,可以有两种做法,要么是直接删除,要么是当前区块保留,被删除文字变成「评论已删除」。尤其是主题式评论,由于某条一级评论可能关联多条二级评论,如果一级评论被删除,其二级评论是否需要全部删除,需要产品经理根据评论价值来决策。建议这种情况还是保留二级评论。

七. 防呆设计

所谓防呆设计,是指需要思考如何通过产品设计,防止用户误操作。包括:

八. 快捷操作

输入文字对用户而言是个高成本的事,而评论本身是个表达态度的渠道,那我们是否可以设计一些简单的交互行为帮助用户迅速表态呢?所谓快捷操作,就是针对这点的解决方案。可以是:

九. 富媒体支持

对某些UGC向的内容产品,评论区甚至支持发静态图、发音频、发GIF动图、发视频,这时也就需要对应的发布流程设计和后台存储逻辑。

十. 细节支持

这里就要从用户体验角度,考虑各种特殊情况的产品细节了,我能想到的比如下面这些。

1. 评论支持识别超链接

2. 发评论时,键盘设置问题

评论框输入评论时,需要考虑是否将「发布」按钮设置在键盘上。如果需要考虑评论换行,那「完成」键应该作为换行键,否则点击“完成”应该是直接提交。

3. 评论点击区域细节

评论区有很多元素,需要告知开发哪些区域可点,点击跳转到哪些地方。如下图所示:

以上就是我能想到的所有做评论功能时,需要注意的方面,希望对大家有帮助。有问题欢迎随时给我留言。

欢迎关注作者的微信公众号: 「互联网悦读笔记」

「好的交互设计还需要注意这些细节」

================ 明星栏目推荐 ================

优优教程网 UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的 知识树专栏 。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航 :国内人气最高的设计网址导航,设计师必备: http://hao.uisdc.com

作者:优设-UISDC
优秀网页设计联盟-SDC-网页设计师交流平台-听讲座,聊设计,找素材,尽在优设网
原文地址:10个关键点,告诉你如何设计产品评论模块, 感谢原作者分享。

发表评论