编者介绍:我们在日常生活和工作中会遇到很多列表,最常见的就是消息列表和联系人列表。每个列表中表示的功能和信息都不同。让我们创建一个合适的列表并一起查看。
我们平均每天查看多少产品?
为了获得相对真实的数据,我们对七位来自互联网、金融、建筑、医药等不同行业的朋友进行了调查。根据抽样调查结果,这一数值在180左右。超过70% 的人每天查看超过150 个列表。
这是一个完全出乎意料的结果。这说明,虽然我们日常在各种产品中都会使用“列表”这种格式,但我们并没有很清楚“列表”在产品中的重要作用。
所有产品都与该列表相关。
根据之前的研究,这些朋友日常查看的产品类别包括社交、资讯、工具、娱乐等,几乎涵盖了所有领域,并且随着样本量的增加,我们相信这些类别会变得更加完整。更完整。
比如我们日常使用的聊天软件微信、QQ,就包含了很多列表,比如聊天室列表、联系人列表、朋友圈好友动态列表等。今日头条、抖音、快手等资讯软件和视频软件也有很多列表,比如文章列表、视频列表、创作者列表、音乐列表等。
这些列表的形状、结构和用途各不相同,但无一例外的是,它们在各种场景下为用户提供了丰富有用的信息,同时在用户和数据之间架起了沟通的桥梁。
列表是传达以下信息的自然选择:
在互联网的世界里,信息当然是最重要的。从技术角度来看,这些复杂的信息存储在不可见的数据表中,原始列表是根据这些数据创建的,并且该列表使用其他结构中没有的技术具有一些优势。
正因如此,列表被广泛应用于各种信息呈现和交互场景,发挥着极好的信息传达作用。
它们的普遍存在暗示了我们必须面对的问题:如何针对每种不同的场景设计合适的列表。
接下来,我们将探讨列表的本质,向您展示一个好的列表是什么样子,并通过实际案例分享我们的列表设计过程。
1.理解列表列表比我们想象的要普遍得多,以至于它们可以侵入任何产品。当我们在设计过程中使用“列表”来承载数据时,我们有时不会考虑太多,也不会深入挖掘为什么这样做,好像这一切都有道理。
其原因被认为是上述列表结构的技术优势。那么这个结构由哪些要素组成呢?我认为有三件事:数据、布局和操作。
1、对于数据来说,如果不看前端接口的性能,直接通过接口获取列表返回数据,你会发现这些“列表”是由多条结构相似的数据组成的马苏。形成有序的信息排列。
这种信息收集具有三个主要特点。
最大的特点就是数据结构的相似性。例如,在电商平台的订单列表中,每行数据在哪些项是引用、哪些项是数组、哪些项是扩展字段等方面基本相同。
第二个特点是数据排列有序。这里的顺序是指数据呈现给用户的顺序,通常按照数据的典型特征如时间、数量、类型等进行排序,以方便用户理解和使用。
最后一个特点是数据的丰富性。也就是说,接口返回的数据不仅要完全满足前端显示的需要,还要保证每条数据的存在都是合理的。这很容易理解,但也很难实现。
2、当布局数据是一个组件时,它的构造方式决定了整个组件的最终呈现。在这些散落的积木面前,我们的产品人员就像叠积木的玩家一样,把积木放在合适的位置上,尽最大努力最终实现既定的目标。
在此过程中需要记住两件事。
首先,要区分信息结构的合理性,即信息的类别和层次。例如,您正在设计一个产品购买页面,当前需要展示的产品是“书籍”。
在此之前,我们收集与该产品相关的信息(书名、作者、作者详细信息、书籍类别、价格),并将这些信息按照信息类别和级别组织成以下信息结构图。
其次,它必须遵循人类视觉的规律。例如,人的视觉范围有一定的限制,超出这个范围的区域不应该包含重要内容。人类视觉识别文本识别的灵敏度远低于图形,因此图形解决方案可以应用于一些需要强调重点的内容。又比如,不同的颜色可以给人带来不同的情绪。红色代表热情,蓝色代表热情。可以合理运用,比如沉稳庄重的黑色。
3. 当然,操作列表不仅仅用于显示信息,这就是它们如此受欢迎的原因。其更重要的表现在于其近乎完美的操作风格,无论是单次操作还是多次操作。或者选择“全部”操作并轻松回复列表。
如果说数据库的增删改查是程序员的浪漫,那么操作列表就是产品艺术。这种艺术品质体现在两个方面。
另一方面,操作也要因地制宜。这里的场景是一个互动性更强的场景。例如,当您搜索超市时,您会在标题中看到“距离”项。您可能希望列表可以根据“距离”项进行排序,因此您自然会将过滤操作放在“距离”上,而不是将过滤项放在其他地方(例如在头部操作区域中),也许需要这样做。放置。列表)。
另一方面,它也需要操纵。从理论上讲,任何列表都可以添加、删除、修改和验证。但是,当列表包含在某些场景中时,我需要隐藏一些不良行为。例如,当买家查看卖家的产品列表时,他们无法删除该产品。相反,如果你的列表是在其他场景,你可能需要增强基本操作。例如,如果买家也在查看产品列表,则应该提供多维度的过滤和排序方法,以帮助用户快速导航。找到合适的产品。
2. 如何设计列表这三个元素在大多数情况下提供了良好的列表外观,但这并不意味着它们是必需的。我们理解,构图不是根据剧本来设计,而是适合特定场景的外观,需要对特定情况进行详细分析。
场景是这样的:在PC端的云文档产品中,用户存储了很多文档,其中很多文档都启用了共享,以便与其他人协作,但是共享方式非常用户特别想要,因为它方便,但也伴随着安全风险。它提供了管理这些共享文档的中心位置。
如果你是我,你会如何设计这个“共享文件”管理列表?这是我的答案。
1、需要哪些数据来分析呢?首先,由于这是一个文件列表,对于用户来说最基本的数据就是用于识别文件的文件的基本信息,比如文件名、文件图标等。
其次,从需求背景来看,用户的核心需求是“找到并管理自己想要的东西”,而这个“东西”就是共享文件。那么这类文件有什么特点呢?
最明显的就是“启用共享”。这意味着会生成共享行为数据,例如共享链接、共享对象(范围)、共享权限和共享链接生存期。
而且,用户肯定关心文件共享后的后果,例如下载次数以及通过共享链接访问文件的次数。
2. 确定信息的优先级组织完所需的数据后,定义数据优先级并根据数据对用户的重要性来划分数据。
在当前案例中,用户的主要目的是“搜索”,然后了解文件共享信息以及共享行为带来的后果的细节,并优先考虑信息描述和细节。协助查找和定位班级信息。
接下来,您需要根据优先级对信息进行分类。
我不会详细介绍该过程。仅显示照片。
3. 布局分析了前两个步骤后,您已经知道您的用户会对哪些内容感兴趣以及您需要突出显示哪些信息。那么第三步你要做的就是如何把这些信息有机地结合起来。
一般来说,我们会参考一些相对成熟的范式,通过应用和调整,最终得到一个合适的列表。
这里我们介绍三种比较常见的列表范例。
1)决定因素
最显着的特点是每一行和每一列的交集形成一个独立的信息单元,也称为表格。
这种列表的优点是结构清晰、稳定性强,信息定义明确,没有业务趋势,灵活性强。缺点是一行不能容纳太多信息。会造成视觉疲劳,破坏原有性的稳定性。其次,焦点不太明显,用户的视觉焦点相对分散。
2) 无柱
严格意义上不存在列。每个单元本身构成一个整体,也称为信息流或馈送流列表。
其优点是,自上而下的信息布局符合大多数用户的阅读习惯;其次,各个信息单元独立性较高,因此信息单元内的信息布局相对自由,可以根据业务业态进行扩展;但其缺点也很明显,即信息密度相对较低,一个屏幕上可以显示的信息单元较少。
3) 无线形式
严格意义上不存在列。每个单元作为一个整体独立存在,通常称为瀑布流。这种列表解决了信息单元密度低的问题,同时保留了信息流列表的大部分优点。代价是它们需要更大的屏幕并且缺乏结构稳定性。
回到案例并将现有信息应用于这三个范例,我们发现列表的行列式和无行结构都不是最优的。为什么?
首先,在该数据中,高优先级信息的数量明显小于低优先级信息的数量,因此使用决策结构会将用户的视觉焦点转移到低优先级信息上;其次,将吸引中心转移到低优先级信息上。用户是“找到自己想要的东西”,而搜索和定位需要稳定的列表结构,所以不太稳定的无行结构是不适合的。
因此,我们选择了无柱结构,这样结构更加稳定,内容布局也更加自由。
既然总体框架已经确定,那么各个信息单元的内容又该如何安排呢?这主要根据用户的视觉习惯来组织信息。
在PC端,用户的视觉焦点一般分布在左上、中、右下,尤其集中在左上。然后将最高优先级的信息,例如图标、文件名等放置在该位置,将次高优先级的信息,例如信息共享、行为数据共享等放置在左下角和右下角。
除了视觉焦点之外,人们对颜色和图形的敏感性也可以用来定制信息的呈现。例如,针对不同类型的文档设计不同的图标,以便用户初步区分。另一个例子是使用不同的颜色来区分文本信息的重要性以吸引用户的注意力。
4. 功能操作在前三个步骤中找出用户想要看到的内容之后,最后一步需要分析用户想要对列表执行什么操作。
就本文而言,正如我之前所说,用户想要做的是“查找并管理他们想要的内容”。简单来说:查询和管理。
说到查询,就不得不提“搜索全家桶”,用于搜索、过滤、排序。其中每一个都对应于三种不同的场景。搜索对应于用户模糊地记住文件名的场景,排序对应于用户根据文件特征缩小结果列表的场景。在所有优先展示列表信息的场景下,这三个特性都会提高用户的查询效率。
在管理方面,每个不同的上市场景的管理需求都有很大差异,不能一概而论。但它们的共同点是,管理行为本身与清单中的信息高度一致。例如,在共享文件列表场景中,用户可以管理的内容实际上仅限于:就共享对象(范围)、共享权限、共享链接生命周期等而言,用户所需的唯一管理操作是更改共享行为、终止共享行为等。
3. 结论即使很小的事情也蕴藏着很多知识。如果你仔细考虑整个列表设计过程,你会发现这里描述的方法论和设计理念实际上可以应用在很多地方。
在产品设计领域,产品背后的所有情感都传达给用户。但世界太复杂,而且节奏只会越来越快。在那些崇高的事物之中,许多微妙的存在逐渐被人们遗忘。
我不希望每个人都这样,我希望你我在每一个细节上都成为巨人。
本文最初由@林峰发表在《人人都是产品经理》上,未经作者许可,不得转载。
标题图片来自Unsplash,并获得CC0 许可。
本文和图片来自网络,不代表火豚游戏立场,如若侵权请联系我们删除:https://www.huotun.com/game/643731.html