mcpField
B
bmad-excalidraw

bmad-excalidraw

github.com/bmad-code-org设计与 UI21774 次安装5 周前更新
代码仓库

关于 bmad-excalidraw

Excalidraw Diagram Builder 是用于对话式设计和生成 Excalidraw 图表的技能,涵盖流程图、架构图和时序图等。它提供引导式、快速和无交互模式,并配有生成及验证图表文件的脚本。

主要功能

  1. 01引导式图表规划
  2. 02自主与 YOLO 生成模式
  3. 03支持多种图表类型
  4. 04自动布局生成
  5. 05验证 Excalidraw 文件

适用场景

  1. 01将初步构想转为图表
  2. 02无交互生成图表
  3. 03制作架构图或时序图
  4. 04检查 Excalidraw 文件结构

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/bmad-code-org/bmad-builder --skill bmad-excalidraw

安装后在 Claude Code 中输入/bmad-excalidraw确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
diagram-generation.md
diagram-types.md
excalidraw-schema.md
guided-design.md
scripts/
generate_excalidraw.py
validate_excalidraw.py
scripts/tests/
test_generate_excalidraw.py
test_validate_excalidraw.py

详细介绍

Excalidraw 图表构建器

概述

通过对话式设计或自主生成,制作专业的图表和视觉辅助材料,并输出为 Excalidraw 文件。作为视觉设计顾问和图表绘制专家,引导用户从粗略想法开始,逐步完成精致的 .excalidraw 文件。输出的是可直接打开的 Excalidraw 图表——流程图、架构图、时序流程图、思维导图等。

领域背景: Excalidraw 是一款虚拟白板工具,可生成手绘风格的图表。文件采用 JSON 格式,并遵循定义明确的元素架构(矩形、椭圆、菱形、箭头、线条、文本、画框)。用户可能不知道哪种图表类型最适合他们的需求——帮助他们找到答案也是你的工作之一。

设计理念: 设置三种模式是因为用户所处的情境各不相同:初次使用者需要引导式探索,熟悉的用户有明确输入时需要快速输出,而流水线则需要零交互。

激活模式检测

立即检查激活上下文:

  1. 自主模式:如果用户传入 --headless 或 -H 标志,或者其意图明显表示需要非交互式执行:

    • 跳过提问,根据提示推断图表类型和内容
    • 使用合理的默认值生成图表
    • 保存到 {output_folder}/diagrams/ 并报告路径
    • 如果使用 --headless:{diagram-type} 或 -H:{diagram-type} → 使用指定的图表类型
  2. YOLO 模式:如果用户说 --yolo 或“直接制作”,或者提供非常具体且完整的描述:

    • 尽可能从输入中推断所有信息
    • 立即生成图表
    • 结束前快速询问一句“需要我调整什么吗?”
  3. 引导模式(默认):继续执行下面的完整交互流程

激活时

  1. 从 {project-root}/_bmad/config.yaml 和 config.user.yaml 加载配置。如果缺失,则使用备用值:

    • {user_name} —— 备用值:省略
    • {communication_language} —— 备用值:使用与用户相同的语言
    • {output_folder} —— 备用值:{project-root}/diagrams
  2. 使用 {user_name} 称呼用户,并使用 {communication_language} 交流

  3. 根据用户请求判断图表意图:

    • 用户想要可视化什么?
    • 用户是否指定了图表类型?如果指定,请根据 ./references/diagram-types.md 验证
    • 用户是否提供了足够的细节,可以跳过引导式设计?
  4. 按模式分流:

    • 自主模式/YOLO → 直接使用 ./references/diagram-generation.md
    • 引导模式 → 先使用 ./references/guided-design.md,然后使用 ./references/diagram-generation.md

阶段

#阶段目的提示词
1引导式设计创意引导——构思图表类型、内容和布局./references/guided-design.md
2生成使用恰当的布局生成 .excalidraw 文件./references/diagram-generation.md

无头模式:跳过 guided-design,完成后输出文件路径。

脚本

scripts/ 中的可用脚本:

  • generate_excalidraw.py — 接收图表规格 JSON,并通过自动布局生成有效的 .excalidraw 文件
  • validate_excalidraw.py — 验证 .excalidraw 文件结构并报告问题

评论

支持 Markdown