Files
王冕 a619938e0c Initial commit: 小羚羚小程序 Axhub Make workspace.
Include xll-miniapp prototype, PRD resources, annotation directory sync, agent skills, and cloud publishing setup.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-30 15:32:30 +08:00

2.0 KiB

Excalidraw 基础指导

这份只说明如何把内容组织成 Excalidraw 图,不规定 Axhub 画布流程。基础思路参考 excalidraw-diagram-generator:先判断图类型,再抽取元素、关系和复杂度,最后生成清晰布局。

参考来源:https://www.skills.sh/github/awesome-copilot/excalidraw-diagram-generator

先判断图类型

用户意图 适合图形
流程、步骤、审批、状态流转 流程图
模块关系、依赖、信息结构 关系图
概念拆解、头脑风暴 思维导图
系统、页面、组件、服务结构 架构图
数据输入、处理、输出 数据流图
多角色协作流程 泳道图

如果画布内容涉及真实图片、UI 设计稿或素材,先按用户目标确认它是画布参考、画布节点,还是项目实现素材。

抽取信息

动手画之前先明确:

  • 关键元素:节点、步骤、角色、页面、模块。
  • 关系:先后、依赖、父子、输入输出、跳转。
  • 复杂度:元素太多时拆成多个 Frame 或多张图。
  • 主次:优先画主路径,细节放到旁边补充。

布局原则

  • 流程图:从左到右或从上到下。
  • 关系图:核心元素居中,相关元素围绕或分组。
  • 架构图:按层级、职责或数据流分区。
  • 思维导图:中心主题 + 4-6 个主分支。
  • 泳道图:角色用列或行,活动放进对应泳道。

相关内容使用 Frame 分组,组内元素用 frameId 归属到对应 Frame。

控制复杂度

  • 单张图优先控制在 20 个核心元素以内。
  • 复杂请求先画高层图,再按模块拆详细图。
  • 避免把长文档逐句搬进画布;画结构和决策点。
  • 颜色只表达语义,不做装饰。

与 Axhub 规范的边界

  • 画布文件仍写入 src/prototypes/<prototype-name>/canvas.excalidraw
  • 字体、颜色、节点、资源和交付口径仍按本技能主文档与其他 references 执行。