教學｜Figma怎麼用？要付費嗎？八大模組功能完整教學：如何用它做出美麗簡報與網站？

當遠距工作成為越來越多工作者的日常，設計與行銷團隊常面臨同樣的挑戰：如何在同一份設計檔案上及時協作、修改、回饋與產出成果？傳統設計軟體不僅有安裝、授權的繁瑣步驟，版本若有更新可能也會有不相容的問題，更無法實現多人同時協作。

Figma 的出現改變了這一切。不論是設計師、產品經理還是內容行銷人，只要打開瀏覽器，就能即時共編及協作，甚至直接演示設計成果。因此，本次《未來商務》將帶讀者從基礎入門開始，了解 Figma 的核心特色、免費版功能、費用方案與實際操作步驟。

Figma：可多人協作的雲端設計平台，打破部門界線

Figma 是一款基於雲端設計與原型製作的平台，涵蓋了從構思、設計到原型製作，到最終與開發者交接的完整流程。它與一般繪圖軟體最大的不同在於「共編與雲端化」的特性，透過瀏覽器即可使用，可支援團隊共同設計及即時協作。

此外，Figma 具有強大的協作環境，使用者可以將想法轉換成響應式、互動式的設計。使用者可以在一個設計檔案中建立多個頁面，每個頁面是一個獨立的畫布，可任意進行編輯。它的應用範圍廣泛，不只是界面設計，更涵蓋所有數位產品與視覺作品，舉凡：網站設計、手機 App、行銷與社群素材、互動原型設計…等。

Figma 方案比較：免費版、專業版、組織版、企業版差在哪？

方案 Free（免費版） Professional（專業版） Organization（組織版） Enterprise（企業版） 年繳價格 $0 $36-192美元；$60-240美元（月繳） $60-660美元＊無提供月繳方案 $60-1080美元＊無提供月繳方案 Collab seat - $36美元；$60美元（月繳） $60美元 $60美元 Dev seat - $144美元；$180美元（月繳） $300美元 $420美元 Full seat - $192美元；$240美元（月繳） $660美元 $1080美元 適合對象 個人 專業人士、小型團隊 中小型企業、需管理多個設計產品的企業 大型企業、為多種產品或品牌設計的企業 主要功能 • 除了 Dev Mode，其餘 7 個模組都可有限度使用
• 無限草稿
• UI 套件和範本
• 基本設計檔案檢查 • 無

席位（Seat）功能說明：

● Collab seat 可使用功能包括：FigJam 及 Figma Slides。

● Dev seat 可使用功能包括：FigJam、Figma Slides、Dev Mode、Figma 及 Buzz。

● Full seat 可使用功能包括：FigJam、Figma Slides、Dev Mode, Figma Draw、Figma Design、Figma Buzz、Figma Sites 及 Figma Make

Figma 八大模組功能及使用教學

Figma 的強大，來自於其多個模組的整合，讓整個產品生命週期的工作都能在同一平台完成：

1. FigJam：線上協作白板，加速創意發想

是一款線上協作白板工具，適合團隊進行腦力激盪、工作坊、流程圖、旅程圖與策略規劃。在同一畫布上，團隊可即時拖曳便利貼、畫圖、註記、投票。而在進入畫布後，使用者可在右側窗格中輸入中/英文提示詞，若無設計想法的話，也可點擊下方的「Start with a template（從模板開始）」，可從 Figma 提供的眾多模板中挑選符合自身使用需求的項目。

舉例來說，當輸入「我想要製作一個時程表」並點擊「Make（製作）」後，下圖即為 Figma 自動生成的模板。之後，便可根據自身需求做細微調整，除了內容可進行客製化的調整外，連方格大小、線段長度也可調整或增減，整體編輯的自由度相當高。

而在 Figma 提供的眾多模板中，也可參考預設的分類，根據活動類型（如會議、圖表、想法激盪）及使用者角色（如設計師、開發者、學生或教育者…等）去做挑選。有了內建版型的加持，整體而言，使用上非常流暢及方便，也大幅減少需手動拖拉設計的時間。

2. Figma Slides：協作簡報工具，設計稿一鍵納入

設計團隊與協作團隊可用來製作簡報的工具，甚至可直接將設計稿／原型納入簡報頁面，並支援共同創作與呈現。所有在投影片上的內容更動都會被即時更新，所有使用者都能同步查看，減少儲存、下載或來回傳遞文件的時間。

進入 Figma Slides 後，首先會跳出如下圖的視窗，可選擇從頭開始製作簡報，或從現有模板中選擇，模板中包含各式擁有專業設計的頁面。此外，使用者可以混合搭配不同範本的頁面版面配置，而不用拘泥於同一種風格的模板，適合對於頁面設計有一定追求的使用者。

選定好要編輯的模板後，同樣可針對內容進行客製化的編輯。選定好編輯標的後，可於右側的工作窗格中進行字級、字型、字距…等一系列的調整。

如需將簡報共享給其他人進行編輯，可於右上角點擊「Share」，調整權限設定（僅供檢視、可編輯）後，再點擊「Copy link」取得分享連結；也可直接輸入共同使用者的信箱。

當簡報內容完成後，可透過右上角的「 ▷（Present）」進行投影。或是也可將投影片依照下圖路徑，將其輸出成 PPTX 或是 PDF 檔。

3. Dev Mode：開發者模式，縮短設計到實作的鴻溝

此模組為針對「開發者」與「設計交接流程」所設計的模式。需為付費用戶才可使用

開發者可在這模式下檢視設計檔中標記為「Ready for Dev」的元件、取得尺寸、程式碼片段、版本變更歷史等，縮短從設計到程式碼實作的時間。

4. Figma Draw：專業插畫與視覺設計

著重於插畫與視覺設計的工具模式。提供更豐富向量繪圖、筆刷、紋理、文字沿路徑等功能，使設計師能在 Figma 平台內直接做插畫創作。

5. Figma Design：核心界面設計模組

這是 Figma 的核心設計模組，用於建立網站、手機 App 等數位產品的界面原型。使用者可在此模組中進行畫布設計、元件庫管理、互動原型等工作。

最中央是設計工作區，使用者可在此進行任何的編輯及設計；最左側窗格則可看到所有元素，並可調整元素的群組、顯示名稱及於圖層中的位置；最底部則是功能區，可執行拉出群組（frame）、畫圖形、使用畫筆、輸入文字…等功能；最右側是樣式調整區，可針對元素進行客製化的調整，包含字級、顏色、字體、圖片…等。

6. Figma Buzz：品牌與行銷素材的快速生產平台

主要針對行銷與品牌資產製作的平台。它支援品牌範本、社群貼圖、廣告素材、影片剪輯、AI 生成圖像等，讓非設計師也能快速生產品牌規範內的視覺作品。除了多款模板供選擇外，Figma 內建好發佈在不同社群管道中的宣傳素材尺寸，因此使用者可「一鍵任意切換」尺寸，毋須花費時間查找該管道的建議文宣尺寸。大幅省下素材製作的時間成本。

使用者也可設計整個團隊都可以使用的行銷模板，並設定哪些部分可編輯，哪些部分不可編輯，如此可確保所有內容都符合品牌要求。最後，當要輸出成品時，Figma 提供 JPG、PNG、PDF 的輸出選項，並可調整輸出成品的尺寸大小（Size）及色彩描述檔（Color profile，可使影像在不同設備間保持色彩一致性的文件）。

7. Figma Sites：設計即網站，一站式建站工具

一款從設計到製作、直接在 Figma 平台上輸出網站的工具。設計師可在同一平台設計、製作響應式網站並發布，不需切換到其他建站工具。當進入 Figma Sites 的模組後，首先使用者可以選擇從頭開始設計網頁，或是選用 Figma 現有的模板後再進行調整。

對於初用 Figma 的使用者，建議可直接選擇一款喜歡的模板開始，會大大降低試錯的時間。如選用系統提供的模板，內建有多個頁面，如首頁、計畫介紹頁、關於我們。而在每個介面中，Figma 也預先做好了在桌電、平板、手機三種不同介面上的響應式設計。令人驚喜的是，無論是圖片還是文字，只要在桌面板的介面上進行修改，Figma 便會自動同步修改到其他兩個介面。

延伸閱讀：Notion教學｜Notion是什麼？如何用它做筆記、管理專案？中文版設定、安裝方式一次看

8. Figma Make：AI 驅動，快速打造可執行原型

Figma 的 AI 驅動工具，使用者可從文字提示詞（prompt）或現有設計稿出發，快速生成可互動的原型或網頁／App 應用，甚至連接真實資料庫／API，快速打造可執行的原型，下圖即為供使用者輸入文字提示詞的頁面。舉例來說，可以輸入「我想要製作一個一頁式的《未來商務》品牌介紹網頁」。

輸入提示詞後，Figma 會依據使用者的需求去延伸出更多需要呈現在網頁的內容。而在左側的窗格中，點開「Reasoning」，可以看到 AI 工具協助補全的內容，包含：「用戶想要製作一個一頁式的《未來商務》品牌介紹網頁。這是一個繁體中文的請求。」、「我應該創建一個包含以下部分的頁面：主視覺和標題、關於/簡介、聯絡方式…等」。

等候約 5 分鐘的時間，Figma 製作的成品便會出現在右側的窗格中。實際操作後，該成品仍保留手動調整的空間，如字級、顏色、字體…等，但卻無法隨意拖動元素擺放的位置及文字內容。需藉由左下角的對話窗格輸入修改需求後，AI 才可協助使用者調整。

除了文字內容，也可將圖檔作為附件上傳，並請 AI 替換掉原本的文字，再者也可以請 AI 修改網頁的文字排版方式，如下圖即是輸入：「1. 請將左上方『未來商務』的文字替換成附件的圖檔。2. 『引領…脫穎而出。』的文字請改成置左排列。」後，AI 自動修改網頁的成果。

延伸閱讀：超好用！Perplexity Finance幫你解讀財報、追蹤美股，免費版就能開啟！完整教學一次看

誰適合用 Figma？

無論是初次接觸設計的行銷企劃，或想優化產品體驗的 PM，抑或是需要把想法視覺化的使用者，Figma 都是個能讓使用者「無痛參與設計流程」的工具，從而大幅提升跨部門溝通效率。此外，內建多種專業且具設計感的可編輯模板，其 Figma Make 也具有 AI 功能，可以讓使用者用對話的方式來完成自己獨一無二的設計，因此入門門檻很低。

若你正想嘗試用 AI 或新工具來提升工作效率，不妨試試 Figma，整體使用感受相當流暢且好上手，絕對會讓你大吃一驚。

本文授權轉載自《FC未來商務》

延伸閱讀：免費線上伴讀神器！Gemini Live可以「共享螢幕＋中英文語音互動」，4步驟完整教學

延伸閱讀

出國打包行李最怕踩雷！行動電源、藍牙耳機、藥品… 怎麼帶？手提、託運行李規定一次看
Google地圖導入Gemini！對話式導航、地標取代距離指路：不用再腦補多少公尺後轉彎
「加入《數位時代》LINE好友，科技新聞不漏接」