用途：HTML Prototype 是一个直接调用的专项技能，用来制作可信的产品决策模型，围绕用户对话、产品与项目上下文生成 HTML 视觉稿或交互原型。目标不是覆盖所有屏幕，而是让关键的视觉或行为问题变得可测试。
保真模式：分两种。Mockup 适合视觉层级、布局、排版、配色或产品契合度等问题，产出精致、响应式、基本静态的产物；Prototype 适合导航、输入、状态变化、反馈、恢复或过渡等问题，产出可运行的流程。不另设 html-mockup 技能；不为让视觉稿显得更完整而添加行为。若用户要求两种模式，应保持相同内容与结构以便对比。
方向来源：设计前先检查对话、提供的参考资料与项目，寻找设计系统文档、tokens、现有组件、产品截图与邻近产物。优先级为：用户明确的视觉与功能指令；项目既有设计语言与交互惯例；产品、受众、内容与场景；自身设计判断。开工前需确定用户与关键任务、受审查的有限场景、模式、视觉方向来源、相关状态模型，以及真实产品接管的边界。无设计系统时应从主题与用例创建具体方向，避免默认渐变、深色仪表盘、可互换卡片或装饰性指标。
范围与状态：选择能回答审查问题的最小流程，使用真实一致的人名、日期、状态、数量与文案。让导航在建模范围内可用；表单含标签、校验、提交反馈与合理默认值；仅在中断或确认属于场景时使用对话框；过渡用于澄清连续性或状态变化。移除无效按钮，属于真实系统的操作应说明边界。先列出状态再构建，包括加载、空、错误、成功、禁用、移动端及领域特定状态；异步动作通常展示加载、成功与失败或恢复，集合考虑空状态，受限操作说明禁用原因。
交付契约：交付一个自包含 .html 文件，必要 CSS 与 JavaScript 内联；无需构建工具、认证、实时 API 或外部服务；采用响应式组合而非缩小桌面画布；设计 token 少而具体；对比度可达，不仅靠颜色传达状态。交互上优先使用原生元素，支持键盘完成整个流程，焦点可见且在关键过渡后有意识放置；对话框有可访问名称、焦点圈定、Escape 关闭并恢复焦点；表单错误与控件关联，重要状态变化需播报；不把关键行为藏在悬停后；尊重 prefers-reduced-motion 并保留状态反馈；触控目标可用，防止页面级水平溢出。
验证与交付：在宽桌面与窄移动宽度测试，演练每个状态与控件，测试 Tab、Shift+Tab、Enter、Space、方向键与 Escape，检查控制台、页面溢出、长内容、禁用行为、焦点恢复与减弱动效模式。检查各不同表面的前景与背景计算色。若无浏览器工具，应说明哪些检查未验证。返回绝对文件路径、保真模式、建模场景、已实现状态，以及有意省略的生产行为。
限制：资料未提供具体收费、价格、平台、运行环境或效果数据；该技能不生成真实后端、认证或外部服务，仅产出前端 HTML 产物，且不适用于需要真实数据与生产逻辑的场景。