Design EditorDokuErste Schritte
Ihr erstes Design
Beginnen Sie auf dem Startbildschirm, zeichnen Sie ein Board, speichern Sie es als .de-Datei und sehen Sie es sich in der Vorschau an.
1Auf dem Startbildschirm beginnen
Der Startbildschirm öffnet sich beim Start der App. Er zeigt Ihre zuletzt verwendeten Dateien als Raster oder Liste und bietet Neue Datei, Datei öffnen, Vorlagen, Designsysteme und Szenenvorlagen.
Das Eingabefeld oben startet ein Design aus einem Satz. Wählen Sie, was Sie erstellen (Landingpage, Mobile App, Web-App, Folien, Dashboard oder Etwas anderes) und eine Größe (Desktop, Tablet, Mobil oder Folien), und beschreiben Sie es dann. Der integrierte Agent zeichnet es auf einer neuen Leinwand.
Die Import-Karten darunter öffnen eine Figma-Datei, eine Webseite, einen nachzubauenden Screenshot oder eine pen.dev-Datei. Cmd+N erstellt eine leere Datei, solange der Startbildschirm angezeigt wird.
2Ein Board zeichnen
- Drücken Sie
Ffür das Rahmen-Werkzeug und ziehen Sie auf der Leinwand. Ein Rahmen auf oberster Ebene ist ein Board: ein Bildschirm, ein Seitenabschnitt oder eine Folie. - Drücken Sie
R,OoderT, um darin ein Rechteck, eine Ellipse oder Text hinzuzufügen. - Wählen Sie eine Ebene aus und bearbeiten Sie Größe, Füllung, Kontur und Effekte im Panel rechts.
- Aktivieren Sie Auto-Layout für das Board, um seine untergeordneten Elemente mit Abstand und Innenabstand zu stapeln.
3Speichern
Cmd+S speichert eine .de-Datei. Sie ist reines JSON, lässt sich in git gut vergleichen und kann von Agenten gelesen werden. Bilder landen standardmäßig in einem Nachbarordner <name>.assets/; Agenten können auch eine einzelne Datei mit allen Bildern eingebettet speichern.
Es gibt keine automatische Speicherung. Wenn Sie ein Fenster mit Änderungen schließen, werden Sie gefragt, ob Sie sie speichern möchten.
4In der Vorschau ansehen
Drücken Sie Cmd+P, um die Vorschau zu öffnen. Wählen Sie oben Telefon, Desktop oder Leinwand. Als Bildschirm markierte Boards verhalten sich wie Seiten einer Website, mit Adressleiste sowie Vor- und Zurück-Navigation.
5Stattdessen mit einer Vorlage beginnen
Datei, Neu aus Vorlage öffnet die integrierten Szenenvorlagen: Karten, Vergleiche, Folien, Infografiken, Tutorials und Karussells. Speichern Sie ein beliebiges Dokument mit Datei, Als Vorlage sichern als eigene Vorlage.
Die Prompt-Bibliothek enthält fertige Prompts für Startbildschirme, mobile Apps, Webseiten, Dashboards, Komponenten und Überarbeitungen. Speichern Sie Prompts, die Sie wiederverwenden, unter Meine.