Figma: Was ist es und wie funktioniert es?

Figma: Was ist es und wie funktioniert es?

Giovanni Blandino Veröffentlicht am 9/25/2023

Figma: Was ist es und wie funktioniert es?

Figma ist ein innovativer und interessanter Vektorgrafik-Editor für das Web, dessen Nutzung im Laufe der Jahre stetig zugenommen hat. Heute ist es eine der am häufigsten verwendeten Plattformen von UX/UI-Designern, Kommunikationsagenturen und Unternehmen auf der ganzen Welt!

Die erste Version von Figma wurde 2015 mit dem erklärten Ziel eingeführt, es allen zu ermöglichen, “kreativ zu sein, indem sie einen Browser verwenden“. Im Jahr 2022 kaufte Adobe, das in den USA bekannte Unternehmen für seine Suite von digitalen Grafikprogrammen, Figma für etwa 20 Milliarden US-Dollar.

Wir wissen immer noch nicht, wie die Zukunft von Figma aussehen wird, aber zweifellos ist die Plattform heute eines der beliebtesten Grafikbearbeitungswerkzeuge für Websites und App-Schnittstellen. Lassen Sie uns heute gemeinsam einen Blick darauf werfen, was Figma ist und wie es funktioniert: Ein Leitfaden für diejenigen, die das Programm noch nicht kennen oder nur davon gehört haben!

Was ist Figma?

Figma ist eine Plattform für Grafikdesign und Interface-Design: Sie ist webbasiert und kollaborativ. Mit Figma können Sie grafisch vieles tun – von der Gestaltung von Websites und grafischen Benutzeroberflächen von Apps über die Erstellung von Social-Media-Posts bis hin zur Erstellung von Präsentationen. Aus diesem Grund wird es in Unternehmen und Grafikstudios immer mehr geschätzt.

Was ist Figma: Eine webbasierte Grafikplattform
Was ist Figma: Eine webbasierte Grafikplattform. Bild: figma.com

Eine der innovativsten Eigenschaften von Figma ist zweifelsohne die Tatsache, dass es ein kollaboratives Werkzeug ist. Die verschiedenen Teammitglieder arbeiten an derselben Datei in Echtzeit: Das bedeutet, dass verschiedene Grafikdesigner gemeinsam an einem Design arbeiten können, aber auch Entwickler und Texter bereits in den frühen Phasen der Arbeit eingebunden sind.

Das Ergebnis? Es spart viel Zeit: Keine endlosen Dateiaustausche mehr. Darüber hinaus fördert die Zusammenarbeit die Kreativität.

Die Tatsache, dass Figma webbasiert ist – also über den Webbrowser zugegriffen wird – ist eine weitere sehr geschätzte Eigenschaft: Es ist nicht notwendig, Programme zu installieren und zu aktualisieren oder Lizenzen zu kaufen. Alle Teammitglieder können von jedem Betriebssystem aus arbeiten, ohne sich um installierte Schriftarten auf den Geräten oder den Wechsel des Computers kümmern zu müssen, unter anderem.

Alles wird in der Cloud gespeichert und in Echtzeit aktualisiert, um verschiedene Probleme zu vermeiden – wie das versehentliche Arbeiten an veralteten Dateien oder den zeitaufwendigen Austausch sehr großer Dokumente. Natürlich müssen Sie praktisch immer online sein und eine gute und stabile Internetverbindung haben, um Figma verwenden zu können.

Ein Bildschirm, der zeigt, was Figma ist.
In Figma können verschiedene Teammitglieder an einem Projekt zusammenarbeiten. Bild: figma.com

Jetzt haben Sie eine genauere Vorstellung von dem, was Figma ist. Abschließend müssen wir sagen, dass Figma zumindest in seiner Grundversion kostenlos ist. Das kostenlose Starter-Paket ermöglicht es Teams, an drei Dateien innerhalb eines Projekts zu arbeiten und speichert frühere Versionen für 30 Tage. Zu beachten ist, dass Schüler und Lehrer auch kostenlosen Zugang zur professionellen Version von Figma erhalten können (von hier aus), die normalerweise 12 $ pro Monat pro Benutzer kostet.

Zusammengefasst: Was ist Figma:

  • Figma ist ein Grafikbearbeitungs- und Prototyping-Programm.
  • Figma wird hauptsächlich für das digitale Design verwendet, insbesondere für die Gestaltung von Websites und App-Schnittstellen.
  • Figma ist webbasiert, das bedeutet, dass es keine Software zum Herunterladen und Installieren gibt. Stattdessen wird es über den Webbrowser und eine Internetverbindung genutzt.
  • Figma ist kollaborativ: Verschiedene Benutzer mit unterschiedlichen Rollen können gleichzeitig an einem Projekt arbeiten.
  • Figma ist in Echtzeit: Alles wird kontinuierlich in der Cloud gespeichert.
  • Figma ist in seiner Grundversion kostenlos.

Wie funktioniert Figma?

Haben Sie nun eine klarere Vorstellung von dem, was Figma ist und was es kann? Bevor wir uns ansehen, wie Figma funktioniert – zumindest in seinen grundlegenden und innovativsten Elementen – klären wir gleich einen wichtigen Aspekt: Figma zeigt seine volle Wirksamkeit nicht nur im endgültigen Design eines grafischen Produkts, sondern vor allem in allen vorherigen Phasen.

Figma-Logo
Was ist Figma und wie funktioniert es

Brainstorming, Bewertung verschiedener grafischer Optionen, Prototyping, Sammlung und Umsetzung von Feedback – in all diesen Phasen kann Figma äußerst effektiv eingesetzt werden! Zum Beispiel kann ein Designteam in Figma gemeinsam den Wireframe einer Website erstellen, das einfache Skelett eines Designs ohne Farben oder Stile, sofortiges Feedback von anderen Teammitgliedern sammeln oder die beste Option bewerten lassen. Oder das Interface einer App prototypisieren: Das bedeutet, bereits in den frühen Phasen der Arbeit die Navigation und Interaktion innerhalb eines Designs zu simulieren.

Lassen Sie uns nun erklären, wie die grundlegenden Aspekte von Figma funktionieren. Am Ende des Artikels werden wir einige Kurse und Ressourcen empfehlen, um tiefer in die Materie einzusteigen und zu professionellen Figma-Nutzern zu werden!

Kontoerstellung

Um ein Konto zu erstellen, melden Sie sich einfach kostenlos auf figma.com an. Nach der Anmeldung können Teams, Projekte und Arbeiten (Dateien) eingerichtet werden. Laden Sie andere Benutzer in Ihr Team ein, um ihnen Zugang zu den Projekten zu geben, an denen Sie zusammenarbeiten werden.

Arbeitsbereich

Der Arbeitsbereich in Figma ist eine enorme Umgebung – ein Quadrat von bis zu 65.000 Pixeln -, in dem Sie die verschiedenen Bildschirme des Designs platzieren können, an dem Sie arbeiten.

Ein Bildschirm, der zeigt, was Figma ist und wie es funktioniert. Bild: figma.com

Um die verwendeten Bildschirme zu erstellen, verwenden Sie das “Frames”-Tool: Sie können aus Dutzenden von voreingestellten Größen wählen, wie zum Beispiel iPhone 14, Apple Watch 41 mm oder einen Facebook-Post. Auf diese Weise können Sie beispielsweise verschiedene Seiten einer Website in einer Datei sammeln oder zeigen, wie eine Seite auf verschiedenen Geräten angezeigt werden soll.

Bibliotheken und Community

Ein weiterer interessanter Aspekt von Figma sind die Komponentenbibliotheken. Wenn Sie keine Zeit verschwenden möchten, um Elemente von Grund auf neu zu erstellen, können Sie die Gestaltung eines Designs oder Entwurfs beschleunigen, indem Sie bereits in den Bibliotheken vorhandene verschiedene grafische Elemente verwenden. In den Bibliotheken finden Sie bereits vorgefertigte Navigationsleisten, Icons oder die gebräuchlichsten Schaltflächen.

Durchsuchen Sie die Figma-Community – einen der interessantesten und nützlichsten Orte für diejenigen, die die Plattform nutzen -, um nach diesen und anderen Elementen zu suchen. Hier können Sie Inspirationen, Materialien für das Brainstorming, grafische Elemente und sogenannte Designsysteme finden – eine Reihe von Regeln, Richtlinien und grafischen Elementen, die dazu beitragen, Ihrem grafischen Produkt Kohärenz zu verleihen.

Prototyping

In der Prototyping-Sektion von Figma können Sie verschiedene Bildschirme oder grafische Elemente miteinander verbinden, indem Sie Knotenpunkte identifizieren: Zum Beispiel kann ein Knotenpunkt auf den “Über uns”-Menüpunkt platziert werden, der den Benutzer zur entsprechenden Seite führt. Oder auf eine “Newsletter abonnieren”-Schaltfläche. Durch das Starten des Prototyps können Sie die Funktionsweise einer Website oder einer App-Schnittstelle bereits in den frühen Arbeitsphasen simulieren, um zu verstehen, was funktioniert und was verbessert werden muss!

Ein App-Prototyp in Figma. Bild: figma.com. Ein Bildschirm, der zeigt, was Figma ist und wie es funktioniert.

Feedback-Sammlung

Nachdem die Datei mit dem Rest des Teams geteilt wurde, können Sie Feedback durch bequeme farbige Haftnotizen erhalten und platzieren. Die Haftnotizen werden verwendet, um abzustimmen, Probleme zu melden oder Ratschläge durch strukturiertere Kommentare zu geben. Zum Beispiel können Sie Ihrem Team drei verschiedene Optionen für das Design einer Homepage präsentieren und in Echtzeit verstehen, was Ihre Kollegen dazu denken, indem sie abstimmen oder Kommentare abgeben.

Die Kommentare können auch mündlich an das Programm übermittelt werden, das sie dann transkribiert. Praktisch, nicht wahr?

Kurse und andere nützliche Ressourcen zur Verwendung von Figma

Haben Sie gesehen, was Figma ist und wie es funktioniert? Die Möglichkeiten sind, wie Sie bereits verstanden haben, endlos! Ich wette, Sie sind bereits gespannt darauf, das Programm zu nutzen und erste kreative Experimente mit Ihrem Team zu machen.

Wenn Sie dann ein Profi werden wollen, gibt es online viele kostenlose Ressourcen, um zu lernen, Figma noch besser zu nutzen.

Eine nützliche erste Einführung wird von Figma selbst angeboten, die Sie unten finden. In etwas mehr als einer Stunde bieten Ihnen die verschiedenen Videos einen umfassenden Überblick über die Plattform.

Online gibt es eine Vielzahl von Kursen, größtenteils kostenlos. Wir möchten Ihnen zum Beispiel diesen Kurs von Sherpa Design empfehlen, der italienischen Community von UX/UI-Designern. Dann gibt es die offiziellen Kurse von Figma selbst, mit Modulen von etwa zehn Minuten Länge, und den Anfängerkurs von The Designer Ship.

Toll, oder? Jetzt, da wir verstanden haben, was Figma ist und wie es funktioniert, für welches Ihrer nächsten Projekte werden Sie es verwenden?