Prototypr.io 這周帶來了 23 款全新的設(shè)計(jì)工具！在疫情肆掠的這個(gè)階段，希望這些優(yōu)質(zhì)的工具能夠幫助大家更好、更冷靜地工作和生活。這次的工具合集當(dāng)中，新增了兩款頗為不錯(cuò)的圖庫工具，令人眼前一亮的還有超帥的調(diào)色工具 Parametric Color Mixer 和辛普森頭像 CSS …… 下面大家仔細(xì)看看吧，總會(huì)有幾款令你心儀的工具出現(xiàn)！

?? 圖標(biāo)和配色工具

1.?Glyphfinder→

這可能是最好的字符搜索工具。Glyphfinder 能夠幫你查找各種各樣的字符、表情乃至于相似的色彩。這個(gè)搜索引擎當(dāng)中收錄了超過3萬種以上的字符，你可以輕松找到它們。

2.?Flat Icons →

這個(gè)圖標(biāo)庫包含了2萬款不同風(fēng)格不同主題的圖標(biāo)，當(dāng)然這套圖標(biāo)庫中的素材包含付費(fèi)和免費(fèi)的部分。這些圖標(biāo)通常會(huì)提供 EPS、SVG、PDF、PNG 等常見格式。

3.?Parametric Color Mixer →

想像混音器一樣調(diào)節(jié)色彩嘛？這款工具滿足你的愿望！Parametric Color Mixer 是從音頻菌核去當(dāng)中獲取靈感，調(diào)節(jié)精度也頗為不錯(cuò)，最主要體驗(yàn)非常獨(dú)特，可以試試哦~

4.?CSS Color Gradient Generator →

這是一款最新的 CSS 漸變色背景工具。使用這款工具，你可以輕松調(diào)節(jié)色彩的亮度、深度和強(qiáng)度，并且根據(jù)需求進(jìn)行調(diào)整，調(diào)整方向，并且復(fù)制相應(yīng)的代碼，應(yīng)用到自己的設(shè)計(jì)當(dāng)中。

5.?Hex Palette?→

Hex Palette 是一款新的配色靈感來源，每日更新的成熟的配色方案，給你的設(shè)計(jì)注入截然不同的感受。當(dāng)然，除此之外你還可以創(chuàng)建自己的配色方案。

6.?Neon 2.0 →

Neon 2.0 是一款適用于 iOS 平臺的漸變配色生成工具，在 iPhone 或者 iPad 上，你可以截取任何圖像，然后將它變化為相應(yīng)的配色方案和漸變色。除此之外，新版本還包括了最大程度發(fā)揮其潛質(zhì)的色彩編輯和分析工具。

??? 插畫圖庫

1.?Control Illustrations →

這是一套包含 108 款不同免費(fèi)扁平插畫的插畫圖庫，其中包含兩種不同的樣式，免費(fèi)版的圖片素材為 PNG 格式圖片，如果你需要其他格式的素材，可以獲取他們的高級軟件包，其中包含針對 Sketch、Figma 以及 AI 格式的兼容，并且附帶 9 個(gè)動(dòng)畫。

2.?Minty 3.0 →

Minty 3.0 是插畫師展示和銷售自己作品的平臺，如果你是插畫師，那么可以來這里推廣作品，獲得收益。如果你正在尋找靈感，那么你可以來這里尋找不同樣式的插畫，進(jìn)行參考。

? UI 素材合集

1.?Doodle Patterns →

這是一組涂鴉合集，其中包含有 61 款不同類型的涂鴉圖案，格式為 SVG 和 AI，這些涂鴉原本都是由 Alexander Olsen 和 July Draw 手工完成，這套涂鴉素材包售價(jià)為 35美元，但是其中有 10 款是完全免費(fèi)的！

2.?thePenTool →

這是一個(gè)設(shè)計(jì)素材庫，thePenTool 可以為你提供相對比較完善的設(shè)計(jì)素材庫，從插畫到郵件模板，再到可視化的數(shù)據(jù)，各種內(nèi)容不一而足，這個(gè)網(wǎng)站提供免費(fèi)和收費(fèi)的素材，去看看，總會(huì)有你感興趣的。

3.?89elements →

這是一套包含 200 多個(gè)常見 UI 元素的庫，89elements 涵蓋了基本的元素和布局的內(nèi)容，讓你可以輕松開始新的設(shè)計(jì)。除此之外，這個(gè)資源庫的類別劃分還非常的清晰，并且是免費(fèi)的

4.?Tetrisly→

Tetrisly 是一個(gè)用來制作線框圖和設(shè)計(jì)系統(tǒng)的新手工具包，其中包含了 2500 個(gè)組件，你可以從中選擇你需要的，開始著手進(jìn)行設(shè)計(jì)。Tetrisly專門為 UI 和 UX 團(tuán)隊(duì)而設(shè)計(jì)，可以確保視覺的一致性和協(xié)作的無縫。

?? 原型制作

1.?Faux Code Generator →

這是一個(gè)生成類似代碼片段圖片插畫的工具，有趣的地方在于它雖然是「偽代碼」插畫，但是它可以是基于真實(shí)的代碼片段來生成。

2.?Fabula →

這是一個(gè)用來創(chuàng)建動(dòng)畫和測試動(dòng)畫的簡單應(yīng)用。Fabula 能夠幫你調(diào)整動(dòng)畫效果的參數(shù)，能夠分享相應(yīng)的 Swift 代碼片段，能夠?qū)崟r(shí)顯示測試結(jié)果。

?? 趣味工具

1.?The Simpsons in CSS →

現(xiàn)在連《辛普森一家》都已經(jīng)可以用 CSS 來呈現(xiàn)了！這個(gè)辛普森 CSS 代碼庫絕對好玩！

2.?No Code Challenges →

No Code Challenges 是一個(gè)鼓勵(lì)開發(fā)者不使用任何代碼來構(gòu)建項(xiàng)目的平臺，每周都會(huì)公布新的挑戰(zhàn)，從構(gòu)建產(chǎn)品到工具不一而足。如果你能力足夠強(qiáng)，是可以贏得 100 美元獎(jiǎng)金的！

3.?Unscreen→

Unscreen 是一個(gè)為 Gif 圖和視頻去除背景的工具，你現(xiàn)在不用制作綠幕一樣可以去除背景了！使用方法很簡單，上傳你的視頻，讓它幫你去除背景就行了~

?? 代碼工具

1.?Spinners React →

這是一個(gè)用于 React 的 SVG 和 CSS Spinner 組件，在 React.js 中，這組自定義組件足夠流暢，且易于使用，足夠輕量級，無需依賴關(guān)系，易于識別。

?? 其他設(shè)計(jì)資源

1.?Checklist →

你是否覺得你的團(tuán)隊(duì)和流程有問題？那么這個(gè)包含針對設(shè)計(jì)和開發(fā)者的清單能幫到你，其中包含你所需要的角色和對應(yīng)的流程，分別是什么，這樣能夠確切地知道你和你的產(chǎn)品下一步要做什么。

2.?Startup 911 →

Startup 911 是一個(gè)給創(chuàng)業(yè)團(tuán)隊(duì)的終極清單，其中包含了各種工具的特價(jià)、折扣的信息，這些工具涵蓋了營銷、分析、生產(chǎn)力等各種工具。這款工具能夠幫你省錢，并且發(fā)展好業(yè)務(wù)。

3.?Corebook?→

這是一本帶你走進(jìn)品牌設(shè)計(jì)的好書，它旨在幫助沒有開發(fā)資源的設(shè)計(jì)師和品牌經(jīng)理，幫他們來創(chuàng)建、維護(hù)和組織相關(guān)的數(shù)字資源，節(jié)省時(shí)間和金錢。Corebook 非常易于上手，包含品牌和UX 相關(guān)的知識，沒有無聊的大段文本，可以 HTML 導(dǎo)出，并且可以云同步。

?? 反饋和跟蹤工具

1.?MarkUp→

MarkUp 是一款能夠進(jìn)行反饋和協(xié)作的工具，可以直接在網(wǎng)站上進(jìn)行實(shí)時(shí)評論，添加 URL，邀請同事和其他團(tuán)隊(duì)成員在一個(gè)地方進(jìn)行集中反饋。這款工具能夠讓你的反饋過程更加清晰，更加有效地管理和編輯內(nèi)容。

2.?Figma Tracking →

這是由 Enzo 和 Ferruccio 所構(gòu)建的 Figma 跟蹤插件。它能夠幫你更加透明地跟進(jìn)項(xiàng)目，促進(jìn)部門之間的溝通，查看所需要跟進(jìn)的內(nèi)容，確保實(shí)施到位，并傳達(dá)給團(tuán)隊(duì)。

如果你正在尋找更多的設(shè)計(jì)工具和干貨素材，可以看看往期：

原文地址：《23 New Tools: ?? Color Mixer, ?? Spinners React and ?? Startup911》
原作者：Sofia