Block Kit：Slack 对构建更好的协作 UI 的贡献
已发表: 2022-03-10（这是一篇赞助文章。）在过去的几年里，公司的工作方式发生了重大转变。 随着越来越多的企业变得独立于位置，协作工具已成为团队开会和完成工作的标准方式。
也就是说，仅仅因为我们拥有集成了我们互联业务流程和工具的协作应用程序，这并不意味着这种体验总能带来最佳效率或生产力。 为什么？ 好吧，有时不友好的用户界面会妨碍您。
这就是为什么今天我要讨论 Block Kit，它是 Slack 为构建更好的协作 UI 所做的贡献。
对于那些构建了自定义 Slack 应用程序（用于应用程序目录或内部用途）的人，这将是您对新设计工具的介绍。 对于那些没有的人，没关系。 有一些有价值的经验教训可以从这方面吸取，这些经验教训可以帮助人们打造一个可以改善协作的引人入胜的工作空间。
开发人员，你知道 Slack 一直在做什么吗？
自 2013 年推出以来，Slack 取得了长足的进步。最初是一个消息应用程序，现在已经发展成为一个强大的协作平台。
在撰写本文时：Slack 每天有超过 1000 万活跃用户——他们生活在世界各地（准确地说是 150 多个国家）。
使用 Slack 的不只是个人——近 585,000 个三人或三人以上的团队在该平台内进行协作。 财富 100 强公司中有 65 家也恰好在 Slack 上。
这一切都归功于 Slack API，它为开发人员创建和发布可扩展 Slack 工作区功能的公开可用应用程序打开了大门。
这样，Slack 用户就不必在他们最常用的业务工具之间来回切换。 相关流程可能全部发生在 Slack 内部。
但是，有时，Slack 应用程序目录中可用的内容不足以满足您组织内部的需求。 您或许可以在您的业务工具与现有工具之间架起一座桥梁，但您也可能会找到构建自己的自定义 Slack 应用程序的理由。
介绍来自 Slack 的 Block Kit
事情是这样的：虽然 Slack 成功地允许开发人员制作自己的应用程序以增强平台内的协作，但开发人员应该如何知道如何使用它创造良好的体验？
直到最近，Slack 的 API 和应用程序目录还提供了有限的灵活性和控制力。 正如平台总经理 Brian Elliott 所解释的：
“今天，所有应用程序都被迫采用一组有限的方式来显示丰富的信息。 如果您在 Slack 中查看并使用过所有不同的应用程序，那么无论他们尝试部署哪种功能，它们中的许多最终都具有相同的布局。 实际上，您需要的是一组组件，这些组件可以让您构建丰富的交互式显示，让人们更容易理解、消化和采取行动。”
因此，Slack 开发了 Block Kit。
Block Kit 是一个 UI 框架，使开发人员、设计人员和前端构建者能够通过丰富、交互式和直观的 UI 显示他们的消息传递应用程序。 此外，通过提供一组可堆叠的 UI 元素或块，Block Kit 现在为开发人员提供了对其应用程序设计和布局的更多控制和灵活性。
注意：如果您希望看到 Block Kit 的实际应用，请加入即将到来的 Slack 会议“使用 Block Kit 构建”，您将在其中获得现场产品演示，并了解自定义应用程序设计是多么容易。
Block Kit 包含两个关键组件：
1. 块套件生成器
请注意此构建器工具与我们用于为客户创建网站和应用程序的许多其他工具之间的相似之处：
建筑组件在左侧。 只需单击您要包含的那个，然后观看它被添加到中心的应用程序预览中。
想要进一步定制？ 查看右侧的文本编辑器。 虽然 Block Kit 提供了遵循设计消息应用程序的最佳实践的预制元素，但如果您愿意，您可以将它们制作成您自己的元素。
2. 块工具包模板
虽然您当然可以自己从 Builder 制作消息传递界面，但我建议您也探索提供的模板：
Slack 团队已经看到了真正有用的 Slack 应用案例。 不用说，他们知道您的组织可能想要利用哪些类型的东西来改善协作。
这就是为什么您会发现已经为您构建的以下常见操作：
- 审查批准请求；
- 对新通知采取行动；
- 运行民意调查和监测结果；
- 进行搜索。
Guru 就是这样一种工具，它利用 Block Kit 来改进其 Slack 应用程序：
Guru 在 Slack 中提供了数据库搜索功能。 结果现在可以快速检索并更清晰地显示在 Slack 的前端。
构建更好的协作 UI 的关键
既然我们已经了解了 Block Kit 的未来发展趋势，那么我们需要谈谈它将如何帮助您创建能够带来更高效协作的应用程序。
块
我最近谈到了古腾堡的主题以及设计师如何利用它来发挥自己的优势。 尽管新的 WordPress 编辑器显然存在缺陷，但毫无疑问 WordPress 团队为何做出改变：
块构建器是网页设计的未来。
“
我知道块构建器往往是网页设计师和 DIY 用户的首选工具。 构建器允许可视化前端设计，并且通常包含丰富的自定义选项。
但 Block Kit 的作用远不止于此，这意味着设计人员和开发人员都可以轻松构建自定义应用程序。
代码
网站构建器和 Block Kit 构建器之间的关键区别在于编码方面。
在大多数情况下，设计人员使用页面构建器，因此他们不必为代码而烦恼。 他们可能会添加一些自定义 CSS 类或将 HTML 添加到他们的文本中，但通常就是这样。 开发人员不会那样工作。
Block Kit 包括一个带有预先编写的 JSON 的面板，开发人员可以在准备就绪后将其复制并粘贴到他们自己的 Slack 应用程序中。 Slack 并没有让开发人员编写自己的代码，而是提供了利用速度和设计最佳实践的代码。
这使开发人员能够专注于进行自定义，而不必从头开始构建他们的应用程序。
一致性
当 Slack 用户进入平台时，他们知道会发生什么。 从工作空间到工作空间，每个界面都是相同的。
但是，当 API 允许开发人员构建应用程序以与这些空间集成时，就会存在引入不合时宜的元素的风险。 发生这种情况时，界面的不可预测性会给最终用户带来困惑和犹豫。 不合适的布局选择也会损害体验。
Block Kit 使开发人员能够使用经过尝试和测试的可堆叠 UI 组件构建应用程序。 在已经建立的平台中定制体验时，可能很难知道您能走多远——或者它是否会奏效。 Slack 已经将这些问题排除在外。
间距
这就是传统的 Slack 交易所的样子：
它往往是单列的来回交换。 这对于协作简单的 Slack 渠道非常有效。 员工关于任务状态的消息。 客户上传丢失的资产。 首席执行官分享了提及该公司的新闻稿的链接。 但并非所有工作空间都那么简单。
Block Kit 可帮助您最大化和增强应用程序功能占用的空间。 例如，Block Kit 使 Optimizely 等公司能够以两列格式显示相关信息，以提高可读性。
这确实是在团队的 Slack 应用程序中共享相关详细信息的更好方式。
丰富的互动
提升您的应用程序的另一种方法是将集成转变为具有丰富交互的集成。
Blocks 是专门为增强 Slack 协作中最常用的元素而开发的。 例如：
- 使用截面块更好地组织。
- 使用文本块自定义消息的显示方式。
- 使用适当大小的图像块，这样您就不必担心它们是否会正确显示。
- 使用上下文块显示关于消息的署名或附加上下文（如作者、评论、更改等）
- 使用分隔块来改善应用程序的外观。
- 使用菜单选择、按钮选择和日历日期等操作块为您的应用程序带来更好的功能并使它们更直观地显示。
- 使用2 部分块以获得更清晰的布局。
Doodle 有一个漂亮的例子，说明使用 Block Kit 可以通过丰富的交互来完成什么：
如您所见，用户可以像使用第三方日历一样有效地安排会议。 唯一的区别是他们现在可以在 Slack 工作区中完成所有这些工作。
包起来
协作是任何组织成功的重要组成部分，无论是 3 人团队还是 300 人团队都无关紧要。但一起工作和高效协作之间存在很大差异。
多亏了 Slack 的 API，开发人员创造了一些很棒的方法来将相关流程和工具集成到平台中。 多亏了 Block Kit，如果元素设计不足，这些外部贡献不会破坏体验。
凭借直观的块构建功能、开发人员友好的编码选项等，Block Kit 将帮助开发人员为 Slack 平台带来更丰富的体验和更好的协作。
最后要提一件事：
Slack 的 Frontiers 会议即将召开。 它将于 4 月 24 日至 25 日在旧金山举行。如果您打算参加，请注意，开发者赛道将包括一整天的 Block Kit 培训，包括研讨会、新功能演示、教程以及一个 -一对一辅导。 如果您正在考虑 Block Kit，那么这是您不容错过的机会。