技术文章

  随着行业技术的发展，Web站点或者Web应用越来越复杂。原来单一的静态网页，变得更加丰富，大大提升了交互体验。因此愉悦的用户体验就是产生用户黏性的基础。今天，笔芯设计匠将为大家分享10款超实用的UX用户体验设计小工具，希望能为大家的用户体验设计加分哦~

  推荐一：Whimsical：不仅有强大的流程图制作功能，也有异想天开的框架图设计功能。事实上，你可能并不需要一个专用的线框应用程序。在这个方向上，传统的笔和纸会做得很好，像Sketch或Fig ** 这样的设计工具也能胜任。那么为什么要使用Whimsical呢——总结一句，那就是它干起来真的非常快、非常有趣。

  Whimsical有一个内置的低保真度的组件库：从按钮、到复选框、到文本输入框、到滑块、到标签条等等，一切都一目了然。所有组件都在智能向导上运行，有点儿像乐高拼图。抓取几个基本组件，把它们放在一起，很快就会有一个粗略的整体布局。这对于构建设计师的设计草图和初期理念是一个非常快捷、保真的办法。

  推荐二：Muzli：这个网站中最令我中意的就是它的每周精品汇总和UX互动交流会。这个网站会定期更新一些有好点子、非常精彩的文章，令人总能在里面发现点儿新的东西。

  推荐三：Zeplin：如果你正在团队中进行一个项目，想要分享工作中的某些创意，拍成照片通过邮箱分享是一个办法，但还有一个方法看起来更便捷，那就是——Zeplin（PC通用）。Zeplin是一个很酷的应用，它的特色非常鲜明。

  首先，分享工作创意和进程它非常拿手，你可以邀请合作伙伴共享视频、下载私人文件并添加评论对某个设计品进行交流。其次，当你进行设计时，该软件会生成样式指南，便于设计师撷取十六进制值的颜色和样式。最后Zeplin是一个完全以代码形式传播设计样品的应用。这一点下面会有所提及。

  总之，Zeplin对版权持有者非常有价值，但倘若多个设计师一同合作怎么办呢？这时每个人都需要版本控制。版本控制是一个日常中不常见的术语，指的是一种软体工程技巧，籍以在开发过程中确保由不同人所编辑的同一档案都得到更新，但这个问题Zeplin就很难解决了。

  推荐四：Trunk：https:// ** .jointrunk.com

  Trunk是实打实的社交编程及代码托管软件。你可以在Trunk设置好需要关注的文档，它会实时观测它们的变化，当发生更改时，Trunk会记录其中的变化，同时更改者也可以更新评论做出解释，让用户知道为什么要这么做。Trunk的这一属性对设计师合作团队来说无疑是福音，因为再也不必担心其中未知的改动而不知道缘由。设计师甚至可以以回滚的方式将文档返回到变化前并重新处理其中矛盾的部分，这是其最大的魅力所在。

  推荐五：Atomic：是一个很伟大的发明。之所以如此认为，是因为一个特殊的理由：Atomic支持原创者将自己的设计逻辑编程入原型中，这意味着即使表面上看起来不像本来设计的样子，但在运行中却会完完全全地遵照设计师地本意。

  推荐六：Flinto：https:// ** .flinto.com

  Flinto（Mac端），Flinto以“什么都会一点儿”而自荐，算是个“百事通”，但其中最厉害的就是交互动画设计功能了。在Flinto中，滚动交互、复杂过渡和微交互的操作都十分便捷，该软件同时也支持嵌入视频或GIF，这样设计师就可以在原型中使用现有的动画资源。

  推荐七：InVision：https:// ** .invisionapp.com

  InVision把更多的精力投放在商业宣传上。不过它在生成快速共享的HTML原型并进行即时修改方面还是非常强大的。InVision确有所长，但个人更偏爱Atomic。事实上，如果你不想使用Atomic，并且倾向于InVision，也可以考虑一下Fig ** 或Sketch。首先，它们都支持基本的可点击原型，这些原型可以与用户共享并进行评论。其次，它们都不专长于滚动交互和高级动画定制之类的操作，但对于制作一个简单的原型来说也足矣。

  推荐八：Fig ** ：https:// ** .fig ** .com

  Fig ** （Mac端，PC端）是我的必选之一，不为别的，就为它能在PC端使用。当然除了平台效应，它还有很多其他优点。个人比较青睐Fig ** 的钢笔工具，它操作十分便捷，尤其是在我想以像素规模制图时。Fig ** 的组件覆盖处理起来也非常得心应手，在对话框面板中，Fig ** 呈现出的不是单一的文本框，而是支持快捷修改的图层，并可将更改视为重写，这个功能比Sketch更容易，操作起来也更富有变化性。最重要的是，Fig ** 是一款很好的协作工具，有时甚至不仅仅是“工具”。在Fig ** 中合作就像打开文件直接更改一样简单。因为它的操作是基于云的，文档中的每个人都可以看到进行中的变化，而且能够完全无缝对接。最后要说的是，Fig ** 的原型搭建和共享工具对于编程而言十分出彩，由于原型基于HTML语言，所以设计师可以和任何人分享创意。更何况它还是免费的呢！

  推荐九：Sketch：https:// ** .sketchapp.com

  重头戏 Sketch（Mac端）终于登场了。至于Sketch为什么在屏幕设计中如此流行其实一点也不稀奇。当Bohemian推出该产品时，市场上根本没有类似的精品。由于大量的插件和资源支持，Sketch是UX软件中无可争议的王者。近期，Sketch的开发进程确越来越缓慢，在其最近更新的版本中着重推出的原型搭建功能其实已经被InVision收入囊中了。

  推荐十：Avocode：https://avocode.com/?lng=en

  Avocode很值得关注，因为它不仅仅支持Sketch，还支持Fig ** 、Adobe XD和PS图象处理软件。它也是为了从设计中生成代码而设计的。个人对Avocode的经验很有限，但是如果开发者切换是你工作中的重头，那么Avocode可能值得一试。

  PS.本文整理自网络

  原文链接： ** c-and-pc-320a7be230c9

  译文链接： >

  往期精彩文章回顾：

  喜欢笔芯设计匠分享的小伙伴，不要吝啬你们的关注和赞哦(*^▽^*)