卡片用于链接资源、图面信息以及与应用程序的直接交互。
集成而不是重复：
利用 Intranet 上已有的体验，例如任务分配和完成、班次计划、公司策略等。
在上下文中停留：
设计卡片以避免用户跳转到不同的体验。 例如，如果可以使用快速视图 (链接到Viva Connections应用中) ) 快速查看页面，则这是理想的选择。 其次最好将用户交互保持在仪表板中。
使用相关且可动态刷新的数据为卡片赋予活力：
例如，公司股票价格、培训或项目的截止日期、任务分配更新和剩余的假期。
每个仪表板卡片都有以下元素：
容器
：所有卡片内容都位于容器内。
图标
：此卡片的唯一视觉表现形式。 可以从预定义的集合中选择图标，也可以上传自定义图标。
预定义集中的图标与主题匹配，并将使用主题主色自动调整为浅色和深色主题。
对于自定义图标，最大大小为 24 px 乘以 24 px。 建议的格式为 PNG 或 SVG。 SVG 图标可在不同的屏幕分辨率之间更好地缩放。 确保图标具有透明背景，并且在浅色和深色主题上都能良好显示。 了解 SharePoint 主题。
名称
：通常为应用名称。 所有名称都应为句首大写。
标题
：卡片上最突出的文本。 用于传达关键信息。 标题文本可以是静态的，也可以是动态更新的。 所有标题都应为句首大写。
添加名称和标题时，请确保文本不会截断，并且可以在桌面和移动设备上的卡片大小（下面提供了有关大小的详细信息）和所用的所有语言中适合卡片宽度。 截断的文本可能会隐藏最终用户完成任务时可能需要的关键信息。 对于名称，在大多数情况下，10-12 个字符的长度应适合卡片宽度。
布局和大小
有三种类型的卡片布局可供选择。
标题 + 图像
标题 + 说明
所有布局有两种大小：中型或大型。 卡片大小将确定仪表板中空间的利用方式。 开始最好使用中型卡片。 如果需要展示不适合中型卡片的额外信息，请使用大型卡片。
当标题足以传达卡片中的关键信息时使用。
标题 + 说明
当说明可以为标题增加额外的信息价值，并可以更轻松地理解卡片用途时使用。 避免重复标题中已传达的信息。
标题 + 图像
图像可以吸引观众的注意，因此请谨慎使用图像来创建对熟悉的应用或网站的识别，或增加仪表板上卡片的整体视觉吸引力。 图像应有意义地连接到标题和/或名称。
可通过三种可能的方式与卡片进行交互：
卡片（可单击整个卡片）
可以自定义其中的每个交互。 使用这些交互执行即时操作、向服务器发送请求、打开快速视图（添加链接）、链接到 Teams 应用、打开外部网站等。
下面是设计卡交互的最佳做法：
整体卡片应始终是交互式的。
如果使用主按钮，由于其视觉上的显著性，它应该是卡片上最重要的操作。
辅助按钮可以单独使用，也可以在需要两个操作时（仅在大型卡片布局中可用）与主按钮结合使用。 如果它与主按钮一起使用，请确保它链接到卡片上第二重要的操作。 在这种情况下，卡片本身将成为最不重要的操作。
对于按钮标签，请使用准确反映按钮行为的简明文本。 例如，“查看任务”比“查看”更好。
确保卡片上的每个交互都是唯一的。
设计卡片以避免用户在不同体验之间跳转。 例如，如果可以使用快速视图将交互保留在Viva Connections应用中，则这是理想的选择。 其次最好将用户交互保持在仪表板中。
由于空间不足：
标题 + 图像布局的中型卡片没有按钮。
标题和名称 + 说明布局的中型卡片只能有一个按钮。
下面是有关如何使用这些布局的一些示例卡片
iOS、Android 和 Web 支持仪表板卡片。 但是，不同平台的样式略有不同 – 字体（台式机使用 Segoe UI、Android 使用 Roboto、iOS 使用 SF Display Pro）、颜色、大小和间距稍有调整，以更好地适应相应的平台，使卡片看起来与该平台的整体体验一致。
仪表板卡片还支持浅色和深色模式主题。 确保使用的颜色可以同时适用于这两种模式 – 文本颜色应清晰明了，并且按钮和图标应可在背景中清晰识别。 若要满足辅助功能条件，文本与按钮背景间的颜色比率应为 4.5：1，而图标等非文本组件与背景间的颜色比率应为 3：1。
使用此工具检查颜色对比度
。
使用以下工具箱将新卡片添加到该仪表板。
若要在仪表板选取器中显示自定义应用，需要以下各项：
1. 图标：
此应用的唯一视觉表现形式。 自定义图标最大大小为 24 px 乘以 24 px，最好采用 PNG 或 SVG 格式。 SVG 图标可在不同的屏幕分辨率之间更好地缩放。 最好使用单色图标，但如果要使用图标表现独特的品牌，则可以使用彩色图标。 无论采用哪种方式，请确保图标具有透明背景，并且在浅色和深色主题上都可良好显示。
了解 SharePoint 主题
。 仪表板卡片将使用同一个图标（见上文）。
2. 名称：
确保应用的名称简洁且未被截断。 建议的长度为 10-12 个字符。 应将相同的名称用于仪表板卡片（见上文）和快速视图（链接快速视图页）（如果已使用）。 如果有多个应用，建议每个应用具有唯一的名称。 所有名称都应为句首大写。
3. 描述性文本：
清晰简洁的说明介绍卡的用途，并提供有关如何使用它的信息。 它应在悬停时（在 Web 中）在工具提示中显示。 请确保文本正确换行，并且在工具提示中不会太宽或太窄。 最佳行长度一般为每行 50-60 个字符，包括空格。
定义卡片的设置
单击应用时，卡片将显示在仪表板上。 可以使用右侧的设置面板编辑卡片。
下面是提供自定义设置的一些最佳做法：
包括说明卡用途的描述性文本，并提供有关如何使用它的信息。 请确保此文本与工具提示中的文本相同或对其有所补充。
除非卡片上的文本动态更新，否则允许用户编辑卡片上的文本以根据其需求对其进行定制。 请考虑在字段中提供预先写好的默认文本，用户可以根据需要重写和编辑此文本。
如果同一组织有多个卡片可用，请确保设置面板中的标签和交互在所有卡片上保持一致。
如果有多个设置且卡片设计复杂，则建议添加“了解详细信息”链接，用户可在其中找到将卡片添加到仪表板的最佳做法，例如，建议的大小、示例卡片等。
