第一波！2020年3月超实用设计工具大合集

新年新气象，宅家做设计搞开的同学似乎效率提升，个月 Prototypr.io 个月的设计工具大合集当中，涵盖 10 个不同类别，功能富样的新玩意！次的合集当中有很令人眼前一亮的东西，比惊艳的图库网站 Open Peeps，基人智能的关键词生成器，还有以超快借鉴你所喜欢网站的和样式的 Figma 插件！

?️ 插画图库

1. Open Peeps →

Open Peeps 是一个最的手绘图库，它供给你相当充裕的创作空间，你可在它供的平台上对人物角色及处的场景进行自定义，这样就可应于你自己的设计作当中。

2. ITG.digital →

ITG 是一个在线的插画生成工，只需钟，你就可以创建独的、有故事性的插画，在这个过程中，你可以调用不同的素来进行搭配，定制性极。你可以将这些插画应用在APP、网站和社交媒体上，非常不错~

3. Lottiefiles for Figma →

Lottiefiles 也近超级的一款 Figma 插件，能够帮将各种免费的 Lottie 动画转 GIF  SVG 插入到的设当中。如果找新的、用的 Figma 插件，一看下面这篇文章：

? 配色工具

1. Vangogh →

这是一个使人工智驱的配色工具，它够根据你要的键词帮你到合适的配色方案。这款工具借助机器习的技术，在上数百万计的图片中搜索、获取配色，并且生成符合你的键词的配色。

2. Color Safe →

Color Safe 是为你提供对比度良好、符 WCAG 规范的配色方案，这的配色方案有着更加优良的可访问性，带来更加优秀的用户体验。

3. Colors & Fonts 4.0 →

自 Michael Andreuzza 的配色库 Colors & Fonts 升级到 4.0 了，这具又一次升级改，新版支持下载 Figma 格式的配色我二，支持 Tailwind CSS，支持颜色选择器，支持渐变图案颜色码转换。它们对于数字设的支持越越好了，得使用！

? 设计资讯和资源

1. Vincent →

Vincent 是个日设计和前端相关设计新闻资讯 APP，目前它主要出了 iOS 版，并 Android 版也将很快安排上。作为个垂领域聚合阅读工具，Vincent 常适合想要第时了解最新设计资讯学。

2. DesignValley →

DesignValley 是一个设计师和设计爱好者的精工具诶机，你会在 DesignValley 中投递、发现和共享自己的设计素材和设计资源。在一个地方到你有的设计工具，它的值是非凡的。

3. FrontendSource →

FrontendSource 是一个给计和前端开发者的资源集，从 Vue、React  Jekyll、Gatsby、HTML 等各种资源一应俱全。除此之外，这个网站中还包含了组件、主题、UI Kit 等常见计资源，非常全面。

? UI 工具包

1. iOS 31 GUI →

是一组超级面的 iOS 平台的 UI Kit 合集，其中包含上百个不同的 UI 组件，且涵盖深和浅模式。所有的元素有 Sketch、Figma、Adobe XD 的版，并且符合人机界面互准则，除此之外，它还支持苹果最新的 SF Symbols。

2. Filter →

这是个 Figma 插件，插件为你提供 20 多不自定义筛选控件，你可以根据自己需求，来选择筛选制，根据自己喜好进编辑。

? 设计工具

1. Lunacy Designer 5.0 →

这是一款 Windows 的全功能图形编辑器，最新版本为 5.0 并且是 Beta 状。最新版中包含了人工智能加持的一键去背景功能，集成了最新的 UI Kit功能，修复了超过 1000 个 Bug。同，作为一款图形编辑器，它可以直使用 Sketch 文档，性能劲且稳定。

2. Pixilart →

Pixiilart 一款线素绘图平台，如果也喜欢素，那么可以这里找到志趣相投的家发友，这里共享的设，或者发掘多趣的设。

3. Figma Handoff →

Figma Handoff 是一个设计付工具，以帮助你从 Figma 设计文件生成标注，方便开人查看。它是一个上应用，通 Figma API 获取设计数据，并生成离或在标注，但不将你的数据存至任何服务器。款插件来自中国

4. DraftXR →

DraftXR 是款 Adobe XD 平台 VR 设计原型插件，虽然它做是 2D 设计，是能够在兼容 WebVR  HMD 进预览和测试，常不。

5. Waymark →

这是一款来创建产路线图的工具，Waymark 够生成 png 格式的产路线图，你可将这个路线图于演示，它你的展示容易于解，易于执行。

??? 无代码工具

1. Airsite →

Airsite 一款移动端应用程序，让可以以极简单的方式构建简单的网站，构建过程的 Android 手机或者 iPhone 完就可以了。

2. Devsync →

是一款视化的 CSS 编辑器，它以与你的无代码编辑器时同步编辑，款 Chrome Devtools 拓展以让你时有效地观察到你的操和样式，无需编写 CSS 代码。

3. Make Stories →

MakeStories 是款代码 AMP Story （AMP Stories和Snapchat Stories、YouTube Reels极为相似）构工具，它使用快速拖放功能来帮你来构互动故事效，结合其 75 不效，将你制作能力提升到个极高程度。比如你可以使用 AMP 动画、键龚律全、自定义体来为你设计增添乐趣。时，它有着丰富库，为它成了诸如 WordPress 和 Drupal 等工具。

⚛️ 设计系统

1. Superposition for Figma →

Superposition 是一款实用性极的软件，如果你喜欢某个网站，并且想使用它的配色、排版甚至式，那你可以用 Superposition 来实现这一目标。

2. Sleuth for Sketch →

Sleuth 一款源具，它能够帮了解如何使用组件，以及何时使用组件。借它，可以估的设系统能够对的流程、以及外部世界都哪些影响。根据它的创建者 Sean Rice 所，Sleuth 一 Figma 的组件分析具，不过它用于 Sketch 的。

? 团队工具

1. Tools for Teams →

团队协作需要有适合团队使用工具，那么这个列表是精选后团队协作工具列表。从管理到设计，从开发到分析，这里所涉及到工具几乎涵盖了团队协作绝大多数需求和场景。

2. Zeplin 3.0 →

Zeplin 是一款非流行的在线设计和协作工具，如今更到最的 3.0 版了，在这个版当中，包含了许多令人兴奋的功，如链接组件功，开发者够防伪代码库中的组件，而 Zeplin API 则通过脚本、小程序甚至他应来访问数据，并且可自定义。

?️ 图片优化工具

1. TinyImage for Figma →

这一 Figma 的图片压缩具，它可以将从 Figma 导出 png  jpeg 格式图片的时候，压缩 90%！

2. AI Image Enlarger →

是一个基人工智能的图放大工具，它以在不降低画质的前提之下，帮你将图无损放大。值得一提的是，它是完免费的。

3. CloudApp for iOS →

CloudApp 是个录屏和文件管理工具，你可以在任何地创录屏、图片和文件，并分享出去。借助这款工具，你能创收藏夹，便于快速访问。

? 测试工具

1. Responsive Website Test →

这是一个网站测工，可以替你进行跨备的测，查你的网站在各种不同的备上的相应速度，它比 Devtools 更快，并且可以更快进行可视化的展示，并且会优先为你展示三种常见屏幕的测结果。