交互设计谁是最好用的原型绘制工具发布者：本站     时间：2020-06-21 11:06:24

Photoshop
作为设计师的看家技能，理论上可以通过它做出任何图形，但对于交互原型来说制作和改动成本略高，图层和组件的处理上比较死板，软件自身性能和模板库也很受挑战，容易过快进入细节讨论而忘记初衷，并非交互稿首选，当然也有设计师一开始就是朝着高保真 Demo 方向做的，用它最直观。

Illustrator
同胞兄弟 Illustrator 在矢量处理上表现的略好，不受画布大小和图层的困扰，也有丰富的模板库支持原型设计，但继承了 Adobe 家族一贯功能大而全导致操作很繁琐的特点，原型图制作效率也不高。

Fireworks
相比之下，干儿子 Fireworks 拥有更简单的界面，同样在图层处理方面的优势，尤其是可编辑 png 文件包含了图层和矢量信息这一点保证了文档的传承性，受到很多的设计团队的青睐而做为交互输出工具的首选，可惜 Adobe 对其支持有限，最新的 Adobe CC 家族中更是失去了它的踪影，未来 Fireworks 优化空间很有限。

3.tools.keynote

Keynote / PPT
作为非专业绘图工具，用 Keynote / PPT 来画交互稿算是曲线救国，丰富的交互动作和简单的使用流程解决了很多交互演示需求，CDC 的同事曾写过一篇《关于快速原型的一点纠结》 做了很好的解释，但问题也正如文章中所述，优缺点非常明显，模板库几乎为零，在没有其它工具辅助情况下自行绘制费时费力，在这里就不详细介绍了。

4.tools.axure

Axure
号称是互联网产品经理标配，国内有大量资料和讨论，其优势非常明显：操作复杂度介于 Keynote/PPT 和 Adobe 家族之间；拥有全套 web 控件库，直接拖拽即可快速制作网站原型；丰富的动态面板可以用来模拟各种复杂的交互效果；导出 HTML 后可以更加准确的传达信息架构和页面跳转。

但对移动产品原型支持不足，Axure 无法导出可在移动端演示的文件，只适合做信息结构和页面逻辑的展示。在对形状样式的处理上不够丰富，很多细节处理的不够好，做出来的线框图大多不够好看。

5.tools.omnigraffle

OmniGraffle
作为 Mac 平台下最好的原型设计工具，除了用来绘制普通图表、树状结构图、流程图、页面编排等，还可以试试规划电影剧本、 绘制公司组织结构，甚至是作为演示文稿来展示一个项目。

由于利用了很多 OS X 原生绘图属性，Omnigraffle 只支持 Mac / iPad ，它在很多方面表现都有 Visio 的影子，就连名字里的 “Graffle” 都是创造出来对应 “Visio” 的，尽管在 web 交互事件上并不如 Axure 那么丰富，对移动平台的支持也不如一些新星 (如 briefs 和 fluidui ) 的表现那么亮眼，但由于其丰富的模板库、轻松的上手体验以及大量贴心的细节，战胜了其它所有竞争对手，成为我日常工作最主要的工具。

以上几个软件已经能涵盖大多数的使用场景，但工具毕竟只是纸和笔的延伸，在熟练掌握其中一个的基础上，不断尝试新工具不仅能发现更多有价值的技巧加快设计节奏，更是对自身能力短板的了解，互相结合使用让想法不受工具牵绊，努力让自己成为全栈设计师才是它们的价值。

另外，市面上较少介绍 OmniGraffle 技巧的文章，很多人感兴趣但不知道怎么用好它，下面分享10个有用的小技巧来加快上手。