发布时间：2023-11-14 分类： 电商动态
无论是设计产品还是功能，“五个层次的用户体验”将贯穿始终，从产品的骨架方向开始，逐步丰富和完善，直至处理细节。
近年来，无论是媒体，社交，电子商务，音乐，视频，移动应用程序都变得越来越成熟，它们正在促进用户之间强弱联系。各种应用程序中的“注释”功能已成为其中不可或缺的一部分。 "意见”的不再仅仅为了用户的意见而使用用户的意见，而是在屏幕后面隐藏社区关系。在许多应用中，依靠这种“四个或两个方言”的社区关系，存在着无限的产品智能。
在移动应用程序在PC网页上的使用频率的背景下，人们在不同的场景，有限大小的屏幕上体验不同复杂的评论活动，即使它是一个多方面的行为，设计也没有跟进工作的方式，让我们一起讨论。
假设您正在设计一个新的应用程序并且最初认为它需要评论。您如何看待设计？
无论是设计产品还是功能，“五个层次的用户体验”将贯穿始终，从产品的骨架方向开始，逐步丰富和完善，直至处理细节。
只需查看以下五个级别：
“战略层”：五个要素中最重要的一层是用户体验的起点。战略可以发展和变化，这决定了整个产品的方向。
“范围层“：战略层可视化的第一步。根据运营商和用户的需求，我们可以弄清楚如何实现战略目标并提供何种功能。
“结构层”：开放交互设计的第一步是信息架构的设计。将分散的需求合并为一个并合理地展示它们。
“框架层”：交互设计的第二步，在此步骤中将确定非常详细的界面布局，以确定整个产品的上下文。
“表现层”：视觉设计的过程也是用户会注意到的第一件事，它是冰山的最高点。界面中的配色方案和样式都在此步骤中完成。
这五个级别可以很好地指导设计思路。我们可以单独解决评论区域的设计问题，并使用5层提出相应的指导性问题（请自下而上查看）：
使用五个级别的用户体验来提出指导性问题
接下来，我将逐层解释，但我将重点关注与“交互设计”相关的两个层。
I.战略层：确定产品类型和目标
在初始阶段，您需要首先确定产品的类型。常见的移动应用类型，如社交，电子商务，服务，自媒体，新闻，社区，音乐，视频。但随着互联网的发展，越来越多的应用程序正在转向多种类型。采取板栗：小红树的“社区+电子商务”的特点，其优势明显，用户的粘性显着增加，这对小红树构成了非常有力的障碍。多种类型的出现显示了产品的更多可能性，并且是制造产品的一种智慧。如何确定类型取决于产品目标的设置——什么问题解决了？为了谁？如何计算成功？确定产品类型后，有一个总体方向，每个步骤都基于战略层面的开发。
2.范围层：用户有哪些需求？你为什么要发表评论？
根据产品的战略目标，是时候开始思考以及可以实现哪些功能？如果您想提供评论，首先需要考虑用户评论的原因。我们从“撰写评论”和“查看评论”中进行分析。
用户为什么要撰写评论？一般而言，通过查看市场中的主流应用和个人体验，用户撰写评论的动机可分为三类：沟通感受，表达意见和寻求帮助。为什么用户想要阅读评论？动机与撰写评论非常不同，而且频率要高得多。它们可以分为四类：依靠评论来做出决定，找到答案，找到共鸣，以及查看反馈（例如朋友圈）。
仔细分析用户的动机可以告诉产品提供此功能的位置。如果您的应用程序被策略层和范围层过滤，则结论是它不需要任何注释功能，这也是产品方向上的重要一步。例如，唯品会在移动应用上不会有评论功能。其原因在于其快速销售的功能，当用户在收到货物后想要赞美或吐痰时，相应的产品可能已经曙光，并且评论已经失去了意义。
结构层：如果您需要评论，使用什么样的演示文稿？
在我们了解了用户评论的许多动机之后，即需求来源，如何可视化分散的需求？魔术就在这一步。
我们仍然从两个方面进行分析：“写评论”和“看评论”。
3.1撰写评论
这个动作既轻又重，轻点击图标，这将是一个漫长的故事。如何设计入口以触发评论？
3.1.1单击图标
社交的赞誉，多媒体的下载和共享，电子商务的收集，社区的顶级和步骤，可以非常准确地表达用户的态度。怎么选择？
带有“评论”的常见图标特征
"像”的/“收藏" &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&通过程度，“像”"程度;收集" "收集""，"顶”的类似，只有最接近产品语义的应用程序出现在应用程序中;并且“下载” && quoquo;分享”意味着更高层次的喜欢，“下载”是一种想要长时间保留一件事的态度，而“分享”是为了促进喜欢的感觉，让更多的人喜欢它，所以更加激烈。可以根据用户的需要选择上述功能。
“靴”的——无论是在电子商务，音乐视频，社交群体，面向服务的应用中，都存在类似于“踩踏”语义的功能，例如淘宝中的“坏评论”，音乐“对应用程序不感兴趣”，“知道”等等。不同意" ;.在社交应用程序中，没有任何实例，只是它已经在Facebook上出现了很短的时间。因此，在设计“踩踏”功能时，您需要仔细考虑用户的玻璃心。如果您的应用是社交，特别是强大的社交，则不建议使用。
3.1.2编辑文本
用户在上一篇文章中提到的三个主要动机是：感情交流，意见表达和求助。它们的特征不同，导致不同的评论形式。
（1）传达感情
大多数出现在强大的关系社交应用程序中，例如微信朋友圈。特点：非常有针对性和即时性。因此，需要在每个人的活动之后设置撰写评论的切入点，如下所示：
社交评论条目
（2）表达意见
它可分为渐进式，一般见解，态度判断和深入讨论三个层次。
1）一般见解
包括对来自媒体，音乐，新闻等的内容的评价，反馈的期望不高。特点：简单，快速，即时。所以入口需要设置在方便的点击和明显的位置。考虑到拇指触摸最舒适的区域，您可以将输入框放在页面底部，如下所示：
一般见解评论门户代购源码网站
一些实用的参考文献：
例1
2）态度判断
通常在消费后或体验后进行评估。特点：非即时性— —时间体验，如网上购物，滑行，看电影。因此，当用户没有体验时，不应提供门户，识别用户体验完成的时间点，并收集用户完成的订单，并提供评估门户，如下所示：/p>
态度评估入口
一些实用的参考文献：
例2
在消费者参考示例中，有一个例外——公众意见。由于无法准确识别用户是否在商店中，因此它是一个评论应用程序，因此其评估门户设置在一个公共位置。此外，要注意这些评论的及时性，例如评估过了一年后住过的酒店是否有意义。因此，在诉讼时效之后，不应允许用户发表评论。
3）讨论主题
对问题的深入讨论，用户表达的愿望是强烈的，并且反馈的期望非常高。特点：长度可能更长，即时。对于这种评论，您应该提供一个具有强烈写作氛围的单独页面，如下所示：
主题讨论评论条目
一些实用的参考文献：
例3
（3）帮助
在评论中提出问题通常会得到其他人或房东的答案。特点：简单，快速，即时，类似于刚刚提到的“一般见解”功能，因此表达式类似，方便点击和明显的位置。实用参考：
例4 - 活得好，网友询问家具链接
3.2见评论
在上一级，我们分析了用户查看评论的四种动机：依靠评论来做出决策，找到答案，找到共鸣，并查看反馈。还有必要根据其不同的特征设计不同的演示。
3.2.1依靠评论做出决定
用户的支出决策通常需要基于其他人对产品的评估。特点：评论数量越来越多，需要引导门户代购源码网站，评论之间没有互动，并且有即时性。由于数量的增加，为了保持页面长度稳定，有必要隔离注释并创建新页面;但需要一个指导门户代购源码网站，因此您可以将热门/最新评论放在上一页;注释之间没有交互，只需提供简单的注释列表，如下图:
所示如何帮助决定如何做出决定
一些实用的参考文献：
例5
这种类型的显示器可以称为：半沉浸式。
3.2.2寻找答案
搜索问题并找到您想要的答案。特点：问题很短，评论是互动的，并且有即时性。由于问题的简洁性，页面底部仍有很多空间，可以跟随瀑布评论;注释之间的交互可以通过嵌套或跳转来显示。选择哪一个取决于评论内容的长度，简短评论您可以使用分层嵌套，如果产品性质要求评论是一定长度，建议使用跳转方法，如下所示。
左：嵌套，右：跳
一些实用的参考文献：
例6
可以调用这种显示：瀑布流+嵌套/瀑布流+跳
3.2.3寻找共鸣
电影评论，书评和音乐评论可以帮助观众找到共鸣。
（1）音乐评论
特点：评论简短，偶尔互动，即时。音乐释放了用户的眼睛并且可以实时看到评论，但是播放页面没有操作空间，因此您需要提供独立的沉浸式页面显示评论，可以嵌套交互式评论，如下所示：
例7
这种类型的演示可以称为：沉浸式
（2）影评人，书评
特点：有长短评论，评论是互动的，有即时性。在页面中，您需要分隔长注释和短注释区域。为了避免列出两个注释，需要将两个页面分成新页面。在新页面中，由于长注释较长，请使用列表管理。需要将其剪切为统一长度，这会导致完整的评论再次被隔离到新页面。因此，简短审核需要两页，长期审核需要三页，如下所示。
电影评论，书评方法
对于长期审查和简短审查本身，它也相当于半沉浸式演示。
3.2.4查看反馈
在发布了一圈朋友或文章后，用户经常迫不及待地想看到反馈。特点：评论数量有限，互动性和即时性。由于评论与文本非常相关并且通常更简洁，您可以使用瀑布来显示方式，您可以参考微信朋友圈。
以上是针对用户在“撰写评论”和“查看评论”时的不同动机，并推荐相应的界面显示方法。这些结论不具有权威性，但可以作为思考的切入点。完成此步骤后，注释区域的显示使用多个接口，并且可以确定如何跳转。下一步是开始考虑界面的具体内容。
4.框架层：如何使评论顺序更有意义？
在用户完成评论后，他们会不自觉地问这样一个问题：我的评论在哪里？您的评论在哪里，具体取决于评论的排序方式。订购是合理的，并且标准因不同的用户需求而不同。仍然基于用户评论的四个动机：依靠评论做出决定，找到答案，找到共鸣，并查看反馈以进行分析。
4.1依靠评论做出决定
从上面可知，这种需求主要发生在电子商务和服务应用中。商家给出的评论列表与消费者真正期望看到的完全不符。商家有一些规则来确定评论的顺序，例如评价单词的数量，图片的数量，用户信用的等级，赞美的次数等，以高质量的评论，甚至花钱购买好评，导致用户的第一眼必须得到好评，而商品不一定真的那么好。因此，有必要帮助消费者看到更客观的评价，例如按时间排序，提供赞美/中/差之间的比例，以及仅查看图片。
4.2寻找答案
答案有两种，一种是肯定是非，另一种是仁慈的仁慈，智慧的智慧。刷这两个答案时，用户的行为略有不同。
每个人都必须熟悉这类问题：XXXXX有哪些经验？这是一个没有正确答案的典型问题。在查看评论时，用户通常希望提出更多不同的意见。甚至一起参与讨论。在您无法判断是非的情况下，您只能使用高质量和低质量来安排评论的顺序，因此评论中的单词数量，批准和不批准的比例，受访者的数量，用户的粉丝数量和回复问题次数等用作判断其质量的因素。
对于另一个只能用正确和错误回答的问题，在用户得到某个响应之后，它将停止刷牙。因此，对于这种类型的评论，所谓的“热门”并不一定有效，“准确性”是用户真正需要的。例如，在百度的知识中，您经常会看到一个简单的问题。在一楼，您复制并粘贴一些文章和论文来回答问题，但答案可以用简洁的句子概括。因此，对于这样的答案的分类，单词的数量，批准的数量，答复的数量和奖励的数量通常不一定表示问题，并且在提问者实际验证之后，“认证标记”答案可以作为一个非常重要的指标。
4.3寻找共鸣
电影评论，书评和音乐评论中的评论经常受到质疑，用户很容易陷入评论的漩涡中。由于这些评论的灵活性，对大量未归类的评论进行排序似乎是不合理的。由于它是“找到共鸣”，用户必须有自己的目的，所以在提供评论区域时，你能考虑添加一些光线筛选，例如，对于电影和电视剧，你可以允许用户选择数量剧集或书中的主要人物，可以在每个过滤条件下提供章节筛选，然后根据单词数量，批准数量，响应数量，用户的影响程度和级别进行排序。
4.4查看回复
此处显示的所有注释均适用于用户。在这种情况下，用户的注意力更多地集中在每个回复的内容上，但订单要求相对简单，因此保存完好的“上下文”对应。 ，按时间表排序。
在上述场景中，为了实现排序规则，大多数用户的合作是必不可少的。例如，根据批准，拒绝，响应数量等的顺序，有必要让用户喜欢，点击和回复。因此，您需要在每个注释上设置这些功能，如图:
所示网易云音乐 - 光互动决定了秩序
以上是对评论区域的反映 - ——注释的顺序，可以在其他页面上使用相同的方法。将叶子添加到已设置的帧中，整个页面的详细信息将逐渐变为每行文本，每个图标，然后您可以进入最后一层工作。
V.表示层：如何设计图标，字体和其他元素以保持界面和谐？
视觉设计的结果是用户首先接触的对象。人们通常使用“看起来很好，很丑，很酷，很清爽”来描述他们对整个应用程序的第一感觉。有时，视觉设计的目的不仅仅是为了美丽和凉爽。比这更重要的是如何保持应用程序中所有界面的统一和和谐。这些方面不仅适用于视觉设计师。
5.1风格&颜色
应用程序的整体风格可以实现或展平，颜色可以更多碰撞，它可以非常优雅。选择哪种样式取决于产品的性质和用户的使用场景。
本文中提到的所有应用程序主要基于功能和文本信息，并且通常持续一段时间（例如购物，刷牙），用户对内容本身的关注度高于界面元素的外观，因此，文本内容的呈现需要明确，不适合使用过强的对比色，并且不适合难以识别。在确保可读性的前提下，尽量保护用户的眼睛，延缓疲劳。常用的背景颜色值是eeeeee。
5.2字体
为了使页面保持和谐，应用程序中应该只有两种类型的字体。不清楚和繁琐的字体匹配将导致整个画面失调，甚至听到一点点低音“rdquo;
字体混搭的效果
因此通常在整个文本中只需要一种类型的字体，并且通过放大字体大小或粗体来处理突出显示的部分。
iOS中常用的中文字体：Apple Simplified Black，Founder Lanting Black，Holly Black，Chinese Fine Black;英文字体：Helvetica，
适用于Android的常用中文字体：Noto，Siyuan Blackbody;英文字体：Roboto。
常用字体大小：标题40-42px，加上文本号32px，侧文26px，小字20px。
字体颜色：很少看到纯黑白配色，通常文字会使用低调而清晰的深灰色，颜色值333333;二级文字颜色可稍浅，色值666666;和辅助信息小字符使用浅灰色，颜色值999999.
通过这种方式，字体具有层次感和节奏感，并且信息的焦点也在隐形中突出显示。
5.3图标
任何界面设计中的图标都是不可避免的。如何确保它们易于阅读，一致且美观？
5.3.1语义
该图标取代了更易读的文本描述，因此其语义通信的准确性非常高。设计图标时要小心：
（1）遵循主流设计
不合适的创新可能会带来更大的认知负担。例如，您认为这两个图标可以准确地表达“下载”的含义吗？
这是“下载”的含义吗？
（2）类似的语义需要更深入的分析
同样的表达是“赞美”，社交应用程序中的语义与社交应用程序中的语义不同。例如，作为一种交流情感的工具，你更喜欢“一颗心”，还是喜欢“大拇指？”显然，对于朋友之间的赞美，“心”可以更准确，对于一个客观的答案，知道，“拇指“可以带来更多的成就感。
5.3.2尺寸
在图标的大小设计中，您需要注意：
（1）点击区域足够大
在有限的手机屏幕上，点击的舒适区域更受限制。人手指触摸屏幕的最小点击区域约为44px * 44px。图标的设计大小可以通过视觉效果来确定，但是开发范围应该足够大。
（2）尺寸不宜过多
虽然尺寸可以帮助用户区分信息的重要性，但是尺寸过小会使界面非常混乱。例如，以下比较：Shrimp Music的主页至少有3种尺寸的图标，这有点令人困惑，网易云音乐主页上的图标大小相同，界面看起来干净整洁。如下图所示：
例8
（3）注意视差平衡
相同的尺寸和大小，不同的形状，会导致面积比导致视差，与图标的边框相同，尺寸看起来不同，所以应该在参考尺寸范围内调整。
视差平衡
5.3.3样式
图标样式的一致性对整个页面的影响更大。请注意以下事项：
（1）正面和负面形式是一致的
拼写图标基于脸部绘制的图标，具有大面积和大视觉强度。由“线”绘制的负图标简单而抽象，具有稍高的理解阈值和较低的视觉强度。可用于表示选定/未选定状态，如例9所示，但在相同状态下，不建议混合，如例10所示：
示例9 - 选择为正形状，未选择为负形式
例10 - 未经检查，以两种方式混合，不够均匀
（2）细节以同样的方式处理
处理细节，包括圆角和直角的设置，线条粗细的均匀性，图标上的断点处理等。例如，在下图中，每组图标都用类似的细节处理，整体外观具有非常强的一致性。
图标来自http://www.iconwerk.com/
结论
我在这看到真爱。我有这篇文章的原因是因为有一天我的同事问我一个问题：
“移动应用程序设计的模板是什么？你怎么看这样的应用程序是如何布局的？“rd”;
当我讨论评论区时，我还开放了各种应用程序体验，发现表单非常多样化，所以我开始思考为什么，最后我有了这个“不成熟的小建议”，感谢同事。
文中有遗漏或不准确之处，欢迎您制作砖块。
最后，感谢您阅读^ _ ^
作者：Dannii
资料来源：https://www.jianshu.com/p/419df3865524
本文由@Dannii授权，未经作者许可复制。
该地图来自Pexels，基于CC0协议
