Bevor du anfängst
Wer kann diese Funktion verwenden
Verfügbar in allen Abos.
Alle Personen mit Schreibzugriff auf eine Datei können Prototypen erstellen.
Du möchtest mehr zur Prototyperstellung erfahren? Sieh dir unseren Leitfaden zur Prototyperstellung in Figma an.
Eine Aktion beschreibt den nächsten Schritt oder Vorgang beim Prototypen. Es ist die Antwort vom Vorgang, der diese Interaktion ausgelöst hat. Mögliche Aktion sind beispielsweise, das Navigieren zu einem anderen Rahmen oder das Öffnen einer externen URL.
Weitere Informationen zu Prototyperstellung mit Interaktionen und Animationen →
Aktionstypen
Navigate to (Navigieren zu)
Diese Aktion bringt dich von einem Rahmen zu einem anderen Rahmen innerhalb eines Prototypen . Es ist der häufigste Aktionstyp, den man zum Bewegen zwischen ganzen Ansichten verwendet.
Back (Zurück)
Hiermit kannst du zum vorherigen Bildschirm zurückkehren. Dies eignet sich optimal zum Simulieren der Taste Zurück deines Prototyps.
Variable festlegen
Die Aktion Set variable (Variable festlegen) ermöglicht es dir, den Wert einer Variable als Ergebnis eines Prototypen-Auslösers festzulegen oder diesen zu bearbeiten.
Erfahre mehr zur Verwendung von Variablen in Prototypen →
Bedingungen
Prüfe mit einer bedingten If/Else-Anweisung, ob eine Bedingung erfüllt ist, bevor du eine Aktion ausführst.
Erfahre mehr zur Verwendung von Bedingungen →
Scroll to (Scrollen zu)
Mit dieser Aktion scrollt dein Prototyp – oder ein eingebetteter, scrollbarer Container – zu einem beliebigen Objekt innerhalb des Rahmens der obersten Ebene. Dies ist nützlich, um Ankerlinks und Interaktionen mit scrollbaren Elementen wie Karussells zu replizieren.
Wenn du Scroll to (Scrollen zu) im Abschnitt Interactions (Interaktionen) des Prototyp-Tabs hinzufügst, kannst du nur direkt untergeordnete Objekte von scrollbaren Rahmen auswählen. Um ein beliebiges Objekt innerhalb des Rahmens der obersten Ebene auszuwählen, ziehe eine Linie heraus und verknüpfe sie mit dem gewünschten Zielobjekt.
Mit Scroll to (Scrollen zu) kannst du die Scroll-Animation auf Instant (Sofort) setzen oder mit der Option Animate (Animieren) ein Easing einrichten.
Hinweis: Um eine Verbindung zu einem Ziel zu ziehen, das durch einen zugeschnittenen Rahmen verborgen ist, deaktiviere im Rahmen-Abschnitt des Bedienfelds Design die Option Clip content (Inhalte abschneiden), um zuerst den Zielrahmen freizugeben.
Open Link (Link öffnen)
Mit dieser Aktion kannst du Nutzer*innen zu einer URL außerhalb des Prototyps leiten. Dies eignet sich optimal für externe Links oder zusätzliche Ressourcen, die nicht in der Hauptnavigation verfügbar sind.
Wähle die Option aus und gib die URL in das dafür vorgesehene Feld ein.
Tipp! Wenn du auf den Hotspot Open URL (URL öffnen) klickst, wird der Link in einem neuen Tab geöffnet. Handelt es sich hierbei um einen Link zu einer externen Website, werden die Nutzer*innen benachrichtigt, dass sie Figma verlassen. Durch Aktivieren des Kontrollkästchen kannst du diese Brückenseite in Zukunft überspringen. Diese Einstellung wird nur auf dem aktuellen Gerät gespeichert.
Open Overlay (Overlay öffnen)
Mit dieser Aktion wird der Zielrahmen über dem aktuellen Rahmen geöffnet. Dies kann verwendet werden, um eine Ansicht, QuickInfo oder Warnmeldung anzuzeigen – von einer Schaltfläche oder einem anderen Objekt im Design aus.
Close Overlay (Overlay schließen)
Mit dieser Aktion kannst du alle Overlays im ursprünglichen Rahmen schließen oder ausblenden. Repliziere damit beispielsweise das Bestätigen oder Verwerfen einer Bildschirmanweisung oder Warnmeldung.
Overlay tauschen
Diese Aktion eermöglicht dir einen Rahmen durch einen anderen zu ersetzen. Dies ähnelt der Option Navigate to (Navigiere zu), wenn sie von einem Hotspot in einem normalen Rahmen ausgelöst wird.
Wenn du Swap overlay (Overlay tauschen) auf einen Hotspot in einem Overlay anwendest, wird das aktuelle Overlay durch den neuen Zielrahmen ersetzt. Das neue Overlay übernimmt die Overlay-Einstellungen des Originals.
Hinweis: Mit der Option Swap overlay (Ersetzen durch) wird der Rahmen nicht im Prototypenverlauf protokolliert. Wenn du möchtest, dass Nutzer*innen mit der Aktion Back (Zurück) zwischen Overlays wechseln können, empfehlen wir, stattdessen die Option Navigate to (Navigieren zu) zu verwenden.
Video abspielen/anhalten
Die Aktion Play/pause video (Video abspielen/anhalten) kann für Interaktionen verwendet werden, die an einem Video enden. Wenn die Option aktiviert ist, können die folgenden Aktionen verwendet werden:
- Play video (Video abspielen) – Abspielen des Videos starten
- Pause video (Video anhalten) – Abspielen des Videsos anhalten
- Toggle play/pause (Abspielen/anhalten umschalten) – Umschalten zwischen Abspielen und Anhalten eines Videos
Erfahre mehr über das Prototyping mit Video →
Video laut-/stummschalten
Die Aktion Mute/unmute video (Video laut-/stummschalten) ist verfügbar für alle Interaktionen, die bei einem Video enden. Wenn die Option aktiviert ist, können die folgenden Aktionen verwendet werden:
- Mote video (Video stummschalten) – Ton des Videos ausschalten
- Unmute video (Videostummschaltung deaktivieren) – Den Ton des Videos auf laut stellen
- Toggle mute/unmute (Laut-/Stummschaltung umschalten) – Umschalten zwischen ein- und ausschalten des Tons vom Video
Erfahre mehr über das Prototyping mit Video →
Startzeit setzen
Die Aktion Set to specific time (Startzeit setzen) ist verfügbar für alle Interaktionen, die bei einem Video enden. Diese Aktion springt zu einem Zeitmarker im Video. Diesen kannst du einstellen, nachdem du die Aktion Set to specific time ausgewählt hast.
Hinweis: Wenn du einen Zeitmarker eingibst, der größer als die Gesamtlänge des Videos ist, springt die Aktion zum Ende des Videos. Wenn die Einstellung Video in Schleife abspielen eingeschaltet ist, beginnt das Video dann wieder von vorn.
Erfahre mehr über das Prototyping mit Video →
Zeitlich vor- und zurückspringen
Die Aktion Jump forward/backward in time (Zeitlich vor- und zurückspringen ist verfügbar für alle Interaktionen, die bei einem Video enden. Wenn die Option aktiviert ist, können die folgenden Aktionen verwendet werden:
- Jump forward (Vorwärts springen) – Gib eine Sekundenzahl an, um beim Abspielen eines Videos vorzuspulen.
- Jump backward (Rückwärts springen) – Gib eine Sekundenzahl an, um beim Abspielen eines Videos zurückzuspulen.
Diese Aktion kann hilfreich beim Design einer interaktiven Videosequenz sein.
Hinweis: Wenn du über die Gesamtlänge des Videos hinausspringst, springt die Aktion zum Ende des Videos. Wenn die Einstellung Video in Schleife abspielen eingeschaltet ist, beginnt das Video dann wieder von vorn.
Erfahre mehr über das Prototyping mit Video →
Ändern zu
Die Aktion Change to (Ändern zu) ist beim Prototyping mit interaktiven Komponenten verfügbar.
Verwende die Aktion Change to (Ändern zu), um zwischen Varianten innerhalb einer Komponentengruppe zu wechseln. Beispielsweise hast du eine Komponentengruppe für ein Kontrollkästchen-Symbol, einmal mit einer angehakten Variante und einmal mit einer leeren Variante. Mit der Aktion Change to (Ändern zu) kannst du zwischen beiden Varianten im Prototyp hin- und herwechseln.
Tipp: Du kannst die Aktion Change to (Ändern zu) für verschachtelte Instanzen nutzen, um die übergeordnete Komponentenvariante zu wechseln.