1.2 原型设计工具一览

产品原型设计工具林林总总有数十种之多,比较知名的如 Axure RP、墨刀、Mockplus、Justinmind和Balsamiq Mockups等,它们各有千秋。其中,Axure RP针对大中型团队建设项目的产品原型设计特别方便,墨刀支持在线原型设计,Justinmind 专为移动应用而生,具有很多方便移动应用设计的功能。“工欲善其事,必先利其器”,大家可以选择使用一种或两种原型设计工具,而Axure RP作为原型设计工具中功能最强大的一款,应当必须掌握。

1.2.1 Axure RP

Axure RP是美国Axure Software Solution公司旗舰产品,是一款专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的产品设计人员能够快速地创建应用软件或Web 网站的线框图、流程图、原型和需求规格说明文档。作为专业的原型设计工具,它能快速、高效地创建原型,同时支持多人协作设计和版本控制管理。

Axure RP是一款专业快速原型设计工具。Axure(发音:Ack-sure),代表美国Axure公司,RP则是Rapid Prototyping(快速原型)的缩写。

Axure RP的使用者主要包括商业分析师、信息架构师、产品经理、IT咨询师、用户体验设计师、交互设计师和UI 设计师等。另外,架构师和开发工程师也可以使用 Axure RP。Axure RP 是一款付费软件,提供试用版,其官方网站为:https://www.axure.com/,如图1-3所示。

图1-3 Axure RP官方网站

Axure RP 8的设计界面如图1-4所示。

图1-4 Axure RP 8设计界面

1.2.2 墨刀

墨刀是一款在线原型设计工具。借助于墨刀,创业者、产品经理及 UI/UX设计师能够快速构建移动应用产品原型,并向他人演示。

作为一款专注移动应用的原型工具,墨刀把全部功能都进行了模块化,用户也能选择页面切换特效及主题,操作方式也相对简便,大部分操作都可通过鼠标拖动来完成。现在,墨刀已实现了云端保存、手机实时预览和在线评论等功能。

墨刀的官方网站为:https://modao.cc,如图1-5所示。

图1-5 墨刀官方网站

墨刀提供免费版、个人版、协同版、团队版和企业版几个软件版本,其年费如图 1-6所示。

图1-6 墨刀年费

墨刀的在线编辑设计页面如图1-7所示。

图1-7 墨刀设计界面

1.2.3 Mockplus

Mockplus(摩客)是一款简洁快速的原型设计工具。适合软件团队、个人在软件开发的设计阶段使用。Mockplus低保真、无须学习、快速上手、功能够用,并能够很好地表达自己的设计。“关注设计,而非工具”是它的设计理念,拿来就上手,上手就设计,设计就可以表达创意。

从设计上,Mockplus 采取了隐藏、堆叠、组合等方式,把原本复杂的功能,经过了精心安排。上手很容易,但随着使用,功能层层递进,会发现更多适合自己的、有用的功能。新手不会迷惑,熟手可以够用,达芬奇说,“至简即至繁”,这一原则易说难做,Mockplus始终贯彻这一理念。

Mockplus的官方网站地址为:https://www.mockplus.cn/,首页如图1-8所示。

Mockplus 3.3版本的设计界面如图1-9所示。

1.2.4 Justinmind

Justinmind是由西班牙Justinmind公司出品的原型制作工具,可以输出HTML页面。与目前主流的交互设计工具 Axure、Balsamiq Mockups 等相比,Justinmind 更为专注于设计移动终端上的App应用。

Justinmind 的可视化工作环境可以让使用者轻松快捷地创建带有注释的高保真原型。不用进行编程,就可以在原型上定义简单连接和高级交互。

图1-8 Mockplus官方网站

图1-9 Mockplus 3.3设计界面

Justinmind的口号是“为移动设计而生”,官方网站地址为:https://www.justinmind.com/,如图1-10所示。

图1-10 Justinmind官方网站

Justinmind设计界面如图1-11所示。

图1-11 Justinmind设计界面

1.2.5 Balsamiq Mockups

Balsamiq Mockups是一种软件工程中快速原型设计软件,可以作为与用户交互的一个界面草图,一旦客户认可,可以作为美工开发HTML的原型使用。

Balsamiq Mockups由美国加利福利亚的Balsamiq工作室(2008年3月创建)推出,于2008年6月发行了第一个版本,它的使命是帮助人们更好、更容易地设计软件产品。

Balsamiq Mockups官方网站地址:https://balsamiq.com/,首页如图1-12所示。

Balsamiq Mockups的设计界面如图1-13所示。

图1-12 Balsamiq Mockups官方网站

图1-13 Balsamiq Mockups设计界面