产品经理绘制工具

交互设计师的一项重要工做就是进行产品原型设计(Prototype Design)。而产品原型设计最基础的工做,就是画出站点的大致wireframe(框架图)并结合批注、大量的说明以及流程图等,将本身的产品原型完整而准确的表述给产品、UI、重构/开发工程师等等,并经过沟通反复修改prototype 直至最终确认,而后进入后续的设计开发流程。浏览器

要完成以上复杂的设计和沟通工做,须要一个好的原型设计工具。这里就目前经常使用的和比较热门的工具来分享一下:
Word(产品经理比较经常使用)
Fireworks(交互组内推广的)
Balsamiq Mockups(近期曝光率比较高)
Auxre RP(业界圈子内广为流传)服务器

1、优点劣势对比
架构

2、操做界面对比
Word:基本是经过绘图工具栏的各类线框来画wireframe。
框架

Fireworks:经过公共库的WEB原型组件库画wireframe。
工具

Balsamiq Mockups:操做相似FW,经过顶部的控件库拉取到工做区域画wireframe。
测试

Auxre RP:基本操做也和FW,Mockups相似,3是工做区域,从5控件库里拉取到工做区域画wireframe。
网站

控件库内含了许多会常常使用到的widget物件,例如:按钮(Button)、图片(Image)、文字面板(Text Panel)、单选按钮(Radio Button)、复选框(Checkbox)、下拉式选单(Droplist)。甚至能够藉由Dynamic Panel的功能,来设计动态介面,例如:下拉式选单、页签,甚至是更进阶的AJAX或RIA的功能。spa

Axure RP相对于其余原型工具,比较有特点的有如下几个方面:prototype

·区域4站点地图(页面列表)
能够自动根据页面列表,快速绘制树状的网站架构图,并且可让架构图中的每个页面节点,直接连结到对应网页。
设计

·区域6 Masters共用模板功能。
在设计Wireframe时,若是能善用Masters共用模板功能,您能够节省下很多重复修改的时间,Master能够是常常被使用到的widget集合,例如:页首、页尾、或是一个登入的画面。

·区域8为高级交互操做区域
Wireframe里的大多数的widget能够对一个或多个事件产生动做,包括 OnClick、OnMouseOver和OnMouseLeave诸如此类。模拟出逼真的交互工做,十分方面的进行演示和讲解。

·自动输出网站原型 (HTML Prototype)
Axure RP能够将您设计的wireframe,输出成符合Internet Explorer或Firefox等不一样浏览器的HTML prototype。

也就是说,您不须要安装Axure RP或任何其它软件,就可直接将产生的Prototype档案email给客户,或是发布到网页服务器让客户或使用者检视和操做,Prototype包括 Sitemap、Page Notes、Annotations和功能性的交互效果,是一个能有效测试所提议的功能和清楚沟通设计的工具。

·自动输出Word格式规格文件(Functional Specification)

Axure RP能够输出Microsoft Word的格式的文件,不仅容易阅读,更能够展示规格文件的专业,能有效的记录、沟通和取得设计的最后确认。

规格文件包含了目录、网页清单、网页和附有批注的Master、撷取的画面、Annotation、Interaction和Widget特定的信息,以及结尾文件(例如:附录),规格的内容与格式也能够依据不一样的阅读物件来变动。

3、实例操做对比

这里,咱们利用以上各工具,实际操做一次,制做一个简单的原型设计实例,看看各个工具的表现。
咱们将实际制做一个Tab View的例子。

Word:

不足:对交互表达很差,也不利于演示。(一个基本的页面要分3页,且一页一页看才能表达交互效果);没有标准样式,各类线框画的很随意。

FW:页面效果同Word。

不足:对交互表达很差,也不利于演示。(一个基本的页面要分3页,且一页一页看才能表达交互效果);控件的扩展和修改不便利。

Balsamiq Mockups:

不足:对交互表达很差,也不利于演示。(一个基本的页面要分3页,且一页一页看才能表达交互效果);输出界面手绘风格,随意性较大。

Axure RP:基本的外观和Word、FW相差不大。

但最奇妙的是他能生成一个真实的页面,能够演示Tab切换的效果,同时生成一份word格式的交互说明文档(实例暂不提供下载)。

4、总结经过以上几个方面的比较,4个原型工具在绘制wireframe的基本操做上不相上下,各具特点。但Axure RP快捷而简便的建立基于目录组织的原型文档、功能说明、交互界面以及带注释的wireframe网页,并可自动生成用于演示的网页文件和word文档,以提供演示与开发等方面完胜,咱们给于其★★★★★评价,不愧为产品经理基本基本原型设计和交互设计师作快速高保真原型的一把利器。

相关文章
相关标签/搜索