【翻译】Sketch 原型设计伴侣|提升创造力的必备工具

原型设计在设计和开发过程中的作用越来越重要，已经成为现代设计师和开发者工作中不可或缺的一部分。

在当代，原型工具领域变化迅速，我们手头可用的工具也是一大把，以至于我们都有点不知所措。

在设计圈和开发界一直都有这样的争论，“我们的设计工具都已经达到饱和了吗？什么时候工具才算足够多？” 我个人觉得选用哪些工具都没问题。App Store多了一款拼图游戏，我们会抱怨吗？不见得吧。我算了算，共有15,489款这种类型的游戏 （这数字是我自己瞎编的，但这样的游戏我知道有很多。谁有具体的数字，我给他加分）。

在工作中，随便选一个工具，只要适合手头的工作，自己用着舒服就成。有人（包括我在内）倾向于使用桌面工具，而有的就更喜欢使用云平台工具，后者已经日渐流行起来。

一直都使用一款应用是不可能的，我自己以及其他一些设计师在日常工作中都会组合使用这些工具，当然你也可以吆。
这里，我简单介绍下我常用到的一些原型设计工具，大部分时间用的都是这一些，感觉效果还不错，对于配合使用Sketch而言很合适。

Flinto

使用Flinto可以创建一些小的交互和动画，实现多屏app的整体流动（comprehensive flows）。Flinto遵循的美学与Sketch类似，甚至还提供了一些跟Sketch中类似的工具。让人吃惊的是，它甚至还有一些同样的键盘快捷键。仿佛像是从一个模子里出来的，但是这是一个加分项。

对于新手而言，直观明了，当用习惯了后就感觉特别顺手，菜单、工具和选项都变成最小化。用它完全可以设计出令人印象深刻的原型，避免陷入特点过多的境地，分散用户注意力。

【视频】http://v.youku.com/v_show/id_XMTY4NTc0OTIwOA==.html

Flinto最重要的特点就是Transition Designer。如果你是一名讨厌时间轴和编程的设计师，那么Transition Designer特别切合你的心意。Flinto很强大，精确控制每一层，能够制作出一些非常复杂的转换，对于整个项目都很有用。

Principle

Principle和Flinto有很多相似的地方。首先，最明显的一处就是模仿了Sketch的美学，这一点与Flinto相比有过之无不及。

Principle是这样一种为数不多的原型设计工具，更多地关注于转换制作的时间轴线路以及Sketch屏幕间的交互。有的人喜欢这种工作方法，有的人就更喜欢使用像Flinto中的Transition Designer或者Framer中的Auto-Code（自动编程）途径这种更直观的方法。在我测试的所有关注于时间轴的工具中，Principle制作的最直观。

【视频】http://v.youku.com/v_show/id_XMTY4NTQ3MDk4NA==.html

使用Principle可以方便地为多屏app制作流动，或者就专注于微交互，这两种任务它都可以胜任。与本文介绍的其它工具相比，Principle缺少一点润色（ lacks a little polish）。但是作为原型设计大家庭的新成员，升级也是要花上一段时间的。

Framer

Framer与Flinto和Principle有点不同，主要是要自己写代码来实现结果。但是，即使你只是位设计师，也不会碰壁的，因为就算是没有经验的人也很容易上手Framer.

利用Framer，设计师可以熟练地进行对象的创建和操作，同时仍保有手动编程所带来的强大和灵活性。Framer最擅长的就是为使用Sketch创作的设计制作最为详细的交互。只要你能想到的，Framer都制作得出。与本质上更为线性的原型设计工具相比，Framer要高好几个层次。而且，Framer中加入了'Auto-Code'（自动编码）功能，这大大降低了其入门门槛。

【视频】http://v.youku.com/v_show/id_XMTY4NTc1NDcwMA==.html

我喜欢Framer的一点是它可以教设计师如何写代码，或者至少能让设计师对操作和代码之间的交互有更深的了解。这使得在设计师控制项目到开发后期阶段的时候，设计师与工作的关系更为密切。

Framer目前有iOS app可以使用，迭代和测试之间的工作流程也变得更加令人愉快。

iOS版Framer功能包括实时预览、离线使用和受安全链接保护的分享等。使用Framer，你就等于拥有了一个完整的移动原型设计工具包。

Marvel

过去很长一段时间，我都尽量不用Marvel。

从通常的渠道中，我听说过Marvel很多次了，也浏览过他们的网站和视频广告无数次（他们的网站太棒了，不看？根本把持不住好伐！）

第一次使用Marvel，并不是因为客户的项目，也不是因为和开发者一起工作完成我的设计，而是制作一个Medium教程系列，我要找一些更轻，对初学者友好的东西加入到我简短的教程系列中，就这样找到了Marvel。

【视频】http://v.youku.com/v_show/id_XMTY4NTc0OTA2MA==.html

Marvel的功能不是最丰富的，但是所具有的功能都很强大，而且可能是这次所罗列的几个工具中最容易上手的工具之一，尽管上手使用就成。像Atomic（下面会介绍）一样，只需要直接使用简单直观的Canvas在Marvel中创建屏幕就行。如果你想迭代的更快，利用Marvel这一功能非常有用。

Proto.io

和我前边提到的原型设计app不一样的是，Proto.io完全基于浏览器，可能有的人不喜欢这一点。我就是那种更喜欢桌面应用的人，但是这并不是说我不知道http://Proto.io是一款强大的基于浏览器的解决方案。如果你网络连接既稳定又快速的话，Proto.io或许就是你进行原型设计最佳的app。

这是一款强大的工具，可能是这次所罗列的工具中功能最为丰富的，但是与其它工具相比，第一眼看上去有那么一点点让人难以应付。

【视频】http://v.youku.com/v_show/id_XMTY4NTc0MDQyOA==.html

Proto.io的UI不是最好看的，虽然在版本6中有所改善，而且有一点点凌乱，这可能会使人在工作中分心。去掉那些无关的功能，这样才能让人更专注于编辑器中所呈现的设计、转换和交互。

Atomic

Atomic也是一款完全基于浏览器的原型设计应用。目前，Sketch importing这一功能还不是最精简的，但是随着专门Sketch插件的诞生，很快就会升级换代。

作为一款给我带来愉悦使用体验的基于云的工具，Atomic是这一堆应用中最为优美的，从一开始就让人感觉是一门专业的工具。你可以利用Atomic设计原型和应用，以及制作像 History滑动条一样简单的东西，自如地进行项目的迭代。

【视频】http://v.youku.com/v_show/id_XMTY4NTczNDI4OA==.html

Atomic的用户界面（UI）是如此的华丽，就是在上面转来转去也让人身心愉悦。想想‘dark mode’下的Sketch使得从设计到原型的转换变得更加流畅。

Atomic的协作功能也非常强大。你可以和你的队友在同一个项目上无缝协作，自如地分享设计文件。当你在设计自己app原型的时候，你就会感觉到这一功能简直是太有价值了！Atomic，就是它了！

除了上述几款工具之外，还有很多其它的工具，比如InVision （这一款我要花很多时间）、Pixate 和UXPin，当然了还有Facebook的Origami Studio以及InVisionLabs的Craft原型设计插件。

找到适合自己工作流程的工具，然后就开始工作吧 。根据手头的工作在不同的工具间切换。各个工具都各有优缺点，一种工具是肯定不行的。谨记。

我不知道怎么加视频，只能直接添加链接，表怪我笨啊！