Figma-Plugins helfen, Ihre Arbeitsleistung zu steigern und stellen sicher, dass Sie innerhalb von Figma bleiben, um Ihre Designarbeit abzuschließen. Mit Figmas unendlicher Plugin-Bibliothek gibt es fast nichts, was Sie mit Ihrem bevorzugten Designtool nicht machen können.
Mit diesen hilfreichsten kostenlosen Figma-Plugins kratzen wir nur an der Oberfläche dessen, was verfügbar ist.
So laden Sie Figma-Plugins herunter
Bevor wir uns in die Warenliste stürzen, sollten Sie wissen, wie Sie ein Figma-Plugin finden und herunterladen. Wie du vielleicht weißt wie man Figma verwendet, aber wenn Sie dies nicht tun, können Sie die Plugin-Bibliothek wie folgt leicht finden. Einige Plugins funktionieren möglicherweise besser in der Figma-Desktop-App als in der Browserversion.
Gehen Sie zur Community-Seite, die auf der Homepage oder auf einer Dateiseite unter Ihrem Kontonamen zu finden ist. Die Community-Seite listet mehr als nur Plugins auf, sondern aus einer Figma-Datei auswählen
Hauptmenü > Plugins zeigt Ihnen kürzlich verwendete Plugins und gespeicherte Plugins und lässt Sie neue Plugins finden.Auswählen Neue Plugins finden führt Sie zum Ressourcen Registerkarte, wo Sie nach jedem Plugin suchen können. Sobald Sie ein Plug-in gefunden haben, das Sie herunterladen möchten, wählen Sie es auf der Community-Seite aus Versuch es herunterzuladen, oder—aus dem Ressourcensuchfeld—auswählen Laufen um das Plugin herunterzuladen.
Jedes Plugin sollte seine eigenen Gebrauchsanweisungen bereitstellen, also lesen Sie den Klappentext, wenn Sie dazu aufgefordert werden.
Gauthams Plug-in „Mesh Gradient“ bietet eine schnelle und einfache Möglichkeit, benutzerdefinierte Farbverläufe zu Ihren Figma-Designs hinzuzufügen. Führen Sie das Plugin aus und erstellen Sie ein Farbverlaufsquadrat. Sie können die Farben selbst anpassen oder treffen Randomisieren um automatisch ein Verlaufsdesign zu generieren.
Dieses Plugin erstellt ein Bild aus Ihrem Farbverlauf, sodass es nach der Generierung nicht bearbeitet werden kann. Sie können jedoch im Plugin alte Verläufe bearbeiten oder neue erstellen.
Webflow Labs bieten eine großartige Möglichkeit, Ihr Figma-Design in HTML oder CSS umzuwandeln, das für die Webflow- und Website-Erstellung bereit ist. Sie können Webflow-Interaktionen für eine nahtlose Integration mit Webflow Labs in Ihre Figma-Designs integrieren. Dieses Plugin ist großartig, wenn Sie ein Webflow Labs-Benutzer sind oder mit einem Webentwicklerteam arbeiten.
Es enthält reaktionsschnelle Komponenten, behält alle Ihre Stile, Schriftarten und Bilder bei und ermöglicht Ihnen sogar, HTML-Tags direkt in Figma zu bearbeiten. Du kannst Master-Vorlagenstile in Figma erstellen und verwenden Sie Figma to Webflow, um sie für zukünftige Website-Projekte zu exportieren.
Mit dem offiziellen Figma-Plugin von Unsplash können Sie Bilder direkt in Ihre Designs einfügen, ohne Ihr Figma-Fenster zu verlassen. Es sind alle die gleichen Unsplash-Lizenzen verfügbar, aber mit diesem Plugin sparen Sie Zeit und Klicks, wenn Sie Bilder zu Ihrer Arbeit hinzufügen.
Wenn Sie ein Designer von Bildern sind, fällt es Ihnen möglicherweise schwer, Platzhaltertext für den Platz in Ihren Designs zu finden. Das Lorem Ipsum Platzhalter-Plugin erledigt das alles für Sie. Bei traditionellem lateinischem Text übergeben Sie Ihr Design einfach Ihrem Werbetexter, um den Platzhaltertext in das Original umzuwandeln, sodass Sie sich nur auf die Optik konzentrieren müssen.
Wenn Sie für Ihr Design eine Reihe von Texten benötigen, hilft Text Porter dabei, Ihre Kopie einfach von Excel nach Figma zu verschieben. Führen Sie einfach das Text Porter-Plugin aus und verschieben Sie Ihren Text. Bearbeiten Sie dann den Text direkt in Ihrer Excel-Datei, um Ihr Figma-Design in Zukunft zu aktualisieren. Dies ist hilfreich, wenn Ihr Texter keinen Zugriff auf oder keine Kenntnis von Figma hat.
Für einen reibungsloseren Arbeitsablauf zusammen mit der Verwendung von Plugins können Sie das auch Verwenden Sie Figma-Shortcuts für einen schnelleren Arbeitsablauf.
Das Entfernen von Hintergründen ist eine gängige Praxis bei der Verwendung von Bildern in vielen Designaspekten. Anstatt sich mit Photoshop, Canva oder anderen Bearbeitungsprogrammen abzumühen, beschleunigt die Verwendung des Icons8 Background Remover-Plug-ins den Prozess und behält alles in Figma.
Das Tool zum Entfernen des Hintergrunds kann auf mehr als ein Bild gleichzeitig angewendet werden, wodurch Ihr Arbeitsprozess auf Knopfdruck beschleunigt wird.
Das Image Tracer-Plugin erstellt ein Vektorbild aus den Bildern und Bildebenen, auf die Sie es anwenden möchten. Ein skalierbarer Vektor ist wie Goldstaub für digitale Designarbeiten, und dieses Plugin macht es einfach, jedes Bild in einen Vektor umzuwandeln.
Das Html.to.design-Plugin kann Ihnen dabei helfen, vorhandene Website-Designs in Figma-Designs umzuwandeln. Dies dient vielen Zwecken, z. B. um Ihnen zu helfen, das Entwerfen von Websites zu üben, oder um alte Websites wiederherzustellen, die Sie entworfen haben und auf die Sie keinen Zugriff mehr haben.
Siehe unser ausführliches Tutorial für Umwandlung einer Website in ein Figma-Design mit diesem Plugin.
Das Vectorize-Plugin funktioniert ähnlich wie Image Tracer, aber dies ist besser, wenn Sie nur ein Bild und eine Farbe zum Vektorisieren haben. Das Konvertieren von Bitmap-Bildern in Vektoren ist mit diesem Plugin einfach.
Ihre neuen Vektoren werden ein Vektorpfad sein, der einfach zu bearbeiten und für alle Ihre Designanforderungen zu verwenden ist. Besonders gut, wenn Ihr Kunde Ihnen sein Logo als verpixeltes Bild sendet, das aus einem Word-Dokument kopiert wurde. Sie können Logos und andere einfarbige Symbole in Figma ganz einfach wiederbeleben.
Entwerfen Sie für ein bestimmtes Seitenverhältnis? Müssen Sie vergrößern oder verkleinern? Verwenden Sie das Aspects-Plugin. Mit diesem Plugin können Sie schnell das Aussehen verschiedener Ebenen in Ihrem Design ändern, insbesondere von Bildern. Aspects ist ein hilfreiches Werkzeug für jede schnelle Skalierung, die Sie durchführen müssen.
Wenn Sie für UX/UI entwerfen, fügen Sie Ihren Designs wahrscheinlich Schaltflächen hinzu. Button Buddy ist ein großartiges Plugin, das viele Button-Komponenten-Designs bietet, wodurch Sie Zeit beim Entwerfen sparen, sodass Sie sich auf großartige Layout-Designs konzentrieren können.
Um mehr Komponenten als Schaltflächen hinzuzufügen, verwenden Sie das Handy Components-Plugin. Dieses Plugin bietet über 60 verschiedene UX/UI-Designelemente. Handy Components verwendet auch intelligentes Design, um die in Ihrem Design vorhandenen Stile zu replizieren und sie direkt auf die hinzugefügten Komponenten des Plugins anzuwenden. Sie müssen es nicht bearbeiten, um es Ihrem Stil anzupassen.
Verfügbare Komponenten sind Schaltflächen, Funktionskarten, Listenelemente, Tabellen, Fortschrittsbalken, Warnaufkleber, Kalender und viele andere nützliche Elemente.
Benötigen Sie eine Karte für Ihr Webdesign? Sie können eine ganz einfach mit dem Map Maker-Plug-in integrieren. Mit dem Plugin können Sie eine benutzerdefinierte Karte hinzufügen, die in eine Form eingefügt wird.
Wählen Sie einfach die gewünschte Form aus – Rechteck, Ellipse oder Polygon – und führen Sie Map Maker aus. Geben Sie dann die Adresse ein, die Sie teilen möchten. So einfach fügen Sie Ihrem Webdesign eine Karte hinzu.
Icons machen UX/UI-Designs universell und zugänglich. Das Iconify-Plugin hostet eine Bibliothek mit über 1000.000 Symbolen für fast jede Verwendung. Die Open-Source-SVG-Symbole von Iconify können in vielen Entwicklungssoftware verwendet werden, um Ihre Figma-Designs einfach vom Prototyp zu Live-Produkten zu bringen.
Das Hinzufügen von Mockups zu Ihren Figma-Designs hilft Ihnen, die Realität in potenzielle Produktideen zu integrieren. Ob Sie Mockups zu Ihrer hinzufügen Figma-Präsentationsdesign oder sie in eine Website zu integrieren, sie sind eine praktische Sache.
Clay Mockups 3D ist eines von vielen großartigen Mockup-Plugins. Siehe unsere Anleitung zu Figma-Smartphone-Modellen um zu sehen, was es sonst noch gibt. Sie können Modelle für Telefone, Computer und andere Geräte sowie Hände einfügen, um sie zu halten.
Mit diesem einfachen Plugin können Sie Ihre Rahmen ausrichten, aufräumen und Ihre Kunstwerke organisieren. Wählen Sie einfach Ihre Elemente aus, führen Sie das Plugin aus und Ihr Figma-Fenster wird super aufgeräumt sein.
Es ordnet nicht nur eine unordentliche Zeichenfläche, sondern nummeriert sogar Frames neu, wenn die Reihenfolge geändert wird. Sie müssen nicht mehr nach Rahmen 5 suchen, nachdem er verschoben wurde, Sie finden ihn eingebettet neben 4 und 6.
Halten Sie Ihre Arbeit mit Figma-Plugins am Laufen
Mit diesen 16 großartigen Tools können Sie Ihren Arbeitsfluss ganz einfach transformieren. Mit Plugins können Sie mehr tun, ohne das Figma-Designfenster zu verlassen.
Diese Plugins sind die nützlichsten, und wenn Sie sie alle verwenden, können Sie Bilder vektorisieren, Bilder hinzufügen von Unsplash, fügen Sie HTML-Designs zu Figma hinzu und wieder zurück mit Webflow Labs, fügen Sie benutzerdefinierte Karten hinzu und ändern Sie die Größe Ihrer Entwürfe. Alles mit Plugins.