Introducing Mobile Layout for Amazon Quick dashboards

介绍 Amazon Quick 仪表板的移动布局 | 人工智能

介绍 Amazon Quick 仪表板的移动布局

依赖仪表板进行日常决策的团队通常需要通过捏合缩放来操作原本为大屏幕设计的控件。在晨会中查看收入、会议之间审查流水线指标、出差时监控运营，这些场景在桌面屏幕设计的仪表板上都需要额外操作。

Amazon Quick Free Form 仪表板的移动布局通过自动将仪表板渲染为单列、触控优化视图来解决这一问题，该视图可填满设备屏幕。读者无需调整大小或横向滚动即可立即访问数据。Free Form 仪表板的移动布局现已在所有支持的 AWS 区域上线。移动布局将桌面画布转换为适配设备尺寸的单列连续滚动体验。图表填满屏幕宽度，保持纵横比并保持交互性。

作者无需进行任何修改即可生效。仪表板读者可在任何手机或平板上立即无摩擦地访问数据。在本文中，我们将展示移动布局的工作原理以及如何优化您的仪表板。

下图动画演示了 Free Form 仪表板在手机上以移动布局打开时，读者如何通过连续垂直滚动浏览关键绩效指标（KPI）和图表。

移动布局解析

移动布局是 Free Form 仪表板的一种渲染模式。当读者在小视口设备上打开 Free Form 仪表板时，Amazon Quick 会检测屏幕尺寸并渲染移动视图。读者将看到单列垂直滚动的可视化内容流，每个可视化元素均填满屏幕宽度。

检测基于设备视口。当视口尺寸处于手机或平板范围内时，移动布局将激活。在大屏设备上，将使用标准桌面渲染模式。

功能特性

移动布局为 Free Form 仪表板提供以下功能：

连续滚动。可视化元素按单列堆叠，每个元素填满整个视口宽度。纵横比保持不变：纵向比例的可视化元素保持高度，横向比例的可视化元素保持宽度。

分组感知渲染。Free Form 仪表板通常使用重叠可视化（例如在彩色背景上叠加 KPI 值）。移动布局尊重分组边界，分组可视化作为单一单元整体渲染，保留分层设计。

读者控制。在 Quick 移动应用中，读者可通过内置视图切换器在移动视图（连续滚动）和桌面视图（原始渲染）之间切换。在网页端（移动浏览器）中，纵向方向显示移动体验，横向方向显示桌面体验。

性能优化。移动布局使用优化的渲染路径，减少移动设备的资源消耗。此前在手机上渲染困难的仪表板现在可流畅加载和滚动。

下图展示了同一仪表板在桌面视图（左）和移动连续滚动视图（右）中的显示效果。

需要执行的操作

对于仪表板读者：无需操作。移动布局适用于现有的 Free Form 仪表板。无需开启设置、无需迁移、无需更新。直接在手机或平板上打开仪表板即可立即访问移动视图。

对于作者和管理员：无需任何操作。自由布局仪表板的作者会自动受益，因为他们在小屏幕上发布的仪表板已默认使用移动布局。使用平铺或经典布局的作者不会受到影响，这些布局类型仍保留原有的响应式行为。管理员无需进行任何配置。移动布局默认在所有自由布局仪表板中启用。

通过分组实现最佳移动体验

使用重叠视觉元素的作者可以采取一个可选步骤来验证其设计在移动设备上的显示效果：将这些视觉元素组织到分组中。

在自由布局中，作者通常会将视觉元素层层叠加。您可能会将KPI值置于彩色背景之上，或在容器上堆叠比较卡片。

在桌面端，这些重叠元素会按照预期显示。在移动端，布局引擎需要决定如何处理它们。

如果不进行分组，每个视觉元素在移动滚动视图中会成为独立的卡片。置于背景图像上的KPI会显示为独立元素：背景渲染为一张卡片，每个KPI渲染为单独的卡片。视觉元素仍能正确显示，但会失去原有的分层关系。

通过分组，组内所有视觉元素会作为一个整体渲染。背景和KPI保持在一起，保留作者设计的横幅效果。

有关自由布局中视觉分组的文档，请参阅[自由布局中的视觉自定义](Customizing visuals in a free-form layout)。

以下动画对比了在移动设备上分组视觉元素（KPI横幅保持为一个整体）与未分组视觉元素（KPI显示为独立卡片）的效果。

如何对重叠视觉元素进行分组

要对视觉元素进行分组，请执行以下步骤。

• 在Amazon Quick的编辑模式下打开您的分析。
• 按住Shift键并选择需要保持在一起的每个视觉元素（例如背景矩形和其上的KPI视觉元素）。
• 打开上下文菜单并选择“分组”。

每张工作表的分组数量没有限制。在移动设备上，每个分组被视为一个独立的视觉单元。

以下动画展示了Amazon Quick编辑视图中的右键上下文菜单和“分组”选项。

移动设备上视觉元素的尺寸设置

当移动布局在连续滚动视图中渲染视觉元素时，会应用以下规则。

• 每个视觉元素填满整个视口宽度。
• 保持宽高比。高条形图保持高度，宽折线图保持比例上的紧凑性。
• 最小高度272像素确保图表元素（图例、坐标轴标签、排序按钮）始终可见。
• 最大高度限制防止视觉元素超出视口范围。
• 拥有大量列的表格会以完整宽度显示，并启用横向滚动。

如果视觉元素过短无法显示内部元素，会出现信息图标。读者可以切换到桌面模式或旋转为横屏模式以查看完整视觉内容。

入门指南

移动布局消除了在为桌面屏幕设计的仪表板上进行缩放和缩放的需要。该功能现已在Amazon Quick中提供。按照以下步骤进行尝试：

• 使用Quick移动应用在手机或平板上打开自由布局仪表板。
• 在连续滚动视图中滚动查看您的视觉元素。
• 使用视图切换器在移动模式、桌面模式和横屏模式之间切换。

• 如果存在重叠的可视化内容，请打开您的分析，选择它们，打开上下文菜单，然后选择“组合”。

下图显示了移动应用中的视图切换器控件。

有关更多信息，请参阅以下资源：

• Amazon Quick

• Amazon Quick 用户指南

• Amazon Quick 控制台

我们欢迎您通过 Quick 控制台的反馈机制提供反馈。

关于作者

'" /