面对复杂的信息，设计商店卡片时该怎么办？

对于面对复杂的信息，设计商店卡片时该怎么办？想必网友都想知道，关于大众点评如何增加评分标签这样的话题一直都是大家想了解的，那让小编为各位揭秘案吧！

虽然商店卡的组成部分的表现形式与产品卡有些相似，但信息的排列和组合程度仍然存在差异。你把信息列出来吗？在这篇文章中，笔者根据自己的经历进行了分享和整理。

1.组件介绍

说到商店卡，大家的第一反应都是“这不是类似于礼品卡吗？”我。

是的，你是对的。由于商店是商品的抽象集合，因此其组件表示与产品卡上的配置表示没有本质上的不同。然而，产品卡通常具有比产品卡本身更多的字段，包括产品卡本身。所以设计这个组件的挑战在于如何合理地安排信息。

总结和布局信息是UI设计中的基本技能之一，遇到包含大量信息的组件越多，这项技能就变得越重要。

但经过长时间的观察，我发现初学者缺乏驾驭多信息排版的能力，大家更注重“视觉”，在某些方面忽视了“信息”的重要性。一个具体的症状是，当你要添加的字段太多时，你会急于将它们随意排列。

2.使用场景

商店卡主要应用于拥有多个商户的应用，行业包括外卖、餐饮、住宿、理发、健身等。

不过，在日常使用的应用中，礼品卡出现最多的是饿了么、美团、大众点评，而不是淘宝、京东等超大型综合电商应用。非常不一样。

淘宝、京东的浏览流程是从特定商品到店铺，即主流程，而美团、饿了么、大众点评则恰恰相反先选择店铺，再选择具体餐食。两者的区别就像超市和购物中心一样，在超市选择产品时，首先想到产品是什么，然后再考虑品牌，但在购物中心就不一样了。首先对商店和品牌感兴趣，然后对商店感兴趣。我应该在商店买什么？

因此，淘宝、京东对商品卡的需求远高于店铺卡，而美团、饿了么则更看重后者，内在逻辑也来源于此。

因此，商店卡的主要应用场景是类似于前面提到的后一种购物中心模式的应用程序。

3、设计要点

1布局

最常用的商店卡使用列表视图，其布局与产品卡的列表视图几乎相同，但商店卡通常包含更多信息，因此不存在信息缺乏的题。信息胜过图片。底部跨度至少可以覆盖整个垂直空间。

2保存卡片内容

店卡的内容和各种商家也有各自独特的领域，可以概括如下。

标题店铺标签+店铺名称

评分信息店铺评分+评分数量

价格相关每人价格/起始价/起始配送价

商店位置大概位置+当前距离/交通信息，主要在酒店提供

店铺标签服务类型不同行业的店铺都有自己的子服务类型。例如，餐馆有“美食”等子类型，酒店有“每小时客房数/酒店数”等子类型。

用户评论以下是一些简短的用户评论。

排名标签地区排名/综合排名

折扣信息优惠券、活动

具体产品店内销售的具体产品及简要信息

当然，远不止上述这些。不同行业的门店、不同业务的也会为门店提供不同类型的信息。该还提供商店营业时间。酒店还展示酒店的配套设施、房型等。在实际设计工作中，字段类型大多由产品经理指定，具体选择根据以下因素来判断产品的实际业务类型。

3内容布局

就内容而言，如何组织如此多的内容成为学生设计卡片时的最大障碍，而由于碎片化的信息太多，很多学生势必会陷入无从下手的困惑状态。这里我来解释一下信息格式的原理。您可以按照这些原则进行格式化或参考。

第一逐行排版

是的，按行格式化是商店卡片最基本的原则。在复杂的商店卡片中，除了图片之外，文本部分还可以分为三种类型的行标题行、几个子字段行和产品行。如果有的话，请尽量保持行间距一致。

第二将您的字段放在这一行内。

这是整个步骤中最困难的部分。几乎所有这些字段对于用户来说都是重要且敏感的信息，因此在组织时几乎不可能破坏每种类型的信息。这就是为什么这些组件看起来很混乱，但它们是必要的，因为用户实际上可以看到所有信息。

然而，无论你多么“想要这一切”，由于排版的各种客观心理影响，某些内容更有可能受到关注。例如

由于系列位置效应，磁力线的起点和终点总是可能更加集中。

冯雷斯托夫效应使不同的元素在一组相似的元素中脱颖而出。

由于雅各布定律，用户对于在哪里可以找到相似的信息有心理预期，因此不同应用中的信息数组之间的差距不能太大。

了解这一点可以帮助您更有意识地定位您的信息。例如

标题下方的线条通常乍一看很明显。所以在这一行中，我们安排了评分、人均价格等可以帮助用户直观做出决策的信息。

最后一行也很容易吸引用户的注意，所以在这里输入促销信息。

重要标签必须与其他标签区分开来。

右对齐的信息往往会因为对齐方式与其他信息不同而显得突出。大多数应用程序都会远离此位置，并将其放置在与商店位置同一行。

按照这个想法，我们可以在先前定义的行中排列信息。

第三具体款式设计

在视觉设计方面，我们主要关注标签设计。虽然多种多样的视觉标签可以有效吸引用户的注意力，但标签设计却没有技巧。它只是颜色+图标。我们在下面列出了一些示例供您参考。

4张比较特别的店卡

1）我们应该去哪里？

您会注意到去哪儿酒店搜索结果页面中央有一张特殊的卡片，卡片下方有一个特别显眼的“选择酒店”横幅。这可能是专门为一些专卖店设计的款式。总而言之，一些不同的东西使它从列表中脱颖而出。

2)将卡与产品放在一起

应用中某些场景中的商店卡还包含产品，其中大部分出现在搜索结果页面上。

在具体的设计上，也会根据你的应用的需求而定，但一般来说，根据你的实际场景，你可以删除上面提到的字段，然后在下面粘贴一个简单的产品卡栏。

4.风格延伸

这是产品卡的在线示例，也可以用作设计参考。

结尾

今天我们就来介绍一下商店卡的组成部分。

发布者酸梅超人，公众号超人的电话亭

这篇文章是关于超人电话亭的每个人都是产品经理的。不允许未经授权的使用。

标题图片来自Unsplash，CC0协议。

本文仅代表作者观点，人人产品经理仅提供信息存储空间服务。

如何在大众点评编辑外卖评论？大众点评可以修改外卖评价。如果您提交评论后发现错误或与实际情况不符，请点击“我的-我的评论-卖家评论”找到您要编辑的评论，然后选择“编辑”。除了编辑之外，大众点评还支持删除评论、添加评论等操作，方便用户为外卖服务提供更准确、及时的反馈和评分。

如何写关于大众点评的评论？大众点评是一个为个人和商家提供添加店铺和评论的，也是一个在线反馈不正确店铺信息的。

评论有两种类型请按如下方式进行

1、第一类是常规评论。

首先，登录您的账户，在左上角切换区域，在左侧找到对应的类别，然后搜索商店名称。

1.当您打开商店时，本有一个“写评论”按钮，进入写评论界面，添加相应的评论。

2、撰写评论，打开如下界面，按照窗口提示进行评分、选择、输入、上传照片等，然后点击下方“提交评论”按钮。