進入12月份，是時候屯一波優質的設計素材，為年底的各大設計項目打好底子，沖一波啊！這次的設計工具和素材合集和以往不同，是從多個不同的網站精選的一波設計素材，包含最新的免費可商用圖庫、收費但是物超所值的資源、設計教程還有各色給力插件，來看看吧！

1、Fonts of web

也許你在某個網站上看到了不錯的字體，但是不知道哪里能找到它們的相關信息，那么這個網站是一個非常不錯的選擇，它可以很好地解決這個問題。

在這里，你只需要在這里輸入網站的 URL 地址，然后Fonts of web 就能夠在幾秒內幫你找出網站所用字體的詳細信息，并且會標注出對應的字體所使用的全部規格（字體大小、字重、行高、乃至于下載鏈接）。

2、教程：如何使用Figma 動態網格

這套教程教你如何在 Figma 當中巧用動態網格來進行布局設計，這套教程當中包含如下部分：

• 網格介紹：Figma 當中網格功能的基本說明，網格的基礎結構
• Figma 和 Layout：教你如何使用固定和拉伸的網格，如何做好網格的約束
• 基線網格：間距控制的技巧，教你如何更好地對齊元素，如何使用基線網格，并且應用到文本和圖標中
• 實戰應用：在范例中演示如何均勻地布線，縮放復雜布局以及如何應用自動布局
• 進階技巧：如何切換網格、修改色彩、創建樣式
• 相關鏈接：一些額外的參考文章和工具

3、ScreenBean

這是生成 Dribbble 風格展示圖的工具，我只能說……真的超級贊，它能夠根據你的圖片自動挑選對應的背景色，可以選擇正常效果、漸變、陰影式以及帶有裝飾性小圓點的版本，總而言之就是超級實用！

4、Delightful Micro-Interactions

靜態的網站和 APP 經常讓人覺得很無聊，但是加入了微交互和動效就不一樣了，如果你正在鉆研交互和動效，那么這個網站應該就是正好符合你的需求，這里搜集了來自213名設計師的 500 多個微交互和動效設計作品，這些作品在視覺上都足夠吸引人，但是又不是侵略性的那種，實用性和易用性都足夠強，涵蓋的類型從按鈕、下載、開關、搜索、購物車可以說是覆蓋了絕大多數的 UI 設計的控件和場景！值得收藏！

5、Glyphs Icons

這是一個應用在 Figma 當中的超全小圖標系統，總計有3000 多款不同的圖標，所有的圖標都已經經過優化，可以在瀏覽器中使用，既可以導出為 SVG 文件，也可以直接作為 Web 組件來使用。

在使用的時候，你可以將對應的插件裝到 Figma 當中，并且直接關鍵詞搜索特定的圖標，在圖標系統當中定位到你想要的那個。

6、Phosphor Icons

Phosphor Icons 這也是一套殺手級的圖標工具包，無論是用在界面、圖表、PPT 當中都相得益彰。這套圖標多達 3500+，樣式也相當的多變，從簡單的線性圖標到填充樣式的圖標，還有雙色的版本，你可以編輯相應的圖標線條粗細、色彩和樣式。這套圖標同樣可以下載，也可以裝到 Figma 當中使用。

7、風格指南靈感合集

自從Dribbble 加入合集功能之后，設計師也可以根據特定的主題來整理自己的靈感合集了。而這一套合集就是關于風格指南的，可以作為日常進行系統化設計的情緒版了。

這組合集并不限于 UI 套件和設計系統的風格指南，還有很多注入 LOGO、網站的風格指南設計，可參考的地方很多，值得關注。

8、Aspectapp Web

這是一個潛力巨大的工具，它可以幫你設計的界面轉化成為真實的網站，而且這個工具內置了一些模板，你可以輕松自定義，用起來并不復雜。

如今 Aspectapp 如今正在努力將 React 集成到這個工具當中，著意味著接下來你可以直接從 Sketch、Figma 和 XD 當中直接導出一個網站了！

9、Kolumna

Kolumna 是一個非常好用的網格生成器，毫無疑問，和同類工具一樣，它可以輕松控制間距、邊距等等參數，但是最重要的一點在于，它本身足夠智能，盡可能幫你省去一些麻煩的環節，加快工作流程。

10、Wrroom

Wrroom 是一套超級方便的角色場景插畫生成工具，并且主要是以 Figma 和 Sketch 插件的形式存在的，這套工具還額外附帶單獨的插畫風角色頭像生成功能，可以說是非常方便了！

11、圣誕節插畫

圣誕節要來了，想必很多同學都在找圣誕節相關的設計素材吧？這個名為圣誕節插畫的服務同樣出自著名的 icons8 團隊，大把免費可商用的圣誕節插畫素材，具體的使用和 icons8 團隊的其他服務一樣，隨便用——但是你得標注個鏈接和出處，很簡單！

12、Nice illustrations

這個名為 Nice Illustrations 的插畫圖庫同樣是免費可商用的，雖然總體數量上不算多，但是素質過硬，并且按照主題進行了分類，來看看吧。

13、Bluurp! 插畫套件

這個名為 Bluurp！的插畫套件工具也是近年來比較流行的一種，插畫組件化，按需進行拼接組合使用，兼顧了美觀性、自由度和定制性，這套工具的風格主要是描邊插畫，填充色彩，風格看起來非常友好，泛用性也強。

14、Avataz 3D 頭像圖庫

這個名為 Avataz 的圖庫是一個 3D 的角色人物圖庫，值得一提的是，它確實是收費的，并且還不便宜，要49美元，但是！這個圖庫包含有 8000+ 的頭像可以說非常非常非常豐富了，而且還含有原始的 Blender 3D 的建模文件！對于需要的同學而言可以省很多麻煩！

來源：

https://blog.prototypr.io/

https://setproduct.com/blog/

http://www.producthunt.com/