课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
任何程序员或者说设计师在制作原型设计的时候,都不会是纯敲代码做出的成绩,或多或少都是有一些便利工具在使用的,这也是为了提高工作效率,今天太原IT培训就给大家介绍下在做原型设计中常用的几种设计辅助工具。
做原型设计,首先,当然是要讲讲工具。做原型设计的工具有很多,功能最强大的应该就属 Axure PR 了,不过上手不容易啊。对于想快速开发一个原型但又没那么多时间去学习设计工具的我来说,只能说,Axure不适合我。好在,上手容易的设计工具还是有的。
POP - Prototyping on Paper
POP 是一款App,操作非常简单,先用手机拍下草图原型,然后开始编辑原型里的哪个区域(比如按钮)链接到哪个页面,添加跳转链接,之后就变成可演示的交互原型了。
POP 并不提供设计原型的任何UI组件,只提供了能在图片上设置任意点击区域并添加链接到其他页面(其实就是另一张图片)。对于从草图开始设计原型的人来说,这款App真是再适合不过了。
当然,局限性也很明显。首先,原型图只能通过其他方式完成。其次,交互非常有限,只能实现页面间的跳转,其他交互比如同一页面内的交互就别想了。最后,它只适用于App原型。
墨刀
墨刀是一款在线的原型设计工具,上手也很简单,网站也提供了新手教程。墨刀的功能比 POP 就强大多了,除了支持手机App原型设计,也支持平板和网页。本项目的原型就是用墨刀设计的。
墨刀吸引我的第一个优点就是提供了很多方便的组件库。有一些单独的组件如文字、按钮、图片、图标、输入框、单选框、多选框、开关、标题栏、搜索栏、标签等等,一拖即用,很方便。尤其是图标,墨刀提供了很多常用的图标,非常方便。除了单独的组件,墨刀还提供了母版和组合。默认母版有轮播图和下拉菜单,默认组合有弹出框、列表项、Action Sheet、日历等,都是一拖即用的。不够用的话还可以自定义新的母版和组合。
墨刀吸引我的第二个优点就是对组件的属性设置也比较全。就拿按钮来说吧,可以设置背景色、前景色、边框、阴影、透明度、位置、宽高、旋转角度、圆角半径、圆形或正方形,还可以设置按钮的文字属性,包括文字的背景色、文本颜色、字体大小、字体样式、阴影、对齐方式,最后,也可以设置按钮的图标,不过图标只能保持在文字左边,无法调整位置。有了这些属性,就可以很方便地将组件设计为自己满意的样子了,组件也可以做得差不多接近最终的UI了,即是说可以做到高保真原型。
不过,这里要提一下,我并不建议产品经理们做原型时做到高保真。除了个别情况,比如需要给高层管理或客户演示用的原型;又或者是创业团队里缺乏有经验的UI设计师,甚至还没有UI设计师;又或者是像我一样的个人开发者,什么都要自己来的。一般情况下,只要完成低保真或中保真原型即可。
墨刀吸引我的第三个优点就是对交互的支持非常好。墨刀除了支持页面间的交互,还支持页面内的交互。而且,页面内的交互不是通过复制页面来实现,而是通过为同个页面添加多个不同状态,实现状态的切换。例如,点击主页右下角的加号按钮,会在加号按钮上方滑动出两个子按钮,并且加号按钮自己会旋转变成关闭的叉号;再点击,两个子按钮会滑动收回下方,叉号再旋转变回加号。
不过,墨刀的免费版不支持导出和多人协作,图片储存不能超过100M。不过好在支持分享。其他人根据分享的二维码或分享链接就可以查看到可运行的原型了。
Mockplus
Mockplus 也是一款不错的快速原型设计工具,和墨刀一样,也提供了很多组件库和图标库,甚至比墨刀还多。上手也同样简单,也是一拖即用。
不过,Mockplus 对于一些常用的组件的封装程度却不如墨刀,例如标题栏不能直接设置标题、标签栏不能直接设置图片、也找不到设置圆形图片的方法、文字按钮也不能支持添加图标等。
Mockplus 在交互方面也是不足,页面内的交互设计只能复制页面,没墨刀方便。其实,Mockplus 也有状态的概念,不过不是页面状态,而是组件状态,但目前我只在按钮组件有看到状态的设置属性,可以设置正常、选中、焦点三种状态。
其他工具
除了 Axure PR 和上面介绍的三款,还有很多其他的设计工具,比如 Balsamiq Mockups ,以前的同事用过,我很喜欢它的手绘风格。不过,Mockups就不是免费的了,但可以试用。当然,网上也有破解版。
也有人提出使用 Sketch 做原型设计。无可否认,Sketch 也是可以设计原型的,PS、AI 等工具也同样可以。至于交互,用标注的方式就好了。但这些工具,确切地说,更适合用来做 UI 设计,而不是原型设计。做原型设计,要求的就是能够快速看到效果,不只是界面效果,还有交互效果。用UI设计工具来做,一是很难达到快速的要求,二是交互效果等于没有。
达内时代科技集团致力于培养面向电信和金融领域Java、C++、C#/.Net、3G/Android、3G/IOS、PHP、嵌入式、软件测试、UID、网络营销、网络工程、会计、UED、web、Unity3D、大数据、童程童美等17大方向中高端软件人才课程与少儿教育课程。选择太原达内培训,不再孤军奋战,轻轻松松做IT高薪白领。太原达内培训带领有明确目标的学子迈向成功之路!想找工作的求职者可以加QQ:3373924515(太原达内就业服务部)咨询了解。