大数据的相关性和准确性_使数据表具有相关性和可操作性

大数据的相关性和准确性

We’re used to thinking of tables as very data-heavy and not user friendly ways to display information. Maybe it’s because we see them as raw data and not an actual visualization tool, so we look into other ways to display our content.

我们习惯于将表视为大量数据,而不是用户友好的方式来显示信息。 也许是因为我们将它们视为原始数据,而不是实际的可视化工具,所以我们研究了其他显示内容的方法。

I personally love using tables for UI design and I’m convinced they can really be the right choice for certain use cases, provided we follow some design principles to make them more readable, relevant and actionable. Let me show you how.

我个人很喜欢使用表进行UI设计,并且我坚信,对于某些用例,只要我们遵循一些设计原则以使其更具可读性相关性和可操作性 ,它们确实是正确的选择。 让我告诉你怎么做。

如何提高可读性 (How to improve readability)

Making tables more readable comes down to knowing how much content to display at once (i.e. how many columns and rows) and in what format. Let’s start with a very important tip:

使表格更具可读性取决于知道一次显示多少内容 (即多少列和行)以及哪种格式 。 让我们从一个非常重要的技巧开始:

A table’s content doesn’t need to match the database table in terms of how many fields and how the fields are formatted.

就多少个字段以及字段的格式而言,表的内容不需要与数据库表匹配。

In other words, you can display fewer fields while hiding others, combine them to create compound columns, and you can format fields in a more human way compared to what’s stored in a database. Example, you would definitely use a readable date format rather than a timestamp, wouldn’t you?

换句话说,您可以显示较少的字段,而隐藏其他字段 ,将它们组合以创建复合列,并且与数据库中存储的字段相比,您可以采用更人性化的方式设置字段格式。 例如,您肯定会使用可读的日期格式,而不是时间戳,不是吗?

Comparison between table with raw data and a formatted table
Image courtesy of the author.
图片由作者提供。

What’s the limit on the number of fields? It really depends on the user. Make it as complex as the user needs it, keeping in mind simplicity might not always be the answer, especially if you’re designing for a technical audience that is not afraid of complex UIs as long as they make them more efficient.

字段数有什么限制? 这确实取决于用户。 根据用户需要使其变得复杂 ,记住简单可能并不总是解决问题的方法 ,特别是如果您是为技术用户设计的,只要他们提高效率,就不怕复杂的UI。

You should also care about spacing, both vertical and horizontal.

您还应该注意垂直和水平间距

Vertical spacing between the rows determines how many entries the user will visualize at a first glance. It highly depends on the use case and target user, sometimes you want to display fewer information to make it less overwhelming, but having compact rows for more technical and focused workflows is also an option.

行之间的垂直间距决定了用户乍看将看到多少个条目。 它高度取决于用例和目标用户,有时您希望显示较少的信息以使其不那么令人头疼,但是也可以选择紧凑的行来放置更多技术性和重点工作流。

Comparison between compact and expanded tables
Image courtesy of the author.
图片由作者提供。

Horizontal spacing between the columns plays a role in the readability of a single row and can be used to separate fields logically into groups, for example making related columns closer and giving more space to the right of a field you want to highlight (usually the first column).

列之间的水平间距在单行的可读性中起作用,可用于将字段逻辑上分成几组,例如使相关列更近,并在要突出显示的字段的右侧提供更多空间(通常是第一个柱)。

Finally, pagination and infinite scroll help you make sure you’re not loading too many rows at once, which would make the table slower to render by the browser. As a rule of thumb, pagination works better when the user is focused on organization and rapid accessibility of the content while infinite scroll is good for content exploration and consumption patterns. If you’re interested in the topic, you can read this amazing and comprehensive guide.

最后,分页和无限滚动 帮助您确保您一次不会加载太多行,这会使该表在浏览器中呈现速度变慢。 根据经验,当用户专注于内容的组织和快速访问时, 分页效果更好,而无限滚动则有利于内容探索和消费模式。 如果您对该主题感兴趣,则可以阅读本精彩而全面的指南

如何显示更多相关数据 (How to display more relevant data)

Now that you know the importance of displaying the right amount of information and in the right format, it’s time to make sure the data you choose to display is what your users need and expect to see.

现在您已经知道了以正确的格式显示正确数量的信息的重要性,现在该确保您选择显示的数据是用户需要期望看到的数据。

To find out what that is, focus on understanding what role the table plays in a specific task, what are the most common actions in that context, what is the user goal, etc. Card sorting, scenarios and other techniques can help you figure it out.

要找出问题所在,请着重于了解表格在特定任务中扮演的角色,在该情况下最常见的操作,用户目标是什么等。 卡片分类方案和其他技术可以帮助您确定它出来。

Another crucial point to keep in mind is the following:

要记住的另一个关键点是:

Because you’re working with a digital UI and not a printed table, you have one great advantage: data is dynamic and can be manipulated and made more relevant by users themselves.

因为您使用的是数字用户界面而不是打印的表格,所以您有一个很大的优势: 数据是 动态的,并且可以由用户自己操纵和使其更加相关。

Filtering, sorting and searching are great ways to make sure users can narrow down data to exactly what they’re looking for, which is an essential feature to make users start from the default visualization and easily get to what they’re looking for. It’s especially useful in more data-heavy tables.

筛选排序搜索是确保用户可以将数据缩小到他们所要查找的精确方法的好方法,这是一项基本功能,可让用户从默认的可视化开始并轻松获得所要查找的内容。 在数据量较大的表中特别有用。

Also, you can allow users customize which fields to display and which ones to hide, according to their needs. This works better with technical audiences as they will always try to optimize their workflow.

另外,您可以允许用户根据需要自定义要显示的字段和要隐藏的字段。 这适用于技术受众,因为他们将始终尝试优化其工作流程。

Table with examples of data manipulation.
Image courtesy of the author.
图片由作者提供。

如何使数据可行 (How to make data actionable)

After providing an intuitive and usable way to access relevant data, it’s time to give your user ways to do something with it. There are many techniques and design patterns, just make sure you pick the ones that make sense for your users:

在提供了一种直观且可用的方式来访问相关数据之后,该为您的用户提供一些使用数据的方法了 。 有很多技术和设计模式,只需确保选择对用户有意义的技术即可:

  • Tips and insights. If you’re able to generate relevant recommendations and suggestions based on the data, it will be of great help for users and it will make the information very actionable.

    提示和见解 。 如果您能够根据数据生成相关的建议和建议,那么它将对用户有很大帮助,并且将使信息具有很大的实用性。

  • Saving and sharing. If users might benefit from exporting, saving or sharing a report, you can provide a flow to do just that. This includes other patterns like smart lists,

    保存和共享 。 如果用户可以从导出,保存或共享报告中受益,则可以提供一个流程来做到这一点。 这包括其他模式,例如智能列表,

  • Monitoring. You can allow users setting up alerts that will be sent to them when data looks a certain way. Very useful feature to be used in dev tools and SaaS platforms.

    监控 。 您可以允许用户设置警报,这些警报将在数据看起来某种方式时发送给他们。 在开发工具和SaaS平台中使用的非常有用的功能。

  • Navigation. Also known as the “everything is a link” UI pattern, when users see a piece of information that is connected to another section or page, they should be able to click and navigate to it, preferably with an intuitive way to go back to the table as they left it (i.e. breadcrumbs, back button)

    导航 。 也称为“一切都是链接” UI模式,当用户看到与另一节或页面相关的一条信息时,他们应该能够单击并导航到该信息,最好以直观的方式返回到他们离开时的桌子(即面包屑,后退按钮)

  • Editing. If users find information they need to edit, they should be able to do that directly from the table, without having to search it somewhere else. Inline editing is an obvious but essential design pattern that makes data way more actionable.

    编辑 。 如果用户找到了需要编辑的信息,则他们应该能够直接从表中进行操作,而不必在其他位置进行搜索。 内联编辑是一种显而易见的但必不可少的设计模式,它使数据更具可操作性。

Table with examples of actionable data
Image courtesy of the author.
图片由作者提供。

In conclusion, tables are a powerful data visualization tool in UI/UX design and I hope you found this article inspiring and useful to start applying these principles to your tables, especially if you’re building a product from scratch and aren’t ready to use several fancy UI patterns just yet — properly designed tables can get the job done quickly.

总之,表是UI / UX设计中功能强大的数据可视化工具,我希望您对本文有所启发并且对将这些原理应用到表中很有用,特别是如果您是从头开始构建产品而还没有准备好仍使用几种精美的UI模式-设计正确的表可以快速完成工作。

Thank you very much for reading. Have a nice day and stay safe!

非常感谢您的阅读。 祝您有美好的一天并保持安全!

Image for post
Bay Area Black Designers: a professional development community for Black people who are digital designers and researchers in the San Francisco Bay Area. By joining together in community, members share inspiration, connection, peer mentorship, professional development, resources, feedback, support, and resilience. Silence against systemic racism is not an option. Build the design community you believe in. 海湾地区黑人设计师 :一个专业的黑人开发社区,他们是旧金山湾区的数字设计师和研究人员。 通过在社区中团结起来,成员可以共享灵感,联系,同伴指导,专业发展,资源,反馈,支持和韧性。 对系统性种族主义保持沉默是不可行的。 建立您相信的设计社区。

翻译自: https://uxdesign.cc/making-data-tables-readable-relevant-and-actionable-d7f51859b1e0

大数据的相关性和准确性

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值