这是苹果 WWDC 22 关于如何设计有效图表的一个讲解视频，主要聚焦设计师如何通过更清晰的视觉表达，把数据中的重点信息准确传递给用户。视频会讲解图表设计中的核心原则，包括如何根据数据关系选择合适的图表类型、如何组织信息层级、如何处理颜色与标注，以及如何减少干扰、提升可读性，并带你理解一张图表为什么不仅要“看起来正确”，更要让用户快速看懂、正确判断。以下是视频内容的中文译文版，文末为中文译注版视频详情。
大家好，我是 Halden。我是 Lilian。今天，我们将向开发者展示如何设计一张有效的图表。
图表是能让您的 App 更具吸引力和信息量的强大工具。人们可以用天气预报图表来制定计划，依靠股价图表来进行财务决策，用健身数据来反映自己的活动，并设定新的目标。
当你在一个 App 中设计图表时，首先需要设计的是 App 的整体体验。通过明确你的 App 需求，你可以决定什么时候使用图表、如何使用图表，以及用什么设计系统来统一它们。
在这次演讲中，我们将深入设计流程的下一个部分：如何设计一个图表。具体来说，是设计一个有效的图表——也就是一个专注于你想传达的内容、易于理解、并且对残障人士无障碍的图表。为此，我们将通过一个 App 中图表的设计过程来逐步讲解。这个 App 是为一辆在旧金山和库比蒂诺售卖各国薄煎饼的餐车设计的。这个完成后的 App 有一整套图表系统，用来帮助规划和管理薄煎饼的销售。今天我们重点讲如何设计其中一个图表，它展示的是过去 30 天的薄煎饼销量。
好的图表设计始于明确图表的目标。对于我们 App 中的这个页面，我们的目标是传达："过去 30 天的薄煎饼销量怎么样？"像这样的目标可以有很多方向。对于我们的餐车老板来说，看到近期销量的变化趋势可能很有用，可以了解销量是如何波动的，或者波动的范围有多大。识别具体的数值可以用来查看特定的日期。其他可能感兴趣的洞察还包括最高销量、异常值天数，或者不同星期几之间的比较，以及不同地点之间的比较。这个列表可以一直列下去。
这些洞察中，哪些对我们的餐车老板最重要？一个有效的图表聚焦于少数几个关键信息。要带着意图来设计图表。对于薄煎饼销量，我们的餐车老板主要想看的是销量随时间的变化情况以及具体某一天的数据。这意味着我们需要聚焦于传达趋势、范围和数值。
我们是怎么从这三个优先级得到这个图表的？让我们一步一步走过设计流程。
我们的设计流程涉及五个主题。标记——图表的视觉构建块，比如柱状图中的柱子。坐标轴——为这些标记提供参照框架。描述——让图表更易理解和解读。交互——赋予用户更深层次的数据探索能力，这对无障碍性至关重要。以及颜色——增添个性，并且正如我们将在第二个图表中展示的那样，颜色还能增强清晰度。
一、标记
我们的第一步是确定图表要用什么样的形式，使用图表的视觉构建块——标记。标记就是柱状图中的柱子、折线图中的线、散点图中的点。它们是代表数据项的视觉元素。标记有很多种，而且任何一种标记都有丰富的方式来表达数据。
以柱子为例。你可以把它们排成一行来表示数据随时间的变化。你可以把它们堆叠起来展示比例关系：不同类别如何累加成一个总数。或者你可以把它们并排放置，来比较不同类别之间的值。这些只是用标记表达数据的众多丰富方式中的几个例子。
那对于我们的图表，什么选择合理呢？在标记方面，你需要根据你的目标和数据来设计。正如我们之前决定的，我们的图表应该聚焦于过去 30 天薄煎饼销量的三个洞察：趋势、范围和具体数值。在选择标记时，我们会特别关注趋势。对于我们的餐车老板来说，看到销量中的任何波动或走势都是有用的。
我们先把时间放在水平轴上，薄煎饼销量放在垂直轴上。这些坐标轴还不完整，我们稍后再补全。标记的一个选项是用点来代表每天的薄煎饼销量。当我们用这样漂亮平滑的数据来预想图表时，点看起来很棒。但真实数据很少这么整洁。用了真实数据之后，我们可以看到使用点标记很难辨别出任何趋势。
尽早用真实数据来测试你的设计，这一点很重要。虽然点标记在揭示某些洞察方面很出色，比如识别数据中的异常值或聚集，但我们的需求需要别的东西。
了让销量趋势更容易看出来，我们可以用线标记把销量数据连接起来。线在表示变化率方面很出色。这里，趋势和走向一目了然。
但如果在某个月里，我们的餐车需要在五个交替的日子关门呢？在这种情况下，销量趋势就变得不那么清晰了，因为连接相距较远的数值的线段比数值本身更显眼。要记得为数据中的各种场景做设计。
柱形标记对我们的图表来说是更灵活的选择。这里，零值是可见的，但不会造成干扰。这个图表也很直观：白色越多意味着销量越多。由于销量是累积的，所有柱子的视觉份量直接对应过去 30 天的销售总量。
很好，我们选择了一种能让薄煎饼销量趋势在视觉上一目了然的标记。但我们还需要遵循无障碍设计的一个重要原则：对于所有你在视觉上展示的信息，你也需要设计它的非视觉呈现方式。换句话说，你需要确保这些标记以及它们代表的信息也能通过 VoiceOver 访问。
VoiceOver 是一个屏幕阅读器。它让人们通过盲文或语音来阅读屏幕上的信息，这样盲人和其他用户不需要看到屏幕就能使用 App。
你可以用 VoiceOver 来浏览内容，比如图表上的元素。你也可以用它来交互。通过一个叫音频图表的功能，还可以播放图表的声音化表达。
要让你的图表标记实现非视觉无障碍，你需要：第一，设计 VoiceOver 如何在数据值之间导航；第二，使用音频图表。方便的是，用 Swift Charts API 实现的图表会自动包含可自定义的标记无障碍标签，以及音频图表的实现。要了解更多关于音频图表和 Swift Charts 的内容，请查看开发者文档、去年的演讲"为你的 App 中的图表带来无障碍"，以及今年的演讲"Hello Swift Charts"。
我们已经根据目标和数据设计了标记，并让它们在 VoiceOver 中是无障碍的。通过我们的决策，我们解决了"过去 30 天薄煎饼销量怎么样"这个问题的一部分——具体来说是趋势。现在我们的餐车老板可以看到近期销量的波动了。但波动的范围呢？还有具体某天的数值呢？
二、坐标轴
为此我们来设计坐标轴。坐标轴为标记提供参照框架，让人能看出它们的值。比如在我们的薄煎饼销量图表中，当我们在水平轴上标注起始和结束日期，就能清楚地看到图表展示的是 5 月 8 日到 6 月 6 日这 30 天的数据。
垂直轴呢？这里的值完全取决于餐车的销量。对于这样的坐标轴，考虑范围很重要。范围可以是固定的，也可以是动态的。固定范围的一个例子是设置 App 中电池图表的垂直轴。我们知道电池电量总是在 0 到 100% 之间。把垂直轴固定在这个范围内，有助于我们一眼就能看出电池是满的、空的，还是在中间某个位置。
虽然改变电池图表的垂直轴范围会让人困惑，但对其他图表来说可能是必要的。
看看健康 App 中的步数图表，它用的是动态范围。步数没有固定上限，所以让垂直轴范围动态适应数据是合理的。这样即使步数很低，柱子也能充分利用可用的垂直空间，让波动更容易看到。
回到我们的薄煎饼销量图表。和步数一样，餐车能卖多少薄煎饼是没有上限的。所以我们用动态范围，让垂直轴的上限自动适应数据。注意我们仍然把下限固定在 0。使用柱形标记时，这样做通常是个好主意，因为它让柱子的高度保持有意义。这样一根柱子如果是另一根的两倍高，那它的销量也是两倍。
虽然坐标轴上下限的标签已经有帮助了，但我们仍需要更多结构来解读图表中间位置的销量。这就引出了我们的下一个概念：我们需要调整坐标轴网格线和标签的密度。网格线给你参考点来估算标记的值。网格线越多，估算这些值就越容易。
有些图表完全不需要网格线和标签，比如健康 App 中的趋势缩略图。这些图表通常是另一个视图中更大图表的预览，所以你只需要了解数据的趋势就够了，网格线和标签会增加干扰。网格线和标签会出现在后续的详细图表中，在那里你可能想更精确地分析数值。
之前我们提到过，餐车老板想要查看销量的范围和具体值。现在我们有两条水平网格线：一条在零的位置，另一条在大约当月最高销量的位置。这对于估算图表中间位置的销量范围来说太少了。同时，太多的网格线和标签也会分散注意力。这里有七条水平网格线可能会让人感到过多。
平衡这些因素来选择合适的密度。对于我们图表的上下文和预期用途，使用大约四条水平网格线，并随着轴范围的变化做调整，会更有效。
注意在放置这些网格线和标签时，我们使用直观的数值来让图表更易理解——在这个例子中是 20 的倍数。同样，人们习惯以 7 天为步长来阅读时间，这给了我们 30 天时间段内的五条网格线。
我们通过考虑范围和调整网格线与标签的密度，完成了坐标轴的设计。我们在让图表变得有效的路上走了很远，但图表是复杂的视觉元素，我们的例子在变得易于理解之前还需要更多工作。我们怎么才能快速、直观地传达标记和坐标轴背后的含义？
这就引出了我们的下一个主题：描述。
三、描述
描述对于框定图表的意图、让它更易理解和更无障碍非常重要。使用描述，或者图表前面的文字，来提供上下文让图表更易理解。
它们可以清楚地表明我们的图表是关于过去 30 天薄煎饼销量的。这些文字可以简短，并且应该是图表周围用户界面的一部分。
当我们在 App 的界面中看这个图表时，屏幕标题"总销量"已经提供了一些上下文，分段控件上"30 天"的标签也快速建立了时间范围。
这是一个开始。另一个需要澄清的是垂直轴展示的是什么。我们看到的是以金额计算的销量？还是薄煎饼的数量？
一个解决方案是添加轴标签。我们可以在垂直轴上方写上"售出的薄煎饼"。但这里它又小又偏到一边。我们希望这个图表的含义是显而易见的。另一个方案是用标题来为数据提供上下文。把"售出的薄煎饼"作为图表的标题，图表的含义就被放在了最前面最中间的位置。提供这样的上下文对于框定图表很重要。
我们还可以通过总结图表的主要结论来让描述更好。
很多图表都用了这种方式。比如天气中降水量图表上方的文字就描述了它的主要结论。在这个例子中是："预计有小雨——预计 9 分钟后开始下小雨，持续 36 分钟。"呈现要点的方式有很多种，从句子描述到与历史数据比较的图标。我们为我们的图表采取一种简单的方式。让我们把图表标题改写为"总销量：1234 个薄煎饼"，来突出主要结论。这个描述用一个具体的数值来锚定图表，并总结了最关键的信息。
提供能为数据提供上下文并总结关键要点的描述，能让读者更容易进入你的图表。它让图表对所有人来说更易理解、更无障碍。它预先设定了期望或告诉人们该关注什么，这对于那些因为某些残障而导致查看图表细节特别耗时或具有挑战性的人来说尤其有帮助。
说到无障碍，为我们的图表使用音频图表为 VoiceOver 添加了重要的描述。通过音频图表，VoiceOver 可以非视觉地描述坐标轴是什么。
音频图表还提供了关于数据的多种摘要，包括一个你可以自定义的摘要。这些描述，尤其是对 x 轴和 y 轴的描述，对于非视觉地传达图表至关重要。
如果音频图表不可用，确保 VoiceOver 仍然能够通过其他方式立即获取这类描述，比如通过无障碍文本标签。
现在我们提供了上下文，总结了主要结论，并使用了音频图表或等效的描述来源，我们的图表已经具备了所有基本部分。但我们可以通过交互让它更加有效。你可以设计交互来让人们在更深层次上探索和理解他们的数据。比如你可以用交互来高亮图表的某个部分，探索他们的数据如何融入更大的上下文中，或者在天、周、月和年之间切换。
四、交互
我们有机会通过交互来增强薄煎饼销量图表。餐车老板会觉得看到某一天具体卖了多少薄煎饼很有用。我们可以通过交互式工具提示来提供这个功能，它让我们可以触摸图表来高亮并读取这些具体的值。为了让这些基于触摸的交互易于使用，确保使用大的触摸目标。所以不要把图表上的触摸目标做成和标记一样的大小，而是添加内边距并把目标拉伸到图表的全部高度，这样使用工具提示就变得容易了，因为你可以触摸图表的任何部分，包括柱子上方的空白区域。
交互不仅仅是触摸。人们使用各种不同的方式与设备交互，取决于场景或残障情况等因素。所以你需要为多种输入类型做设计，让图表交互变得易用且无障碍。
换句话说，对于你为触摸或鼠标点击设计的每一个交互，你都需要为键盘、语音控制、开关控制和 VoiceOver 等输入方式设计同样的体验。在设计这些交互时，确保屏幕上的变化是可见的很重要，
比如把开关控制或 VoiceOver 的焦点指示器做大，就像我们设计触摸目标那样。为 VoiceOver 提供支持的一部分是你还需要设计好的无障碍标签。回想一下我们设计标记时，确保了 VoiceOver 可以在图表的数据值之间导航。我们做到了当 VoiceOver 导航到某个柱子上时，它会读出"6 月 1 日，36 个薄煎饼"这样的值。
来看看是什么让这个标签成为好的设计。它很简洁。我们不重复不必要的信息，比如轴名称"时间"或"销量"——这些音频图表已经描述过了。我们拼写出完整的单词而不是使用缩写。这样 VoiceOver 读出的是"June"而不是"Jun"或"6-1"，并且我们明确了 36 是薄煎饼的数量。我们还把提供上下文的数据值——在这个例子中是日期——放在前面。这种顺序让快速查找特定值变得更容易。它也让数据更容易理解，尤其是因为你可以跳转到图表的不同部分，先获得上下文能让你知道自己在哪里。
你设计什么样的标签在很大程度上取决于图表的目标。比如地图中骑行路线海拔变化的图表不显示单个值，而是展示路线的海拔升降趋势，并使用了很多垂直柱子——太多了无法逐个导航。一个设计良好的无障碍标签可以这样标注一组柱子："从 3.6 英里到 4.4 英里：爬升 100 英尺，下降 5 英尺。"相反，如果一个图表是按钮内部的一个小预览，用来打开同一个图表的详细版本，那么用一个标签来总结整个按钮（包括图表）可能是合理的。
现在我们已经设计了交互来服务于图表的聚焦性、易理解性和无障碍性，还有最后一个主题我们想聊聊。
Halden：颜色。颜色可以为图表增添个性并增强清晰度。到目前为止我们一直在用黑白进行设计。颜色可以让图表在 App 中更出彩。但它还能传达更多。你可以用颜色来区分类别，就像健身 App 中的三个活动圆环。你也可以用它来传达强度，比如天气预报中的温度。你甚至可以减少颜色来把注意力引向图表的特定特征。健康 App 就是这么做的，用来突出你一天内的最低和最高心率。
考虑使用颜色来增强。理想情况下你把颜色作为一种额外手段，让图表更容易理解，而不是传达关键信息的唯一方式。为了帮助说明，我们用一个场景来演示：在 App 中追踪两辆餐车，一辆在旧金山，另一辆在库比蒂诺。我们想修改总销量图表，让我们能够比较这两个地点的销量。怎么做呢？
我们可以为每个城市的销量各用一条线，但我们分不清哪条线属于哪个城市。没有标签或布局来区分这两条线。我们可以通过在每条线上放置符号来标记每一天，从而澄清关联。这里我们用圆形代表旧金山，方形代表库比蒂诺。注意我们现在需要一个图例了。我们可以添加颜色来增强这个差异。重要的是，颜色是在符号的基础上添加的。一些有色盲的人可能无法区分仅靠颜色不同的线条。这个做法对于"不使用颜色来区分"这样的系统设置尤其重要。
在选择用于表示数据的颜色时，有几件事需要考虑。首先，考虑颜色如何承载含义。比如红色和绿色代表低电量和充满电量。文化也会影响颜色的含义。在美国，用绿色表示上涨、红色表示下跌来给股票配色是合理的。但在一些国家比如中国，人们的期望恰好相反，红色表示上涨，绿色表示下跌。
对于我们的图表，系统蓝色和绿色很合适。在城市的上下文中，这些颜色没有明显的含义关联。但如果我们想自定义颜色来匹配 App 的外观和风格呢？在为类别选择颜色时，要平衡视觉权重。如果一种颜色压倒了另一种，就会暗示出层级关系。假设我们一开始给旧金山用了深紫色，给库比蒂诺用了这种鲜艳的粉色。注意在这种情况下，库比蒂诺粉色的突出与旧金山紫色的暗沉相比，让库比蒂诺看起来更重要了。我们可以通过调整饱和度和亮度来修复这个问题。这样好多了。虽然这些颜色选择还需要一些调整，但现在它们的权重是相等的，不会暗示一个城市是主要的而另一个是次要的。
注意，调整颜色的视觉权重是一种工具。有时候当我们想把注意力吸引到图表中特定的值或区域时，使用视觉权重更强的颜色是有用的。健身 App 中的趋势图表就用了这个策略来突出你最近的活动。在选择色板时，选择视觉上有明显区分度的颜色来提升无障碍性和可读性也很重要。一个好的规则是选择容易用名字区分开的颜色，并且彼此之间有良好的对比度。所以与其给旧金山用紫色、库比蒂诺用偏紫的粉色，不如用紫色和绿色。我们还要确保它们不仅彼此之间有区分度，而且和背景也有区分度。确保颜色之间以及与图表其他部分之间都有高对比度，这让图表对有视觉障碍的人更无障碍，对所有人来说也是更好的设计。
记得也要让你的颜色对色盲人群可区分。你可以用色盲滤镜来检查你的选择。最后，确保你的图表尊重系统设置，设计能适应深色模式和浅色模式的颜色，以及增强对比度设置。
好了，让我们回顾一下今天做了什么。
Lilian：我们为薄煎饼餐车 App 设计了一个图表。为此，我们选择了最有效传达目标的标记，并在 VoiceOver 中呈现了它们；设置了坐标轴范围和网格线来更好地一目了然地传达数值；添加了描述来用上下文和概述引导人们进入图表；加入了交互来按需提供细节；加了一抹颜色作为薄煎饼图表上的黄油；还进一步用颜色增强了第二个图表，用来比较不同城市的薄煎饼销量表现。在每一步中，我们都做出了设计决策，确保我们的图表是聚焦的、易于理解的和无障碍的——换句话说，我们做出了一个有效的图表。
Halden：记住，我们设计的图表是 App 丰富上下文中整个图表系统的一部分。你可以用同样的设计流程来让这些其他关于薄煎饼的图表也变得非常精彩。现在我想吃薄煎饼了。
Lilian：是的，我也是。
Halden：感谢观看。
Audio Graphs 还提供了一些关于数据的摘要，包括一个您可以自定义的摘要。这些描述，尤其是对 x 轴和 y 轴的描述，对于图表的非视觉传达至关重要。
如果 Audio Graphs 不可选，请确保 VoiceOver 仍然可以通过其他方式直接访问这些类型的描述，比如通过可访问文本标签。
现在，我们提供了上下文，总结了主要的要点，并使用了 Audio Graphs 或类似的描述源。我们的图表包含了所有重要的部分。
但我们可以通过互动让它变得更高效。您可以设计交互，使人们能够更深入地探索并理解他们的数据。例如，您可以使用交互来突出显示图表的各个部分，以探索它们的数据如何适合更广泛的背景，或在日、周、月和年之间切换。
我们有机会通过互动来提升我们的煎饼销量图表。我们的餐车老板会发现，能看看某一天到底卖出了多少煎饼非常有用。我们可以通过一个交互式工具提示来提供这个功能。它会允许我们触摸图表，来突出显示并读取这些特定的值。
为了让这些基于触摸的互动更容易使用，要确保使用了较大的触摸目标。因此，不要在我们的图表上设置与标记相同大小的触摸目标，而要在图表的整个高度添加填充和拉伸目标。这会使我们的工具提示更易使用，因为您可以触摸图表的任何部分，包括条形图上方的空白区域。
互动不仅仅是触摸。人们使用各种各样的其他方式与设备互动，这取决于环境或残疾等因素。所以，您需要为多种类型的输入进行设计，使图表交互变得易于使用。换句话说，对于您为触摸或鼠标点击设计的每个交互，您需要为键盘、语音控制、开关控制和 VoiceOver 等输入设计相同的体验。
当您设计这些交互时，让屏幕上的变化可见很重要，比如将 Switch Control 或 VoiceOver 的聚焦指示器调整得大一点。这与我们设计触控目标的方法相同。为 VoiceOver 提供支持的一部分，是您还需要设计良好的可访问性标签。
回想一下，在设计标记时，我们是如何确保 VoiceOver 能够导览图表的数据值的。我们这样做是为了当 VoiceOver 导航到其中一个条形图上时，它会读出诸如“6 月 1 日，36 个煎饼”这样的值。让我们看看是什么让这个标签成为了一个好的设计。它很简洁。我们不重复不必要的信息，比如 Audio Graphs 已经描述过的坐标轴名称“时间”或“销售额”。我们要拼出整个单词而不使用缩写，这样 VoiceOver 读出的就是“6 月”，而不是“6”或“6 横线 1”。我们要清楚地表明是煎饼的数量。我们还要将与上下文相关的数据值，在本例中是日期，放在前面。这种排序使快速查找特定值变得更容易。
VoiceOver：“5 月 27 日。5 月 28 日。5 月 29 日。5 月 30 日，41 个煎饼。”
这也使数据更容易解释，尤其是您可以跳到图表的不同部分，首先获得上下文，让您知道您在哪里。您设计的标签类型很大程度上取决于图表的目标。例如，地图上关于骑行路线海拔变化的图表，并不显示单独的数值，而是显示一条路线海拔的增加和减少模式，并且使用了许多竖条形图，太多以至于无法单独浏览。一个精心设计的可访问性标签可以在一段条形图上标注“从 3.6 英里到 4.4 英里，爬升100英尺，下降5英尺”。相反，如果一个图表是一个按钮内的一个小预览，用于打开同一个图表的更多细节，那么用一个标签总结整个按钮、图表以及所有内容，可能是有意义的。
既然我们已经将交互设计为图表的重点、可使用性和可理解性服务，那么我们还有一个话题需要谈到。
五、颜色
颜色。颜色可以增加图表的个性，增强图表的清晰度。到目前为止，我们的设计都是黑白的。颜色可以让我们的图表在 App 中更加醒目，但它也能传达更多信息。您可以用颜色来区分类别，比如健身 App 中的三个活动环。您还可以用它来传达强度，比如天气预报中的炎热程度。您甚至可以去掉颜色，来吸引人们对图表特征的注意。在这里，健康 App 会这样做，以突出您一天内的最小和最大心率。
考虑使用颜色来增强效果。最好使用颜色使图表更容易理解，而不是将其作为传达关键信息的唯一手段。为了帮助解释，让我们使用一个跟踪 App 中两辆餐车的场景，一辆在旧金山，一辆在库比蒂诺。我们想要修改我们的总销售图表，以便比较这两个地点的销售情况。我们要如何做到呢？
我们可以用一条折线表示每个城市的销售情况，但是我们无法区分哪条线属于哪个城市。没有标签或布局用于区分两者。我们可以通过在每一行上放置一个符号来标记每个日子，以阐明这种关联。在这里，我们用圆圈代表旧金山，用正方形代表库比蒂诺。注意，我们现在需要一个图例。我们可以添加颜色来增强这种差异。重要的是在这里的符号上添加颜色。有些色盲患者可能无法分辨这些线条。这种做法对于“不以颜色区分”这样的系统设置尤其重要。
在选择颜色来表示数据时，有几点需要考虑。首先，要考虑颜色如何传达意思。例如，红色和绿色会表示低电量和充电电量。文化也可能影响颜色的含义。在美国，颜色在股票方面的意义是绿色代表收益，红色代表损失。然而，在中国等一些国家，人们的预期正好相反：红色代表收益，绿色代表损失。对于我们的图表，蓝色和绿色系统工作良好。在不同城市的上下文中，这些颜色没有明显的意义。但是，如果我们想自定义颜色来匹配 App 的外观和感觉呢？我们需要谨慎选择。
为了在想把注意力吸引到图表中的特定数值或区域时增强效果，颜色不应过度饱和。健身 App 中的趋势图就会用这种策略来突出近期活动。在选择配色方案时，也要选择视觉上区分明显的颜色，以提升可访问性和可读性。一个很好的规则是，选择那些从名称上就容易区分、彼此对比又明显的颜色。所以，与其为旧金山使用紫色、为库比蒂诺使用偏粉的紫色，不如使用紫色和绿色。还要确保它们不仅彼此区分明显，也能和背景区分开来。让颜色既彼此高对比，又和图表其他部分形成高对比，会让图表对视觉障碍用户更易访问，同时对所有人来说也是更好的整体设计。记得也要为色觉障碍用户测试，让颜色在色盲模式下依然可区分。您可以用色盲滤镜检查自己的选择。最后，请确保图表尊重系统设置，设计的颜色要能适配深色模式和浅色模式，也要适配“提高对比度”。
好了，让我们回顾一下今天做了什么。
我们为煎饼餐车 App 设计了一张图表。为此，我们选择了最能有效传达目标的标记，并让它们能被 VoiceOver 表达；设置了轴的范围和网格线，让人能一眼更好地理解数值；加入了描述，用上下文和总览帮助人们更容易进入图表；加入了交互，按需提供细节；还加上了一点颜色，就像给煎饼图表放上的一块黄油；并进一步用颜色增强了第二张图表，用来比较两个城市之间煎饼销量的高下。在整个过程中，我们都在做设计决策，以确保图表聚焦、易理解且具备可访问性——换句话说，我们做出了一张有效的图表。
请记住，我们设计的这张图表，是 App 丰富上下文中整个图表系统的一部分。您也可以用同样的设计流程，让这些关于煎饼的其他图表也一样精彩。现在我想吃煎饼了。
我也是。
感谢观看。