cabinwandClaude Fable 5.1
e447d1f807
- 07 macaron, referenced from Meowdoku: cream worlds, a white tray with gutters, candy tokens with white arrows, two-column 关卡/待解 HUD, white elevated tool discs (macaron-only exception to the flat rule), full-screen dark result overlay, a brick ripple on board clear, an eased glide-out and dot-lattice dissolve on exit; Resource Han Rounded subset fonts (SIL OFL) in assets/fonts with the charset and regeneration note - 06 signpost: the design.md, tokens and preview directory that earlier commits left untracked - design docs, catalog, manifest, showcase and base spec updated to seven directions; the analysis and proposal live in docs/art-proposal-macaron.html - the renderer, app, geometry and CSS sources for both directions were already carried by the level commits made from this working tree Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
6.6 KiB
HEX TRAILS · 设计系统入口
这是给设计审核者和 Agent 共用的主游戏设计入口。当前有 7 套并列方案，每套 5 个主题，共 35 种组合。默认方案是 01「柔和原色」，最新候选是 07「马卡龙」；可同时保留多套。
人看 设计总览 与 可操作审核页。Agent 从本文、共用接入约定 和本次指定方案的 design.md 开始；可直接读 manifest.json 发现全部文件。根目录 AGENTS.md 与本目录 AGENTS.md 提供路由和维护要求。
按任务找到入口
| 你要做什么 | 先读 | 然后做什么 |
|---|---|---|
| 使用指定设计实现页面 | shared.md → 该套 design.md → tokens.json | 复用 directionTheme 和 drawScene，并接入对应 CSS |
| 调整某套造型或配色 | 该套 design.md → 文档列出的 JS/CSS 源 | 修改对应分支，同步文档，再生成配色与预览 |
| 比较与选择设计 | index.html | 同主题比较，再到审核页多选、记录意见 |
| 用其他引擎实现 | shared.md 跨引擎范围 → 该套 design.md | 复用绘制命令和几何，按浏览器参考验收 |
| 自动发现方案与颜色 | manifest.json → designs[].tokens | 路径从仓库根解析，schemaVersion 当前为 1 |
五套独立规范
| 编号 | ID | 方案 | Agent 规范 | 数据 | 预览 |
|---|---|---|---|---|---|
| 01 | calm | 柔和原色：哑光原版 | design.md | tokens.json | 查看 |
| 02 | vivid | 高彩游乐场：高饱和贴纸 | design.md | tokens.json | 查看 |
| 03 | toy | 积木轨道屋：塑胶积木 | design.md | tokens.json | 查看 |
| 04 | animals | 动物弯弯镇：动物角色 | design.md | tokens.json | 查看 |
| 05 | paper | 轻线纸境：细线纸面 | design.md | tokens.json | 查看 |
| 06 | signpost | 路标：线路图棋盘与压痕控件 | design.md | tokens.json | 查看 |
| 07 | macaron | 马卡龙：白托盘糖砖棋盘，参考 Meowdoku | design.md | tokens.json | 查看 |
设计 ID、主题 ID 和关卡版本各自独立。每套都支持 lagoon（轻松）、apricot（进阶）、lavender（烧脑）、rose（挑战）、midnight（每周挑战）；显示名可以不同，ID 不变。各主题名称、色值与有序色板从 tokens.json 读取。
文件架构与来源
design/
├── AGENTS.md # Agent 工作入口，人工维护
├── README.md # 本索引，人工维护
├── shared.md # 共用规则、接入、验证与限制，人工维护
├── manifest.json # 全部方案与文件路径，生成
├── index.html # 人看的总览，生成
├── examples/
│ └── render-design.mjs # 可执行的无 DOM 接入示例
├── directions/
│ ├── calm/ # 其余 vivid / toy / animals / paper 结构相同
│ │ ├── design.md # 本套设计规范，人工维护，构建不覆盖
│ │ ├── tokens.json # 12 色库、5 主题与 4/7/9/12 色板，生成
│ │ └── index.html # 人看的完整设计稿，生成
│ ├── calm.html # 兼容旧 URL，跳转到 calm/index.html
│ └── calm.md # 兼容旧文档入口，指向 calm/design.md
├── art-directions.css # 五套控件的样式源
├── game-tools.css # 共用扁平道具与布局源
└── tokens.json # 基础语义色导出，不是五套方案全集
设计颜色定义仍在 src/art-directions.js / src/design-tokens.js，几何仍在 src/renderer.js / src/token-art.js。没有将运行时代码复制到每套目录。各 design.md 解释意图、精确画法、控件差异、不可丢失的特征和验收点；tokens.json 给 Agent 提供当前数值快照。
所有生成 JSON 中 pathBase 为 repository-root；文件路径从仓库根目录解析。它与 Markdown 内按当前文档位置解析的相对链接不同。manifest 的版本号描述数据格式，不代表第几套设计。新增字段可保持同一版本；改变字段含义或移除字段时升级版本并更新消费者。
快速验证一次接入
在仓库根目录执行，Node.js 20+，无需安装依赖：
node design/examples/render-design.mjs paper lagoon 7
它调用共享主题与渲染器，输出设计 ID、主题 ID、色数、棋盘格数、色板和绘制命令数。可更换为 animals midnight 12。未知 ID 或不支持的色数会报错，避免 Agent 拼错 ID 后默默使用默认设计。此例验证无 DOM 几何接入，不代替 PNG、CSS 或实机视觉验收。浏览器 Canvas 示例在 shared.md 中。
修改、生成与校验
npm run design
node --test tests/design-packages.test.js tests/art-directions.test.js tests/themes.test.js
node scripts/build.mjs
- 规范源：本目录 AGENTS.md、README.md、shared.md、各套 design.md，直接编辑且不会被生成脚本覆盖。
- 实现源：JS/CSS、已接受的图集；在本次指定的方案范围内修改。
- 生成物：manifest、各套 tokens.json、index.html 及旧入口；不要只改生成物，下一次构建会重建。
- 新增方案：在 ART_DIRECTIONS 注册稳定 ID，新增
directions/<id>/design.md，更新本索引与相关验证，再运行构建。缺少规范时构建会失败。 - 校验覆盖文件可发现性、链接、配色导出与运行时一致性，以及可执行示例。视觉与原生范围按 shared.md 验收。
旧的 design/directions/<id>.html 和 <id>.md 入口继续可用；新的代码和文档请引用独立目录。根目录 Design.md / Design.html 保留基础组件与历史设计说明，不作为五套独立方案的唯一规范。实验室中的其他玩法原型各有自己的文档，不在这五套主游戏设计的 manifest 中。