wireframe 线框图与原型生成器：快速绘制 Web/iOS/Android UI 线框图和交互原型
wireframe by markdown-viewer/skills
安装命令
npx skills add https://github.com/markdown-viewer/skills --skill wireframe🇨🇳中文介绍
UI 线框图与原型生成器
快速开始： 选择平台（Web/iOS/Android）→ 从组件库添加 UI 组件 → 在屏幕布局中排列 → 添加导航流程 → 用 ````drawio` 代码块包裹。
⚠️ 重要： 始终使用
drawio` 代码块。切勿使用xml` —— 它不会渲染为图表。
关键规则
🔗 这是一个基于 drawio 衍生的技能。 所有结构、布局和边路由规则均继承自 drawio SKILL.md。请先阅读基础规则。
线框图特有的补充规则：
- 查看 stencils/README.md 以获取确切的 UI 组件名称
- 使用一致的间距：紧凑用 10px，正常用 20px，区块间用 40px
- 移动端屏幕：iPhone 375×812，Android 360×800（逻辑像素）
- Web 线框图：桌面端宽度为 1200px 或 1440px
线框图类型
| 类型 | 用途 | 组件库 | 示例 |
|---|---|---|---|
| Web 线框图 | 桌面端/响应式网页布局 |
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者，精准高效
