Deine Design-Bibliothek verbinden
Der Agent verweist auf deine echten Komponenten, Token und Variablen, wenn er Specs generiert – damit Entwickler präzise Dokumentation erhalten, keine Platzhalterwerte.
Dein KI-Assistent für die Design-Übergabe direkt auf der Arbeitsfläche
Der Figma-Agent hilft dir, Specs vorzubereiten, Assets zu extrahieren und Entwicklerfragen zu beantworten – direkt auf der Arbeitsfläche, wo dein Design bereits lebt. Weniger Kontextwechsel, klarere Übergaben.
Übergaben, die wirklich funktionieren
Halte Designer und Entwickler in einem gemeinsamen Raum aufeinander abgestimmt, während die KI die lästige Vorbereitungsarbeit übernimmt, damit du dich auf das Bauen konzentrieren kannst.
Automatisiere die Vorbereitung, behalte die Präzision
Lass den Agenten sich um die repetitiven Übergabe-Aufgaben kümmern – Redlines generieren, Abstände dokumentieren, Komponenten-Specs auflisten – während du dich auf die Designentscheidungen konzentrierst, die deine Aufmerksamkeit wirklich brauchen.
Fragen beantworten, bevor sie gestellt werden
Der Agent stellt den Kontext bereit, den Entwickler brauchen: Komponentennamen, Style-Tokens, Interaktionsnotizen. Weniger Pings im Chat, weniger Missverständnisse, schnellere Builds.
Dein Team in einer gemeinsamen Datei abstimmen
Specs, Assets und Design-Kontext existieren direkt neben der eigentlichen Arbeit. Entwickler sehen die neueste Version, Designer sehen, was gerade gebaut wird – nichts geht beim Export oder bei der Übersetzung verloren.
Die Funktionen hinter besseren Übergaben
Ein genauerer Blick darauf, was den Figma-Agenten auszeichnet – entwickelt für die Art, wie Design-Teams wirklich arbeiten.
Paralleles Prompten
Bereite mehrere Frames gleichzeitig für die Übergabe vor. Dokumentiere einen Bereich, während du Assets aus einem anderen extrahierst – keine Wartezeit zwischen den Aufgaben.
Teilbare Threads
Teile einen Übergabe-Thread, und Entwickler sehen den vollständigen Prompt, den Kontext und den Iterationsverlauf. Fragen und Antworten bleiben an die Arbeit angehängt.
Mit Folge-Prompts verfeinern
Brauchst du mehr Details zu einer Komponente? Frag im selben Thread. Der Agent merkt sich den Kontext, sodass du iterieren kannst, ohne von vorne anzufangen.
Figma fühlt sich an wie eine natürliche Verlängerung meiner Hand. Ich entwickle meine Design-Ideen auf der Arbeitsfläche, und jetzt übernimmt der Agent die letzte Etappe. Mit meinen verbundenen Design-Bibliotheken komme ich schneller vom Design zum Code als je zuvor.
Andy Madrick
Product Designer bei Notion
Mit dem Figma-Agenten starten
Frames zur Übergabe auswählen
Öffne deine Datei in Figma Design und wähle die Frames oder Komponenten aus, die du für die Entwicklung vorbereiten musst.
Beschreibe, was Entwickler brauchen
Sag dem Agenten, was er dokumentieren soll – Abstands-Specs, Komponentennamen, Interaktionsnotizen, exportierbare Assets. Sei konkret, welcher Kontext am wichtigsten ist.
Die Dokumentation überprüfen
Prüfe die generierten Specs auf deiner Arbeitsfläche. Verfeinere im selben Thread, falls etwas fehlt, oder starte einen parallelen Prompt für einen anderen Frame.
Mit deinem Team teilen
Entwickler greifen auf dieselbe Datei mit vollem Kontext zu. Teile den Thread-Link, damit sie genau sehen, was sich geändert hat und warum.
Zum Agenten-Profi werden
Der Design-Agent von Figma ist da
Mehr erfahrenSieh dir Figmas KI-Agenten in Aktion an und erfahre, wie du ihn in deinen eigenen Workflows einsetzen kannst.
Mit dem Figma-Agenten arbeiten
LoslegenEin praxisnaher Spielplatz, um die Fähigkeiten des Figma-Agenten zu erkunden – von Massenbearbeitungen bis zur Umsetzung von Feedback – mit integrierter Schritt-für-Schritt-Anleitung.
So nutzt du den Figma-Agenten in deinen Design-Workflows
Jetzt ansehenLerne mit einem Schritt-für-Schritt-Tutorial vom Figma-Team, wie du den Figma-Agenten in deinen Design-Workflows einsetzt.
FAQ
Ein KI-Assistent für die Design-Übergabe automatisiert die mühsamen Teile der Vorbereitung von Designs für die Entwicklung – Specs generieren, Abstände und Styles dokumentieren, und Assets extrahieren. Der Figma-Agent macht das direkt auf der Arbeitsfläche, sodass alles, was Entwickler brauchen, in derselben Datei bleibt, in der das Design lebt. Keine separaten Übergabe-Tools oder Exporte nötig.
KI reduziert die manuelle Arbeit beim Dokumentieren von Designs und beim Beantworten wiederkehrender Entwicklerfragen. Der Figma-Agent kann automatisch Redlines generieren, Komponenten-Specs auflisten und Design-Tokens sichtbar machen. Das bedeutet weniger Missverständnisse, schnellere Bearbeitung, und weniger Zeit, die Designer mit lästiger Dokumentations-Fleißarbeit verbringen.
Achte auf Tools, die Specs direkt neben dem eigentlichen Design halten, dein echtes Design System referenzieren, und Teams die Zusammenarbeit an einem Ort ermöglichen. Der Figma-Agent erfüllt alle drei – er generiert Dokumentation mit deinen echten Komponenten und Token, und alles bleibt in der gemeinsamen Datei, in der Designer und Entwickler zusammenarbeiten.
Wähle die Frames aus, die du übergeben möchtest, öffne den Figma-Agenten über die linke Seitenleiste oder drücke CMD + Enter, und beschreibe, welche Dokumentation du brauchst. Der Agent generiert Specs, extrahiert Assets und dokumentiert Kontext direkt auf deiner Arbeitsfläche. Entwickler können dann auf alles in derselben Datei zugreifen.
Der Figma-Agent ist in allen kostenpflichtigen Figma-Plänen verfügbar. Du findest ihn in der linken Seitenleiste in Figma Design. Während der aktuellen offenen Beta-Phase verbraucht er keine KI-Credits – der perfekte Zeitpunkt also, um ihn auszuprobieren, zu experimentieren und uns dein Feedback zu geben.
Schneller entwickeln mit dem Figma-Agenten