ui-mockup-desktop-workbenchlisted

# ui-mockup-desktop-workbench ## 中文速查 - 中文名：高保真 UI 交付对齐器 / 桌面工作台 UI Mockup 生成器 - 英文稳定名：`ui-mockup-desktop-workbench` - 分类：产品与 PRD - 你可以这样叫我：`基于 PRD 和 UI 规范出高保真 mockup`、`先从 PRD 出 UI 结构和 ASCII 布局再做高保真`、`生成桌面工作台真实页面`、`把这个 Agent Client PRD 做成可交付开发的 UI`、`让前端按这个 UI 复刻` - 适合：把 PRD、UI 规范、真实项目组件、参考截图和状态清单转成先结构、后视觉、再交付实现的 UI contract、mockup 或项目原生 preview。 - 不适合：问题还没定义清楚；只需要 PRD 文案；只做移动端或营销页；不需要视觉/状态确认而是直接写生产功能。 ## Overview Use this Skill when the goal is not just a pretty standalone page, but a staged UI handoff that product, design, and engineering can inspect and implement from. The default output is a **UI implementation contract**, not disposable HTML. The contract starts with UI structure and states, then moves to visual fidelity only after the screen model is coherent. Standalone HTML is allowed only as one output mode. When the user provides a real frontend project path and wants development to reproduce the design, prefer a project-native preview route/component using the real app's components, tokens, icons, and layout conventions. The workflow combines: 1. `ui-wireframe-to-html` discipline: structure and state before polish. 2. Desktop Agent workbench patterns: navigation, task list, execution canvas, artifact/workspace panel, settings, and result surfaces. 3. User-provided UI specifications: tokens, layout rules, component style, copy tone, and interaction constraints override generic design instincts. 4. Project-native design discovery: real routes, components, style