新手教程之产品原型设计

作者:课课家教育更新于： 2019-03-19 15:34:22

     产品原型设计人人都是产品经理。产品原型其实就是产品原始原型框架,网站页面模块、需要我们去对它进行排版和布局,加入交互性的元素,使其更加具体创新、更形象生动的产品框架，目前对产品设计使用范围最广最适合的是Axure软件它不仅功能强大还容易于操作，往往是首选之一。接下来我为大家介绍一下axure原型设计的技巧方法， 依我个人而言,目前使用频率次数最多,效果最高,交互效果最好的原型工具是axure软件。今天给大家介绍一些我在工作中使用axure的经验。主要从交互设计中涉及的三个主要步骤进行说明。

　　一、页面原型设计交互设计师需要注意:

　　1、产品经理提供一份主要的任务流程图。

　　2、产品经理提供一份主要功能列表。

　　3、交互设计师来完成的网站信息架构。

　　4、对于前期调研结果的理解。

　　5、如何做“主要页面原型”。

　　1.在建立项目的初期就开始定义大师，项目一但启动,如果可以稍微掌握哪些区块未来块将是共享区块,那么就开始建立Master,例如网站的Header/Footer/导览选单(Navigation),或者广告版位等等。越早使用,越可以节省其它页面设计的重复步骤。

      2. Master的定义

　   关于AxureRPlibrary（AxureRP图书馆）网上有很多关于AxureRPlibrary资源，在这里就不一一说明了。也可以自己动手制作适合产品的library，或者模仿网上library图库、文库等等。

　　3.根据“任务流程图”,“功能列表”将主要的页面原型制作出来。包括一些必要的交互动作。详细的,出错提示等交互软件可以不用考虑。

　　用途:主要的页面原型可以用于产品初期的讨论会、测试以及产品介绍会。

　　1.不要加入太多视觉设计的元素。着眼于大局,不要纠结细枝末节找重点。制作原型的初期请把所有精力都放在优化流程和布局设计上面,不要把时间浪费在视觉设计上,那样绝对是得不偿失的结果。因为我们的原型方案还没有最终通过决定,肯定要通过多次优胜劣汰才能确定方案,太多的视觉设计就是浪费时间。如果原型做的过于逼真,在产品讨论会上视觉的元素会很快吸引大众的眼球,到时领导就会来质疑你的界面是不是该换颜色,按钮是不是更精致一些视觉上设计的问题。没有人会在意你的交互设计了。

　　2.在使用axure工具之前用纸和笔画一些纸面大概的原型图,整理一下设计思路。

　　二、页面流程图

　　确定了主要页面之后我们可以开始细化页面流程，页面流程图有利于向大家展示自己的设计想法,也有利于思路的清晰整理。毕竟axure交互点是零散的页面流程图,可以帮我们整理所有的页面上的交互行为,避免遗漏;在向他人展示的时候,也可以一目了然的看出需要的操作步骤，倾向于将主要任务列表出来,然后画出所有任务的页面流程图。

　　如果项目时间有限,页面流程最好可以画在图纸上。但建议在交互设计保留这一步。为了减少沟通成本,在绘制页面流程图时,最好有一定的规范和标准来操作。

　　三、完善原型

　　页面的主要页面和页面流程确定之后,就可以完善原型了。这时可以完成原型的细节工作。如何完善原型？

　　1.按照页面流程中所考虑的交互过程,体现在原型上面出错提示,交互细节体现。这时你可能会用到变量、层等高级axure技巧。点击定时操作弹出层的操。

　　2.增加说明选中某个控件,在右边区域可以为此控件增加说明，增加描述后的前台页面,点击黄色图标显示说明提示层如果对于说明区域的属性不满意,可以修改属性。

　　增加描述的方式可能会干扰整个页面,很容易让浏览者以为是一个页面元素。也可以采取一种原始的方法为控件增加说明文字。

　　3.当原型不再需要修改页面编号时,我们需要为原型页面编号,这样有利于与视觉设计师、前端沟通。测试、产品需求文档编写参考、视觉设计参考、前端设计参考等。

　　应注意的两点:

 　  1.不要过于追求技术体现

　　2.为了减少沟通成本,在完善原型时,最好有一定的规范和标准。

　　总结：Axure其实只是一种交互产品原型设计的工具而已,交互设计最重要的还是表达方法和设计思路清晰，对于原型设计的构造具备一定的思考，过于沉迷于设计的视觉会使你偏离最初的想法，主要是对流程的交流，优化升级产品，多参考别人优秀的产品。专注于产品的结构布局和页面的创新优化，这样一个产品才能走得更远，更多的交互设计知识尽在课课家在线教育。