Vibe coding · 以此为例
“帮团队做一个报销应用。”
做一个符合你们团队需要的报销应用，要想清楚彼此关联的选择：审批怎么流转、不同角色能做什么、提交报销时该怎样操作。仅靠对话问答和文字表述，往往难以看清这些选择如何相互影响、权衡取舍、表达团队真正关心的事情。
很多需求，要看到具体方案才能想清楚。等结果做出来才发现偏差，就容易陷入反复修改。关键判断又散落在聊天记录里，需求一变，回顾当时的取舍、调整整体方案，都得重新翻找和梳理。
开源插件
让构思看得见让细节有把握
语构设计系统（Yugoo Design）将你的 Agent 应用升级为交互式构思设计工作台。它将智能体技能与可编辑的设计面板相结合，像专业顾问一样主动引导协作，帮助你澄清问题、探索可能、完善方案，在复杂任务中理解问题、思考取舍、表达需求。
适配多种智能体宿主 · 沿用已有模型、会话与工具
从许愿到掌控
如何让 AI 更好地与你协作？ 你需要理解、思考和表达
Vibe coding 和 Vibe working 能快速给出结果。但怎样才能在过程中有效参与，而不是等到最后，才知道做出来的是不是自己想要的？
And more.
类似的困难，也出现在写代码以外的工作里。
- 活动策划
- 即使列出了完整议程，你也未必能想象活动现场的体验。节奏、分组与参与方式，能否真正帮助你们团队达成目标？
- 游戏设计
- 规则、奖励与玩家选择彼此影响。即使逐项讨论过每种机制，仍可能难以判断组合后的体验，或说清哪里需要调整。
- 排班规划
- 排班要兼顾岗位覆盖、时间限制和个人偏好。即使排满了每个时段，哪些取舍能被接受、调整一处会影响哪些安排，仍可能难以判断。
为人与 AI 协作而设计
核心能力
与 AI 一起探索想法、推敲选择，让你的判断成为双方共同成果的一部分，并持续完善下去。
可交互的技能包 · 让信息以自然、合适的形式呈现
Bundle 将专业技能与适合不同信息和任务的 UI 交互结合起来。这些界面可以通过声明式 UI 预先定义，也可以由 AI 通过 A2UI 生成，帮助你直观理解信息、有效思考取舍、准确表达意图。
主动式专业引导 · 围绕目标与缺口，推进下一步
Kit 将领域专业方法与相关 Bundle 组织在一起。AI 结合这些方法，帮你澄清诉求、推敲选择。随着想法逐渐清晰，它根据目标、当前成果与你的反馈发现缺口、建议下一步。
信息关联与自动审查 · KAG 与 GRA · 从局部到整体
知识图谱（KAG）将成果与来源关联起来，帮你看清不同部分的联系。自动审查（GRA）关注内容是否一致、知识是否存疑、意图是否清晰，提出需要你判断和完善的建议。
把构思沉淀为项目 · 成果集中管理，演进有迹可循
将构思成果与相关资料保存在同一个设计项目中，通过文件管理组织内容，通过版本记录追溯变化。跨对话回来，仍能围绕同一个项目继续推敲与修订。
定制你自己的 Kit 与 Bundle
把你所在领域的专业方法与交互方式带入语构。
例如，为活动策划定制 Kit。
开始使用语构
从你关心的事情开始
从示例开始
通过 Web App Kit，看看一个想法如何逐步形成完整、一致的应用设计。
查看完整示例带入已有工作
打开已有语构项目，或从文档、截图与代码重建设计。
查看支持的方式定制 Kit 或 Bundle
改造一个 Bundle，或将多个 Bundle 与专业方法组合成适合自己领域的 Kit。
查看定制教程选择宿主，开始安装
常见问题
DeepSeek Harness
把这段提示词交给 DeepSeek Harness 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 DeepSeek Harness 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 DeepSeek Harness 以 pnpm exec yugoo-design install --host dsh 为入口，按本版帮助补齐所需参数后执行。 按本次安装包的 DSH 说明，发现当前官方 Harness 的现有 profile 及原生 Node、CLI、Loader，准备 --dsh-config、--profile 和 --receipt-dir；路径与校验信息由你取得。将 Yugoo 原生模块接入该 profile，在 Harness 的 Plugins 界面启用，必要时按宿主正常流程重启。回到目标会话，核对实际加载的模块版本并调用一次 Design 工具。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-deepseek-harness
Codex Desktop
把这段提示词交给 Codex Desktop 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 Codex Desktop 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 Codex Desktop 以 pnpm exec yugoo-design install --host codex-desktop 为入口，按本版帮助补齐所需参数后执行。 按本版帮助，在我的用户目录内准备 --destination，并选择外部 --receipt-dir。使用安装器返回的个人插件目录和 npm 来源，在 Codex Desktop 原生 Plugins 界面安装或更新、启用 Yugoo Design；需要我操作时，给出准确界面位置和本次生成的路径。必要时正常重启，再在目标会话核对已加载插件、实际调用一次 MCP 工具，并检查 Panel 入口。生成目录不等于已启用。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-codex-desktop
Codex CLI
命令行把这段提示词交给 Codex CLI 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 Codex CLI 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 Codex CLI 以 pnpm exec yugoo-design install --host codex 为入口，按本版帮助补齐所需参数后执行。 发现实际使用的 Codex CLI 和兼容 Node，准备 --receipt-dir，以及本版需要的 --codex-executable，完成原生持久接入。在目标工作区正常开启 Codex 会话，确认已安装的 yugoo Skill，实际调用一次 MCP 工具并检查 Panel 入口。保留已登记的 npm 运行时，不以临时 --plugin-dir 启动代替安装。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-codex-cli
Claude Code CLI
命令行把这段提示词交给 Claude Code CLI 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 Claude Code CLI 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 Claude Code CLI 以 pnpm exec yugoo-design install --host claude-code 为入口，按本版帮助补齐所需参数后执行。 发现当前 Claude 执行文件和兼容 Node，按本版帮助填写 --claude-executable、--receipt-dir，完成原生用户级插件安装。正常开启 Claude Code 会话，确认 /yugoo-design:yugoo 入口，实际调用一次 MCP 工具，再检查 Panel 入口。保留已有设置和其他插件，不要只打印临时 --plugin-dir 命令就结束。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-claude-code-cli
Qoder CLI
命令行把这段提示词交给 Qoder CLI 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 Qoder CLI 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 Qoder CLI 以 pnpm exec yugoo-design install --host qoder 为入口，按本版帮助补齐所需参数后执行。 发现 qodercli 和兼容 Node，准备 --receipt-dir；需要明确执行文件时再填写 --qoder-executable。保留当前 Qoder 配置，完成原生用户级安装。再按本版参数单独运行 pnpm exec yugoo-design check-runtime --host qoder，检查运行时是否就绪。在正常新会话中确认 /yugoo-design:yugoo，实际调用一次 MCP 工具并检查 Panel 入口，不以仅本会话生效的 --plugin-dir 启动代替持久安装。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-qoder-cli
千问办公 QwenWork
把这段提示词交给 千问办公 QwenWork 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 QwenWork 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 QwenWork 以 pnpm exec yugoo-design install --host qwenwork 为入口，按本版帮助补齐所需参数后执行。 按本包 README 和帮助发现真实 QwenWork 运行时，准备 --qwenwork-runtime、--destination、--suite-version。优先用宿主实际提供的原生工具导入套件；需人工时，到 Extensions → Expert Kits → Add → Upload suite，选择返回的套件压缩包。再单独验证 design-system MCP 连接器：已有可用连接就复用；需要导入时，到 Extensions → Connectors → Add → Paste JSON，使用本次生成的连接器配置，只启用一个 design-system。确认实际加载的套件和一次真实工具调用；若必须新开 QwenWork 任务才能激活，说明并在新任务中继续验证。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-qwenwork
WorkBuddy
把这段提示词交给 WorkBuddy 中的 Agent，依次完成取包、宿主接入与启用验证。
请为 WorkBuddy 安装或更新语构设计系统（Yugoo Design），分两步完成：先取得 npm 包，再接入并启用当前宿主。 1. 取得安装包 缺少兼容 Node 或 pnpm 时先帮我准备。优先使用我指定的版本；未指定时，将 npm latest 一次解析为精确稳定版本，若 latest 指向预发布版则说明并停止。复用匹配的已有安装，或在专用安装目录用实际版本执行 pnpm add --save-exact yugoo-design@<resolved-version>，核对完整性，保留项目、设置与回执。 在该目录读取 node_modules/yugoo-design/README.md，并运行 pnpm exec yugoo-design --help。具体版本的问题按取得版本的说明处理；所需路径和参数由你发现并填写，不要让我手写路径或哈希。 2. 接入 WorkBuddy 以 pnpm exec yugoo-design install --host workbuddy 为入口，按本版帮助补齐所需参数后执行。 用 --destination 和 --suite-version 准备外部稳定市场目录。到 Skills → Skill Market → Suites → +（Add Marketplace），或当前版本的对应控件，导入返回的 nativeImport.market 目录，再安装、启用 Yugoo Design。更新时复用同一市场路径和 --previous-receipt，先在市场中 Refresh、确认新套件版本，再 Update 插件；不要当作 QwenWork 套件导入，也不要添加 QwenWork 运行时参数。必要时新开原生会话，核对加载的插件，实际调用一次 MCP 工具并检查 Panel 入口。 分别核对取得的包版本与宿主实际加载版本，如实说明尚未完成的启用步骤。可打开已有项目的 Panel 检查入口，不要自动创建设计项目或运行 GRA。最后给出当前可用的 yugoo 入口，以及一条可复制的 Web App Kit 首项目请求，由我开始。 仅当本包 README、帮助和宿主实际输出仍不能解决具体问题时，再查补充指南：https://github.com/alibaba-damo-academy/yugoo-design/blob/main/packages/companion/HOSTS.md#install-or-update-workbuddy