用途：将选定的视觉目标（图片、截图、样机、Image Gen 结果或 Figma 画布）翻译为高质量、可交互的网站或 Web App。必须先有明确选定的视觉目标，仅有文字说明不足以开始；若无法唯一确定所选图像，应停止并让用户指定概念或重新附上图片，禁止猜测。若参考为移动端视口则构建移动 App，默认桌面端。
主要能力：先审查参考设计并清点所有图片素材，使用内置 Image Gen 工具逐个生成素材（主视觉、缩略图、装饰插画、纹理、Logo、产品图、头像等），要求生成素材与参考共享同一艺术方向、配色与渲染风格。禁止用自定义 div 艺术、CSS 绘图、内联 SVG、手工 SVG、渐变、emoji 或文字字形替代真实图标与图片；图标使用最匹配的图标库，不默认 Lucide。若文字属于图片素材本身则保留在图片内。会为每段区块测量布局、间距与元素尺寸，寻找匹配的免费字体和图标库。
使用方式：先加载用户上下文并运行其预检脚本（有本地 shell 权限时）；按检查清单执行。用 local-prototype-preflight 开始构建，让导航、链接、菜单、主要 CTA、输入、筛选、切换等核心体验可用，并呈现 hover、focus、选中、加载、空、成功等状态；除非用户要求，不构建认证、持久化、后端或集成。生成素材后先替换全部占位符再继续。
本地验证：运行本地应用并用浏览器捕获；设计 QA 作为阻塞门禁。在 ChatGPT Work Mode 中，sites-preview 运行 npm run dev -- --host 0.0.0.0 --port 4173 --strictPort，需在云端浏览器打开 http://terminal.local:4173/ 并检查渲染页面、主要交互与控制台错误；启动预览不等于验证。QA 报告存为项目根目录 design-qa.md，P0/P1/P2 修复至 final result: passed，被阻塞则标记 blocked。通过后交付，保持本地预览开启。
限制：不部署到 Sites，除非用户明确要求分享、发布或部署；不新增页面或路由（除非用户要求）；不循环打磨 P3。图片生成工具不支持透明图，需要透明时须后处理。移动端 1:1 忠实仅适用于设备屏幕内 App 自有内容，设备外壳、状态栏等由模板负责。具体收费、平台价格与更多细节暂未提供。