Figma-Entwürfe-Organisierer (Autonom, Interne API)
Dieser Skill erfasst eine bewährte, zuverlässige Methode, um den Entwürfe-Ordner eines Figma-Teams zu leeren, indem jede Datei klassifiziert und in das richtige nummerierte Kategorieprojekt einsortiert wird. Die gesamte Arbeit erfolgt über die interne API von Figma mittels des javascript_tool von Claude in Chrome – kein Klicken auf Dateikarten, kein Verschieben-Dialog, kein Herumfummeln am Umbenennungsfeld. Die mausgesteuerte Herangehensweise war langsam und anfällig; die interne API erledigt Verschieben + Umbenennen in einem Request und bleibt nie hängen.
Die Kernidee für gute Ergebnisse: Der Inhalt der Datei ist die Quelle der Wahrheit, niemals ihr alter Name. Alte Entwurfsnamen sind oft falsch, generisch oder kopiert. Daher lesen wir für jede Datei den tatsächlichen Text in ihren Frames, entscheiden anhand dessen einen Namen und eine Kategorie und führen dann Umbenennung + Verschiebung durch.
Betriebsmodus
Standardmäßig ist der Modus vollständig autonom: Gehe den Entwürfe-Ordner eine Datei nach der anderen durch, in der Reihenfolge, benenne um und verschiebe sofort, ohne auf Zustimmung zwischen den Dateien zu warten. Melde ein kurzes Ergebnis pro Datei. Halte nur an und frage den Benutzer, wenn etwas wirklich mehrdeutig ist und Du es nicht aus dem Inhalt lösen kannst (selten) oder wenn ein API-Aufruf wiederholt fehlschlägt.
Wenn der Benutzer explizit eine Vorschau-/Genehmigungsrunde wünscht, zeige stattdessen eine Vergleichstabelle (aktueller Name → vorgeschlagener Name + Kategorie) und warte – aber das ist die Ausnahme, nicht die Regel.
Die fünf Schritte (pro Datei – verwende diese, erfinde keine neuen)
Für jede Entwurfsdatei führe genau diese fünf Schritte in dieser Reihenfolge aus:
- Dateischlüssel erfassen – aus der Entwurfsliste (Index 0 der neu abgerufenen Liste).
- Tatsächlichen Inhalt prüfen – den echten Text in den Frames über die REST-API lesen. Vertraue NICHT dem alten Namen.
- Neuen Namen + Kategorie bestimmen – beide aus dem Inhalt abgeleitet.
Namensmuster:
<Betreff> - <Hauptfunktionen> Dashboard(Englisch, unabhängig von der Sprache des Designs). - Zielprojekt auflösen – das passende nummerierte Kategorieprojekt finden; wenn keins existiert, erstelle eines (nächste Nummer in der Sequenz).
- Umbenennen + verschieben – ein interner API-
PUT, der beides erledigt. Erwarte HTTP 200.
Dann rufe die Entwurfsliste erneut ab und wiederhole ab Schritt 1, bis der Entwürfe-Ordner leer ist. Rufe bei jeder Iteration neu ab, da sich die Liste neu ordnet, wenn Dateien sie verlassen; nimm daher immer Index 0.
Einrichtung (einmal pro Sitzung)
-
Stelle sicher, dass ein Chrome-Tab auf der Entwürfe-Seite des Teams geöffnet ist, z. B.
https://www.figma.com/files/team/{TEAM_ID}/drafts, und Du dietabIdhast. Der Benutzer muss in diesem Chrome-Profil bei Figma angemeldet sein. -
Sammle die Werte des Benutzers. Frage einmal, falls sie nicht bekannt sind:
FIGMA_TOKEN– ein Figma-Personal-Access-Token mit schreibgeschütztem Dateizugriff (Figma → Einstellungen → Sicherheit → Persönliche Zugriffstokens → Bereich „Dateiinhalt: Nur lesen“). Wird nur zum Lesen des Dateiinhalts verwendet.TEAM_ID– die Nummer nach/team/in der URL der Entwürfe-Seite.
Füge sie in den
CONFIG-Block vonscripts/helpers.jsein (oder setzewindow.__FIGMA_TOKENundwindow.__TEAM_IDvor dem Einfügen). Schreibe das Token niemals in eine Datei, die geteilt oder eingecheckt wird. -
Füge den Hilfsblock einmal ein (siehe
scripts/helpers.js). Er definiertfindDraftsFolder,inspect,moveFile,loadFolders,loadDraftsaufwindow. Führe das gesamte JS über dasjavascript_toolvon Claude in Chrome auf dem Figma-Tab aus. -
Finde die ID des Entwürfe-Ordners (die Entwürfe-Seite muss vollständig geladen sein):
window.findDraftsFolder() // → "drafts=<id>"Wenn
NOT_FOUNDzurückgegeben wird, lade die Entwürfe-Seite neu, warte, füge die Hilfsfunktionen erneut ein und versuche es nochmal. -
Lade die Kategorieprojekte, damit Umbenennungen/Verschiebungen sie finden können:
window.loadFolders() // füllt window.__folders = { "<name>": id, ... }
Die Hilfsfunktionen überleben normale In-App (SPA) Navigation, aber eine Projekterstellungsseite führt einen harten Reload aus und LÖSCHT SIE. Nach dem Erstellen eines neuen Projekts füge den Hilfsblock erneut ein und führe
loadFolders()erneut aus, bevor Du fortfährst. Behalte Token, Team-ID und Entwürfe-Ordner-ID in Deinen Notizen, damit Du sie nach dem Reload wiederherstellen kannst.
Erster Durchlauf in einem Team ohne Kategorieprojekte
Wenn das Team noch keine nummerierten Projekte hat, erstellen die ersten Dateien jeweils eine Kategorie (01 - ..., 02 - ...). Das ist zu erwarten. references/categories.md enthält eine Startliste von Kategorien, die für UI/Dashboard-Arbeiten gut geeignet ist; verwende sie als Namensrichtlinie, nicht als Liste, die bereits existieren muss.
Die aktive Kategorieliste ist window.__folders nach loadFolders(). references/categories.md ist eine Startliste und Namensrichtlinie; lies sie, um neue Kategorien konsistent zu halten und die nächste freie Nummer zu finden.
Schritt 1–2 – Nächste Datei holen und Inhalt prüfen
Rufe die Entwurfsliste ab, nimm Index 0 und starte die Inhaltsprüfung:
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 bedeutet, der Entwürfe-Ordner ist leer – Du bist fertig.
window.inspect durchläuft die ersten paar Frames jeder Seite und sammelt kurze Textstrings. Nach dem Auslösen warte ~8 Sekunden und lies dann die bereinigte Wortliste (dieser Filter entfernt Vorlagen-Boilerplate – siehe Ignorierliste unten):
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))
Verwende das JS setTimeout-Promise oben für die Verzögerung anstatt eines separaten Warte-Tools – es hält alles innerhalb des Browser-Tabs.
Wenn das Ergebnis spärlich ist oder von Boilerplate dominiert wird, eskalieren zu einem tieferen vollständigen Dokument-Durchlauf (Tiefe 12) – siehe scripts/deep_walk.js. Wenn der Inhalt immer noch zu dünn für eine Klassifizierung ist, greife als letzten Ausweg auf den alten Dateinamen zurück.
Zu ignorierende Boilerplate bei der Klassifizierung
Viele Entwürfe sind gekaufte Vorlagen, die dekorative Miniaturansichten teilen. Klassifiziere nach dem Haupt-Dashboard-Frame mit Namen, nicht nach diesen:
- NFT-Vorschaubildern (MirNFT / preview envato / Explore / Auctions / CryptoPunks / WonderPals / Azuki / Doodles / Decentraland / Sandbox / etc.)
- Musikvorschaubildern, FastEat-Speisevorschauen
- Der generischen medizinischen Vorlagen-Seitenleiste (Message / Test / Payment / Appointment / Settings / Help / Medicine / Order / "Welcome Alexa June") wenn sie in einer nicht-medizinischen Datei auftaucht
Schritt 3 – Namen + Kategorie aus dem Inhalt entscheiden
Baue den Namen nach dem Muster <Betreff> - <Hauptfunktionen> Dashboard, auf Englisch. Beispiele aus echten Durchläufen:
- Crypto Wallet + Exchange + Analytics →
Crypto Trading Platform - Wallet & Exchange Dashboard→ Kategorie07 - Crypto - Online-Kurse, Studenten, Dozent, Analysen →
Online Courses - Students & Performance Dashboard→05 - LMS - Chat-App mit Nachrichten/Gruppen →
Chat App - Messages & Groups Dashboard→36 - Chat & Messaging - Kalorien-/Trainings-Tracker →
Health Tracker - Calories & Training Dashboard→14 - Medical & Health
Wähle die Kategorie, indem Du die Inhaltssignale mit der nummerierten Projektliste in references/categories.md abgleichst.
Schritt 4 – Zielprojekt auflösen (oder erstellen)
Suche den Kategorienamen in window.__folders. Die meisten Ordnerschlüssel tragen ein nachgestelltes Dashboard (z. B. 02 - Finance & Insurance Dashboard); einige nicht (04 - UI Components, 37 - Agency & Portfolio Website, 47 - Pitch Deck & Presentation, 48 - UX Case Study). Verwende den genauen Schlüssel.
Wenn kein passendes Kategorieprojekt existiert, erstelle eines (das ist zu erwarten und autorisiert – halte nicht an, um zu fragen). Die interne API kann keine Projekte erstellen, also verwende die Figma-Oberfläche:
- Navigiere zu
https://www.figma.com/files/team/{TEAM_ID}/all-projects. - Klicke + Project (oben rechts). Die Koordinaten variieren je nach Bildschirm – mache einen Screenshot oder verwende
find, um jedes Steuerelement zu finden. - Warte, klicke auf das Namensfeld, gib den neuen nummerierten Namen ein (nächste freie Nummer aus
references/categories.md, gleicher Stil wie der Rest, z. B.49 - Crowdfunding & Fundraising Dashboard). - Klicke Continue.
- Klicke in Schritt 2 „Add people“ auf Create project, OHNE jemanden hinzuzufügen – ändere niemals Freigaben/Berechtigungen.
- Die Seite lädt hart in das neue Projekt neu → füge Hilfsfunktionen erneut ein und führe erneut
loadFolders()aus.
Fahre dann mit der Verschiebung fort.
Schritt 5 – Umbenennen + verschieben in einem Aufruf
window.moveFile(window.__cur.key, "<KATEGORIE-ORDNERSCHLÜSSEL>", "<NEUER NAME>").then(r=>"mv="+r)
mv=S200 bedeutet Erfolg (umbenannt und verschoben zusammen). Alles andere: Lese das Cookie/CSRF erneut, bestätige, dass der Ordnerschlüssel in window.__folders existiert, und wiederhole.
Gehe zurück zu Schritt 1.
Harte Regeln (diese schützen den Benutzer – befolge sie)
- Inhalt ist die Referenz, niemals der alte Name. Prüfe immer vor dem Benennen.
- Autonom standardmäßig – keine Genehmigungsaufforderungen zwischen Dateien. Melde einfach die Ergebnisse.
- Englische Namen, Muster
<Betreff> - <Hauptfunktionen> Dashboard. - Erstelle eine Kategorie, wenn sie fehlt, mit der nächsten Nummer in der Sequenz; verwende niemals eine Nummer zweimal.
- Lösche niemals etwas – keine Dateien in den Papierkorb legen, keine Entwürfe durch Löschen leeren. Dateien werden nur verschoben.
- Ändere niemals Freigaben oder Berechtigungen – klicke beim Erstellen eines Projekts auf „Create project“, ohne Personen hinzuzufügen.
- Eine Datei nach der anderen, rufe immer erneut ab und nimm Index 0 (die Liste ordnet sich neu).
- Füge Hilfsfunktionen nach jedem harten Reload (Projekterstellung) erneut ein.
- Verwende Chrome JS für alle Figma-API-Aufrufe – niemals bash/WebFetch (durch Proxy blockiert).
Was NICHT funktioniert (verschwende keine Zeit)
PUT /v1/files/{key}(öffentliche REST) → 404. Verwende die internePUT /api/files/{key}(inmoveFile).- Die öffentliche REST hat keinen Endpunkt zum Auflisten von Entwürfen → verwende internes
/api/folders/{id}/paginated_files(inloadDrafts). - Projekte über die API erstellen → nicht unterstützt. Verwende den oben beschriebenen UI-Ablauf.
- Separate Warte-Tools → hier unzuverlässig; verwende ein JS
setTimeout-Promise. - Das Lesen eines 22-Zeichen-Dateischlüssels als roher String kann als base64 blockiert werden – die Hilfsfunktionen geben Schlüssel bereits sicher zurück.
Referenzdateien
references/categories.md– eine nummerierte Startliste von Kategorien + welche Schlüssel das SuffixDashboardnicht haben, und wie man die nächste freie Nummer findet.scripts/helpers.js– der Hilfsblock, der einmal pro Sitzung eingefügt werden muss (findDraftsFolder / inspect / moveFile / loadFolders / loadDrafts), mit dem CONFIG-Block und CSRF-Behandlung.scripts/deep_walk.js– vollständiger Textdurchlauf mit Tiefe 12 für spärliche/boilerplate-reiche Dateien.
Hinweis zur internen API
Das Umbenennen + Verschieben und die Entwürfe-Liste verwenden die interne Web-API von Figma (dieselben Endpunkte, die die Figma-Web-App aufruft), nicht die dokumentierte öffentliche REST-API. Sie ist undokumentiert und kann sich ohne Vorankündigung ändern. Wenn ein Aufruf, der früher funktioniert hat, fehlschlägt, hat sich der Endpunkt wahrscheinlich geändert. Verwende diesen Skill nach eigenem Ermessen und im Einklang mit Figmas Nutzungsbedingungen.