Ardot Html Prototype Converter

Ardot HTML 原型转换器

将 HTML 原型按业务结构重建为可维护、可编辑的 Ardot 页面。不要逐像素搬运 DOM，也不要只凭页面名、静态 HTML 或一张截图猜测内容。

必读顺序

1. 任何转换前读取 references/workflow.md。
2. 创建或修复页面前读取 references/page-specs/common.md。
3. 判断平台后只读取对应规范：

• PC 列表页：references/page-specs/pc-list-page.md
• PC 表单页：references/page-specs/pc-form-page.md
• PC 详情页：references/page-specs/pc-detail-page.md
• PC 报表页：references/page-specs/pc-report-page.md
• PC 页面存在真实弹窗状态时，追加读取：references/page-specs/pc-dialog.md
• 移动端页面：references/page-specs/mobile.md

1. 审查、修复、批量交接或接手已有产物时，再读取 references/execution-checklist.md 和 references/failure-modes.md。

平台分流

• PC 普通页面排除可选 AnnotationLayer 批注实例后，只保留一个 PageFrame。存在浏览器证据可证明的真实弹窗状态时，允许在同一 page 横向平铺 PageFrame/默认 与一个或多个 PageFrame/；详细结构以 pc-dialog.md 为准。
• 移动端一个 Axure 页面对应一个 Ardot page；排除可选 AnnotationLayer 批注实例后，page 根节点可按状态平铺多个 Screen/，不使用 PC sidepanel。完整结构与验收规则以 mobile.md 为准。
• 不确定平台时先从渲染宽度、导航模型和页面主体判断，并把决定记录到系统 manifest；不要混用两套根结构。

不可违反的规则

• 创建 Ardot 节点前，必须通过 HTTP 服务用 Playwright 或等价浏览器流程渲染原型。
• element JSON 和截图必须覆盖实际业务状态。移动端的 Tab、分步表单、弹窗、单位切换和动态面板按状态分别取证。
• 最终 Ardot 页面使用 auto layout、命名容器和本地组件，不按 DOM 绝对坐标散堆节点。
• 页面命名优先执行项目级约定；项目未约定时使用解析后的完整菜单 path，一个文件对应一个系统时省略系统层级。
• 组件和变量 ID 仅在当前 Ardot 文件内有效。先读取本地组件库，再整理最小组件映射。
• 页面根节点中的批注只识别主组件为当前文件本地 AnnotationLayer 的实例。结构、业务文本和语义校验先排除该实例及其后代；原样保留已有实例，不生成、修改、移动或删除。裸 Text、Rectangle 或普通 Frame 不享受此例外。
• Content 保持普通可编辑 frame；PC Content 垂直 padding 必须为 0，水平 padding 默认为 24；常用控件使用当前文件的本地组件实例。
• PC 弹窗状态必须使用独立的标准尺寸 PageFrame，不复制或继承宽表默认态的自适应宽度。其 Content 可以为空，但仅作为尺寸基准；必须同时存在源弹窗证据、已启用「忽略自动布局」的 ModalLayer 和可见 Dialog。普通 PC 状态的空 Content 仍然失败。
• PC 表格使用 Table -> table column 组件实例，不得改成 TableRow -> Cell。
• 除 pc-dialog.md 明确允许的弹窗评审态空 Content 外，不得隐藏、压缩、省略业务内容或用展示覆盖层伪造可验收截图；弹窗页的完整默认态仍必须保留全部业务内容。
• 列数、字段分组、顺序和信息层级以源稿为准；组件不适配时调整或新增本地组件，不能改布局迁就组件。无法实现时标记 needs_rebuild 或 blocked 并说明原因，不得标记 completed。
• capture_layout 只用于结构检查，不能单独证明页面完成。completed 必须同时通过结构、语义和视觉验证。
• 多页面批次按单页事务执行：创建 page 时选中它，在切换下一页前完成构建、回读、布局检查、画面节点截图和 manifest 更新；不要先批量创建空 page。
• 每个系统使用独立 manifest。PC 弹窗页面可在既有页面记录中增加可选 states[]，接口见 pc-dialog.md；移动端采用状态级 manifest v2，接口见 mobile.md。
• 通用 Skill 仓库只保存参数化规则、脚本和占位模板。项目专属 Axure HTML、业务数据、真实 ID、截图和证据必须保存在外部 --project-root 或被 Git 忽略的 .local/，不得写入公开仓库。
• 控制上下文：优先读取 compact page manifest、状态摘要、组件映射和单页证据，不常规输出压缩 document.js、全量 HTML 或完整组件子树。

执行方式

每批先完成一种页面类型的样板。样板通过结构、语义和视觉验证后才能复用；每个页面或状态仍需使用自己的源证据。完成一个页面或状态后立即更新 manifest 和交接记录。

公开发布或交接本 Skill 仓库前，运行 node scripts/audit_public_repo.js --repo-root .；项目专属敏感词只写入被忽略的 .local/audit-policy.json。

遇到截图、组件或状态异常时，只做最小、可解释、可回滚的修正；按 failure-modes.md 排查，无法定位时停止并汇报证据和节点 ID。

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: balabalabalading
• Source: balabalabalading/ardot-html-prototype-converter
• License: MIT

Install and usage instructions live in the source repository linked above.