原型设计工具 Balsamiq Mockups

Posted on Feb 28, 2011

Mockups is bitchin’. Pure and simple. It’s rare to find a tool that both devs and non-devs enjoy using, and use productively together. Huge fan!”

Jay Simons, VP of Marketing,Atlassian

这是一位 Balsamiq 的客户对 Balsamiq Mockups 的评价，像这样的褒奖还有很多。这款让 Balsamiq Studio 3周内实现盈利，5个月入账10万美元的软件，用销量进一步证明了用户的赞誉。的确，Balsamiq Mockups is “So freaking good”。

简介

Balsamiq Mockups ，顾名思义，就是用于绘制 mockup 的工具。在早期的产品设计的需求阶段，人们习惯用笔和白板/纸来画草图，但是这样的草图一般只是为了沟通时便于表达和理解，很难将有价值的原型保存下来。Mockups 解决了这些问题。无论是绘制草图还是会议讨论，都可以使用Mockups来设计或者展示原型图。

特点

简单易用：几乎不用学习怎么使用，很容易上手，而且支持中文，只需勾选“Use System Fonts”即可。低保真图：简单明了的线框图设计，让设计师专注于功能，而非界面的样式，颜色等细节。控件丰富：内置75种控件和187个图标，还可以从Balsamiq社区下载网友制作的控件。此外还有个比较好用的功能，就是的“重用组件库”，用户可以将自己制作的组件放入控件库中，便于在其它地方使用。多种格式：采用 XML 格式保存原型图，也可以导出为多种格式，包括 PNG，XML，PDF等，XML 最有用，可以导入到其它的设计工具中生成相应的文件，如actionscript，MXML，MAML，HTML等等。平台广泛：Mockups 起初是作为 Confluence 的插件开发出来的，而随后又诞生了 Mockups for Desktop，Mockups for JIRA 4.x，Mockups for FogBugz，Mockups for XWiki ……全部是跨浏览器跨操作系统产品。

使用体会

目前已经使用 Mockups 完成了主界面和日志界面的设计。

效果如下图所示。

优点上面已经总结过了，都是我自己的切身体会。Balsamiq Studio 更新非常快，我明显感觉到，现在的这个版本比第一次用的时候(去年…)改进了很多,印象比较深刻的是Group 功能，以前多个控件组成一个Group之后，要想修改，必须取消Group然后修改，非常繁琐。现在只需要单击这个 Group，就会进入到 Group 内部，面板上也会有相应的面包屑，指示当前进入的 Group 层次。太贴心了，顿时对其好感度大大上升 : ) 。

另外，一个新功能 —— Reusable Symbol Library，也很不错，在做多个界面时，难免会重复用到一些组件。这时，可以将这个组件“Convert To Symbol”，放到库里面，便于再次使用。Control + MouseWheel UP/DOWN 缩放视图也很好用，Contro + F 全屏演示模式就更有用了，开会讨论的时候，演示效果很不错。改进的地方太多了，这些只是其中一两点。

当然，人无完人，再优秀的软件也有bug，说说几个不足之处：

复杂组件的自定义功能不是很灵活，比方说，一个 RadioButtonGroup 或者 ComboBoxGroup，只能采用竖排布局，没有其它的选项；ButtonBar 不能放图标，只能显示文字。不过好在有“Reusable Symbol”，自己做一个导入也可以达到目的。 Group 问题：调整了 Group 大小之后，里面的控件布局会出现问题，这个比较讨厌，暂时没找到解决办法。交互问题：虽然提供了链接功能，但是交互体验不是很好，对于TabsBar这样的标签导航器，每个标签页都要链接到一个单独的文件中才能显示，比较繁琐。层次问题：例如，一个组件嵌入在另外一个窗体内，但是窗体比较小，只能显示其中一部分内容，这时虽然可以窗体边添加滚动条，但是怎么把这个大的页面放进小的窗体里显示呢？怎么实现组件的部分显示，这是个问题。个人使用体验就是这样。

总之，使用简单方便是 Balsamiq Mockups 最大的优点，和人沟通时其手绘风格也很讨人喜欢，这是一款让人印象深刻的原型设计工具。