Figma Plugin 插件平臺正式發布!

2022-01-29 DEX Group

Figma 期待已久的插件系統，昨夜終於正式上線了！其實我們早就拿到了邀請，已經內測了快兩個月了。Figma 的插件相比 Sketch 的插件更加友好，完全基於 web 技術，如果你會 JavaScript 和 HTML 也可以輕鬆的編寫插件，當然還支持 React，Vue，TypeScript 等幾乎所有最流行的框架和語言，並且它的 API 和使用條件並沒有太多限制，甚至可以利用 three.js 製作 3D 相關的插件。

另外對於企業級（Figma Organization）的付費用戶，還可以製作針對公司內部，不對外開放的私有插件。

插件平臺：https://www.figma.com/c

官方文檔：http://figma.com/plugin-docs

插件實例：https://github.com/figma/plugin-samples

Figma UI Kit：https://www.figma.com/file/Gj9iMcTbFbHrFq1ZWbDBuyc9/UI2-— Public-Copy?node-id=0%3A11724

目前官方平臺已經發布了 50 個左右的插件，相信今天正式發布後，還有一大波插件正在路上。下面列舉一些非常值得安裝的插件：

Figma Walker

Figma 版的快速啟動器，相當於 Sketch Runner，不過功能暫時還沒有那麼強大。

Content Reel

微軟開發的一款自動填充數據的插件。有了它，終於可以像 Sketch 那樣通過插件快速填充頭像、文字、圖標等信息了。

Super Tidy

整理 frame 畫板的插件，應該也是 Sketch 的移植版。

Similayer

Sketch 著名插件 Paddy 的作者 David Williames 開發的一款效率插件，它把官方默認的智能選擇圖層的功能擴展地更加強大了。

Figmotion

這個插件有點厲害，直接在 Figma 裡面添加了一個時間軸界面，可以通過它製作一些簡單的動效交互了。

Interplay

Interplay 這個插件是一個設計系統組件資源庫，包含了很多流行的開源框架的組件，可以把前端寫的代碼組件轉化成設計組件，即拖即用。不過因為是代碼層面的組件，所以如下面那張圖，比如我把 Ant Design 的組件拖到畫布中，設計上看起來是一樣的，但圖層組已經炸了……不過還好，對設計來說並不影響使用。

Mapsicle& Map Maker

地圖類插件目前已經有兩個了，Mapsicle 支持 Mapbox，Map Maker 支持 Mapbox 和 Google Maps，都可以選擇不同的主題，調整角度等等。

Stark

顏色對比度檢查。選中圖層打開插件，就會看到你的設計顏色對比度是否達標。

Unsplash

任何平臺都少不了它，一鍵插入 Unsplash 攝影平臺的圖片。

Themer

這個插件就比較高端了，你可以通過在 Figma 裡面定義兩套樣式，然後通過在線 json 平臺如 jsbin 作為中轉站（需要拿到 API key），從而實現一鍵切換設計文件的整體樣式。

其他值得一看的插件AutoflowBrandfetch輸入網址，快速獲得相應 logo。不知道是不是通過抓取 favico，如果是的話很多網站其實都沒有。Image Palette

創意編程領域的頂級大神 Matt DesLauriers 開發的插件，快速獲取任意圖片的配色。他還開發了很多更有創意的插件，就不一一列舉了，請自行探索。

Chart

Sketch 圖表插件的 Figma 移植版，可以導入隨機數據，同時也支持 JSON 數據。

QR Code Generator

同樣來自 Paddy 作者的插件，快速為你的 Figma 設計文件生成二維碼。這傢伙太高產了，目前平臺上已經有 6 個插件都是他開發的。

Rename It

批量重命名圖層，可以設定規則智能命名，還支持查找替換。

kaleidocode

微軟的另一個插件：可以把你在 Figma 裡面定義的顏色樣式直接導出生成 VS Code theme 主題！

Roto

基於 three.js 技術的插件，可以在 Figma 中實時生成 3D 模型，支持手動拖拽調整角度和深度。

Android Resources Export

我們之前的嘉賓，Sketch 知名插件作者阿爽老師開發的插件，用來導出安卓設計資源。

下周末我們聯合職人社，將在上海舉辦一場 Figma Meetup 線下交流會。如果你對這個未來必然會成為主流設計工具感興趣的話，歡迎報名參加。另外我們還準備了由官方提供的體恤和貼紙。

前不久我們在北京 Airbnb 舉辦了一場 Figma Meetup，場面十分火爆，由於場地限制，報名的 140 人我們只能忍痛篩選出 90 人通過，在此對那些沒能到現場的朋友說句抱歉！很快我們還會在北京舉辦其他設計相關活動，到時會找更大的場地，請留意我們的活動信息。🙏

關注我們的公眾號，後臺回復 figma北京 獲取上次活動的 PPT 文件。

本文作者：丁一

轉載請點擊原文向作者獲取授權，並註明作者、出處和連結。

更多精彩文章

好看就點下在看唄👇👇👇

相關焦點

  • 2020年,這18款超給力的Figma插件一定要試試
    但是，Figma有一個很大的缺點，那就是從其他平臺「遷移」的用戶會覺得它有一個問題，那就是- 缺少插件。許多Figma用戶不得不使用第三方應用程式，這顯然不是很方便。Figma的員工說，他們兩年前就有過使用插件的想法，而且一直以來，他們一直在忙於完善API，以確保系統內部插件的平穩運行。使用插件的優點插件提供了簡單直觀的方法來增強Figma的功能。它們幫助優化和自動化例行和重複性任務-使用圖層名稱，搜索，分組，添加特殊功能（例如向模型添加有用的內容）。目
  • 以下35個Figma插件輕鬆讓你提升工作效率
    插件地址：https://www.figma.com/community/plugin/742764242781786818/Wireframe    插件地址：https://www.figma.com/community/plugin/733902567457592893/Autoflow   2.
  • 6個可以大幅節省你時間的Figma插件(更新版)
    下載地址：https://www.figma.com/community/plugin/731271836271143349/Rename-ItStyler這個插件可以將設計稿中的樣式一鍵生成並總結出來，如果你需要做設計規範，那麼Styler這個插件可以給你帶來不少幫助。
  • Figma讓設計變得更輕鬆
    我的快捷鍵/插件還能用嗎？某某功能怎麼用呢？等等等....其實Figma對比Sketch在操作上沒有特別大的差異，可能有一些功能軟體本身不像Sketch那麼齊全，但基本通過插件都能很好的解決，作為推動者，在過程中多些耐心幫助同事解決問題就好。
  • Figma 常見問題與基礎操作
    如果沒有付費，只支持調用當前文件內組件；如果買了專業版或組織版，需要點擊左側 Assets 面板頂部的小書圖標將組件發布出來，才可以在其他文件調用。[29]Figma 有哪些好用的插件？官方的插件列表[30]可以看一下，此外也可以看一下這個用戶整理的一份插件列表[31]。不過 Figma 不安裝插件已經很強大了，如無必要不用安裝一堆插件。Figma 與 Sketch 相比有哪些優勢？
  • Figma插件推薦(21.12)
    「 簡單推薦幾個figma插件。」
  • Figma UI完全教程 04 - Figma的10個插件
    Figma UI完全教程 04 - Figma的10個插件應很多同學要求，我準備為大家補一下
  • Figma UI完全教程 06 - Figma的另5個插件
    Figma UI完全教程 06 - Figma的另5個插件應很多同學要求，我準備為大家補一下
  • Figma 社區遊玩指南
    社區簡介Figma 社區從去年十月份開始內測[2]，簡單來說，就是設計師可以將自己的 Figma 文件直接發布到社區，發布的源文件採用 CC BY 4.0[3] 協議，其他設計師可以基於此自由創作，甚至商業使用，只要你對作品按照作者要求的方式進行署名。它有點像 Dribbble[4] 這種展示設計作品的網站，不同之處在於你每次發布的是設計的源文件。
  • 小白的Figma入門手冊
    Figma的一大亮點就是基於WEB平臺開發，以支撐其在所有硬體產品，所有場景下使用。然後在Rasmus Andersson的推動下，他們最終仍然開發了客戶端版本，最終結果也是使用客戶端版本的用戶確實高於WEB端用戶。
  • Figma UI完全教程 15-在Figma中的UI尺寸
    figma是一個基於web端的在線設計平臺；個人版完全免費 。Figma是2020年國外很熱門的一款界面設計軟體，號稱UI軟體裡的法拉利。它可以在網頁端直接打開Figma.com直接做圖，也可以在Windows和MacOS平臺下載桌面端。同時也有Mirror可以在手機上觀看效果，簡直就是PS+Sketch+XD的怪獸，並且還是基於瀏覽器的！
  • 讓Figma變成交互原型神器!ProtoPie這個插件官方都推薦過!
    那一定試試ProtoPie的Figma插件      我發現ProtoPie的契機很偶然，月初Figma推特帳號上介紹了一款交互原型工具插件叫ProtoPie。看英文大致意思是說使用這款插件可以直接將Figma的素材導入至ProtoPie，還能做出高保真的原型。既然是Figma強力推薦的，那我肯定要試試。... ...
  • 【BIM平臺】增加AutoCAD插件!RevitBus正式更名為Plugin'Plug!
    來源丨 畢馬科技投稿發布丨 EaBIM_工號07
  • ​Figma教程匯總
    Figma常用工具快速上手(二)Figma組件和自動布局的應用(三)Figma Variants組件集/變體組件(四)什麼是 FigmaFigma 是一個基於瀏覽器的協作式 UI 設計工具，Figma 從推出至今越來越受到 UI 設計師的青睞，如今也有很多的設計團隊投入了Figma 的懷抱。
  • 實現TensorRT自定義插件(plugin)自由!
    未來不知道會不會出來新的API，不過這也不是咱要考慮的問題，因為TensorRT的後兼容性做的很好，根本不用擔心你寫的舊版本插件在新版本上無法運行。目前的plugin-API：tensorrt-plugin官方提供的插件已經相當多，而且TensorRT開源了plugin部分(可以讓我們白嫖！)。並且可以看到其源碼，通過模仿源碼來學習plugin是如何寫的。
  • Reverb Plugin 插件 免費下載
    Reverb Plugin 插件 免費下載  你想要掛 Reverb 嗎？
  • Flutter Plugin開發流程
    很多平臺相關性或者對於Flutter實現起來比較複雜的部分，都可以封裝成Plugin。其原理如下發布當插件開發完畢，可以將插件發布讓其他人使用，在發布之前，確保pubspec.yaml,、README.md以及CHANGELOG.md文件的內容都正確填寫完畢。可以通過dry-run命令來看準備是否就緒。flutter packages pub publish —dry-run檢查無誤後，可以執行下面的命令，發布到Pub上。
  • Figma - 面向未來的設計工具
    在國內的熱度雖然還沒有這麼高，不過Figma正在逐漸搶佔 Sketch 的用戶，比如最近很火的閱文，其體驗設計部YUX已將海外項目webnovel全部遷移至figma。這時候figma給windows帶來了媲美，甚至超過sketch之於mac的體驗。基於web這個基本特質決定了figma非常容易適配全平臺，只要你的設備有瀏覽器，聯了網，就隨時隨地可以快樂地進行設計。不管是macOS、windows、Linux，甚至最近連 iPad 都可以了！
  • 厲害了,AK大神最新AE插件Videocopilot ORB After Effects plugin三維行星插件預告
    Effects plugin三維行星插件預告Video Copilot即將發布一個新的AE插件，稱為Orb。它最初只是一個簡單的CC Sphere插件（CC球體）的替代品，但現在已經成為一個完整的3D行星產生器，包括基於物理的著色器，大氣功能，定製的地形凹凸貼圖，環境反射，自動陰影照明，GPU加速等等。Orb插件將於下周免費發布，並附帶從頭開始使用與Element 3D相似的方法來製作3D行星教程。當然不用說，Orb插件的功能肯定比這裡演示的還要多。
  • 乾貨 | Figma詳細的學習資源都在這了
    我們先來了解一下它：Figma是一款基於Web的設計工具，它能將項目時刻保存在雲端並且支持全平臺使用，這樣一來就可以保證產品，設計，交互，開發對設計進行實時參與或討論。這個公司是由23歲的Dylan Field創辦於2012年，總部位於舊金山。