Wireframe

🖊️ 极速线框原型,一键出图

快速生成网页线框图、组件草图与用户流程图,支持 ASCII/SVG/HTML 多格式输出,适合原型设计阶段快速可视化。

收藏
5.5k
安装
1.2k
版本
3.4.1
CLS 安全扫描中
预计需要 3 分钟...

使用说明

核心功能

Wireframe 是一款专注于 UI/UX 原型设计的命令行工具,提供完整的线框图生成工作流。其核心能力涵盖:全页线框图(page)、单组件草图(component)、用户流程图(flow)、SVG 标注(annotate)、HTML 导出(export)及模板快速生成(template)。输出格式灵活,支持 ASCII 文本(适合代码审查与快速迭代)和 SVG 矢量图(适合演示与精修),并可直接导出为独立 HTML 文件,便于分享与浏览器预览。

显著优点

  • 多格式支持:ASCII 适合开发者快速查看,SVG 适合设计师精修,HTML 导出零配置即用
  • 模板化工作流:内置 landing、dashboard、blog、ecommerce 等常见页面模板,降低重复劳动
  • 轻量无依赖:仅需 Bash 4+,无需 Node/Python 环境,CI/CD 场景友好
  • 流程图能力flow 命令原生支持决策节点与页面跳转,弥补纯线框工具的叙事短板

潜在局限

  • 输出为静态线框,非可交互原型,无法模拟点击跳转或状态变化
  • ASCII 模式在复杂布局下可读性受限,需配合 SVG 使用
  • 缺乏组件库联动,无法与 Figma/Sketch 等主流设计工具双向同步
  • 标注功能依赖手动输入坐标,自动化程度有限

适合人群

  • 前端开发者在编码前快速确认页面结构
  • 产品经理需要低保真原型与开发团队对齐
  • 技术写作者生成文档配图
  • 个人开发者或初创团队追求零成本、轻量级的原型方案

常规风险

  • 开源 Bash 脚本存在供应链风险,建议审计 script.sh 后再部署于生产环境
  • SVG/HTML 导出文件若包含用户输入内容,需注意 XSS 过滤
  • 无版本锁定机制,直接拉取最新脚本可能引入破坏性更新

Wireframe 内容

scripts文件夹
手动下载zip · 7.0 kB
script.shtext/x-shellscript
请选择文件