序言

咦，同樣是用Figma，為什么同桌小花早早下班，隔壁二狗歲月靜好，而你卻在Figma中焦頭爛額？設計提速的秘訣就在于Figma中功能各異的插件。但當打開Figma插件庫，海量插件讓人頭暈眼花，究竟哪一款才是最適合你的呢？為此QQ設計師在日常工作中反復實驗，終于找到了這些寶藏插件，讓UI設計領域的你成為高效的設計師。

1、Skale-縮放能力增強工具

很多設計師在從Sketch轉換使用Figma的時候，找不到對應Sketch里的縮放功能。此時你就需要Skale，這是一款熱門好用的縮放插件，可以設置元素縮放中心，縮放比例或者縮放到特定的寬度、高度（包括該對象的所有屬性也會隨之縮放）。

下載地址：https://www.figma.com/community/plugin/808289809557716614/skale

2、To Path-路徑上創建圖形和文字

經常做平面的設計師會遇到的一個問題，Figma內要如何在創建曲線的文字呢？你不妨可以使用To Path插件，它的功能是可以按照指定的路徑來變換圖形和文字。

下載地址：https://www.figma.com/community/plugin/751576264585242935/To-Path

3、Morph-快速創建特殊效果

Morph可以在Figma內快速創建一些特殊視覺效果，如浮雕，霓虹燈，抖音故障效果，倒影，玻璃等。可以幫助設計師快速進行一些風格化的嘗試和探索。

下載地址：https://www.figma.com/community/plugin/906950256777348534/Morph

4、Mesh Gradient-網格漸變工具

當我們需要多種顏色混合漸變的效果時，Mesh Gradient的作用是可以在Figma內以網格的形式編輯漸變，你可以編輯、拖動、填充這些網格點，做出極光的效果。

下載地址：https://www.figma.com/community/plugin/958202093377483021/Mesh-Gradient

5、Webgradients-配色靈感工具

做設計非常常用的一個方法就是多去嘗試，當我們在做某個界面的時候不知道配色該如何處理的時候，可以使用Webgradients插件內置的多種高級配色，或許你的靈感就此誕生。

下載地址：https://www.figma.com/community/plugin/802147585857776440/Webgradients

6、Auto Layout Styles-自動布局管理

相比Sketch，Figma在Auto layou方面極大的提升了設計靈活度。而Auto Layout Styles插件可以很好的管理或者單獨對某幾個元素配置Auto Layout，設計師可以在插件內設置好布局關系并進行命名，然后應用到設計中。還可以對已經設置好的布局樣式進行修改，Auto Layout Styles會同步到所有調用過這個布局樣式的元素中。

下載地址：https://www.figma.com/community/plugin/939173063111899081/Auto-Layout-Styles

7、Batch Styler-批量修改文本和顏色樣式

大家在工作中經常會需要去修改大量樣式，這時候你就可以使用Batch Styler插件，它的主要提效點在于可以批量修改顏色屬性樣式，批量更改排版樣式，批量刪除、重命名樣式。

下載地址：https://www.figma.com/community/plugin/818203235789864127/Batch-Styler

8、Styler-快速創建樣式

當需要批量創建樣式的時候，手動逐個去創建并不是有效的做法，而Styler插件可以快速批量創建樣式（包括文本，顏色，效果等），它可以基于圖層屬性批量創建、修改或更新樣式，當設計師在搭建組件庫樣式的時候，Styler可以大大提高工作效率。

下載地址：https://www.figma.com/community/plugin/820660579767995949/Styler

9、Design System Organizer-管理設計系統

設計師在Figma內搭建組件庫時，Design System Organizer插件可以更方便設計師創建，管理和修改組件庫。超級提效實用的功能包含：1.像文件管理器一般管理組件內容。2.項目在類別樹之間拖拽移動。3.文件之前批量轉移樣式。4.批量重新鏈接實例和樣式。

下載地址：https://www.figma.com/community/plugin/802579985985331070/Design-System-Organizer

10、Breakpoints-響應式斷點插件

在Figma內，當需要展示界面因為拉伸拖拽而發生響應變化的效果時，使用口頭描述和各種靜態界面標注并不是最優解，使用Breakpoints插件，可以做一些響應式動態布局的效果，并共享動畫原型。即使團隊其他設計師沒有安裝這個插件，也可以在拉伸界面時預覽到動態布局。

下載地址：https://www.figma.com/community/plugin/824289601590456356/Breakpoints

11、Themer-UI界面主題管理

同時設計深色模式和淺色模式的視覺稿會耗費設計師不必要的精力，Themer的主要功能包括一鍵切換樣式，主題管理，團隊共享主題。能夠從團隊庫中的已發布的組件創建和交換主題。將其作用于顏色、文本和效果樣式的替換。設計師使用Themer可以一鍵切換成深色模式和淺色模式的設計稿，避免無效的適配模式工作。

下載地址：https://www.figma.com/community/plugin/731176732337510831/Themer 

12、Motion-關鍵幀動畫

當需要在做界面的動畫時，很多設計師會問，Figma要如何導入AE？其實未必要導入AE才能做動畫。Motion插件的作用是可以直接在Figma內完成關鍵幀動畫設計，將大部分圖層屬性創建成關鍵幀動畫，避免設計師做動畫時需要不停切換設計工具，在Figma內就可以輕松愉快的完成靜態和動態的設計稿。

下載地址：https://www.figma.com/community/plugin/889777319208467032/Motion

13、LottieFiles-導入和瀏覽Lottie資源

在Figma內使用LottieFiles可以將自己的dotLottie（.lottie）和Lottie JSON（.json）文件導入Figma作為gif動畫或高質量的svg圖層，且可以訪問和預覽免費Lottie動畫庫內的資源，意味著有時候設計師甚至不需要使用其他設計軟件來配合展示UI動畫。

下載地址：https://www.figma.com/community/plugin/809860933081065308/LottieFiles

結語

設計工具與設計師是相輔相成的。所有的設計工具本身都有局限，但合理利用插件可以放大工具的價值，為設計提效，讓設計師有更多的時間去思考設計方案本身。

你在設計中是否也遇到過一些寶藏插件呢？歡迎在評論區分享給我們，大家一起做最高效的設計師~

Tips：

配合上期“工具趨勢”閱讀，收獲更多噢~

設計效率工具趨勢 ｜ 綜述篇

原文地址：騰訊ISUX

作者：ISUX設計

轉載請注明：學UI網》設計提效-Figma插件篇

藍藍設計建立了UI設計分享群，每天會分享國內外的一些優秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。

藍藍設計( www.0391cbd.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、

UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司