在熟练使用2B铅笔前,请不要打开Axure

在互联网产品领域,Axure已成为产品经理、产品设计师以及交互设计师的必备工具,从某种程度讲,Axure帮助我们建立低保真模型,便于与用户的需求验证,也帮助我们构思交互细节,使前端和开发人员更容易理解我们的产品;但从另一方面讲,Axure绑架了我们的思维,让很多产品经理和设计师养成了“无Axure不设计”的恶习,忽略了用户故事、功能规格和信息架构,甚至走入“为了用Axure而用的误区”,导致了资源的大量浪费和产品的硬伤。因此,提醒为Axure着迷的产品经理:在熟练使用2B铅笔前,请不要打开Axure

继续阅读

用Visio画web流程图的无奈

今日又接到项目,手绘整个流程图后,想把关键部分在RTX上发给老大看看,于是不得不使用 Office Visio 流程图工具解决。其实我不爽这个软件很久了,但又没有什么合适的替代品,所以每当画web流程图时,都十分无奈。先贴出刚出炉的部分流程:

不爽的原因如下:

1、Visio流程图的默认汉字字符为8pt,而默认页面显示宽度为75%,这就意味着,除非每次都调整设置一下,不然在进程框中输入的汉字基本是看不清的…囧。当然,通过“工具-选项”的高级设置,默认值是可以修改的,但相信90%以上的人都没有想到,或不知道在哪。实际上,汉字大小需要调整到12pt才能看清(你能看清上图中的汉字么?);

2、页面和字体小就算了,流程图的背景还是可恶的小方格,小方格就算了,流程框的背景颜色还是灰色。我不能确定这样的设计是否符合 W3C 标准,但我认为这种颜色的设计可用性并不好,如果谁有兴趣,可以用对比度分析器来检测一下。如果Visio只是一个很平凡的软件,或许我不会如此吹毛求疵,但很可惜,它是微软设计的(Visio 2007中,这SB的小方格设计终于被抛弃了);

3、Visio默认的背景纸太小了,或许可以理解为只有一张A4纸大小。在我绘制复杂产品的流程图时,这种问题就更加凸显,我不得不将一个完整的流程分割成若干分项流程,除非我放弃使用Visio。实际遇到这种情况时,我也的确是这么做的;

4、版权问题。随着微软打击盗版的力度加大,很多企业已经卸载了Office产品,转而使用金山的WPS,如果使用正版,你需要付出不菲的代价;

当然,我并是不是说用 Visio 画流程图是一无是处的,毕竟它主要的作用就是如此。同时,相对于其他乱七八糟的流程图设计工具而言,很多功能细节处理都是非常到位的。所以,如果有数据能证明用 Visio 画流程图的人占绝大多数时,我一点也不会惊讶(不考虑版权因素)。比如 Visio 在流程模块拖放时的参考线处理、连接线的自动对齐处理、以及将 Visio 流程图导入到 Word 中是如此方便,甚至可以在 Word 中直接对流程图进行修改和完善,这一点是其他流程图软件不可比拟的。

如何使用 Visio 画 Web 流程图呢?网上有很多这方面的资料,我推荐千鸟的一个 Visio 流程图基础性总结。当然,除了 Visio,还有很多工具能够画好流程图,这些工具在不同情况下有着不同的作用,也都有自己的局限性。在这里给大家推荐几个我经常用的:

1、纸和笔
没有比灵光一闪再珍贵的创意,没有比挥洒自如更好用的工具;所以纸和笔是思考产品结构、框架、流程最好的伙伴。刚入道时,我也十分迷信美观、工整、专业的流程图,但实际上,使用软件的效率还没有纸笔的十分之一。毕竟在流程构思的最初阶段,我们需要的是“如何设计”,而非“如何展现”。最初阶段,好的创意和设计是需要大胆涂抹和随心修改的,所以纸和笔是这个阶段最好的工具。缺点是保真度不高,难以表述复杂流程细节;

2、Axure RP


Axure 是在 Web 产品经理中使用率最高的软件之一,主要作用是帮助网站需求设计者,快捷而简便的创建基于网站构架图的带注释页面示意图、操作流程图、以及交互设计,并可自动生成用于演示的网页文件和规格文件,以提供演示与开发。Axure 的流程图模块非常简单,但却十分高效。结合产品原型DEMO展示时,有着非常好的效果。不足之处就是对中文的支持不够良好,并且流程框之间的连线没有 Visio 智能。但毕竟 Axure 并非是专门为流程图而设计,这里推荐一整套Axure原创教程,第六篇详细介绍了流程图模块,我曾经就是看着这套教程学习的,感谢作者 hawking。同时,UCDChina有一个专题,介绍和分析 Axure 相关,是很好的参考资料;

3、Photoshop
Photoshop 是专业的图像处理软件,拿来画流程图自然是小菜一碟。她能够处理十分复杂的流程图,而不受流程图设计软件规则的约束;当然,Photoshop 还能设计出非常美观甚至华丽的流程图。但问题的关键在于,流程图的价值在于为了简单清晰地表示一个流程。虽然Visio的流程图很丑陋,但不可否认,它足够简单。实际上,在画流程图上浪费过多的时间是没有必要的。当然,如果你的 Photoshop 功底还不错,或者说非常习惯并依赖 Photoshop,那么在处理复杂流程时还是可以用的,特别是将流程模块整合进画笔后,PS是十分强大的。但我总觉得有一点大炮打蚊子的感觉,所以处理流程时我只用过一次;

4、其它工具
PPT、Word、Dreamweave、CorelDraw…这些东西,其实都可以拿来用,但毕竟不那么专业。当然,主要还是习惯问题。一个专业的需求设计者或者UI基本是不会用这些工具来处理流程图的;

最后,我想说说 OmniGraffle。在看到 Felix Ding 的这篇被转贴无数的“画Web流程图的一点心得”之前,我甚至还不知道这个苹果主机上的软件,了解后才发现,这不就是我梦寐以求的流程图设计工具么?!Felix Ding 给 OmniGraffle 的评价是:最好的原型和流程图绘制工具。可惜我用的还是PC机,如果MAC兼容性在好一点,说不定我也去买个苹果小白了……怨念啊……

用 Visio 画 web 流程图虽然是无奈之选,但毕竟大家都在用,并且也没有什么更合适的软件了。虽然没用过 office Visio 2007,但我更更期待有个能与 Visio 媲美的,与 OmniGraffle 一样强大的PC机流程图软件出现,最好不用担心版权问题,有这样的软件么?