一、什么是原型图?
“原型”的最基本定义是“最终产品的仿真或样本版本,用于发布之前方便测试。” 原型的目标是在花费大量时间和金钱进入开发产品前,让开发者以及对应的需求方能够快速的了解产品创意以及产品的样式布局。
原型是一种让用户提前体验产品、交流设计构想、展示复杂系统的方式。就本质而言,原型是一种沟通工具。
线框图描绘的是页面功能结构,它不是设计稿,也不代表最终布局,线框图所展示的布局,最主要的作用是描述功能与内容的逻辑关系
原型图是最终系统的代表模型或者模拟,比线框图更加真实、细致。
二、原型的类型有哪些?
如果需要从类型上来区分原型稿,大致可以分为三类:低保真原型、高保真原型、可交互原型。
低保真原型
低保真原型可以理解为高保真原型的雏形,一般在产品架构还不清晰的情况下产出的产品原型,产品还需要不断的设计迭代,此阶段低保真原型的设计成本较低。
低保真原型虽然是线框图,但是依然能够清晰的表达系统每个功能的业务逻辑、流程节点、功能点、页面布局、页面元素等。
三、高保真原型
高保真原型又可以被称为产品的演示Demo,这种原型除了没有后台数据交互外,完全可以模拟出真机静态演示效果,用户看到界面的所有功能、所有设计、所有状态反馈等等,都可以在这个原型中进行表现和传达,但是唯一的不足之处就是这类原型都是静态的,没有任何动效的,也就是说按钮就是按钮,你点按钮是没有任何反应的。
高保真原型设计稿,不仅仅要将页面布局、功能展示进行更细致的表现外,还需要对色彩风格、图标风格、文本样式、间距等等进行更高质量的输出。
一个高质量的高保真原型,是产品最终静态的可视化成果,也是前端/后端开发/测试人员的开发验收的重要标准之一。
四、可交互原型
可交互原型,顾名思义就是原型图支持用户的交互操作,通过每一次滑动、点击的操作,可以为用户展示不同的交互效果。
高质量的可交互原型,能够100%模拟出真机的实际操作,包括登录、注册、查询、报价、下单等等,通过真机模拟,来让客户真实感受产品。
五、主要设计工具
Axure RP 是一款快速原型设计工具,它不需要任何编程或写代码基础,就可以设计出交互效果良好的产品原型,常用于互联网产品设计、网页设计、UI 设计等领域。作为一款热门的原型设计工具,它可以完成很多纸和笔画不出来的事情,特别是高交互的页面,用动画效果展现让人瞬间清楚你要表达的内容。
我们可以在Axure中文学习网上学习它:https://www.axure.com.cn/86308
或者在b站找个视频看下案例:https://www.bilibili.com/video/av58666880/?vd_source=53f038e0534bbeb798b0fc50865c85d5
一些素材库:https://ant-design.antgroup.com/docs/resources-cn