给独立开发者，开箱即用、免费漂亮的设计资源
作为一名设计专业的学渣，毕业后，由于按捺不住一颗躁动的心，一直希望不受约束地做自己喜爱的产品。
我开始自学编程，初尝了写一个小程序的快感。
一手包办了产品的方向、设计、交互、原型、开发。
虽然，「我的产品我做主」的感觉很爽，但有时要做的事情太多，不免要分心，把时间放在了不重要的事上。
于是，我整理这份开箱即用的设计资源，帮助那些乐于折腾的小伙伴创造 side project。
他们几乎都是免费；同时，大部分资源我自己也实践过；所以实际上，你看的，是我大浪淘沙过的。
如果你是设计小白，推荐阅读这篇文章：七个实用的设计技巧。它非常易懂，了解这些技巧，你可以马上用在你的项目上。
最后，欢迎各位小伙伴提交 issue，分享自己用过的好东西。
我会持续更新，感谢 star 鼓励！
| 名称 | 简介 | 预览图 |
|---|---|---|
| Sketch | 移动时代崛起的设计工具，非常好用的设计软件，不过只有 Mac 版，不过 Windows 用户不用灰心，你们可以选择下面这款。 |  |
| Figma | Figma 号称要取代 Sketch 的地位，因为是基于 Web 的，一开始觉得会受限于性能不够流畅，但实际上体验非常丝滑，尤其支持全平台，这点很赞！ |  |
| 蓝湖 | 这是个产品设计协作工具，但我主要看中它可以把 Sketch 设计稿传到网上，方便查看。 |  |
| 网站 | 简介 | 预览图 |
|---|---|---|
| Dribbble | 一个收集了非常多优秀设计作品的网站，几乎每个设计师人手一个。 |  |
| 优设网 | 国内分享设计知识的网站，大部分比较浅显易懂。 |  |
| 网站 | 简介 | 预览图 |
|---|---|---|
| calltoidea | 展示了各种界面部件的设计案例，当你设计陷入瓶颈，可以来找找灵感。 |  |
| collectui | 收集各种用户界面的网站，不过似乎加载速度不太好，但胜在资源多。 |  |
| 网站 | 简介 | 预览图 |
|---|---|---|
| iconfont | 马云家的一个 icon 网站，似乎也是最大，好多公司也在用。不过又多又杂，跟淘宝一样。 |  |
| google icon | 谷歌家的，图标品种多样，基本你要的都能找到，最关键的是风格统一，这点很省事！缺点就是英文以及要科学上网。 |  |
| icofont | 又一个好看图标的网站，可以弥补一下 iconfont 风格迥异的缺点，而且，网站名称也很像。 |  |
| 网站 | 简介 | 预览图 |
|---|---|---|
| undraw | 扁平化风格的 SVG 插画网站，种类很丰富，我用这个比较多。 |  |
| manypixels | 渐变风格的插画网站，图案很丰富。 |  |
| ouch | 有很多不同风格图案，全都好好看，不过免费只能下载 png，但也足够清晰了。 |  |
| humaaans | 也是一个扁平化风格的插图网站，不过人物有一种夸张的美感。 |  |
| 网站 | 简介 | 预览图 |
|---|---|---|
| WebGradients | 一个收集漂亮渐变色网站，风格偏小清新，看着就想吃。 |  |
| 100font | 一个专门收集整理「免费商用字体」的网站。 |  |
| animate.css | 一个强大的 CSS3 动画库，显著提升产品的精致度。 |  |
| bouncejs | 相当进阶版的 animate.css，像搭积木一样做出你想要的动画，然后一键生成代码。 |  |