主流原型设计工具

首先,一款优秀的移动APP界面原型设计工具应该具备:

  ①.支持移动端演示(随时随地演示给BOSS,厕所&食堂&电梯…以体现我是那么的敬业)

  ②.组件库(高效复用,谁用谁知道)

  ③.可以快速生成全局流程(程序猿看不懂拆解的,给TA看这个)

  ④.在线协作(多个PM狗一起用)

  ⑤.手势操作、转场动画、交互特效…(这些都不需要,留给专业的交互、视觉,搞那么虚的不如多想想产品流程逻辑做做减法、写写xxRD啥的)

这些年,产品狗们折腾过的原型工具:

1.轻巧型
低保真;无控件;iOS;少交互;免费。

POP(Prototyping on Paper)

 

算是移动App原型设计神器 ,很多公司在用:quora、sina、豆瓣、36氪、ifanr…

操作轻巧简单:先用手机拍下草图原型(存到POP app内);然后开始编辑图片的哪个区域(按钮)链接到什么页面,添加跳转链接热区,就可以在iPhone上给小伙伴们演示了,并且POP内嵌的交互动作 如侧滑、展开、消失等,即可满足一般的动态演示需要。

方法:拍照--添加触控区--转场方式--选择图片

平台:全手机操作

缺点:分享不便。动画有如侧滑、展开、消失,快现的摇一摇。操作只可以单击。没有控件,所有东西都靠你的照片。

Pencil Project

 

Pencil是一款开源的可以用来制作图表和GUI原型的工具,可以作为一个独立的app,也可以作为Firefox插件。内置模版可以帮你绘制桌面和移动界面中用到的各种各样的用户界面,包括流程图、UI和一般的通用图形。

通过它内置的模板,你可以创建可链接的文档,并输出成为HTML文件、PNG、OpenOffice文档、Word文档、PDF。Pencil Project还包含大量移动app模版。

2.专业型
高保真度;自带控件;Mac+iOS;全交互;收费+免费

UIDesigner + UIDPlayer

腾讯出品的原型软件,中文,操作简单,符合国人习惯,容易上手。方便分享。
方法:windows电脑安装UIDesigner,使用现成控件进行可视化搭建,调试后通过网盘等方式发到iOS设备,用UIDPlayer打开即可。
平台:只支持Win+ iOS。可能也是优点,仅有的专门支持Win平台的原型软件。

Blueprint + viewer

方法:基本都一样,就是在iPad上操作。触控不那么精确,但是操作体验很好,完整版的自定义库按钮很多很丰富。
平台:iPad + iOS
缺点:最重要的就是只能在iPad上编辑,我做了个大型的项目,打开还是稍慢点,但是稳定,操作多了有点累。分享需要对方装软件,而且生成的项目文件会很大。

3.超大型
高保真度;可拓展控件;自定义库;适配;少交互;收费。

Axure

老牌原型设计工具,交互制作功能强大,当然同时也带来了较高的学习成本。设计区域是无限画布,方便给设计稿添加文字注解。在交互效果层面,可以实现非常多条件判断、巧妙运用可以实现更复杂的交互。不过同时也会带来“效率不高”的问题,因为细节过于繁琐,所以会加重产品经理或交互设计师在画原型时的负担。

此外,作为一款离线工具,Axure的原型预览和分享方式并不十分友好。浏览器预览本地文件需要安装插件;支持上传到Axshare分享,但在国内的速度也较慢。因为离线,Axure 文档存档会比较安心,不过如果涉及到多人协作,也会有“信息更新不及时”的问题。

软件官网: http://www.axure.com/default.aspx

新版特征
1. 优化了界面和操作,明显提高绘制效率,可直接在控件上改变形状,同时加入了几个常用形状;
2. 支持了投影和内阴影,可以用来画简单的组件;
3. 支持更多的触发事件;
4. 普通形状也能增加事件效果,例如要移动一个形状,不需要转化成动态面板;
5. 事件用例感觉也有所变化,增加了一些参数,例如切换动态面板状态时有更多的参数可以选择;
6. 增加了和Justinmind一样的实时预览功能,再也不用一遍又一遍地生成页面了;
7. 内容自适应,例如动态面板或文字块能根据内容自动适应到合适大小;
8. 强化的表格功能Repeater,可以自动填充数据,对数据进行排序,过滤等操作;
9. 页面级的参数Onreszie,这样在手机测试时可以作为横竖屏判断;
10. 响应式布局,可以定义不同窗口大小下的布局结构。

Axure RP的用户群体非常宽泛,包括商业分析师、信息架构师、可用性专家、产品经理、IT咨询师、用户体验设计师、交互设计师、界面设计师、架构师、程序开发工程师等相关从业者。

Omnigraffle

OmniGraffle是由The Omni Group制作的一款带有大量模版可以用来快速绘制线框图、图表、流程图、组织结构图以及插图等类型图的app,也可以用来组织头脑中思考的信息,曾获得2002年的苹果设计奖。
它采用拖放的所见即所得界面,你可以用钢笔工具绘制自定义的模版或者图形,此外还自带Graffletopia提供的多个iPhone、iPad以及Android模版。
平台:iPad + Mac OS X

JustinMind

JustinMind是由西班牙JustinMind公司出品的原型制作工具,可以输出Html页面。与目前主流的交互设计工具axure,Balsamiq Mockups等相比,Justinmind Prototyper更为专属于设计移动终端上app应用。
JustinMind 可以帮助开发者设计更丰富、更具交互新的移动产品线框图,包含了iPhone、Android 以及iPad常用手势,滑动、缩放、旋转,甚至捕捉设备方向等,从而创造出更具交互性的原型。另外,它可以导出原型信息到Microsoft Word,生成规范的文档。
此外,你还可以自定义小组件,创建自定义组件库,并进行分类,不管对象是iPhone、iPad、黑莓、Android还是其他。

软件官网:https://modao.cc

1、JustinMind的可视化工作环境支持以鼠标的方式创建带有注释的高保真原型;
2、提供多种触屏的交互效果,例如滑动、缩放、旋转,甚至捕捉设备方向等,在需要产生效果的部件中选择对应的手势即可;
3、JustinMind为iPhone、iPad、黑莓、Android提供了多样的组件,可以创建自定义组件库;
4、比Axure,JustinMind更好的提供了属性窗口,并且更好的支持捕获PS等软件的图像属性;
5、可以通过拖拽等方式来实现跳转、定向等交互效果,无需像Axure一样每一步都只能通过点击来完成。

4.HTML
中保真度;自带控件;全平台;需联网;少交互;收费+免费

Moqups

是一个非常好的、免费的HTML5应用,通过它可以创建可爱朴素的线框图、实体模型和UI概念。该程序使用起来非常简单,并且有内置的模板可以直接使用(模板包括单选按钮、链接、图像占位符、文本框以及滑块等)。

它还提供了iPhone和iPad模板,以及iOS相关的按钮、提示框、picker、菜单、开关以及键盘等。你可以设置网格的尺寸,并预览和分享你的线框图。Moqups提供了一个很有用的功能就是对齐网格,可以使对象精准对齐。

UXPin

UXPin是DeSmart团队开发的一个简易快速的实体模型和在线可点击原型创作工具。它基于优秀的用户体验设计原则,在构建原型中,它提供了一个完整的工具包(该工具包具有良好的用户设计模式和元素)来从头构建一个出色的原型。

UXPin 具有响应式的断点功能,创建的响应式原型和线框图可以运行在不同的设备和分辨率上。另外该软件还提供了版本控制和迭代功能,可以轻松的共享预览,直观的注 解和实时的协同编辑和聊天。该软件拥有大量具有吸引力的用户界面元素风格(包括web,iOS,Android等),并且具有快速、灵敏的响应拖放接口。

Proto .io

Proto .io是国外一款轻便好用的在线原型设计工具,在大多数浏览器中都能使用,支持导入Sketch和PS设计稿做交互。界面清爽,拥有较为丰富的UI组件。可以直接用链接分享原型,而且因为集成了移动录屏工具lookback,适用于用户测试场景:可以记录用户点击、滑动、点击区域;也可以记录用户的声音和facecam视频评论。

目前Proto .io 有协作功能,只是比较受限;此外,交互设计较为复杂,细节效果只能通过容器实现,上手成本较高。价格相对Invision较便宜,但相对国内产品来说仍然较高。  

墨刀

作为国内目前广受认可的一款在线原型设计和协同工具,墨刀有内置丰富的UI素材和模板,清爽的界面,让设计原型的过程顺畅高效。墨刀同样支持Sketch设计稿的导入,拖拽式创建交互链接,可以通过链接或者二维码在电脑端或者移动端快捷预览原型。此外,设计师也可以通过墨刀进行自动标注,开发者也可以用墨刀进行切图。

而墨刀新出的版本更加强化了协同管理功能,满足了更大规模团队的需求。不仅多人团队可以在墨刀协同编辑/实时讨论,共同管理素材库,对于人员权限的管理也更加清晰分明。目前很多雇主在招聘产品经理时,已经会将墨刀列为和Axure并列的必备技能之一。

软件官网:https://modao.cc

另外墨刀的APP原型可以支持下载在手机里,当然是单机版,但是你可以完全通过手机来打开你的原型,相应的Axure这一点就做的很不好,虽然有插件支持手机预览,但是非常卡顿。中文版教程对很多人来说很 NICE。

Protoshare

ProtoShare:在线网站开发协同制作工具是一个十分便捷的在线原型制作工具,侧重于团队协作。团队成员可以通过这个工具对工作进行审查,并及时提供反馈,对线框图或内容进行建议。

作为一个强大的线框图和原型平台,Protoshare提供了大量移动工具集(有来自中心资源库的大量移动模版和大量2D、3D动画过渡)。通过“拖放”界 面,你可以快速创建交互式的线框图和移动原型,然后发送至iPhone、iPad或者Android设备进行测试,体验app的功能实现情况。

另外,Protoshare还支持分享和反馈功能,项目成员可以标记和跟踪的反馈信息来做出决定。而大量的资源库意味着你可以使用模版和获得的反馈创建移动产品线框图,进而演变为高保真的原型。

以上给大家总结了 产品经理常用的原型协作工具,我个人用的比较多的是Axure、墨刀,了解这些工具,可以让开发人员更好的与产品沟通,由其是在做外包项目的公司,这点很重要。

选择适合自己的原型工具开始你的原型设计之路吧!

猜你喜欢

转载自www.cnblogs.com/starlipure/p/12914047.html