一、线框图

  1. 用途：通过【线段+色块+文字】描述产品设计（内容、取值、校验、用途、交互、页面排版）
  • 优点：制作快速
  • 缺点：过于简陋，不易理解
  • 用途：早期方案讨论或需要快速输出

二、高保真图

  1. 用途：高度还原产品运行效果

  2. 要求：

    静态

    尺寸:严格按照截图比例
    参考线色彩:使用吸取颜色，注意渐变色
    贴图:矢量图/位图，截取，覆盖等

    动态

    交互:页面切换，点击动效，数据变化
    演示:PC浏览器、手机APP

  • 优点：还原度高
  • 缺点：耗时长
  • 用途：客户/大领导沟通，求职

三、简易需求文档PRD

  1. 在原型（线框图/高保真）上描述业务逻辑与数据说明

四、结论

  1. 建议根据项目需求制作简易需求文档PRD。有组件库时，优先采用高保真+说明；没有组件库时，优先采用线框图+说明，如果一上来就画高保真，容易陷入页面美化的误区，浪费自己时间，把原型发给UI后也容易误导UI设计师。