Neues von der Config 2024 – Figma Learn - Hilfe-Center

Config ist die jährliche Designkonferenz von Figma für Menschen, die Produkte entwickeln, bei der wir die Community für zwei Tage zusammenbringen, mit spannenden Feature-Launches und Vorträgen von Branchenexperten.

In diesem Artikel erläutern wir alle Funktionen, dir wir bei der Config 2024 vorgestellt haben. Einige dieser Funktionen befinden sich noch in der Beta-Phase. Wenn sie verfügbar werden, werden wir dies ankündigen und diesen Artikel aktualisieren, sobald sich etwas ändert.

Bist du ein Admin für ein Team oder Unternehmen? Den Admin-Guide für die Config 2024 ansehen →

KI in Figma Design anwenden

Figma KI ist kostenlos in der Beta-Version verfügbar, aber es können Nutzungsbeschränkungen gelten. Sobald die KI-Funktionen die Beta-Phase verlassen, werden sie zu einem kostenpflichtigen Feature. Du wirst darüber im Voraus informiert.

Mit Figma KI wird deine Kreativität entfesselt. Du wechselst schneller vom ersten Entwurf zum Endprodukt, findest, wonach du suchst, und bleibst im Flow.

Mit KI-Tools in Figma kannst du:

First Draft: Verwandele Ideen binnen weniger Minuten in editierbare Designs. So kannst du viel mehr Designmöglichkeiten und Iterationen im Handumdrehen austesten. Außerdem brauchst du nicht mehr so viel Zeit darauf zu verwenden, frühe Entwürfe von Grund auf zu erstellen.
Visuelle Suche und Asset-Suche: Verwende Bilder und Designs, um nach ähnlichen Designs und Komponenten zu suchen, die von deinem Team oder deiner Organisation erstellt wurden. Suche die benötigten Komponenten auf der Assets-Tab, ohne dir ihre Namen merken zu müssen.
Ebenen umbenennen: Organisiere deine Datei, indem du allen Ebenen mit einem Klick aussagekräftige Namen gibst.
Erstelle Prototypen: Verwandele deine Mocks schnell in einen interaktiven Prototyp.
Text umformulieren: Ändere Text in einen anderen Schreibstil um, übersetze Text in eine andere Sprache und kürze den Text, um ihn an deine Designs anzupassen.
Bilder generieren und Hintergründe entfernen: Generiere und bearbeite exklusive Bilder mit einer schriftlichen Eingabeaufforderung. Entferne den Hintergrund eines Bildes, um das Hauptmotiv zu isolieren.

eine Bento-Collage verschiedener KI-Funktionen

Mit Bezug auf die Entwicklung von KI, möchten wir über unser Vorgehen und darüber, was es für dich bedeutet, transparent sein. Erfahre mehr über den Ansatz von Figma für KI →

Ein neuer Einblick in den Dev Mode

Die folgenden Dev Mode-Funktionen sind jetzt verfügbar, können aber je nach Plan oder Lizenz begrenzt sein. Klicke auf den Link für jede der folgenden Funktionen, um mehr zu erfahren.

Damit Teams bessere Produkte effizienter bereitstellen können, unterstützen Figma Design und Dev Mode nun die Anforderungen von Design und Entwicklung. Designer*innen haben weiterhin die Freiheit, Ideen zu erkunden und schnell zu iterieren, während Entwickler*innen einen besseren Überblick darüber haben, was entwicklungsfertig ist, was sich in einer Datei geändert hat und wie Designs umgesetzt werden sollen.

Optimiere deinen Übergabeprozess mit Dev Mode-Funktionen wie:

Statusaktualisierungen: Designs können jetzt ein Fortschrittsstatus zugewiesen werden, und Teamkollegen können über Änderungen benachrichtigt werden. Die Übergabe zwischen Designern und Entwicklern erfolgt mehrmals während eines Projekts, weshalb es wichtig ist, zu kommunizieren, wann ein Feature erstellt werden kann.
Ready for Dev View: Ready for Dev View hilft Entwicklern, an einem Ort schnell alles zu finden, was erstellt werden kann.
Focus View: Zeige nur das Design, an dem du arbeitest, während alle anderen Designs ausgeblendet werden, um Ablenkungen auf dem Canvas zu minimieren.
Code Connect: Die Beta-Phase von Code Connect ist nun offiziell zu Ende! Code Connect ist ein Tool für Designsysteme und Entwicklungsteams, mit dem sie Programmcode für Komponenten in Dev Mode einfügen können. Wenn Entwickler*innen eine Komponente mit verknüpften Codeschnipseln prüfen, sehen sie Designsystem-Programmcode aus ihren Bibliotheken statt dem automatisch generierten Programmcode.

drei mobile Frames, die in einem Abschnitt eingebettet sind. Ein Cursor schwebt über einem Symbol neben dem Abschnittsnamen mit einem Tooltip mit der Aufschrift „Als entwicklungsfertig markieren“.

Präsentiere deine Ideen mit Figma Slides

Figma Slides befindet sich in der offenen Beta-Phase und ist für alle verfügbar.

Während der Beta-Phase ist Figma Slides kostenlos. Anfang 2025 wird Figma Slides in kostenlosen und kostenpflichtigen Plänen verfügbar sein, je nach Plan ab 3 oder 5 US-Dollar pro Benutzer/Monat. Wir werden dich im Voraus informieren, wenn dies der Fall ist.

Figma Slides ist das erste Präsentationstool, das für Designer und Teamkollegen entwickelt wurde. Figma Slides kombiniert die Leistungsfähigkeit und Präzision von Figma design mit benutzerfreundlichen Präsentationstools. So bringt es Leben in deine Narrative und fördert das Team-Alignment.

Mit Figma Slides, kannst du:

Aus flexiblen Vorlagen wählen, um aussagekräftige Präsentationen für jedes Publikum zu erstellen
Multiplayer- und Kollaborationsfeatures anwenden, um kollaborativ Präsentationen zu erstellen und sie mit gemeinsam genutzten Notizen und Co-Steuerungen zu präsentieren
Live-Folien mit Umfragen, Abstimmungsskalen und Abstimmungen erstellen, um Feedback von Stakeholdern zu erfassen und die Entscheidungsfindung voranzutreiben.
Deine Folienstapel-Designs anpassen mithilfe der Figma Design-Tools, die du bereits kennst und liebst

Vollbild einer neuen Oberfläche mit Figma Slides mit geöffneter Vorlagenauswahl.

Figma Slides erkunden →

Ein neuer Look für Figma Design

Das Redesign von Figma, auch UI3 genannt, befindet sich derzeit in der Betaphase. Erfahre mehr darüber, wie du auf UI3 zugreifen kannst →

Wir haben Figma neu gestaltet, dies mit Hinblick auf Benutzerfreundlichkeit, Ergonomie für deinen Workflow und Konsistenz über alle Figma-Produkte hinweg. Mit einer besser zugänglichen Benutzeroberfläche und neuen Möglichkeiten, deine Lieblingstools zu finden, soll Figma dich auch weiterhin dabei unterstützen, deine Ideen umzusetzen. Und dies ist erst der Anfang.

Vollbild einer Figma Designdatei mit UI3. Es gibt vier Frames in Desktop-Größe einer App namens „Earthling“ – einer Reisetagebuch-App – in einem Abschnitt namens „Landing Pages“.

Die neue Benutzeroberfläche von Figma Design erkunden →

Einfacher designen

Die folgenden Updates stehen allen in Figma design zur Verfügung.

Responsive Prototyping, intuitiveres Auto-Layout sowie erste Schritte mit UI-Sets im Asset-Tab – deine Lieblingsfunktionen in Figma funktionieren jetzt nach deinen Vorstellungen

UI-Sets

Wir haben die Systeme von Apple Design Resources, Google Material Design und Figma Design direkt in den Assets-Tab integriert, damit du sofort mit dem Designen beginnen kannst, ohne ein eigenes Designsystem zu benötigen. Mit diesen hochwertigen Komponenten, Stilen und Variablen kannst du deine Ideen im Handumdrehen zum Leben erwecken und sie mit anderen teilen.

drei Miniaturansichten hintereinander für die UI-Kits für iOS 18 von Apple, Material 3 Design von Google und Simple Design System von Figma.

Mit UI-Sets designen →

Verbesserungen am Auto-Layout

Nutze Auto-Layout mit seinen neuen Funktionen und intuitiveren Interaktionen jetzt noch häufiger.

Apply auto layout to nested frames (Auto-Layout auf eingebettete Rahmen anwenden): Wende Auto-Layout-Rahmen automatisch auf mehrere eingebettete Rahmen auf einmal an mit Strg ⇧ Umschalttaste A oder Strg Alt ⇧ Umschalttaste A.
Ignore auto layout (Auto-Layout ignorieren, früher absolute Position genannt): Halte Strg gedrückt, während du ein Objekt in einen Auto-Layout-Rahmen ziehst, um es als absolute Position zu setzen.
On-canvas alignment preview (Ausrichtungsvorschau auf der Arbeitsfläche): Wenn du den Mauszeiger über die Optionen „Fill container“ (Container auffüllen), „Fixed width“ (Feste Breite) oder „Hug content“ (Inhalt dicht umschließen) bewegst, werden Linien auf der Arbeitsfläche angezeigt, die die Änderungen der Begrenzungsrahmen des Designs angeben.
Das Umordnen von Objekten in einem Auto-Layout-Rahmen ist reibungsloser und intuitiver.
Wenn du Auto-Layout hinzufügst, werden die untergeordneten Objekte des Rahmens auf Abstand statt auf feste Breite gesetzt. Wenn du die Größe eines untergeordneten Objekts so änderst, dass es die volle Breite des übergeordneten Objekts einnimmt, wird es auf „Fill container“ (Container füllen) eingestellt.

Auf der Arbeitsfläche ist ein Frame ausgewählt und das Aktionsmenü ist geöffnet. Das Aktionsmenü enthält die Suchanfrage „Auto vorschlagen“ mit einem Cursor, der über dem Ergebnis „Auto-Layout vorschlagen“ schwebt.

Schau die Keynote von Config an, um Demos von Auto-Layout-Updates zu sehen!

Responsive Prototypen-Ansicht

Sieh dir deine Designs auf jeder Bildschirmgröße an, mit der Prototypen-Ansicht, die Größen gemäß den Einschränkungen und Auto-Layout-Einstellungen responsiv anpasst. Die Einstellung Responsive ist in beiden Protoyping-Ansichten (Present und Preview) und der Figma-App für Mobilgeräte verfügbar.

Die Präsentationsansicht ist mit einem Webseiten-Prototyp innerhalb eines Macbook Air-Geräter-Frames geöffnet. Es sind zwei Dropdown-Menüs geöffnet. Eines davon ist das Optionsmenü in der oberen rechten Ecke, in dem die Option „Responsive“ ausgewählt ist. Das zweite ist der Gerätewechsel in der unteren Mitte des Fensters, wo es Optionen zur Auswahl von anderen Macbook-Geräten gibt.

Seiten in FigJam

Seiten in FigJam ist für alle verfügbar.

Du kann jetzt mehrere Seiten in FigJam erstellen, die dir mehr Platz geben, deine Ideen zu entwickeln und deine Dateien noch besser zu organisieren. Dazu kannst du sogar Trennelemente zwischen den Seiten erstellen.

Mit Seiten kannst du:

Individuelle Arbeitsbereiche für Aktivitäten zwischen Arbeitsgruppen oder Einzelpersonen schaffen.
Regelmäßige Meetings in FigJam zwischen den Seiten organisieren, um Board-Größen und Ladezeiten zu reduzieren.
Arbeitsströme zwischen den Seiten trennen.

In die obere linke Ecke einer Figjam Datei gezoomt. Das Panel der Seiten ist offen und enthält mehrere Seiten für verschiedene vierteljährliche Retros sowie einen Trenner. Ein Cursor-Chat sagt „Ich liebe die Seiten“ mit einer Reihe von Herz-Emojis darüber.

So fügst du in FigJam Kommentare hinzu →

Die gesamte Config 2024 ansehen

Wenn du es nicht live dabei geschafft hast, schau dir die Keynote von der Config 2024 an und hole die Aufzeichnungen auf unserem YouTube-Kanal nach. Wir werden in der kommenden Woche weitere Videos veröffentlichen, also abonniere sie, um auf dem Laufenden zu bleiben!