FIgma介紹及好用插件分享，一個不容錯過的好工具

11個月前

Figma是一個多功能的應用程式，也是一個強大的網頁工具

不僅能離線作業也能線上同步工作，強調使用者介面與用戶體驗設計

有人會用XD排版，有人會用PS製圖，那這個可以裝載插件的工具，是一個你不容錯過的好軟體喔！

Figma - Download

1. Figma的起源
2. Figma介紹
3. Figma的優勢
4. Figma好用的插件介紹

Figma的起源

Figma也許你不陌生，也許你從沒聽過，但如果只有耳聞卻還沒接觸的你，希望藉由這邊文章讓你更認識Figma

Figma的竄起在網頁設計產業中引起風潮，設計網頁的工具這麼多，為什麼唯獨Figma可以在2020年使用率突破66%，甚至用途不止於在網頁設計的範疇上?

相信大家都有耳聞Adobe豪擲200億收購Figma，但你們知道嗎?Figma之所以被開發出來是為了挑戰Adobe Photoshop及Adobe Fireworks的難用困境，Dylan Field及聯合創辦人Evan Wallace由Google Docs的線上團隊執行作為靈感，主要開發目的有兩點：

1. 打造共享設計環境
2. 在瀏覽器上輕量化設計的工具

因此他們打造決定用Web GL在瀏覽器中建立一個雲端設計工具，Figma就此誕生…

Figma介紹

由於創辦初期是完全免費使用的，後為將使用者擴大市場而有其他的企業收費標準，可以針對團隊使用的目的及方便性選擇升級的版本

Figma目前使用分為兩種使用版本，一種是桌面應用版，一種是網頁瀏覽器端

其實用戶介面很簡單，也非常好上手，因為Dylan Field為了減少在設計工具上的學習曲線，也減少設計苦手的挫折感，讓使用者在製作的時候可以輕易地操作介面，並且可以快速產生想要的內容

除了網頁UI/UX設計、動畫、UML、框架圖、流程圖你想應用的範圍都可以透過自己的創作或者內部的元件，甚至是其他人分享的範本或設計主題去做應用

最吸引人的特點，Figma還有強大的插件，就像VScode一樣，透過插件工作可以讓你的設計時間減少、提升效率，也可以讓作品達到更好的效果！

Figma的優勢

1. 及時協同開發

Figma在分享檔案連結給你的夥伴之後，可以像Google Doc一樣看到其他夥伴的滑鼠游標，就像大家在同一時間在一個畫布上共同畫作一樣，非常適合及時討論及團隊共同編修作品內容
2. 線上修改展示

在Figma的共享優勢下，設計人員、專案管理以及客戶都可以在同一個畫面進行交流，提供互動良好的介面以及備註功能，減少轉檔編寫文件的時間，在專案的運行下可以更有效率
3. 雲端自動儲存

設計最怕就是檔案沒儲存就頁面罷工，但是有自動儲存就不會再有這種問題，不用擔心忘記儲存、突然斷線，工作也變得好安心！
4. CSS檢索工具

現在Photoshop 也可以將CSS轉出了，但Figma可以輕易點擊就能看到編譯的CSS樣式內容，這樣的工具難道你捨得錯過嗎?
5. 主題顏色管理

每個網站或設計都有主題顏色、也會有顏色配比，透過顏色管理可以快速地控制這些顏色項目，再某些需要快速轉換顏色的時刻，就不需要土法煉鋼一個一個去修正了
6. 組件複用屬性

把可複用的項目設計成組件，這些組件會共通屬性，在專案的設計中，重複的樣式風格一定會有，透過組件設定可以一次修改所有複用的項目