23款实用设计工具合集推荐

23款实用设计工具合集推荐

Prototypr.io最新一期的设计工具合集来了！这次的合集包含了23款涵盖不同领域、针对不同需求的实用工具！无论是图库还是各种功能强大的Figma插件，应该都切中了许多设计师同学的需求。

1.Cone2.0：这是一个适合在iPhone上使用的实时取色工具，它可以帮你识别潘通色，根据镜头取景框生成ColorBucket，并且能够借助「色盲模式」来帮你规避可能有风险的配色。此外，这款APP还附带有iPhone和AppleWatch云同步功能，让你随时使用之前自己创建的ColorBucket。

2.Duo：Duo是包含100种不同配色的合集，这些配色可以直接使用，也可以在JSON中使用，让你可以非常便捷地添加到网页当中。

3.LineIcons：这是一组为设计师和开发者准备的线性图标合集，包含2000款图标，所有的图标包含有不同的格式：SVG、AI、Web字体等等。你可以在其中找到包含商业、通讯、食物等各种不同的类别。这个版本是完全免费的。

4.BlackIllustrations：这是由JohnD.Saunders所创建的关于有色人种的免费插画图库，插画中包含了30多种不同格式的高清插画，包括JPG、PNG和Sketch等格式。和很多插画图库类似，这里的插画图库都是可定制元素的，值得试试。

5.DeliciousIllustrations：这是一套以美食为主题的插画图标合集，其中包含36套多彩的插画和80个单色的图标，所有的都是SVG格式的。这套插画图库完整版的售价是9美元，部分插画是免费的。

6.404Illustrations：这个名为404Illustrations的插画图库就是一个超有趣的404专用插画页面合集，这些插画设计非常的可爱有趣，并且这些插画可以在Sketch和Figma当中编辑！

7.UnitUIKit：UnitUIKit包含了160多个不同的免费UI组件，涵盖了按钮、文本、选项卡等UI组件和不同的页面，所有的组件都和Sketch兼容，你可以轻松地将它们添加到不同的设计当中，并进行自定义。

8.ContraWireframeKit：Contra是一款开源的线框图设计框架，其中包含150多个组件和50多屏的组件，可以供你快速地绘制线框图和原型。这套组件工具包当中还包含了PabloStanley和OpenPeeps的插画。Cointra可以用于Figma、Sketch和Studio，无论商用还是个人使用都是免费的。

9.UIDesignDaily：UIDesignDaily是一个是设计内容推荐平台，其中包含有不同的UI设计项目和相应的源文件。它是完全免费的，无限制使用。这些源文件兼容Sketch、Figma和AdobeXD等软件。

10.Pattern.css：这是一套CSS背景图案库，Pattern.css当中包含数十个不同的图案，你可以直接下载使用，也可以使用npm来安装它。

11.98.css：如果你是一个怀旧的人，那么你可能会喜欢这个模拟90年代WindowsUI的CSS库，它可以让你生成类似Windows98视觉风格的界面。

12.DarkCSSGenerator：为了缓解视觉疲劳，越来越多的人开始选择深色模式，而Kasloyan和Stanislav创建的这个DarkCSSGenerator则可以快速地将任何网页切换为深色主题。

13.ProductDisrupt2.0：ProductDisrupt汇集了很多精选的设计资源，来学习产品设计，从博客文章，到音频播客、图书、Youtube频道等等。这个平台旨在为你提供自由且相对精准的学习资源指引，此外，它还针对产品设计不同阶段的学习参考指引，进行了划分。

14.UserTestingFieldGuide：这是一份实用性很强的用户测试指南，借助它，你可以满怀信心地做用户测试了。它会教你如何设定合理的测试目标，选择对的测试方法，以及正确的工具。

15.CodingList：如果你真的想学代码，那么这份编程开发课程表单，一定要收下。它能够帮你找到你所需要的技能对应的知识和教程。

16.SaaSforCOVID：新冠肺炎导致很多科技公司进行了针对性的调整，很多SaaS类的服务都进行了相应的升级和调整，其中不少都降价甚至免费了，更具体的信息，你可以在这个网站看到。

17.OvercomeFinancialCrisis：这是一本免费的电子书，内容是关于设计师如何对抗经济上的危机，如何有效地应对各种财务状况上的问题，如何更好地管理自己的工作和生活。

18.Flow：Flow是一款动画工具，但是它同时还能导出可用的代码。一方面，它可以接纳来自Sketch的设计文档，另一方面，它又能将动画导出到Lottie、aSVG、iOS、HTML和React上使用，它有缓动，有多种格式和分辨率，有定制化的代码模板。

19.FigmaImporterforFramer：这款工具能够将你的Figma中做好的设计导入到Framer当中，并且快速创建交互式的原型。你可以轻松地构建静态原型，甚至UI，将想法快速变成现实！它目前加入了更加开放的工作流程，让团队协作更加具有竞争优势。

20.BackgroundGenerator：这是一个可以生成自定义背景的生成工具，它旨在将自定义的视觉元素导入到不同的设计项目，或者社交媒体网站当中，你可以通过它的侧边栏的设置功能来进行快速的调整。

21.Frametastic：Frametastic是一个Figma插件，可以在不同的窗口中测试你的设计，你需要做的，就是保存好你最喜欢的帧组合，添加约束，然后让这款插件来帮你进行测试。

22.Show+TellforFigma：Show+Tell是一个全新的插件，它可以帮你在Figma当中创建演示文稿。此外，这款插件还能实现自动滚屏、支持任意尺寸，并且能够让框架和组件始终保持最新，在展示的同时无缝地展示原型，无需切换应用，并且能够通过链接进行分享。

23.Camille2.0：如果你想为你的移动端设备进行3D和虚拟现实的设计，那么你可以试试Camille，它可以帮你的iOS和Android设备提供最佳的AR和VR的元素设计，并且能够导出并进行3D打印。