內容目錄
之前 apo design 有分享過一篇 『幾個 Figma 實用的 Plugin 分享』這次要來分享第二篇！
最近 Figma 從 5 月 Config 開始，優化和新增了許多功能、 6 月甚至推出 Widgets 讓使用者在 Figma 上方的工具列就能夠選到 Component, Plugins , Widgets ！
看起來會有越來越多有趣的 Plugins 和 Widgets 被開發！
而在眾多的 Plugins 中，筆者這次分享的是近期較常使用的。
比較著重在檔案整理、建立 Design System 或是要製作大量設計稿時會使用的工具。
如果你也正在進行類似的工作，希望以下介紹的 Plugins 可以幫助到你～！
選取小幫手！ Similayer & A Selector
當圖層越來越多、頁面內容越來越多時，有時困擾哪些部分使用了統一的樣式、又有哪些內容是沒選到的漏網之魚(ex.圓角、顏色、線條樣式等），此時可以用 Similayer 或 A Selector 選擇相同的樣式，然後一次修改！
Similayer
Similayer 選取方式：
A Selector
A Selector 選取的方式：
Replace 好方法！ – Paste to replace
當我在設計介面，前期還未決定 Component 樣式時，會有一段視覺測試的階段，此時可能會試排版、試顏色、試字體等，會排好幾個版之後決定其中一個樣式後建立 Component ，接著會將舊的 Component 或是正式版的設計替換成新設計，此時就能先複製新樣式，然後逐一使用 Paste to replace 替換內容。
這部分適用改動幅度較小、或是如果有預留 WIP 或 Pending 的區域。像是 Model 外框確定但內容排版尚未訂定時，此時預留空白一塊灰色區塊或是突兀的顏色來提醒自己更新內容時一併替換。
Sort Layers
如果你有圖層與畫面的控制欲或是希望交付一個從圖層命名就能找到設計稿的畫布位置時，就能夠使用 Sort Layers！
想像當你在一個 page 內放入 10 張左右的畫布表示一個流程順序(ex. 由左至右表示步驟由 1 ~ 4 等)，當工程師或接收到的設計師可以透過圖層順序對應到畫布排列。 例如以下示範：
GRAMMAR
接著分享的是 Spelling , Grammar 檢查工具。他可以選擇其中一個 Frame 或 Page 檢查。
檢查後也能在建議修改的文字上選擇跳到那個 Layer 去確認是否要修改。
此一個 Plugin 是要收費的，有提供 5 天試用。
另外一個類似的工具 SPELLL 我也有用過，但我單純只是因為 GRAMMAR 可以一次看多個內容，同時可以跳到那個元件。
如果你也有推薦的類似工具，也歡迎分享給我！
A11y – Color Contrast Checker
在做介面設計或 Design System 時，需要確認字體與底色對比度、大小等，以便適用於視障或更多身份者。
而這個 Plugin 可以同時選取多個圖層確認；在未通過的選項也可以調整文字或底色的亮度。
關於無障礙網站的介紹歡迎查閱： 漫談無障礙網頁設計 系列文章
我通常會設計多種樣式、嘗試不同的淺深底色，接著再一次選取後確認：
了以上的 Plugins 外，還有更多實用的工具像是插入 Icon 神器 – Iconify 、畫流程圖的工具 – Autoflow、快速插入使用者頭像素材圖的 User Profile 等等這些工具也推薦讀者裝來玩玩看！
如果有其他有趣的 Plugins 下次也可以一併分享。🤓
