Figma

Dieser Figma-Testbericht behandelt die Einsatzbereiche von Figma, die wichtigsten Funktionen der einzelnen Produkte, die Preise und Lizenzen von Figma, Figma Sites und Figma Make, die Stärken und Schwächen des Design-Tools sowie einen Vergleich mit anderen Tools. Figma läuft im Browser und als Desktop-App, und alle Dateien werden in der Cloud gespeichert, sodass Designer, Entwickler und Produktmanager gleichzeitig an derselben Datei arbeiten können. Seit 2025 ist Figma mehr als nur ein Tool: Neben „Figma Design“ umfasst es „FigJam“ für Whiteboard-Funktionen, den „Dev Mode“ für die Übergabe an Entwickler, „Figma Slides“, „Figma Sites“ zur Veröffentlichung von Websites sowie „Figma Make“, um Anforderungen in funktionierende Prototypen und Web-Apps umzusetzen.

Wofür wird Figma verwendet?

Figma wird zum Entwerfen von Benutzeroberflächen für Websites, Web-Apps und mobile Apps verwendet, von groben Wireframes bis hin zu High-Fidelity-Prototypen. Designteams erstellen und pflegen darin Designsysteme: gemeinsam genutzte Komponenten, Stile und Variablen, die für ein einheitliches Erscheinungsbild aller Bildschirme sorgen, sodass der gesamte Designprozess auf der Grundlage eines einzigen Dateisatzes abläuft. UX-Designer erstellen interaktive Prototypen für Nutzertests, und Entwicklungsteams greifen auf dieselben Figma-Dateien zu, um Maße, Assets und Code-Schnipsel zu entnehmen.

Für Low-Code-Teams ist Figma oft der erste Schritt eines Projekts. Ein Designer erstellt die Bildschirme in Figma, und ein Entwickler setzt sie in Webflow, Framer, FlutterFlow oder Bravo Studio in ein funktionierendes Produkt um. Mit „Figma Sites“ und „Figma Make“ kann ein Team nun einen Teil dieser Übergabe überspringen: Eine Website veröffentlichen oder einen funktionsfähigen Prototyp erstellen, ohne Figma verlassen zu müssen.

Wichtigste Funktionen

• Vektorbearbeitung und automatisches Layout: Stift- und Textwerkzeuge für präzises Design sowie ein automatisches Layout, das Rahmen an ihren Inhalt und an verschiedene Bildschirmgrößen anpasst.
• Komponenten und Designsysteme: Erstellen Sie wiederverwendbare Komponenten mit Varianten und Eigenschaften, veröffentlichen Sie diese als gemeinsam genutzte Bibliotheken und verwenden Sie Variablen für Farben, Abstände und Modi wie „hell“ und „dunkel“.
• Interaktive Prototypen: Verknüpfen Sie mehrere Bildschirme mit Klicks, Hover-Zuständen und intelligenten Animationsübergängen, ergänzt durch bedingte Logik und Variablen für realistischere Abläufe.
• Echtzeit-Zusammenarbeit: Mehrere Bearbeiter in derselben Datei, Kommentare, Versionshistorie, Audio-Gespräche und teilbare Links für externe Mitwirkende mit Lese- oder Kommentarzugriff.
• Dev-Modus: Maße, CSS- und Plattform-Code-Schnipsel, Export von Assets und Code Connect, damit Entwickler sehen können, wie ein Design auf ihre Komponenten abgebildet wird.
• Figma AI: KI-Funktionen zum Erstellen erster Entwürfe, Umbenennen von Ebenen, visuellen Suchen in Dateien und Verfassen von Text, abgerechnet in KI-Credits pro Arbeitsplatz.
• FigJam: Ein Whiteboard mit Haftnotizen, Vorlagen und Diagrammen für Ideen und Workshops, das auch für Nicht-Designer zugänglich ist.
• Plugins und die Figma-Community: Tausende von Plugins, UI-Kits und Vorlagen sowie private Plugins in den Tarifen „Organization“ und „Enterprise“.

Figma-Preise

Figma verkauft Lizenzen, keine Produkte. Die folgenden Zahlen stammen von der Preisseite von Figma sowie dem Artikel zu Tarifen und Funktionen (Stand: September 2026).

• Starter (kostenloser Tarif): 0 $. Ein Team, ein Ordner und 3 Designdateien, unbegrenzte Entwürfe, 30 Tage Versionshistorie, Zugriff auf Vorlagen und UI-Kits, 150 KI-Credits pro Tag bis zu 500 pro Monat.
• Professional: Full-Lizenz 16 $, Dev-Lizenz 12 $ und Collab-Lizenz 3 $ pro Monat. Unbegrenzte Anzahl an Dateien und unbegrenzte Versionshistorie, Team-Bibliotheken, erweiterte Prototyping-Funktionen, 3.000 KI-Credits pro Monat bei einer Full-Lizenz.
• „Organization“: jährliche Abrechnung. „Full“-Lizenz 55 $, „Dev“-Lizenz 25 $, „Collab“-Lizenz 5 $ pro Monat. Bietet zusätzlich Verzweigungen und Zusammenführungen, Code Connect, zentralisierte Verwaltung und private Plugins.
• Enterprise: jährliche Abrechnung. Full-Lizenz 90 $, Dev-Lizenz 35 $, Collab-Lizenz 5 $ pro Monat. Zusätzlich enthalten sind Arbeitsbereiche, Single Sign-On, erweiterte Sicherheitsfunktionen und Gastzugriffskontrollen.

Ein „Full“-Zugang schaltet alle Produkte frei, einschließlich Figma Design, Make, Sites und Dev Mode. Ein „Dev“-Zugang umfasst Dev Mode, FigJam und Slides mit Zugriff zum Anzeigen und Kommentieren von Designdateien. Ein „Collab“-Zugang umfasst FigJam und Slides.

Bei den Kosten ist zu beachten, welche Lizenz jede Person benötigt. Jeder, der Designs bearbeitet oder Figma Make bzw. Figma Sites nutzt, benötigt eine „Full“-Lizenz; die Tarife „Organization“ und „Enterprise“ werden jährlich abgerechnet. KI-Funktionen verbrauchen ein monatliches Guthaben pro Lizenz, und bei intensiver Nutzung von Make wird dieses Guthaben schnell aufgebraucht.

Erste Schritte: Die Lernkurve

Der Einstieg in Figma ist einfach: Erstelle ein kostenloses Konto, öffne eine Designdatei im Browser und zeichne Frames, Text und Formen. Die Lernkurve beginnt bei den fortgeschrittenen Funktionen, die Figma für Designteams so effizient machen: automatisches Layout, Komponenten mit Varianten, Variablen und Prototyping-Logik. Die meisten Designer erlernen die Grundlagen innerhalb weniger Tage und die Funktionen des Designsystems, wie Komponenten und Variablen, im Laufe von Wochen. Beginnen Sie mit einer der kostenlosen Vorlagen oder einem UI-Kit aus der Figma-Community, bauen Sie einige Bildschirme aus einem realen Projekt nach und teilen Sie die Datei mit Kommentarzugriff, um frühzeitig Feedback zu erhalten. Für Entwickler ist der Dev-Modus der Teil, den man zuerst lernen sollte; für Nutzer von Low-Code-Buildern sorgt das Erlernen des Umgangs mit Komponenten und des automatischen Layouts für einen reibungsloseren Übergang von Figma-Entwürfen zum Builder.

Figma im Vergleich zu Adobe XD und anderen Design-Tools

Adobe XD war jahrelang Figmas engster Konkurrent, doch Adobe entwickelt das Programm nicht mehr aktiv weiter, und die meisten Teams, die XD genutzt haben, sind zu Figma gewechselt. Sketch ist auf dem Mac nach wie vor beliebt und funktioniert offline, doch die Zusammenarbeit ist weniger direkt als die Bearbeitung derselben Datei im Browser. Penpot ist eine Open-Source-Option, die man selbst hosten kann, allerdings mit weniger Funktionen. Figma bietet mehr Kontrolle über Designsysteme, Komponenten und die Übergabe an Entwickler als jedes dieser Tools und verfügt über mehr Funktionen für Teams in einem einzigen Design-Workflow – weshalb es zum Standardtool für Produktteams geworden ist.

Figma Sites: Eine Website aus Figma veröffentlichen

Figma Sites wandelt Figma-Design-Frames in responsive Websites um und veröffentlicht sie ohne separaten Website-Builder. Sie beginnen mit einer Designdatei oder einer Vorlage, verwenden vorgefertigte Blöcke mit automatischem Layout, fügen Interaktionen wie Hover-Zustände und Scroll-Effekte hinzu und verwalten Inhalte im Sites-CMS. Für Effekte, die die integrierten Optionen nicht abdecken, sind benutzerdefinierter Code und KI-generierte Code-Ebenen möglich (Figma Sites).

Für die Veröffentlichung ist ein kostenpflichtiger Tarif mit einem „Full“-Zugang erforderlich. Im „Professional“-Tarif können bis zu 10 benutzerdefinierte Domains verbunden werden, im „Organization“- und „Enterprise“-Tarif so viele wie benötigt (Figma-Hilfe). Figma Sites befindet sich noch im Beta-Status. Es eignet sich für Portfolios, Landingpages und Marketing-Websites, die ein Designteam von Anfang bis Ende selbst verwalten möchte. Für größere Websites mit komplexen CMS-Anforderungen ist ein dedizierter Website-Builder nach wie vor die bessere Wahl.

Figma Make: Von der Idee zum Prototyp und zur Web-App

Figma Make ist Figmas KI-App-Builder. Sie beschreiben, was Sie möchten, fügen Figma-Frames oder ein Designsystem hinzu, und Make generiert einen funktionierenden, code-gestützten Prototyp, den Sie visuell oder im Code bearbeiten können (Figma Make). Make-Kits synchronisieren Ihre npm-Pakete, Bibliotheksstile und Richtlinien, sodass das Ergebnis Ihrem Designsystem entspricht. Eine Supabase-Integration fügt ein Backend mit einer Postgres-Datenbank, einer Anmeldefunktion und einer Speicherung geheimer Daten hinzu (Figma-Hilfe).

Make ist Teil des „Full“-Abonnements, und im kostenlosen „Starter“-Tarif kann es im Rahmen der täglichen KI-Guthaben getestet werden. „Starter“-Nutzer können eine Make-Datei nur dann im öffentlichen Web veröffentlichen, wenn sie diese auch in der Figma-Community veröffentlichen (Figma Make FAQs). Make ist der schnellste Weg, um interaktive Prototypen für Nutzertests zu erstellen. Für eine Produktions-App mit komplexer Logik übergeben die meisten Teams das Ergebnis nach wie vor an Entwickler oder eine Low-Code-Plattform.

Wo Figma glänzt – und wo es Schwächen zeigt

Stärken:

• Echtzeit-Zusammenarbeit im Browser, ohne dass Dateien hin- und hergeschickt werden müssen.
• Das leistungsstärkste Tool für Designsysteme, Komponenten und Variablen.
• Ein einziges Tool vom Wireframe über den Prototyp bis hin zur Übergabe an die Entwickler und sogar zur Live-Website.
• Eine riesige Community mit Plugins, UI-Kits und Vorlagen sowie eine unbegrenzte Anzahl an Mitwirkenden mit Lesezugriff in jedem Tarif.

Nachteile:

• Kostenpflichtige Lizenzen werden pro Editor berechnet, und die Tarife „Organization“ und „Enterprise“ sind nur als Jahresabonnements erhältlich.
• Kein echter Code-Export: Der Dev-Modus zeigt Code-Schnipsel an, generiert jedoch kein produktionsreifes Frontend.
• Sehr große Dateien mit vielen Bildschirmen können zu Verzögerungen führen, und für die meisten Arbeiten ist eine Internetverbindung erforderlich.
• Figma Sites befindet sich noch in der Beta-Phase und ist weniger flexibel als ein dedizierter Website-Baukasten.
• KI-Funktionen und „Make“ sind durch monatliche KI-Guthaben begrenzt.

Wie Figma im Vergleich abschneidet

• Framer: Entwerfen und Veröffentlichen von Websites in einem Tool, mit einem leistungsfähigeren CMS und Hosting als bei Figma Sites.
• Webflow: Ein visueller Website-Baukasten für Produktionswebsites; Teams entwerfen in Figma und erstellen die Websites in Webflow.
• Canva: Einfacheres Design für Marketinggrafiken und Social Media, nicht für Interface-Design.
• FlutterFlow und Bravo Studio: Verwandeln Sie Designs in native mobile Apps.
• Wix: Ein All-in-One-Website-Baukasten für kleine Unternehmen.
• Bubble: Erstellen Sie nach Fertigstellung des Designs vollständige Web-Apps mit Logik und einer Datenbank.

Lohnt sich Figma?

Figma lohnt sich für Produktteams, UX-Designer und Agenturen, die gemeinsam Benutzeroberflächen entwerfen und ein projektübergreifendes Designsystem benötigen. Der kostenlose Tarif reicht aus, um das Design-Tool kennenzulernen und Ideen zu testen, und der Professional-Tarif mit unbegrenzter Dateianzahl deckt die Anforderungen der meisten kleinen Teams ab. Weniger geeignet ist Figma für Personen, die lediglich Marketinggrafiken benötigen – hier ist Canva einfacher – oder für Teams, die eine komplette Website-Plattform suchen, da Framer oder Webflow in diesem Bereich mehr bieten als Figma Sites. Für Low-Code-Projekte ist Figma in der Regel der richtige Ausgangspunkt: Entwerfen Sie zuerst die Bildschirme und erstellen Sie sie anschließend auf der Plattform Ihrer Wahl. Die Low-Code-Agenturen und Entwickler auf LowCodeDevs können ein Figma-Design übernehmen und umsetzen.

Quellen

• Figma-Preise: Tarife, Lizenztypen, Preise und KI-Guthaben.
• Figma-Tarife und Funktionen: Beschränkungen des Starter-Tarifs und Funktionen pro Tarif.
• Figma Sites und Verwaltung einer benutzerdefinierten Domain für Ihre Website: Veröffentlichung und benutzerdefinierte Domains.
• Figma Make, Figma Make – FAQs und Hinzufügen eines Backends: „Prompt-to-App“, Veröffentlichung und Supabase.
• Figma-Testbericht 2026, ChooseSaaS: Vor- und Nachteile (die Preise von 15, 45 und 75 US-Dollar pro Editor sowie ein separates Dev-Mode-Add-on sind veraltet; auf der Preisseite von Figma werden nun „Full“-Lizenzen für 16, 55 und 90 US-Dollar sowie der Lizenztyp „Dev“ angezeigt).
• 13 Figma-Alternativen, UX Pilot: Alternativen (verfasst von einem Mitbewerber).