产品原型设计软件Balsamiq Mockups

Haijun - 2009/10/16

那些精致到让人爱不释手的原型图,总是对我有莫大的吸引力。但迄今为止我却没有画出过一张像样的原型,试用过 Visio、Axure 后感觉在易用性方面都不太满意。原型设计图作为产品团队相关成员沟通的基础,应当能够清晰表达设计师的意图。基于这个目的,一杆笔 + 一张纸产生的原型图显得更原汁原味。但由于不方便留存、共享,一些产品人员仍然会选择软件。

但通过目前这些软件绘制原型图的一个缺陷就是不够写意,显得呆板。尤其是对于我这种新手而言,使用这些软件时都显得自己很笨。学习成本很高,基于 Axure 的培训班也是收费不菲。最近从一些 Blog 了解到一款由 Balsamiq Studios 开发的叫做 Balsamiq Mockups 的原型设计软件,试用一下就知道有多赞:

  • 易操作:从 Balsamiq Mockups 自带的元素里可以很方便地拖拽,效果图轻易形成;元素对齐很贴心;
  • 可偷懒:根据 Balsamiq Mockups 提供的 Wiki 风格的代码规则,画图时可以「偷懒」,输入文本符号则能生成图标。因此相比其它繁琐的软件操作,Balsamiq Mockups 也能更快地完成画图任务。
  • 控件足:Balsamiq Mockups 软件包括 50 多个控件, 70 多个图标。基本自带了所有常用的小控件,并在导航处进行分类;图标设计赏心悦目。要是 Balsamiq Mockups 允许用户导入自定义的控件就更好了,当然现有的也足够了 -:)
  • 新风格:让人眼前一亮的涂鸦风格,很能还原手绘效果;
  • 可中文:在菜单栏 View 里将 Use System Fonts 勾上,就能完美支持中文输入(注:非 Balsamiq Mockups 中文版);
  • 其它点:Balsamiq Mockups 使用 xml 记录,方便移植、二次利用;可导出为 png 格式图片。

另外还有跨平台与多版本两个优点:

  • 跨平台:Balsamiq Mockups 基于 Air ,因此能同时在 Windows、Mac OS 及 Linux 下使用;
  • 多版本:包括桌面版本,以及集成于 Confluence、JIRA、XWiki、FogBugz 中的版本;

Balsamiq Mockups 可由 Wiki 风格代码控制菜单、树型导航等其它相似控件:

Balsamiq Mockups 的 Wiki 式代码

为了保证原型风格的一致性,Balsamiq Mockups 还能够将图片转换为手绘风格,比如 Twitter 首页如图:

Balsamiq Mockups 原型图

不过让国内用户不习惯的是,这款软件定价为 $79 ,偏高。当然 Balsamiq Studios 也为用户提供了 5 种免费获得 license key 的机会,其中之一就是针对科技/软件 Blogger 或媒体从业者,鼓励这类用户通过写 Blog 口碑传播的方式帮助 Balsamiq Mockups 营销。写完本文,我也会尝试向作者申请一个 license key。

UpDate:在给 Balsamiq 发邮件的两个小时后,我就收到了 Balsamiq 发来的 Mockups 注册码,很厚道。对此软件感兴趣的朋友,也都可以写篇 Blog 然后发 Email 索取 Key。之前有一些网友公布的 Key 已经失效,而且出对于软件开发者的尊重,我不会公布我的注册码。

25 条评论

成功后告诉我 我也写一篇试试

by Eary on 2009/10/16 at 01:00. 回复 #

哈~看到师兄更新了。

by shazeer on 2009/10/16 at 01:07. 回复 #

@Eary: 有进展通知你,也会在 Blog Update 一下。
@shazeer: 47 天后再写日志,要不是这个 license key 的激励,不知道还要懒到什么时候。。

by oxygen on 2009/10/16 at 08:57. 回复 #

终于看到更新了,不过发现大多都看不懂~原来产品设计这么复杂啊~

by vancho on 2009/10/16 at 09:50. 回复 #

话说我用axure时,最恶心的就是…中文输入了.

另外这个软件在制作规模较大原型时,会不会生成的东西加载很慢啊-.-

by yacca on 2009/10/16 at 10:46. 回复 #

@yacca: 这个软件比较小巧哦,没有像用 Visio 时那么笨重的感觉。应该不会很慢 :)

by oxygen on 2009/10/16 at 11:35. 回复 #

@vancho:只是工具而已。但工具的选择是基于经验的。

by oxygen on 2009/10/16 at 11:36. 回复 #

@Eary: @oxygen: 作者给我发了个 Key,请看文章的 Update

by oxygen on 2009/10/16 at 14:06. 回复 #

mockups的优点就是简洁和手绘效果,其他的还差很多。我也写了博。

by sunny on 2009/10/16 at 14:19. 回复 #

mockups更加不支持中文,我也写了博。blog.sina.com.cn/happywenzi

by sunny on 2009/10/16 at 14:21. 回复 #

@sunny: 在菜单栏 View 里将 Use System Fonts 勾上,就能完美支持中文输入。

by oxygen on 2009/10/16 at 14:36. 回复 #

都是英文的,看上去有点困难。

by 大树叔叔 on 2009/10/16 at 17:21. 回复 #

@shazeer 同感啊!

by 萧遥 on 2009/10/19 at 14:28. 回复 #

通过提供的试用链接。感觉这个软件易用性方面确实不错。手绘风格也能让人使用的愉悦,但是通过软件功能判断,貌似无法实现高保真模型,果然是非常“彻底”的原型软件。

by jackly on 2009/10/21 at 22:08. 回复 #

很不错的博客,交换下友情链接不?

by 软件开发 on 2009/10/31 at 08:30. 回复 #

博主的文采不错,大家有空多交流!

by 笨猫 on 2009/11/02 at 22:59. 回复 #

这软件看起来不错

by William Hua on 2009/11/04 at 13:35. 回复 #

@oxygen:用我以前写过的一篇文章提交过去,也很厚道的给了我key,呵呵 。

by eary on 2009/11/12 at 09:36. 回复 #

博主你好,可否共享下你的Key给我?

我很喜欢这个软件,写了文章发给了官方,但是那边一直不给我回信…

先行谢过

by 木鱼猫 on 2009/11/16 at 18:09. 回复 #

不错的…开始使用它是设计一款手机应用软件…

by tualatin on 2009/11/20 at 17:19. 回复 #

博主要当产品经理了?这么快?牛
火狐好像有个产品设计的插件pencil

by CT on 2009/11/25 at 21:36. 回复 #

@CT:不只是产品经理才需要画原型图。原型图的目的是方便产品干系人了解产品设计的目的和思想,因此设计师、需求方都可能会画原型图。

by oxygen on 2009/11/29 at 19:43. 回复 #

If you are willing to demo Mockups to an audience of at least 15 professionals (at a team meeting, user group, a conference, a BarCamp), email us your info and we’ll give you two licenses, one for you to keep and one to give away at the event, FREE of charge.

If you teach a high-school class, email us the name of your school and your class, plus the number of students in your class. We will send you a license for all of them.
——————
外国人真是简单的可以,朴实的可以!

by iamin on 2009/12/04 at 15:46. 回复 #

我也去试试。谢谢博主

by 无名 on 2009/12/29 at 10:24. 回复 #

thanks,两年前就开始用了,看了你日志又打开了中文输入。
不过最近官网好像速度很慢,想下载几个其他控件都不是太方便。。。

by kevin xun on 2011/11/22 at 15:56. 回复 #

我来说两句

Not published.

If you have one.