7月第1波設(shè)計(jì)干貨合集來了！這一次我所搜集的干貨合集當(dāng)中，有圖標(biāo)合集也有插畫合集，但是最值得一看的，是 icons8 出品的動(dòng)態(tài)圖標(biāo)和效果超贊的 SVG 素材編輯工具，還有將 Svg 格式的平面矢量文件升級(jí)為 3d 動(dòng)態(tài)內(nèi)容的服務(wù)。另外別忘了往期的干貨合集：

下面我們具體看看這一期的干貨：

60+ 有趣的免費(fèi)小插畫合集

https://prettyrandomillustrations.webflow.io/

這個(gè)插畫合集是設(shè)計(jì)師 Prem Pradeep 自己做 100 天設(shè)計(jì)挑戰(zhàn)過程中完成的插畫作品，其中內(nèi)容涉及到的主題非常寬泛，相當(dāng)隨機(jī)，這套插畫小合集可以免費(fèi)獲取，不過清晰度有限制，如果你其中有你特別需要的，可以下單購(gòu)買付費(fèi)的矢量版本。

免費(fèi)開源極簡(jiǎn)圖標(biāo)大合集

https://feathericons.com/

Feather 是一個(gè)風(fēng)格比較簡(jiǎn)約利落的開源圖標(biāo)合集，每個(gè)圖標(biāo)都在 24x24 的網(wǎng)格上，圖標(biāo)整體保持著高度的一致性和可讀性。你可以一次性把所有的圖標(biāo)都下載下來，也可以在臨時(shí)有需求的時(shí)候，直接在網(wǎng)站當(dāng)中根據(jù)主題 和關(guān)鍵詞來搜索合適的圖標(biāo)，修改尺寸和筆觸粗細(xì)，然后直接復(fù)制粘貼，非常方便。

icons8 出品的動(dòng)態(tài)圖標(biāo)

https://icons8.com/animated-icons/color

這是著名的圖標(biāo)和插畫素材供應(yīng)商 icons8 出品的圖標(biāo)服務(wù)，目前其中已經(jīng)囊括了 3700+ 動(dòng)畫圖標(biāo)，這些圖標(biāo)全部以基于 Lottie 的 Json 格式、Gif、AE三種格式而存在，便于你在不同的流程之下使用。另外，這里的動(dòng)態(tài)圖標(biāo)有 iOS 和 Material Design 樣式的，也有符合 Windows 系統(tǒng)風(fēng)格的，可以根據(jù)風(fēng)格選取。這里的圖標(biāo)并非完全免費(fèi)，有一部分是可以免費(fèi)下載使用的，另外一部分是付費(fèi)的。

高素質(zhì)免費(fèi) UIkit 下載

https://www.pixeltrue.com/free-ui-kits

這是著名的設(shè)計(jì)素材服務(wù)商 Pixelture Packs 出品的免費(fèi) UIkit 合集，這個(gè)合集當(dāng)中所提供的 UIKit 是完全免費(fèi)可商用的，無需署名，直接拿來修改應(yīng)用就行，對(duì)于做 UI 設(shè)計(jì)的同學(xué)而言，特別值得收藏一發(fā)。這些 UIKit 大多數(shù)都提供 Figma 和 Sketch 格式的文件，而且通常包含有幾十個(gè)界面和大量的常用組件，相當(dāng)好使。

絕美的免費(fèi) SVG 素材編輯平臺(tái)

https://heazy.studio/

這個(gè)名為 Heazy 的 SVG 編輯平臺(tái)能夠幫你生成視覺效果特別獨(dú)特和時(shí)髦的素材，你可以輕松地在 JavaScript 和 TypeScript 當(dāng)中調(diào)用矢量的 SVG 數(shù)據(jù)，還可以導(dǎo)出為 PNG，或者應(yīng)用到 React 組件上去。這個(gè)SVG 編輯平臺(tái)提供了很多預(yù)先設(shè)計(jì)好的 SVG 素材，你可以借助內(nèi)置的編輯器將他們改成你想要的樣子。

將 SVG 升級(jí)為動(dòng)態(tài) 3D 的高級(jí)工具

https://studio.morflax.com/shift

這個(gè)工具我是第一次注意到，它可以將你的 SVG 格式的2D矢量文件轉(zhuǎn)化為 3D 的動(dòng)畫，從這點(diǎn)來說，它是可以幫助很多現(xiàn)有的SVG 素材的基礎(chǔ)上進(jìn)一步提升，特別值得嘗試。這項(xiàng)服務(wù)完全版是收費(fèi)的，免費(fèi)服務(wù)是有限制的，感興趣的同學(xué)可以上手試試。

給UI設(shè)計(jì)師的UI控件占位符服務(wù)

https://www.uifiller.com/

當(dāng)我們需要用小圖標(biāo)的時(shí)候，可以直接在網(wǎng)站上搜索圖標(biāo)然后復(fù)制圖標(biāo)，粘貼到設(shè)計(jì)軟件當(dāng)中。現(xiàn)在終于有人更近一步了，直接將日常的 UI 控件的占位符直接設(shè)計(jì)好，選中你需要的占位符復(fù)制粘貼，也是一個(gè)提升設(shè)計(jì)效率的好辦法！所以做 UI 設(shè)計(jì)的同學(xué)可以試試看。

在 Figma 中直接使用交互式小組件

https://www.figma.com/community/widgets/figma_design

現(xiàn)在 Figma 當(dāng)中更新了新功能，F(xiàn)igma 官方和 Asana、Jira 等社區(qū)的開發(fā)者一同合作，將交互式小部件帶到了 figma 的插件系統(tǒng)當(dāng)中，這樣一來，進(jìn)化在進(jìn)行設(shè)計(jì)的時(shí)候就不止有靜態(tài)的元素了，還能使用直接可交互式的控件。