wireframe-sketch
Wireframe Sketch 是一个用于生成手绘风格线框图页面的技能。它强调低保证真度,追求铅笔/马克笔质感、网格纸背景、斜线填充、虚线边框和轻微旋转,让页面看起来像草稿而非成品 UI。工作流会从需求中选取 3–4 个屏幕变体标签,其中一个为激活态,其余为未激活的草图标签。页面结构依次包括:带伪标签的页头、标签条、网格纸画布、浏览器窗口栏、侧边导航、KPI 卡片、折线图占位、柱状图占位以及便签注释。最终输出一个内联 CSS 的 HTML 文档,使用 Caveat、Patrick Hand 或 Architects Daughter 等手写字体,并通过 data-od-id 标记关键区域。该技能适合在早期设计探索阶段快速表达布局想法,不适用于需要精细视觉的成品界面。