Communitygithub.com

Figma 草稿整理器

自動整理 Figma 團隊中所有草稿檔案:藉由檢查檔案實際內容(而非舊名稱)給予描述性英文名稱,並將其移至相符的編號分類專案中。使用 Figma 內部 API(無需滑鼠自動化)。

Figma 草稿整理器 是什麼?

這個技能提供了一個完全自動化的流程,用來清空 Figma 團隊的草稿資料夾。它透過 Figma 的內部 API(而非滑鼠操作)將所有草稿檔案分類、重新命名,並移至對應的編號分類專案中。核心原則是「檔案內容才是真理」,因此它會讀取每個設計檔案中的實際文字,再據此決定合適的名稱與分類,而非仰賴經常錯誤或通用的舊檔名。支援 Claude in Chrome 的 `javascript_tool`,只要使用者提供 Figma 個人存取權杖(唯讀)和團隊 ID 即可開始自動化流程,預設為全自動模式:一個接一個處理草稿,無需逐個確認。若無相符的分類專案,它會自動建立新的編號專案,並確保命名規則一致(`<主題> - <關鍵功能> Dashboard`)。整個腳本會持續重複步驟,直到草稿資料夾完全清空。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/ahmeduxui/figma-drafts-organizer/tree/main/figma-drafts-organizer

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

Figma 草稿整理器(自動化,內部 API)

這個技能提供一個經過驗證、可靠的方式來清空 Figma 團隊的 草稿 資料夾,方法是將每個檔案分類並歸檔到正確的編號分類專案中。它透過 Claude in Chrome 的 javascript_tool 呼叫 Figma 的內部 API 來完成所有操作——不需要點擊檔案卡片、移動對話方塊或修改名稱欄位。那種滑鼠驅動的方式既慢又脆弱;內部 API 可以在一個請求中同時完成移動和重新命名,永遠不會卡住。

讓結果良好的核心觀念:檔案內容才是真理,絕不參考舊名稱。 舊的草稿名稱通常是錯誤、通用或複製的。因此,對於每個檔案,我們會讀取其框架內的實際文字,從中決定名稱和分類,然後重新命名並移動。

操作模式

預設為完全自動化:依序處理草稿資料夾中的每個檔案,立即重新命名並移動,無需在檔案之間暫停要求批准。每個檔案回報簡短結果。只有在遇到無法從內容判斷的明顯模糊情況(罕見)或 API 呼叫持續失敗時,才會停下來詢問使用者。

如果使用者明確要求預覽/審核模式,則顯示一個比較表格(目前名稱 → 建議名稱 + 分類)並等待——但這是例外情況,非預設模式。

五個步驟(每個檔案 — 重複使用這些步驟,不要發明新的)

對於每個草稿檔案,請按順序執行以下五個步驟:

  1. 取得檔案金鑰 — 從草稿清單中取得(重新擷取後的列表索引 0)。
  2. 檢查實際內容 — 透過 REST API 讀取框架中的實際文字。不要相信舊名稱。
  3. 決定新名稱和分類 — 兩者都從內容推斷。 命名模式:<主題> - <關鍵功能> Dashboard(英文,無論設計語言為何)。
  4. 解析目標專案 — 找到相符的編號分類專案;如果不存在,則建立一個(依序下一個編號)。
  5. 重新命名並移動 — 一個內部 API PUT 請求同時完成兩者。預期回傳 HTTP 200。

然後重新擷取草稿清單,並從步驟 1 重複,直到草稿資料夾清空。每次迭代都要重新擷取,因為檔案移出後清單順序會變動,所以總是取索引 0。


設定(每次會話一次)

  1. 確保 Chrome 分頁已開啟團隊的草稿頁面,例如 https://www.figma.com/files/team/{TEAM_ID}/drafts,並且你已取得其 tabId。 使用者必須在該 Chrome 設定檔中登入 Figma。

  2. 收集使用者的值。如果尚不知道,請詢問一次:

    • FIGMA_TOKEN — 具有唯讀檔案存取權限的 Figma 個人存取權杖(Figma → 設定 → 安全性 → 個人存取權杖 → 範圍「檔案內容:唯讀」)。僅用於讀取檔案內容。
    • TEAM_ID — Drafts 頁面 URL 中 /team/ 之後的數字。

    將它們放入 scripts/helpers.js 的 CONFIG 區塊中(或在貼上前設定 window.__FIGMA_TOKEN 和 window.__TEAM_ID)。 切勿將權杖寫入會被分享或提交的檔案中。

  3. 貼上 helper 區塊一次(參閱 scripts/helpers.js)。它會在 window 上定義 findDraftsFolder、inspect、moveFile、loadFolders、loadDrafts。 所有 JS 都透過 Claude in Chrome 的 javascript_tool 在 Figma 分頁上執行。

  4. 找到草稿資料夾 ID(Drafts 頁面必須已載入完成):

    window.findDraftsFolder()   // → "drafts=<id>"
    

    如果回傳 NOT_FOUND,重新載入 Drafts 頁面,等待,重新貼上 helpers 再試一次。

  5. 載入分類專案,以便重新命名/移動可以找到它們:

    window.loadFolders()   // 填充 window.__folders = { "<name>": id, ... }
    

Helpers 能夠在正常的應用內(SPA)導航中存活,但專案建立頁面會執行硬重新載入並清除它們。 建立新專案後,重新貼上 helper 區塊並重新執行 loadFolders() 再繼續。 將 token、團隊 ID 和草稿資料夾 ID 保留在你的筆記中,以便在重新載入後恢復它們。

在沒有分類專案的團隊中首次執行

如果團隊還沒有任何編號專案,第一個檔案將會建立分類(01 - ...、02 - ...)。這是預期的行為。references/categories.md 提供了一個適用於 UI/儀表板工作的起始分類清單;將其作為命名指南,而非必須已存在的清單。

執行 loadFolders() 後的 window.__folders 是即時的分類清單。 references/categories.md 是起始清單和命名指南;閱讀它以保持新分類的一致性,並找到下一個可用編號。


步驟 1–2 — 擷取下一個檔案並檢查其內容

擷取草稿清單,取索引 0,然後觸發內容檢查:

window.loadDrafts().then(n=>{
  window.__last="CLEARED"; window.__ir="";
  const d=window.__drafts[0]; window.__cur=d; window.__cn=d?d.name:null;
  if(d){ window.inspect(d.key).then(r=>window.__ir=r).catch(e=>window.__ir="ERR:"+e); }
  return "n="+n+(d?(" first="+String(d.name).replace(/[^A-Za-z0-9 ]/g,"")+" key="+d.key):" EMPTY");
})

n=0 EMPTY 表示草稿資料夾已清空 — 執行完畢。

window.inspect 會遍歷每個頁面的前幾個框架並收集簡短文字字串。觸發後,等待約 8 秒,然後讀取清理後的單詞列表(此過濾器會移除樣板文字 — 參閱下方的忽略清單):

new Promise(res=>setTimeout(()=>res(
  [...new Set((window.__last.match(/[A-Za-z]{4,}/g)||[]))]
    .filter(w=>!/http|www|figma|preview|envato|MirNFT|Explore|creators|rankings|Auctions|Solid|Melt|Flare|Mare|Fusion|Soul/i.test(w))
    .slice(0,40).join(" ")
), 8000))

使用上述的 JS setTimeout promise 來實現延遲,而不是使用單獨的等待工具——這樣可以將所有操作保留在瀏覽器分頁內。

如果結果稀疏或主要由樣板內容主導,則升級為更深入的全文件遍歷(深度 12)——參閱 scripts/deep_walk.js。如果內容仍然過於薄弱而無法分類,則最後才使用檔案的舊名稱。

分類時要忽略的樣板內容

許多草稿是共享裝飾性縮圖的購買範本。請根據主要命名的儀表板框架進行分類,而非以下這些:

  • NFT 預覽縮圖(MirNFT / preview envato / Explore / Auctions / CryptoPunks / WonderPals / Azuki / Doodles / Decentraland / Sandbox 等)
  • 音樂預覽縮圖、FastEat 食物預覽
  • 通用醫療範本側邊欄(Message / Test / Payment / Appointment / Settings / Help / Medicine / Order / "Welcome Alexa June")當它出現在非醫療檔案中時

步驟 3 — 從內容決定名稱與分類

將名稱建構為 <Subject> - <Key features> Dashboard,使用英文。實際執行的範例:

  • 加密錢包 + 交易所 + 分析 → Crypto Trading Platform - Wallet & Exchange Dashboard → 分類 07 - Crypto
  • 線上課程、學生、講師、分析 → Online Courses - Students & Performance Dashboard → 05 - LMS
  • 聊天應用程式(訊息/群組)→ Chat App - Messages & Groups Dashboard → 36 - Chat & Messaging
  • 卡路里/訓練追蹤器 → Health Tracker - Calories & Training Dashboard → 14 - Medical & Health

透過比對內容訊號與 references/categories.md 中的編號專案清單來選擇分類。


步驟 4 — 解析(或建立)目標專案

在 window.__folders 中查詢分類名稱。大多數資料夾金鑰帶有後綴 Dashboard(例如 02 - Finance & Insurance Dashboard);少數則沒有(04 - UI Components、37 - Agency & Portfolio Website、47 - Pitch Deck & Presentation、48 - UX Case Study)。使用確切的金鑰。

如果沒有相符的分類專案,請建立一個(這是預期且授權的行為——不要停下來詢問)。內部 API 無法建立專案,因此請使用 Figma UI:

  1. 導航至 https://www.figma.com/files/team/{TEAM_ID}/all-projects。
  2. 點擊 + Project(右上角)。座標因螢幕而異——截圖或使用 find 來定位每個控制項。
  3. 等待,點擊名稱欄位,輸入新的編號名稱 (來自 references/categories.md 的下一個可用編號,風格與其餘一致,例如 49 - Crowdfunding & Fundraising Dashboard)。
  4. 點擊 Continue。
  5. 在步驟 2「新增人員」中,點擊 Create project,不要新增任何人——永遠不要更改分享/權限。
  6. 頁面會硬重新載入到新專案中 → 重新貼上 helpers 並重新執行 loadFolders()。

然後繼續進行移動。


步驟 5 — 在一個呼叫中重新命名並移動

window.moveFile(window.__cur.key, "<CATEGORY FOLDER KEY>", "<NEW NAME>").then(r=>"mv="+r)

mv=S200 表示成功(同時重新命名和移動)。其他任何結果:重新讀取 cookie/CSRF,確認資料夾金鑰存在於 window.__folders 中,然後重試。

回到步驟 1。


嚴格規則(這些保護使用者 — 請遵守)

  • 內容是參考依據,絕不是舊名稱。 命名前務必檢查。
  • 預設為自動化 — 檔案之間無需權限提示。只需回報結果。
  • 英文名稱,模式 <Subject> - <Key features> Dashboard。
  • 缺少分類時建立一個,使用序列中的下一個編號;切勿重複使用編號。
  • 永遠不要刪除任何東西 — 不要丟棄檔案,不要透過刪除來清空草稿。檔案只會移動。
  • 永遠不要更改分享或權限 — 建立專案時,點擊「Create project」而不新增人員。
  • 一次一個檔案,總是重新擷取並取索引 0(清單會重新排序)。
  • 在專案建立導致的硬重新載入後,重新貼上 helpers。
  • 所有 Figma API 呼叫都使用 Chrome JS — 絕不使用 bash/WebFetch(會被代理封鎖)。

無效的方法(不要浪費時間)

  • PUT /v1/files/{key}(公開 REST)→ 404。使用內部 PUT /api/files/{key}(在 moveFile 中)。
  • 公開 REST 沒有草稿列表端點 → 使用內部 /api/folders/{id}/paginated_files(在 loadDrafts 中)。
  • 透過 API 建立專案 → 不支援。請使用上面的 UI 流程。
  • 單獨的等待工具 → 在此不可靠;使用 JS setTimeout promise。
  • 將 22 個字元的檔案金鑰作為原始字串讀取可能會被視為 base64 而封鎖 — helpers 已安全地回傳金鑰。

參考檔案

  • references/categories.md — 起始編號分類清單 + 哪些金鑰缺少 Dashboard 後綴,以及如何找到下一個可用編號。
  • scripts/helpers.js — 每次會話貼上一次的 helper 區塊(findDraftsFolder / inspect / moveFile / loadFolders / loadDrafts),包含 CONFIG 區塊和 CSRF 處理。
  • scripts/deep_walk.js — 深度 12 的全文件文字遍歷,用於內容稀疏或樣板繁多的檔案。

關於內部 API 的說明

重新命名+移動以及草稿列表使用了 Figma 的內部 Web API(與 Figma Web 應用程式呼叫的端點相同),而非有文件的公開 REST API。此 API 沒有文件,且可能隨時變更而無通知。如果一個原本可以運作的呼叫開始失敗,表示端點可能已更改。請自行斟酌使用此技能,並遵守 Figma 的條款。

相關技能