SuperAPI AI 工具集

wireframe

通用与其它

查看项目

更新于 10-16 06:50

技能介绍

用途:把界面或流程的结构用低保真黑白 SVG 线框图表达出来,关注“什么放在哪里、顺序和大致尺寸”,不涉及颜色、品牌和精修。

主要能力:按固定的 house style 输出,描边 #000、宽度 1.5,盒子填充 #fff,占位填充 #e6e6e6,文字 #000、占位文字 #666,标注层仅用 #d33 虚线;统一字体 -apple-system, system-ui, sans-serif;字号仅 12/14/20/28;网格 8px 吸附、24px 间距,坐标须为 8 的倍数;默认画布为桌面 1280×800、移动 375×812、平板 768×1024。提供按钮、输入框、卡片、导航、表格、占位图、弹窗、抽屉、标注等原语;多屏流程每屏一张 SVG,并生成 flow.svg 缩略图加箭头。

使用方式:先确认屏幕与视口,选画布并说明;从 primitives 组装、坐标吸附 8px;默认写入 wireframes/<slug>.svg;回复中内联 SVG、给出编号标注列表与假设。用户要求浏览页或发布时,读取 viewer 说明并基于 site-template.html。

适用场景:屏幕、页面、流程的线框化梳理,以及为评审、纯文本渠道提供可查询的说明。

限制:不用于生产 UI 代码、高保真或品牌稿、交互原型、架构/时序/数据模型图、插画;SVG 是静态的。具体原语细节、网格像素、示例和发布模板暂未提供。