Gemini 推出了很方便的文字修圖功能,讓使用者能夠通過簡單的文字描述就能實現圖片的快速編輯。本篇將詳細介紹如何在 Figma 設計環境中直接整合這項功能,讓設計師能夠更高效地完成工作。

Gemini文字修圖功能概述

Gemini 的文字修圖功能允許使用者通過文字指令來編輯圖像,一些應用方式例如:

  • 更換圖像的色系
  • 修改人物服裝顏色
  • 增加人物配件
  • 調整圖像元素
  • 把 LOGO 變成 3D 風格

這項功能目前可以在 Google AI Studio 上免費體驗,但對於設計師而言,能夠直接在設計工具中使用會更加方便,所以來跟大家分享如何在 Figma 中使用。

在Figma中使用Gemini功能

第一步:獲取Gemini API密鑰

要使用插件連接 Gemini 服務,您需要取得自己的 API 密鑰:

1.訪問 Google AI Studio 官方網站


2.登錄您的 Google 帳戶

3.點選右上「Get API Key」按鈕


4.點擊「Create API Key」按鈕

5.選擇「Project name」

6.下方有生成 API,就可以複製 API 密鑰使用

注意:請妥善保管您的 API 密鑰,不要分享給他人,另外 API 是有費用的,詳細可以參考此連結說明。
官方說明:https://ai.google.dev/gemini-api/docs/pricing?hl=zh-tw

第二步:安裝 Figma Plugin 中並配置 API

目前 Figma 平台上有找到二款 Plugin 支援 Gemini AI 的整合。這邊我二款都有用,主要是因為二款偶爾使用上會有錯誤跟失敗,一款不能用另一款可能就可以。

這款 Plugin 能夠讓我們在 Figma 的工作環境中直接調用 Gemini 的文字修圖功能,無需在多個平台間切換。

請依照以下方式就能順利使用 Plugin

1.在 Figma 開啟 Plugin

2.搜尋 Plugin,找到名稱「Evoker」、「Gemini 圖像助手」的 Plugin

二款主要差異在於 Evoker 多了直接生成圖片功能,有需要生成的人更有幫助,而 Gemini 圖像助手則是支援多張圖像合成。

3.點擊 Run 可以執行打開 Plugin

4.貼上您剛剛獲取的 Gemini API 密鑰,保存設置就能開使用了

Evoker 設置

點選編號 1 的設置 Icon 圖案開啟設置,編號 2 的位置就貼上第一步獲得的 Gemini API,然後按下保存設置就能使用了。

Gemini 圖像助手設置

點擊齒輪後進去就有欄位能貼上 API。

第三步:使用文字修圖功能

1.在 Figma 中選擇您想要編輯的圖像

2.啟動 Plugin

3.在 Plugin 界面中輸入您的編輯指令,按下編輯圖片或發送就能生成了

例如:

  • 「把這張圖變成藍色系」

實際應用案例

通過 Figma 與 Gemini 的結合,設計師可以快速實現以下工作:

  • 更換場景中物件 (Prompt:把圖片上的鬧鐘更換成馬克杯)
  • 調整人物形象的服裝和配飾 (Prompt:給人物添加一頂帽子)
  • 調整畫面元素色彩 (Prompt:把圖片上的絲巾顏色換成橘色)

補充資訊:透過 Figma 的「Edit image」選擇模型

除了上述步驟的教學外,也可以在 Figma 中,找到 Actions 後,搜尋「Edit image」,此時就可以選擇自己喜歡的模型來做編輯操作!(*註:不過目前要是付費帳號才能使用相關 AI 功能。)


在 Figma 中直接使用 Gemini 的文字修圖功能,為設計師提供了前所未有的便捷體驗。通過簡單的文字指令,我們可以快速實現圖像編輯,提高工作效率。

希望這篇教學能幫助你順利在 Figma 中使用 Gemini 功能。