从设计到开发，10大不容错过的效率提升工具

工欲善其事必先利其器。好的工具虽不是缔造一位出色的开发者的充分条件，却是必要条件。希望在这篇文章中分享的这些实用性工具可以在优化工作流上帮助到你。

Atom

Atom是Github推出的一个开源跨平台文本编辑器。几年间Atom都是我的第一选择，它功能齐全，内置包管理工具，有智能提示补全功能（auto-completion），并包含精美的主题。





包管理器这个概念像一缕清风，来源于Sublime编辑器。Atom既可以使用APM，也具有简洁直观的GUI界面。无须修改配置文件，可以直接使用。另外Atom支持CSS、HTML、JavaScript等网页编程语言。它支持宏，自动完成分屏功能，集成了文件管理器。





性能方面，Atom缺点是启动较为缓慢。但是目前的版本已经很快了。你可以阅读更多关于Atom及其性能优化的文章，Moving Atom To React、Implement
text editor DOM updates manually instead of via React。

DragDis

作为一名设计师，灵感是创作的灵魂。DragDis是一个节省找灵感时间的工具，易于上手。安装 Chrome扩展插件，拖拽所有你想要保存的内容。你可以把自己要保存的资源分门别类，先建好文件夹然后把相应的内容拖拽至相应的文件夹即可。





我一般每周新建一个文件夹，这样可以追踪设计品味随时间的变化。





DragDis还有全页面的网格布局，可用作很棒的情绪板，更多功能还等你亲自去体验。

iTerm2

iTerm是一款Mac上的终端增强工具，是Terminal更整洁的替代品。iTerm2提供更为强大的功能，如无限制分屏、自动完成、选中复制、剪切板记忆、全屏、内联图像和搜索等等，并仍在不断完善。

Muzli

Muzli是一个Chrome扩展应用，聚集了Designer News、Dribbble、Behance等资源库的内容，所有你需要的设计灵感这里都有。

每次在Chrome Muzli中打开新的标签，你都会一眼看到各个网站的精选内容。





我最喜欢的一点是个人推荐模块，好像你拥有了一位私人助理，帮助你挑选最好的前端设计相关的文章。

Noiz.io

很多设计师喜欢去有情调的地方比如咖啡厅来寻找创作的氛围，Noizio将这种氛围带到家中。它提供了十月雨声、喧闹的巴黎咖啡厅、雷雨声等10种不同的白噪音音效，它还可以让用户根据自己的喜好混搭音效。我最后固定使用的音效是这样的一幅画面：在一个雷雨交加的晚上，寂寞的旅人在野外生火取暖。

Invision

Invison是一个便捷的产品原型生成工具和工作流控制平台，完美地配合前端和设计师之间的协作。它提供的不是准确的线框图，而是一个快速原型的环境，可以把你的UX/UI草图快速连接起来。数字型的线框图和高保真的设计可以帮你测试app的工作情况，同时该工具还支持协作和分享功能，生成的在线原型可以支持任何人在产品原型的任何地方评论，便于准确的交流。





蓝色部分是链接区域，点击后会到下一屏，便于设计师向用户和开发工程师展示流变化，也适用于做一些初步的定性测试。





Invision近期发布了一个新功能：Boards。Boards可以收集灵感和构建情绪板。与DragDis最大的不同是Boards具有协作性，可与团队其他成员共同设计。

What the Font

排版是设计中最重要的部分，这也是为什么What the Font是我最喜欢的Chrome扩展程序之一。它可以帮助设计师找到网站所用的是什么字体。

Postman

作为前端开发人员，我们需要经常查询API或交互的接口，调试网页是否能够正确是处理各种HTTP请求。Postman插件就充当着这种交互方式的“桥梁”，它可以把各种模拟用户HTTP请求的数据发送到服务器，以便开发人员能够及时地作出正确的响应，或者对产品发布之前的错误信息提前处理，进而保证产品上线之后的稳定性和安全性。

Wappalyzer

Wappalyzer用于识别网站所使用的工具库和框架。它有Chrome 扩展程序，下次当你想知道网站是用什么库才制作出特别的视觉效果的时候，尝试使用 Wappalyzer吧。

Boom2

Boom是一个Mac的扩音器和声音平衡器。当你码代码需要一些音乐来加速生产力的时候，Boom是一个好选择。





它有一系列预配置的音乐流派，jazz、hip-hop、电子乐等，也可以自由配置。Boom还包含一些声音效果。





小编的话： 

好的工具可以有效提升我们的工作效率。如果你有想推荐的工具，欢迎在文章下面留言和大家分享~希望我们都能配置一个最适合自己的“工具箱”！