节奏

是什么

Tempo 是一款由 AI 辅助的产品，可用于更快地设计和构建 React 应用界面。它结合了可视化编辑器、代码生成和开发者工作流控制，使设计师和开发者能够直接围绕 React 代码协作，而不是在不同工具之间分开工作。

该产品似乎面向构建 React 前端的团队或个人，尤其适合希望基于现有代码库开展工作、而非从头开始重建的用户。其定位很可能是可视化构建器、AI 编码助手和面向 React 的协作环境的混合体，并通过 Agent+ 服务提供可选的更高接触度支持。

功能

• 面向 React 代码的可视化编辑：Tempo 允许用户通过拖放界面编辑 React 组件、布局和样式，使以设计为导向的工作流中的 UI 修改更加容易。
• 兼容现有 React 代码库：用户可以导入当前的 React 项目，而无需从零重建，这有助于保留已有的工程成果。
• 代码层面的灵活性：平台表示代码可以自由组织和自定义，这对于需要可维护输出而非受限模板的团队很有价值。
• 支持 Storybook 和设计系统：用户可以从 Storybook 导入组件，或生成自定义组件库，以支持设计系统的搭建和复用。
• 支持本地和基于 GitHub 的工作流：Tempo 支持在 VSCode 中编辑并推送到 GitHub，帮助开发者保留熟悉的工具链，并继续掌控托管和部署。
• 模板和组件起点：该产品提供 React 组件和社区模板，可加快原型设计和界面搭建。

实用建议

• 验证其对现有代码库的适配程度：如果你的团队已有成熟规范，应先在一个具有代表性的 React 项目上测试 Tempo，再决定是否更广泛采用。
• 在既重视可视化编辑又重视代码所有权的场景中使用：对于希望快速迭代 UI、同时又不放弃源代码直接访问权的团队，这款产品可能最具优势。
• 尽早确认与设计系统的契合度：如果 Storybook 和可复用组件是你工作流的核心，应确认 Tempo 在命名、结构和样式规范上的保留程度。
• 区分自助式与服务式价值：Tempo 同时提供软件访问和 Agent+ 服务，因此采购方应明确自己需要的是工具、交付伙伴，还是两者都需要。
• 仔细评估基于额度的使用方式：由于核心套餐采用额度制，团队应预估生成和代理功能的使用频率，以避免选择不匹配的方案。

OpenClaw 技能

在 OpenClaw 生态中，Tempo 很可能支持聚焦前端生成、UI 优化和 React 组件操作的技能。可能的工作流包括：将产品需求转化为界面草图、生成或修改 React 页面、比对设计系统一致性，以及为工程团队准备可直接实施的 UI 任务。如果 OpenClaw 代理能够编排多步骤交付，那么 Tempo 将很自然地适合作为该流程中的 React 设计与构建层。

一个可能的高价值用例是：OpenClaw 的产品团队代理接收 PRD，产出页面规划，起草组件结构，然后使用面向 Tempo 的技能生成或优化前端输出，最后将工作交给开发者在 VSCode 和 GitHub 中审查。对于设计系统团队，OpenClaw 还可以协调对 Storybook 组件的审计，并建议应在何处使用 Tempo 来标准化或扩展 UI 模式。这些是基于工作流推断出的可能性，并非源页面已确认的原生集成。