Figma-Prototypen mit Passwortschutz hochladen

Erstelle mit Crypto passwortgeschützte Einbettungen von Figma-Prototypen und verwalte ihre Einstellungen.

Video-Tutorial: Einbettungen von Figma-Prototypen mit einem Passwort schützen

Dieses Video zeigt dir, wie du die Einbettungen deiner Figma-Prototypen mit dem Plugin Crypto per Passwort schützt.

Die Funktion „Live Embed“ in Crypto legt die öffentliche Einbettung deines Figma-Prototyps hinter eine sichere URL mit Passwort, die du mit anderen teilen kannst. Diese sehen sich deine Designs dann in der Web-App von Crypto an, ohne ein Figma-Konto zu brauchen.

Die zugrunde liegende Figma-URL bleibt öffentlich. Aufgrund der Funktionsweise von Freigabelinks in Figma kann Crypto eine öffentliche Figma-URL-Einbettung nur in eine passwortgeschützte URL einbetten. Das bedeutet, dass jeder mit der zugrunde liegenden Figma-URL sie weiterhin ansehen kann. Bei Bedarf kannst du die passwortgeschützte URL über das Crypto-Plugin löschen und/oder die Berechtigungen der Figma-Datei auf only people invited to this file ändern, um den Zugriff zu entziehen.

In den Prototyp-Modus wechseln ​

Um mit dieser Funktion zu starten, wähle in der Symbolleiste des Crypto-Plugins Figma Prototype (Live Embed) aus.

Übergeordnete Figma-Frames erforderlich. Damit du einen Figma-Prototyp hochladen kannst, muss deine Figma-Seite mindestens einen „übergeordneten Frame“ enthalten. Gemeint sind alle Frames, die sich direkt unter deiner Seite befinden.

Die zu verwendende Figma-URL kopieren ​

Optionen für deinen Prototyp festlegen ​

Beim Erstellen passwortgeschützter Links für deine Figma-Prototypen kannst du einige Optionen festlegen:

Skalierungsoptionen ​

In diesem Dropdown wählst du, wie dein Prototyp im Browser skaliert wird. Es gibt folgende Optionen:

  • 100% – In voller Größe anzeigen
  • Fit – Passend verkleinern
  • Fill – Füllend verkleinern oder vergrößern
  • Scale down to fit width (Standard)

Hotspots ​

Ist der Schalter Hotspots aktiviert, zeigt der Prototyp anklickbare Hotspots in deinen Designs an, wenn jemand auf den Bildschirm klickt. Bleibt er deaktiviert, werden keine Hinweise auf anklickbare Hotspots angezeigt.

Ist der Schalter Sidebar aktiviert, wird die seitliche Navigationsleiste deines Figma-Prototyps im Browser angezeigt. Bleibt er deaktiviert, sieht der Nutzer sie nicht.

Die URL für deinen passwortgeschützten Prototyp erstellen ​

Die zugrunde liegende Figma-URL bleibt öffentlich. Aufgrund der Funktionsweise von Freigabelinks in Figma kann Crypto eine öffentliche Figma-URL-Einbettung nur in eine passwortgeschützte URL einbetten. Das bedeutet, dass jeder mit der zugrunde liegenden Figma-URL sie weiterhin ansehen kann. Bei Bedarf kannst du die passwortgeschützte URL über das Crypto-Plugin löschen und/oder die Berechtigungen der Figma-Datei auf only people invited to this file ändern, um den Zugriff zu entziehen.

Um den passwortgeschützten Link zu deinem Prototyp zu erstellen, klick auf Share Prototype URL und dann auf Create Prototype URL.

Nach dem Upload kannst du die sichere URL und das Passwort kopieren und die Einbettung deines Figma-Prototyps in der Web-App von Crypto im Browser ansehen.

Jeder Upload gehört zu der Figma-Seite, auf der er gestartet wurde. Wechselst du die Seite, werden die Einstellungen und der Versionsverlauf dieser Seite geladen; geh zurück zur ursprünglichen Seite, um einen dort abgeschlossenen Upload zu finden. Warte, bis ein laufender Upload oder eine Aktualisierung der Einstellungen fertig ist, bevor du auf derselben Seite einen neuen Vorgang startest.

URL und Passwort findest du später im Plugin wieder. Wenn du URL und Passwort später noch einmal kopieren musst, klick in der Symbolleiste des Crypto-Plugins auf Share Prototype URL. Unter Secure URL Details werden dann URL und Passwort des Prototyps zum Kopieren angezeigt.

Die zugrunde liegende Figma-URL bleibt öffentlich. Aufgrund der Funktionsweise von Freigabelinks in Figma kann Crypto eine öffentliche Figma-URL-Einbettung nur in eine passwortgeschützte URL einbetten. Das bedeutet, dass jeder mit der zugrunde liegenden Figma-URL sie weiterhin ansehen kann. Bei Bedarf kannst du die passwortgeschützte URL über das Crypto-Plugin löschen und/oder die Berechtigungen der Figma-Datei auf only people invited to this file ändern, um den Zugriff zu entziehen.

Die Einstellungen der Prototyp-URL aktualisieren ​

Manchmal möchtest du die Prototyp-URL von Crypto aktualisieren, die du erstellt und an jemanden geschickt hast. Dazu klickst du in der Symbolleiste des Crypto-Plugins auf Share Prototype URL, änderst nach Bedarf die URL der Figma-Datei oder die Prototyp-Optionen und klickst dann auf Update Existing Prototype URL.

Das Passwort deiner Crypto-URL ändern ​

Standardmäßig erzeugt das Crypto-Plugin ein sicheres, zufälliges Passwort für dich. Möchtest du stattdessen ein eigenes Passwort verwenden, aktiviere in den Upload-Einstellungen im Bereich Set Password for Crypto URLs on this page den Schalter Change Password, gib dein neues Passwort in das Eingabefeld ein (mindestens 6 Zeichen) und klick auf Set New Password. Damit wird das Passwort deiner Crypto-URL für diese Figma-Seite aktualisiert.

Statische Designs und Prototyp-URLs teilen sich pro Figma-Seite dasselbe Passwort. Wenn du statische Designs und einen Prototyp auf derselben Figma-Seite hochlädst, beachte, dass jede Figma-Seite nur ein einziges Passwort für beide URLs hat. Änderst du das Passwort für die eine, ändert sich auch das der anderen.

Ein neues Passwort sperrt alle aus, die das bisherige Passwort hatten. Nach der Änderung kann niemand mehr mit dem alten Passwort deine URL ansehen. Wenn diese Personen weiterhin Zugriff haben sollen, teile das neue Passwort erneut mit ihnen.

Die Prototyp-URL löschen ​

Bei Bedarf kannst du die passwortgeschützte URL über das Crypto-Plugin löschen und/oder die Berechtigungen der Figma-Datei auf only people invited to this file ändern, um den Zugriff zu entziehen.

Figma-Prototypen ansehen ​

Bei deinem passwortgeschützten Figma-Prototyp anmelden und damit interagieren ​

Wenn du deine URL (aus dem Figma-Plugin Crypto) im Browser öffnest, kannst du das erzeugte Passwort (aus dem Figma-Plugin Crypto) einfügen. Klick danach auf Login, um dich anzumelden und die hochgeladenen Designs anzusehen.

Da die Web-App von Crypto die native Einbettung des Figma-Prototyps nutzt, funktioniert die Interaktion mit deinem Prototyp genau so wie beim Ansehen in Figma. Ausführliche Informationen dazu findest du im offiziellen Hilfeartikel von Figma Preview designs and prototypes in Presentation View.

Tastenkürzel für Figma-Prototypen nutzen ​

Da die Web-App von Crypto die native Einbettung des Figma-Prototyps nutzt, gelten genau dieselben Tastenkürzel wie beim Ansehen des Prototyps in Figma. Um diese Tastenkürzel in der Web-App von Crypto zu sehen, fahr mit der Maus über das Symbol Keyboard in der Symbolleiste.

Verfügbare Tastenkürzel beim Ansehen des Prototyps ​

  • Change View Size (Z)
  • Toggle Fullscreen (F)
  • Restart Prototype (R)
  • Previous Screen (←)
  • Next Screen (→)
  • Advance Prototype (Enter)

Die Symbole der Symbolleiste ein- und ausblenden ​

Wenn die Symbolleiste der Web-App von Crypto beim Ansehen deines Prototyps nicht sichtbar sein soll, klick in der Symbolleiste der Web-App von Crypto auf das Symbol Visibility. Damit blendest du die Symbole ein oder aus. Fährst du wieder mit der Maus über das Symbol Visibility, wird es sichtbar, und ein erneuter Klick blendet die Symbolleiste wieder ein.

Die Figma-Einbettung erneut fokussieren. Klick nach dem Ein- oder Ausblenden der Symbole oder nach der Nutzung eines anderen Steuerelements der Crypto-Symbolleiste erneut auf den Figma-Prototyp, bevor du seine Tastenkürzel verwendest.