Video-Tutorial: Statische Figma-Designs mit einem Passwort schützen

Dieses Video zeigt dir, wie du deine Figma-Designs mit dem Plugin Crypto per Passwort schützt.

Die Funktion „Static Frames“ in Crypto lädt über das Figma-Plugin Crypto Bilder deiner übergeordneten Frames der obersten Ebene von der aktuellen Figma-Seite hoch und erzeugt eine sichere URL samt 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.

Um mit dieser Funktion zu starten, wähle in der Symbolleiste des Crypto-Plugins Figma Designs (Static Frames) aus.

Frames zum Hochladen auswählen und abwählen

Wähle zuerst in der Symbolleiste des Crypto-Plugins Figma Designs (Static Frames) aus.

Jetzt kannst du die Frames deiner aktuellen Figma-Seite auswählen, die du als Designs über deinen passwortgeschützten Link teilen möchtest.

Crypto lädt alle „übergeordneten Frames“ deiner aktuellen Figma-Seite als Liste ins Plugin, aus der du die Designs zum Teilen auswählst. Klick auf das Kontrollkästchen oder das Vorschaubild eines Frames, um ihn auszuwählen; ein erneuter Klick hebt die Auswahl wieder auf.

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

Übergeordnete Figma-Frames markieren, um sie auszuwählen

Damit du die gewünschten übergeordneten Figma-Frames leichter findest, filtert das Crypto-Plugin die Liste der verfügbaren Frames automatisch auf die Frames, die du auf deiner Figma-Seite anklickst oder markierst.

Übergeordnete Figma-Frames aktualisieren

Läuft das Crypto-Plugin bereits und du möchtest übergeordnete Frames auf deiner aktuellen Figma-Seite hinzufügen oder entfernen, nimm die Änderungen einfach vor und klick dann in der Symbolleiste des Crypto-Plugins auf das Symbol Refresh frames neben der Anzahl der Frames.

Frames per Schnellsortierung ordnen

Du kannst die Reihenfolge der Frames für deine hochgeladenen Designs auf verschiedene Arten sortieren:

Frames nach der Ebenenreihenfolge in Figma sortieren

Mit der Option Sort frames by Layer Order ↓ (oder ↑ für die umgekehrte Reihenfolge) sortierst du deine Frames automatisch in der Reihenfolge ihrer Figma-Ebenen.

Frames visuell nach Spalten sortieren

Mit der Option Sort frames Left to Right oder Sort frames Right to Left sortierst du deine Frames automatisch nach ihrer visuellen Position in Spalten in deinem Figma-Design.

Frames visuell nach Zeilen sortieren

Mit der Option Sort frames Top to Bottom oder Sort frames Bottom to Top sortierst du deine Frames automatisch nach ihrer visuellen Position in Zeilen in deinem Figma-Design.

Die visuelle Sortierung toleriert kleine Abweichungen in der Ausrichtung und nutzt die absolute Position jedes Frames auf dem Canvas, auch bei Frames in verschiedenen Figma-Sections.

Frames nach dem Namen der Figma-Ebene sortieren

Mit der Option Sort by Figma Layer Name ↓ (oder ↑ für die umgekehrte Reihenfolge) sortierst du deine Frames automatisch in natürlicher Reihenfolge nach den Namen ihrer Figma-Ebenen, sodass zum Beispiel Frame 2 vor Frame 10 erscheint.

Frames per Drag-and-drop manuell ordnen

Du kannst die Reihenfolge deiner Frames per Drag-and-drop selbst festlegen: Klick und halte die Maus auf dem Ziehgriff am Ende einer Frame-Zeile, zieh ihn nach oben oder unten, um seine Position unter den hochzuladenden Frames zu ändern, und lass ihn los, um die Reihenfolge zu bestätigen. Diese eigene Reihenfolge bleibt gespeichert, wenn du zwischen den Sortieroptionen wechselst. Du holst sie mit der Option Sort frames by Custom Order im Auswahlfeld für die Sortierung zurück.

Deine Designs hochladen

Wenn Auswahl und Reihenfolge der Frames passen, klick in der Symbolleiste des Crypto-Plugins auf Share Design URL. Dadurch öffnet sich das Fenster zum Teilen, in dem du mit Securely Upload Designs den Upload der Bilder startest.

Ist der Upload abgeschlossen, siehst du eine Bestätigung mit deiner sicheren URL und einem erzeugten Passwort.

Beim Duplizieren einer Figma-Datei werden auch ihre URL und ihr Passwort kopiert. Um für das Duplikat neue Zugangsdaten zu erzeugen, gib bei geöffnetem Plugin den Konami-Code ein (Up, Up, Down, Down, Left, Right, Left, Right, B, A). Crypto erstellt dann eine neue URL und ein neues Passwort, ohne die bisherige URL zu löschen.

Deine erzeugte URL öffnen

Nach dem Upload kannst du die sichere URL und das Passwort kopieren und deine ausgewählten Frames aus Figma 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 Design URL und wähle im Auswahlfeld Select Previous Version eine zuvor hochgeladene Version. Unter Secure URL Details werden dann URL und Passwort zum Kopieren angezeigt.

Eine neue Versions-URL hochladen

Nachdem du deine Designs zum ersten Mal hochgeladen hast, kannst du weitere URLs hochladen, die Versionen deiner Designs erzeugen. So behältst du verschiedene Phasen eines Designs im Blick oder erstellst unterschiedliche URLs, die jeweils andere Frames zeigen.

Eine neue Versions-URL erstellst du, indem du in der Symbolleiste des Crypto-Plugins auf Share Design URL und dann auf Upload New Version URL klickst.

Ist der Upload abgeschlossen, siehst du eine Bestätigung mit der neuen Version deiner sicheren URL und dem Passwort.

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 Design URL und wähle im Auswahlfeld Select Previous Version eine zuvor hochgeladene Version. Unter Secure URL Details werden dann URL und Passwort zum Kopieren angezeigt.

Eine zuvor hochgeladene Versions-URL von Crypto aktualisieren

Manchmal möchtest du eine frühere Versions-URL von Crypto aktualisieren, die du schon hochgeladen und an jemanden geschickt hast. Dazu klickst du in der Symbolleiste des Crypto-Plugins auf Share Design URL, wählst im Auswahlfeld Select Previous Version eine zuvor hochgeladene Version und klickst auf Update Version xxxxxxxx URL.

Dadurch werden die Designs unter der zuvor hochgeladenen URL durch die Frames ersetzt, die du jetzt im Crypto-Plugin ausgewählt hast. URL und Passwort bleiben unverändert, sodass alle, die diese Zugangsdaten bereits haben, sie weiter nutzen können.

Ist der Upload abgeschlossen, siehst du eine Bestätigung mit der neuen Version deiner sicheren URL und dem Passwort.

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 Design URL und wähle im Auswahlfeld Select Previous Version eine zuvor hochgeladene Version. Unter Secure URL Details werden dann URL und Passwort zum Kopieren angezeigt.

Beim Aktualisieren einer URL werden die zuvor hochgeladenen Designs ersetzt. Ein Klick auf Update Version xxxxxxxx URL ersetzt alle hochgeladenen Designs der ausgewählten Version. Wer die bisherige URL und das Passwort hat, sieht die aktualisierten Designs, sobald er die ihm geschickte URL erneut aufruft.

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.

Eine Versions-URL von Crypto löschen

Du kannst jede Version der sicheren URLs löschen, die du mit dem Crypto-Plugin erzeugt hast. Klick dazu in der Symbolleiste des Crypto-Plugins auf Share Design URL, wähle im Auswahlfeld Select Previous Version eine zuvor hochgeladene Version und aktiviere den Schalter I would like to delete the xxxxxxxx version URL. Danach kannst du auf Delete Version xxxxxxxx URL klicken.

Du siehst dann eine Bestätigung, dass die ausgewählte Version gelöscht wurde.

Das Löschen einer Versions-URL lässt sich nicht rückgängig machen Ein Klick auf Delete Version xxxxxxxx URL löscht alle hochgeladenen Designs der ausgewählten Version. Wer diese URL hat, kann die Designs danach nicht mehr ansehen. Du kannst aber jederzeit eine neue Version hochladen und die neue URL teilen, nachdem du die zuvor verschickte URL gelöscht hast.

Statische Figma-Designs ansehen

Bei deinen Designs anmelden

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.

Durch die Frames deines Designs navigieren

In der Web-App von Crypto wechselst du zwischen deinen Frames, indem du auf die Pfeilsymbole klickst, die Frames mit gedrückter Maustaste nach links oder rechts ziehst oder die Tasten Pfeil links bzw. Pfeil rechts auf deiner Tastatur drückst. Auch mit der Leertaste springst du zum nächsten Frame.

Zwischen den Frames deines Designs springen

Wenn du direkt zu einem bestimmten Frame deiner hochgeladenen Designs springen möchtest, nutze die Navigationsleiste unten auf der Seite in der Web-App von Crypto. Fährst du mit der Maus über die Navigationsleiste, erscheinen die Vorschaubilder aller Frames. Ein Klick auf ein Vorschaubild zeigt sofort genau diesen Frame an.

Zwischen deinen hochgeladenen Designversionen wechseln

Hast du mit dem Figma-Plugin Crypto mehrere Versionen deiner Designs hochgeladen, wechselst du in der Web-App von Crypto sofort zwischen ihnen, indem du oben links auf der Seite auf die Überschrift mit dem Auswahlfeld klickst. Wählst du eine andere Version, werden die Designs dieser Version geladen. Unter der Auswahl siehst du außerdem, wann jede Version zuletzt aktualisiert wurde.

Dark Mode umschalten

Wirken deine Designs vor einem dunklen Hintergrund besser, schaltest du den Dark Mode mit einem Klick auf das Sonnen- oder Mond-Symbol in der Symbolleiste der Web-App von Crypto ein. Ein Klick auf das Symbol wechselt zwischen dem Dark Mode und dem standardmäßigen (hellen) Modus.

Die umgebenden Elemente ein- und ausblenden

Wenn Überschrift, Pfeilsymbole, Navigationsleiste oder Symbolleiste beim Ansehen deiner Designs nicht sichtbar sein sollen, klick in der Symbolleiste der Web-App von Crypto auf das Symbol für die Sichtbarkeit. Damit blendest du alles außer den Designs selbst ein oder aus.