高保真原型图
本篇文章的写作内容为:何为高保真原型图、所适用的情形、优劣势以及注意规范。
作为一名产品助理,绘制原型图是其必备的能力。有些公司会将绘制原型图的任务专门交给交互设计师做,即便是这样,这项技能仍是产品助理应该具备的。
以前在学校做原型图时,只是将产品的界面设计出来(表现层),没有逻辑层面的展示(数据逻辑层),并且界面效果等都需要后续再次完善。并且在找工作的时候,为了方便,会将参考软件的界面进行截图,用PS擦去需要实现的部分,再用Axure导入图片后,再在擦去的部分中进行添加功能。只是想用交互的原型来传达自己的想法,并没有比较真切的感受自己完全手工绘制,还是绘制高保真原型图。
何为高保真原型图?
使用绘制工具,将原本的想法进行绘制,明确其功能、逻辑层面以及界面,其最终的期望是能达到与产品实际运行时一样的状态。包括:功能、流程、逻辑、字体、颜色、布局、样式、视觉效果等。
有线框图、手绘图、低保真原型图、高保真原型图,那么高保真原型图更适宜使用于什么情景呢?
在绘制高保真原型图时,前期的投入相对较大,但却能够降低后期的修改与沟通成本。更适宜于开发团队之间还没有非常的默契,但公司发展较规范,且产品助理的发展方向更偏向于执行者角色的情况下。
在绘制高保真原型时,需要注意哪些事项呢?
如果是初创的产品,一般都是采用线框图,而如果真需要绘制高保真,那么需要前期大量的商讨、确定之后才进行绘制,需要确定功能、流程、样式等等。如果是成熟的迭代式产品,可以借鉴之前版本的样式,可参考性较大。需要注意的点:需确定样式、各个模块字体大小和字体类型、明确逻辑流程。确定原型设计的尺寸,一般网站设置为1024*768(或其他像素尺寸,网页随着屏幕的自适应度不同),APP设置为iphone5(640*1136)。
亲自实践,是对网站的需求迭代。前提是,已有参考网站样式,做出高保真原型图。那么,就开始着手实践了。首先,先将需求转化为功能和布局,然后在依照原有的网站样式进行原型制作,其最终结果是要高保真的。期间,使用到了MarkMan测量工具,测量出在原网站样式里,各个控件之间的距离。将原网站进行截图,并导入Axure中,可以匹对各个模块中的文字大小,以及可以用吸管,吸取原网站的颜色填充在现做网站上。通过对文字、颜色、距离、样式的把控,然后将控件都做好交互(各种情况下都有相应的状态),就能够将原型逐渐制作成为高保真的原型图了。