Statusmanagement für Prototypen
Bevor du beginnst
Wer diese Funktion verwenden kann
Verfügbar für jedes Team und jeden Plan.
Alle Personen mit Schreibzugriff auf eine Datei können Prototypen erstellen.
Bei Prototypen sollen sich unsere Interaktionen so real wie möglich anfühlen – vor allem dann, wenn wir zwischen verschiedenen Frames hin- und hernavigieren.
Statusmanagement ermöglicht es uns, die Eigenschaften und den Status eines Objekts zu bewahren, wenn wir beim Abspielen von Prototypen innerhalb und zwischen Frames navigieren.
Statusmanagement kann mit interaktiven Komponenten, Scroll-Position und Videos in Prototypen auf drei Arten verwendet werden:
- Statusmemorisierung: Speichere den Status eines Objekts, wenn du den Frame verlässt und zu ihm zurückkehrst
- Status teilen: Teile den Status zwischen übereinstimmenden Objekten in unterschiedlichen Frames
- Status zurücksetzen: Setze bei jeder Interaktion den Objektstatus zurück
Damit der Status Frame-übergreifend geteilt werden kann, müssen die Objekte übereinstimmen.
Hinweis: Bei neuen Interaktionen wird die Scroll-Position automatisch geteilt, solange die Objektnamen Frame-übergreifend übereinstimmen.
Für Interaktionen, die vor dem 24. Mai 2023 getätigt wurden, wird die Scroll-Position nur dann geteilt, wenn die Einstellung Scroll-Position beibehalten aktiviert ist. Diese Einstellung ist bei neuen Interaktionen nicht verfügbar, da dieses Verhalten standardmäßig eingestellt ist.
Vor einem Update auf ein neues Statusmanagement empfehlen wir, zu überprüfen, dass deine Frames und Objekte richtig benannt sind, sodass die Scroll-Position erwartungsgemäß Frame-übergreifend geteilt wird. Wenn du die Scroll-Position nicht teilen willst, musst du deine Ebenen umbenennen, sodass sie nicht übereinstimmen, oder die Funktion Scroll-Position zurücksetzen aktivieren.
Statusmemorisierung
Wenn du zwischen Frames hin- und hernavigierst, werden Objekte in ihrem letzten gespeicherten Status wieder geöffnet.
Interaktive Komponenten
Figma speichert die letzte gespeicherte Variante der interaktiven Komponente.
Zum Beispiel kann eine interaktive Komponente für ein Kontrollkästchen vorhanden sein. Wenn du die interaktive Komponente auf die markierte Variante einstellst, speichert Figma den Status dieser Variante. Das heißt: Wenn du aus dem Frame herausnavigierst und später zu ihm zurückkehrst, verbleibt die interaktive Komponente im markierten Status.
Scroll-Position
Figma speichert deine Scroll-Position.
Zum Beispiel kann auf einer Karte das horizontale und vertikale Scrollen aktiviert sein. Wenn du auf der Karte zu einer bestimmten Stelle scrollst, speichert Figma die Position, an die du gescrollt hast. Das heißt: Wenn du aus dem Frame herausnavigierst und später zu ihm zurückkehrst, wird deine Scroll-Position auf der Karte wiederhergestellt.
Videos
Figma speichert den Abspielstatus aller Videos, die in deinen Prototypen verwendet werden.
Zum Beispiel beginnst du die Wiedergabe eines Videos auf einem Frame. Wenn du die 5-Sekunden-Marke erreichst, navigierst du zu einem anderen Frame. Wenn du zum ursprünglichen Frame zurückkehrst, wird das Video ab der 5-Sekunden-Marke an der Stelle weiter abgespielt, an der du aufgehört hast.
Status teilen
Wenn du zwischen Frames mit übereinstimmenden Objekten navigierst, wird der Status des ersten Objekts auf das zweite Objekt übertragen.
Interaktive Komponenten
Figma teilt den Status zwischen übereinstimmenden interaktiven Komponenten. Der Status wird erst geteilt, wenn bereits eine erste Interaktion mit der Komponente stattgefunden hat.
Zum Beispiel kann eine interaktive Komponente für ein Kontrollkästchen vorhanden sein, mit einer Instanz der nicht markierten Variante auf jedem von zwei Frames. Wenn du deinen Prototyp abspielst, aktivierst du das Kontrollkästchen im ersten Frame. Wenn du dann zum zweiten Frame navigierst, wird die entsprechende Komponente im zweiten Frame ebenfalls auf die markierte Variante gesetzt.
Scroll-Position
Figma teilt Scroll-Positionen zwischen übereinstimmenden Objekten.
Zum Beispiel kann auf einer Karte das horizontale und vertikale Scrollen auf jedem von zwei Frames aktiviert sein. Wenn du zu einer bestimmten Stelle auf der Karte scrollst und dann zum zweiten Frame navigierst, wird das übereinstimmende Karten-Objekt auf dem zweiten Frame an die gleiche Stelle gescrollt.
Videos
Figma teilt den Abspielstatus von Videos zwischen übereinstimmenden Objekten.
Zum Beispiel beginnst du die Wiedergabe eines Videos auf einem Frame. Wenn du zu einem zweiten Frame mit einem übereinstimmenden Videoobjekt navigierst, wird das Video auf dem zweiten Frame an der Stelle weiter abgespielt, an der du aufgehört hast.
Status zurücksetzen
Wenn durch verschiedene Prototypen navigiert wird, kann es erforderlich sein, dass der Status eines Objekts auf spezifische Interaktionen zurückgesetzt werden muss. Der Objektstatus sollte auf die Interaktion zurückgesetzt werden, die zum nächsten Frame navigiert.
- Klicke auf eine Prototyp-Verbindung, um das Panel Interaktionsdetails zu öffnen.
- Wähle im Bereich Statusmanagement des Panels eine der folgenden Einstellungen aus:
- Scroll-Position zurücksetzen: Auf ursprüngliche Scroll-Position zurücksetzen
- Komponentenstatus zurücksetzen: Auf ursprünglichen Komponentenstatus gemäß der Einstellung auf der Arbeitsfläche zurücksetzen
- Videostatus zurücksetzen: Das Video nochmals von Anfang an starten und auf den ursprünglichen Abspielzustand zurücksetzen
Hinweis: Die Einstellungen für das Zurücksetzen sind nur dann auf dem Panel Interaktionsdetails zu sehen, wenn sie für die aktuell ausgewählte Interaktion relevant sind. Wenn die Interaktion beispielsweise mit einem Frame ohne Video verbunden ist, ist die Einstellung Videostatus zurücksetzen nicht vorhanden.
Interaktive Komponenten
Setze den Status von interaktiven Komponenten auf ihren ursprünglichen Status gemäß den Einstellungen in der Arbeitsfläche zurück.
Beispielsweise kann eine interaktive Komponente für einen Ladebalken mit leeren
und vollständigen
Varianten vorhanden sein.
Wenn du möchtest, dass der Ladebalken die leere
Variante neu startet, wenn auf die Reload-Schaltfläche geklickt wird, musst du die Einstellung Komponentenstatus zurücksetzen auf der Schaltflächen-Interaktion deaktivieren.
Scroll-Position
Verwende Scroll-Position zurücksetzen, um zu der ursprünglichen Scroll-Position gemäß der Einstellung auf der Arbeitsfläche zurückzukehren.
Zum Beispiel kann auf einer Karte das horizontale und vertikale Scrollen aktiviert sein. Wenn du zur ursprünglichen Scroll-Position zurückkehren willst, wenn du zwischen Frames navigierst, musst du die Einstellung Scroll-Position zurücksetzen auf der Interaktion deaktivieren.
Videos
Starte das Video neu und setze es auf den ursprünglichen Abspielzustand gemäß den Einstellungen auf der Arbeitsfläche zurück.
Zum Beispiel beginnst du die Wiedergabe eines Videos auf einem Frame. Wenn du die 5-Sekunden-Marke erreichst, navigierst du zu einem anderen Frame. Wenn du zum ursprünglichen Frame zurückkehrst und das Video von Anfang an erneut abspielen willst, musst du die Einstellung Videostatus zurücksetzen auf der Interaktion aktivieren.
Übereinstimmende Objekte
Um den Status Frame-übergreifend zu teilen, müssen die Objekte übereinstimmen.
Um Objekte zu identifizieren, die zwischen Frames übereinstimmen:
- Öffne den Tab Prototyp in der rechten Seitenleiste.
- Lasse den Mauszeiger über ein Objekt oder eine Ebene in der Arbeitsfläche schweben.
- Figma hebt das übereinstimmende Objekt in allen anderen Frames hervor, in denen es vorkommt.
Eingebettete Objekte
Objekte werden als übereinstimmend angesehen, wenn sie in der obersten Ebene Frame-übergreifend denselben Ebenen-Namen und dieselbe Parent-Gruppe aufweisen.
Tipp: Wenn du nicht willst, dass der Status über zwei Objekte hinweg geteilt wird, kannst du sie umbenennen, sodass sie nicht länger übereinstimmen.
Frames der obersten Ebene
Frames der obersten Ebene sind Frames, die direkt auf der Arbeitsfläche platziert sind. Da Frames der obersten Ebene nicht über Parent-Objekte verfügen, kannst du sie auf eine der folgenden Arten anpassen:
- Identische Ebenen-Namen verwenden
- Verwende Ebenen-Namen mit übereinstimmenden Zeichenfolgen und Schrägstrichen. Ein Frame der obersten Ebene mit dem Namen
Checkout / 1
stimmt beispielsweise mit einem weiteren Frame der obersten Ebene mit dem NamenCheckout / 2
überein, da die Zeichenfolge vor dem Schrägstrich identisch ist.
Aktualisierung auf neues Status-Management
Figma hat am 24. Mai 2023 auf seine aktuellen Status-Management-Kontrollen aktualisiert.
Für Prototyp-Interaktionen, die vor dem 24. Mai 2023 erstellt wurden, gilt:
- Interaktive Komponenten können den Status nicht Frame-übergreifend teilen
- Scrolling-Objekte können ihren Status nicht speichern, wenn sie erneut geöffnet werden
- Scrolling-Objekte können den Status nur dann Frame-übergreifend speichern, wenn die Einstellung Scroll-Position beibehalten aktiviert ist
Hinweis: Bei neuen Interaktionen wird die Scroll-Position automatisch geteilt, solange die Objektnamen Frame-übergreifend übereinstimmen.
Für Interaktionen, die vor dem 24. Mai 2023 erstellt wurden, wird die Scroll-Position nur dann geteilt, wenn die Einstellung Scroll-Position beibehalten aktiviert ist. Diese Einstellung ist bei neuen Interaktionen nicht verfügbar, da dieses Verhalten standardmäßig aktiviert ist.
Bevor du auf das neue Status-Management aktualisierst, empfehlen wir dir, zu überprüfen, dass deine Frames und Objekte richtig benannt sind, sodass die Scroll-Position erwartungsgemäß Frame-übergreifend geteilt wird. Wenn du die Scroll-Position nicht teilen möchtest, musst du deine Ebenen umbenennen, sodass sie nicht übereinstimmen, oder die Option Scroll-Position zurücksetzen aktivieren.
So aktualisierst du ältere Interaktionen entsprechend der neuen Status-Management-Kontrollen:
- Klicke auf eine Prototyp-Verbindung, um das Panel Interaktionsdetails zu öffnen.
- Klicke auf Aktualisieren.
Tipp: Um alle Interaktionen in einer Datei auf einmal zu aktualisieren, klickst du mit der rechten Maustaste auf die Arbeitsfläche und wählst Alle Interaktionen aktualisieren aus.