第一波！2019年6月30款超實(shí)用設(shè)計(jì)工具合集

編者按：最新一期的設(shè)計(jì)圈干貨來了！這次的干貨是來自 prototypr.io 的整理。

對(duì)于設(shè)計(jì)師而言，這是一個(gè)越來越好的時(shí)代，每個(gè)月都會(huì)有大批的設(shè)計(jì)工具和輔助插件更新來幫助設(shè)計(jì)更好地完成設(shè)計(jì)工作，而這其中 Adobe XD、Marvel 和 Framer 這類原型工具相關(guān)的插件更新尤其頻繁，它們讓設(shè)計(jì)師更好地通過協(xié)作完成設(shè)計(jì)。這次更新的設(shè)計(jì)工具和插件總計(jì)有 31 款，希望它們能幫助你。

6款配色工具和圖標(biāo)合集

1. 彩色圓點(diǎn)字體 Color Dot Font

說真的，它并不是一個(gè)真正意義上的配色工具，它是一套字體──每一個(gè)西文字母都對(duì)應(yīng)為一個(gè)不同色彩的小圓點(diǎn)。你可以拿這套字體來作為占位符，更加清晰地看到布局的結(jié)構(gòu)。非常獨(dú)特的腦洞，也不失為一種獨(dú)創(chuàng)的設(shè)計(jì)元素吧？

2. 精選調(diào)色板 Colorinspire.io

為合適的項(xiàng)目尋找合適的配色總是一件令人糾結(jié)的事情，考慮到這一點(diǎn)，Ales Nesetril 創(chuàng)造了 Colorinspire 為你提供精選的配色方案，無論是直接使用，還是作為靈感，都會(huì)是不錯(cuò)的選擇。

3. 取色神器 Colordrop 2

你有沒有想過，你最喜歡的那張照片里的色彩所對(duì)應(yīng)的16進(jìn)制 HEX 值？不用想了，用 Colordrop 2，答案直接就告訴你。

4. 圖標(biāo)合集 Flight Icons

忘記靜態(tài)圖標(biāo)吧。如今的世界是動(dòng)態(tài)的，這也是為什么當(dāng)我們發(fā)現(xiàn) Flight Icons 的時(shí)候，我們就會(huì)把它納入到整個(gè)體系當(dāng)中，這個(gè)圖標(biāo)合集包含了日常常見的所有日常圖標(biāo)，非常有趣。

5. 動(dòng)畫圖標(biāo)庫 useAnimations

根據(jù)如今對(duì)于動(dòng)畫的趨勢，Patrik Svoboda 整合了一系列很酷的微動(dòng)畫圖標(biāo)庫，你可以在你的 APP 和網(wǎng)站上使用。

6. 免費(fèi)圖標(biāo)編輯器 Free Online Icon Editor

定制化設(shè)計(jì)也是一大趨勢。這款免費(fèi)的圖標(biāo)設(shè)計(jì)工具是來自 IconFinder，這個(gè)免費(fèi)的圖標(biāo)編輯器讓你可以輕松修改圖標(biāo)顏色，筆觸甚至形狀。

3套設(shè)計(jì)素材合集

1. Muzli 搜索

Muzli 可能是網(wǎng)絡(luò)上品質(zhì)最高的設(shè)計(jì)靈感平臺(tái)之一了，我們?cè)缭缇驼鄯谶@款工具，現(xiàn)在 Muzli 搜索讓你能夠更為精確地搜索并獲取靈感素材。

2. 素材庫 Undesign

無論你是開發(fā)者、設(shè)計(jì)師，這個(gè)素材庫都是非常值得收藏的。這套素材庫當(dāng)中涵蓋了各種不同的免費(fèi)工具和資源，幫你將自己的構(gòu)想變?yōu)楝F(xiàn)實(shí)。

3. 設(shè)計(jì)API Design API

這可能是搜集并使用設(shè)計(jì)元素的最有意思的一種方式，那就是將它以 API 的形式來使用。這個(gè)API 支持返回各種形式的內(nèi)容，包括 LOGO、色彩、字體等等幾乎所有類型的素材。

5款原型工具

1. Adobe XD 19.0

這可能是原型設(shè)計(jì)領(lǐng)域最不可忽略的力量，Adobe XD 19.0 作為最新的版本，明顯是最大程度地傾聽了用戶反饋之后，迭代出來的版本。新版中加重了設(shè)計(jì)組件的功能，以及設(shè)計(jì)師和開發(fā)人員之間的協(xié)同。

2. Framer Playground

截至目前，F(xiàn)ramer 在2019年更新的這個(gè)版本是變化最大的一版。Playground 提供了自己編寫組件的可能性，而且這種編寫幾乎是毫無限制的。Framer 內(nèi)置了新的代碼編輯器，Playground 還為 Framer 增加了其他的功能，包括完整的原型庫和相關(guān)的文檔。

3. Marvel 工具箱 Entreprise 3

Marvel Entreprise 3是對(duì) Marvel 原有工具組合的一次合理的補(bǔ)充。新版的 Entreprise 主要通過增強(qiáng)協(xié)作和組織來大規(guī)模地提升產(chǎn)品設(shè)計(jì)的效率和效果。

4. 矢量圖形編輯器 Amadine

這是一款全新的矢量圖形設(shè)計(jì)工具，具有直觀且足夠易用的 UI，對(duì)于視覺設(shè)計(jì)師和插畫師而言，是非常不錯(cuò)的工具。

5. 3D場景搭建工具 Spoke

如果你是火狐瀏覽器和相關(guān)產(chǎn)品的用戶，那么恭喜你了，這回有新東西可以玩了：3D 場景建模工具 Spoke，讓你可以直接在瀏覽器中構(gòu)建各種場景，非常有趣，也非常實(shí)用。

2款樣機(jī)工具

1. 視頻樣機(jī) Mokup Frames

視頻樣機(jī)在設(shè)計(jì)領(lǐng)域用得越來越多了，Mokup Frames 就是基于這一概念而設(shè)計(jì)的，設(shè)計(jì)師可以基于它來創(chuàng)建可以用在 Dribbble 等平臺(tái)的GIF視覺稿。

2. AppStore 樣機(jī)工具 Jaamly

Jaamly 是一款僅適用于 iOS 平臺(tái)的工具，它是用來幫你生成 AppStore 中展示用的屏幕截圖以及相關(guān)的圖標(biāo)的工具。

4款設(shè)計(jì)插件

1. Sketch 轉(zhuǎn)網(wǎng)頁插件

這款插件出自 Sparkle 之手，能夠幫你將 Sketch 中的設(shè)計(jì)稿自動(dòng)轉(zhuǎn)換成網(wǎng)頁。它能提供一套使用且易用的代碼設(shè)計(jì)解決方案，幫你省去大量的時(shí)間。

2. Sketch 入門設(shè)計(jì)套件

這是基于原子設(shè)計(jì)原則所制作的一套入門設(shè)計(jì)套件，它是新項(xiàng)目的完美起點(diǎn)，整套套件預(yù)先準(zhǔn)備了完整的指南和相應(yīng)的符號(hào)架構(gòu)，可以非常便捷地進(jìn)行定制。

3. remove.bg Sketch 插件

著名的去背景服務(wù) Remove.bg 為 Sketch 制作的插件，讓你可以不離開 Sketch 直接輕松地移除圖片中不需要的背景。

4. 數(shù)據(jù)填充器 Data Populator

可用于 Sketch 和 Adobe XD，Data Populator 能動(dòng)態(tài)的數(shù)據(jù)占位符，而不是傳統(tǒng)的亂數(shù)假文。

4款協(xié)作和文檔工具

1. 協(xié)作平臺(tái) Taskade 2.0

Taskade 是一款干凈、有趣且易用的協(xié)作平臺(tái)，如今在整個(gè)數(shù)字協(xié)作工具領(lǐng)域也有它自己的一席之地了。它可以在瀏覽器上使用，也可以作為桌面端和移動(dòng)端的工具來使用，這意味著你可以在任何你感到舒適的地方便捷地工作。

2. 項(xiàng)目管理協(xié)作工具 Nural

這是一款新興的協(xié)作工具，2019 年年初才誕生，它的重心是在高效的項(xiàng)目管理上，無論是組織項(xiàng)目，還是和團(tuán)隊(duì)進(jìn)行溝通，它都能夠輕松勝任，并且?guī)湍阍?Deadline 之前完成項(xiàng)目。

3. 筆記工具 Milanote iOS

這是一款簡單的 iOS 應(yīng)用，能幫你組織筆記和想法，并且將它轉(zhuǎn)換成可視化的內(nèi)容。

4. 文檔工具 DesignGapp

文檔是確保項(xiàng)目一致性的關(guān)鍵。DesignGapp 可以讓你輕松創(chuàng)建設(shè)計(jì)風(fēng)格指南，確保你和客戶協(xié)作和溝通更加便捷。

1款設(shè)計(jì)轉(zhuǎn)代碼工具

1. 設(shè)計(jì)&代碼編輯器 Frontnd

還在擔(dān)心你的設(shè)計(jì)脫離不開草稿本？你可以試著使用 Frontnd Builder 編輯器，只需托拽就能快速搭建設(shè)計(jì)，生成 Web應(yīng)用，進(jìn)行深入的編輯和管理，你甚至可以借助它的實(shí)時(shí)編碼功能來調(diào)整代碼，控制輸出的效果和細(xì)節(jié)。

5款分析和用戶反饋工具

1. 用戶反饋工具 Useberry?2.0

如果你嘗試過 Useberry，你會(huì)發(fā)現(xiàn)用戶測試從來都沒有這么便捷過！Useberry 讓你可以在原型階段就可以獲得用戶反饋，這樣就不必浪費(fèi)時(shí)間經(jīng)歷來創(chuàng)造用戶不需要的東西了。

2. 新用戶引導(dǎo)設(shè)計(jì)工具 Eyelet

幫助新用戶快速熟悉你的產(chǎn)品，提供完美的引導(dǎo)，是一件不容易的事情。Eyelet 就是為此應(yīng)運(yùn)而生的，它同樣會(huì)引導(dǎo)著你來使用它，而無需代碼編寫能力。

3. 用戶測試工具 One Click Test

借助 One Click Test 做用戶測試，你真的只需要點(diǎn)擊一下就可以了。添加你的用戶測試的鏈接，并描述你需要用戶完成的任務(wù)，接下來你就只需要坐下來觀察就行了。

4. 互動(dòng)內(nèi)容工具 involve.me

交互式的內(nèi)容是一種吸引用戶的方式，而 involve.me 就是為了這樣的內(nèi)容而生的，它可以幫你在不同的節(jié)點(diǎn)吸引用戶的注意力，以達(dá)成目標(biāo)。

5. 用戶反饋工具 Presto

幫你專注于用戶反饋的內(nèi)容，它能夠很好的幫你組織屏幕截圖和產(chǎn)品視頻，并且創(chuàng)建直觀的操作指南，并提高協(xié)助用戶的效率。