Skip to content

Unendliche Szenen und Frames

Eine Szene ist eine unendliche, verschiebbare Leinwand, die viele Zeichenflächen (Frames) enthält. Sie ist der Teiltyp, den Sie verwenden sollten, wenn Sie eine ganze Kampagne, eine Reihe von Größenvarianten oder ein kleines Designsystem auf einer Oberfläche sehen möchten, anstatt zwischen separaten Seiten zu wechseln.

Ein Frame ist hier eine Zeichenfläche, nicht der Ausschnittsrahmen, den Sie mit Auswahlwerkzeugen oder den Stiftwerkzeugen erhalten. Die beiden Funktionen teilen sich zufällig das Wort „Frame“ (Rahmen), sind aber nicht verwandt: Ein Szenen-Frame enthält ein Design, ein Auswahlrahmen maskiert einen Teil eines Bildes.

Kurzübersicht

  1. Fügen Sie über die Seitenreiter einen unendlichen Teil hinzu oder schalten Sie den aktuellen Teil über die Befehlsleiste zwischen „Einzeln“ und „Unendlich“ um.
  2. Zeichnen Sie einen Frame mit dem Frame-Werkzeug oder fügen Sie einen aus einer Vorlage oder einem gespeicherten Design hinzu.
  3. Schwenken und zoomen Sie, um Frames anzuordnen; wählen Sie mehrere Frames aus, um sie auszurichten, zu verteilen oder zu gruppieren.
  4. Machen Sie ein gemeinsames Element zu einer verknüpften Komponente, sodass alle Frames synchron bleiben.
  5. Laden Sie einen Frame als PNG herunter oder wählen Sie mehrere aus, um jeweils ein PNG herunterzuladen.

Detaillierte Referenz

Erstellen einer Szene

Eine Szene kann auf zwei Arten beginnen: Fügen Sie einen Unendlichen Teil über das Menü „+“ auf den Seitenreitern hinzu oder schalten Sie den Schalter Einzeln / Unendlich im Vorlagenbereich der Befehlsleiste um. Der Schalter setzt nur den Modus; die eigentliche Szenenseite wird verzögert erstellt, sobald Sie zum ersten Mal einen Frame hinzufügen oder eine Vorlage im unendlichen Modus ablegen. Ein Umschalten erzeugt also nie selbstständig eine leere Seite. Eine neue Szene beginnt mit einem Platzhalter-Frame, der automatisch ersetzt wird, sobald Sie zum ersten Mal echte Inhalte hinzufügen, sodass Ihre erste Vorlage als einziger Frame landet und nicht neben einem leeren steht.

Frame-Voreinstellungen

Sowohl das Frame-Werkzeug als auch der Generator für responsive Varianten verwenden dieselben fünf Größen:

VoreinstellungGröße (px)
Quadrat1080 x 1080
Hochformat1080 x 1350
Story1080 x 1920
Querformat1920 x 1080
A4595 x 842

Hinzufügen und Bearbeiten von Frames

AktionWie
Einen Frame zeichnenWählen Sie das Frame-Werkzeug und ziehen Sie; ein kurzer Zug legt stattdessen einen Standard-Quadrat-Frame ab
Eine voreingestellte Größe verwendenÖffnen Sie das Ausklappmenü des Frame-Werkzeugs für die fünf oben genannten Größen
Aus einer Vorlage hinzufügenLegen Sie ein Vorlagendesign ab; es landet als neuer Frame neben den anderen
Ein gespeichertes Design hinzufügenPlatzieren Sie eines Ihrer gespeicherten Designs auf die gleiche Weise als Frame
Größe ändernWählen Sie den Frame aus und geben Sie eine exakte Breite und Höhe ein (20 bis 20.000 px) oder wählen Sie einen Seitenverhältnis-Chip: 1:1, 16:9, 9:16, 4:3 oder 3:4
DuplizierenPlatziert eine Kopie rechts neben dem Original, in die erste freie Spalte, mit einem Kopie-Suffix im Namen
UmfärbenWählen Sie eine Hintergrundfarbe aus der Farbfeldreihe, eine benutzerdefinierte Farbe oder machen Sie ihn transparent
UmbenennenKlicken Sie auf das Namensetikett des Frames und geben Sie einen neuen ein
TaggenÖffnen Sie die Tag-Auswahl über die Kontextleiste des Frames, um Projekttags hinzuzufügen oder zu entfernen
LöschenWählen Sie den Frame aus und löschen Sie ihn wie jedes Objekt

Beim Ändern der Größe eines Frames bleibt die obere linke Ecke fixiert und der bereits darin enthaltene Inhalt wird nicht skaliert.

Bearbeiten innerhalb eines Frames

Ein Frame verhält sich normalerweise wie ein Objekt: Ein einzelner Klick wählt die gesamte Zeichenfläche aus, und Ziehen bewegt sie (und alles darin) als Einheit. Um den Inhalt zu bearbeiten, doppelklicken Sie auf den Frame, um hineinzugehen. Seine Objekte werden einzeln auswählbar, sein Hintergrund wird zu einem gesperrten Hintergrund und die anderen Frames werden abgedunkelt, damit Sie sich konzentrieren können. Drücken Sie Esc oder doppelklicken Sie auf den Hintergrund oder leeren Raum, um wieder herauszugehen; die Objekte werden wieder im Frame gruppiert und die Szene wird gespeichert. Neue Texte, Bilder und Formen, die Sie hinzufügen, werden in den aktiven Frame eingefügt, wie unter „Symbolleiste und Navigation“ unten beschrieben.

Arbeiten mit mehreren Frames gleichzeitig

Wählen Sie mit der Auswahlbox oder Umschalt-Klick mehrere Frames aus; die Auswahl beschränkt sich automatisch auf Frames. Eine Mehrfachauswahl-Leiste bietet Hintergrundfarbe, exakte Größe, Gruppieren oder Gruppierung aufheben, Ausrichten und Herunterladen pro Frame. Ausrichten funktioniert an sechs Kanten (links, zentriert, rechts, oben, Mitte, unten), und Verteilen ordnet Frames gleichmäßig entlang einer Zeile oder Spalte an, wobei mindestens ein kleiner Abstand zwischen ihnen bleibt. Gruppierte Frames bewegen sich zusammen, und die Auswahl eines beliebigen Mitglieds einer Gruppe wählt die gesamte Gruppe aus.

Leistung und ruhende Frames

Eine Szene enthält standardmäßig bis zu 200 Frames; das Hinzufügen weiterer zeigt einen Limit-Hinweis an. Damit sich einige hundert Frames flüssig schwenken und zoomen lassen, werden Frames, die weit außerhalb des sichtbaren Bildschirmbereichs liegen, in eine leichte, zwischengespeicherte Miniaturansicht umgewandelt (begrenzt auf etwa 400 px auf der langen Seite) und wachen wieder zu vollständig bearbeitbaren Objekten auf, sobald Sie sich ihnen wieder nähern. Das Aufwachen verwendet einen kleinen Bereich um den Bildschirmrand, sodass ein Frame normalerweise kurz bevor er hineinscrollt, aufwacht, und die Überprüfung erfolgt einen Bruchteil einer Sekunde, nachdem ein Schwenk- oder Zoomschritt abgeschlossen ist, nicht bei jedem Frame der Geste. Ruhen und Aufwachen fügen keine Rückgängig-Schritte hinzu.

Filtern von Frames nach Tag

Sobald Ihr Projekt Tags hat, ermöglicht eine Filterleiste das Umschalten von Tag-Chips, um einzugrenzen, welche Frames hervorgehoben werden, zwischen Übereinstimmung aller Tags oder irgendeines Tags zu wechseln, die Übereinstimmung umzukehren und den Filter mit einem Klick zu löschen. Eine Cluster-Aktion gruppiert die übereinstimmenden Frames in ordentlichen Blöcken, und Sie können einen Filter als benannte Ansicht speichern, um später darauf zurückzukommen.

Verknüpfte Komponenten

Machen Sie ein ausgewähltes Element zu einer verknüpften Komponente, und es wird in jeden anderen Frame an derselben relativen Position geklont. Das Bearbeiten der Füllung, des Strichs, der Größe, des Textes, der Schriftart oder des Schattens einer Instanz aktualisiert sofort jede andere Instanz, während jede Instanz ihre eigene Position behält. So bleibt ein gemeinsamer Header oder Button visuell konsistent, kann aber dennoch korrekt in einem anders geformten Frame sitzen. Das erneute Verknüpfen nach dem Hinzufügen neuer Frames erweitert die Synchronisation auch auf diese.

Responsive Varianten

Erzeugen Sie in einem Schritt eine vollständige Reihe von plattformgerechten Kopien aus einem Frame, unter Verwendung derselben fünf oben aufgeführten Größen. Jede Variante wird unterhalb des Quell-Frames platziert, mit proportional geklontem und skaliertem Inhalt, bereit für plattformspezifische Anpassungen. So wird aus einem Layout eine passende Reihe korrekt dimensionierter Frames.

Anwenden einer Marke

Wenden Sie mit einem aktiven Marken-Kit dessen Farben und Schriftart auf einen einzelnen Frame oder auf alle Frames der Szene gleichzeitig an, einschließlich der gerade ruhenden Frames. Frame-Hintergründe übernehmen die Körperfarbe der Marke, Text wechselt zur Schriftart und Textfarbe der Marke, und andere Formen übernehmen die Primärfarbe der Marke. Siehe Markenübersicht.

Exportieren von Frames

Die Aktion Herunterladen in der Frame-Leiste rendert den ausgewählten Frame (Hintergrund und Inhalt) als PNG und lädt ihn herunter. Wenn mehrere Frames ausgewählt sind, wird für jeden Frame ein eigenes PNG heruntergeladen, kein einzelnes Archiv. Um viele Frames als eine ZIP-Datei zu erhalten, wählen Sie sie im Works-Browser aus und verwenden Sie dessen teilspezifischen Massenexport. Siehe Exportieren einer Seite für allgemeine Exportoptionen.

Symbolleiste und Navigation

Die schwebende Symbolleiste enthält Auswählen/Verschieben, ein Hand-Werkzeug zum Schwenken, Frame, Bild, Text, die Stiftwerkzeuge, Formen und ein „Mehr“-Menü für Haftnotizen, Hinzufügen einer Vorlage, einen Raster-Umschalter und einen Smart-Snap-Umschalter. Wenn Sie mit der Maus über Auswählen, Frame oder den Stift-Button fahren, öffnet sich ein kleines Ausklappmenü mit Varianten und Größen; Formen und „Mehr“ öffnen sich durch Klicken. Scrollen Sie, um auf den Zeiger hin zwischen 5 % und 800 % zu zoomen, halten Sie die Leertaste gedrückt oder ziehen Sie mit der mittleren Maustaste, um zu schwenken, und drücken Sie Esc, um das aktuelle Werkzeug zu verlassen, ein Ausklappmenü zu schließen oder die Auswahl aufzuheben. Das Zeichnen eines Frames schaltet Sie danach zurück zu Auswählen; halten Sie Alt gedrückt, während Sie den Zug beenden, um das Frame-Werkzeug aktiv zu lassen und mehrere hintereinander zu zeichnen.

Ein neues Objekt (eine Form, ein Bild, Text, ein Symbol, ein QR-Code usw.) wird automatisch dem aktiven Frame hinzugefügt und zentriert darin abgelegt. Der aktive Frame ist der, den Sie ausgewählt haben, der Frame, den Sie gerade bearbeiten, oder, wenn nichts ausgewählt ist, der Frame, der dem Mittelpunkt Ihrer Ansicht am nächsten ist. Haftnotizen aus dem „Mehr“-Menü sind die Ausnahme: Sie schweben immer frei auf Szenenebene und werden nie in einen Frame aufgenommen.

Schritt für Schritt

Eine Szene wie ein Moodboard oder einen Multi-Screen-Ablauf anordnen

  1. Fügen Sie einen unendlichen Teil über das Menü „+“ auf den Seitenreitern hinzu oder schalten Sie den Schalter „Einzeln / Unendlich“ in der Befehlsleiste auf „Unendlich“.
  2. Drücken Sie F für das Frame-Werkzeug. Ziehen Sie jede Zeichenfläche auf oder fahren Sie mit der Maus über den Frame-Button und wählen Sie eine voreingestellte Größe (Quadrat, Hochformat, Story, Querformat oder A4). Ein schneller Klick ohne Ziehen legt einen Standard-Frame von 1080 x 1080 ab.
  3. Füllen Sie jeden Frame: Wählen Sie einen Frame aus (oder doppelklicken Sie hinein), fügen Sie Text mit T, Bilder mit I und Formen mit R hinzu. Jedes neue Objekt zentriert sich im aktiven Frame.
  4. Drücken Sie V, um zu Auswählen zurückzukehren, wählen Sie mehrere Frames mit der Auswahlbox aus und verwenden Sie die Mehrfachauswahl-Leiste, um sie in ordentlichen Zeilen oder Spalten auszurichten und die Abstände gleichmäßig zu verteilen.

Einen neuen Frame zeichnen und ihm einen Namen geben

  1. Drücken Sie F, ziehen Sie dann auf der leeren Leinwand, um die Zeichenfläche in der gewünschten Größe aufzuspannen; eine gestrichelte Vorschau folgt Ihrem Cursor.
  2. Lassen Sie los, um den Frame zu erstellen. Das Werkzeug schaltet zurück zu Auswählen, sodass Sie ihn sofort neu positionieren können (halten Sie Alt gedrückt, wenn Sie loslassen, wenn Sie weitere Frames zeichnen möchten).
  3. Jeder Frame trägt ein Namensetikett direkt darüber. Klicken Sie auf das Etikett in der Kontextleiste des Frames, geben Sie einen neuen Namen ein und drücken Sie Eingabe. Das Etikett auf der Leinwand wird entsprechend aktualisiert.

In einer großen Szene schwenken und zoomen, ohne den Überblick zu verlieren

  1. Scrollen Sie, um auf den Zeiger hin zu zoomen (5 % bis 800 %). Halten Sie die Leertaste gedrückt und ziehen Sie, wechseln Sie mit H zum Hand-Werkzeug oder ziehen Sie mit der mittleren Maustaste, um von überall zu schwenken.
  2. Die Namensetiketten der Frames bewegen sich beim Verschieben über jeder Zeichenfläche mit und werden beim Herauszoomen auf die Breite des Frames abgeschnitten, sodass Sie immer sehen können, wo Sie sind.
  3. Um eine unübersichtliche Szene neu zu ordnen, taggen Sie die Frames, öffnen Sie die Tag-Filterleiste und verwenden Sie deren Cluster-Aktion, um die Frames in ordentliche Blöcke zu gruppieren, die nach ihrem ersten Tag geordnet sind.

Einen einzelnen Frame für sich verwenden

  1. Klicken Sie einmal auf einen Frame, um die gesamte Zeichenfläche auszuwählen; doppelklicken Sie nicht, da Sie sonst hineingehen würden.
  2. Wählen Sie in der Kontextleiste des Frames Herunterladen, um nur diesen Frame als PNG zu rendern.
  3. Um das Design des Frames anderswo wiederzuverwenden, speichern Sie ein Element darin unter Meine Formen oder erzeugen Sie plattformgerechte Kopien mit responsiven Varianten. Für eine Charge von Frames als einzelne ZIP-Datei wählen Sie sie im Works-Browser aus und verwenden Sie dessen Massenexport.

Häufige Aufgaben

  • Ein Design, alle Plattformgrößen: Wählen Sie einen fertigen Frame aus und erzeugen Sie responsive Varianten. Sie erhalten eine Kopie in jeder der anderen voreingestellten Größen, unterhalb der Quelle platziert, mit skaliertem Inhalt, bereit für plattformspezifische Anpassungen.
  • Einen gemeinsamen Header oder Button synchron halten: Wählen Sie das Element aus und verknüpfen Sie es als Komponente. Eine verknüpfte Kopie wird in jedem anderen Frame an derselben relativen Position abgelegt, und das Bearbeiten der Füllung, des Textes, der Schriftart, der Größe oder des Schattens einer Instanz aktualisiert alle, während jede ihre eigene Position behält.
  • Eine Marke in einem Schritt anwenden: Wenden Sie mit einem aktiven Marken-Kit die Farben und Schriftart auf einen einzelnen Frame oder die gesamte Szene gleichzeitig an, einschließlich ruhender Frames. Siehe Markenübersicht.
  • Frames gruppieren, die zusammengehören: Wählen Sie mehrere aus und wählen Sie „Gruppieren“. Gruppierte Frames bewegen sich zusammen, und das Klicken auf einen wählt die gesamte Gruppe aus; wählen Sie „Gruppierung aufheben“, um sie freizugeben.
  • Hintergrund eines Frames umfärben: Öffnen Sie die Hintergrund-Farbfelder in der Frame-Leiste, wählen Sie eine Voreinstellung oder eine benutzerdefinierte Farbe aus oder machen Sie ihn transparent, sodass der gepunktete Hintergrund durchscheint.

Fehlerbehebung

Frames sehen beim Herauszoomen weich oder niedrig aufgelöst aus

Frames, die weit außerhalb des Bildschirms liegen, werden gegen eine zwischengespeicherte Miniaturansicht (ca. 400 px auf der langen Seite) ausgetauscht, um das Schwenken flüssig zu halten. Diese Proxy-Darstellung kann etwas weich aussehen. Scrollen Sie zurück zum Frame, und er wacht in der vollauflösenden, bearbeitbaren Version auf. Exporte rendern immer in voller Auflösung, unabhängig vom Ruhezustand eines Frames.

Ein neues Objekt ist im falschen Frame gelandet. Neue Objekte gehen in den aktiven Frame: den ausgewählten Frame, den Frame, den Sie gerade bearbeiten, oder den, der dem Mittelpunkt der Ansicht am nächsten ist. Wählen Sie zuerst den Zielframe aus und fügen Sie dann das Objekt hinzu, oder ziehen Sie ein freies Objekt über einen Frame und legen Sie es ab, um es aufzunehmen.

Sie können nicht auf ein Element innerhalb eines Frames klicken. Ein einzelner Klick wählt den gesamten Frame als Einheit aus. Doppelklicken Sie auf den Frame, um hineinzugehen, klicken Sie dann auf das Element, und drücken Sie Esc, um wieder herauszugehen.

Das Ändern der Größe eines Frames hat dessen Inhalt nicht skaliert. Das ist beabsichtigt: Eine Größenänderung behält die obere linke Ecke bei und lässt den Inhalt an seinem Platz. Um ein Layout in eine andere Form zu skalieren, verwenden Sie stattdessen responsive Varianten.

Eine Haftnotiz lässt sich nicht an einem Frame befestigen. Haftnotizen leben immer frei auf Szenenebene – das ist beabsichtigt, damit sie nie einen Frame verzerren. Verwenden Sie Text (das T-Werkzeug) für Text, der zu einem Frame gehören soll.

„Ausrichten“ schien Frames zu verstecken. Das tut es nicht: Das Ausrichten einer Kante, die Frames überlappen lassen würde, ordnet sie in einer Zeile oder Spalte mit einem kleinen Abstand neu an, sodass jeder Frame sichtbar bleibt.

Tastaturkürzel

KürzelAktion
VAuswählen / Verschieben
HHand (schwenken)
FFrame
IBild
TText
PBézier-Stift
Umschalt + PFreihandstift
LLinienwerkzeug
RFormen
EscAktuelles Werkzeug verlassen, Ausklappmenü schließen oder Auswahl aufheben

Tipps

Einfachklick wählt aus, Doppelklick bearbeitet

Klicken Sie einmal auf einen Frame, um die gesamte Zeichenfläche als Einheit zu verschieben oder ihre Größe zu ändern. Doppelklicken Sie, um hineinzugehen und deren Inhalt zu bearbeiten; die anderen Frames werden abgedunkelt, damit Sie sich konzentrieren können. Esc geht wieder hinaus.

Verwechseln Sie nicht die beiden „Frames“

Die Frames einer Szene sind Zeichenflächen, in denen Sie entwerfen. Der Frame, den Sie mit den Auswahlwerkzeugen oder den Stiftwerkzeugen erhalten, ist ein Ausschnittsrahmen um einen Teil eines Bildes. Siehe Auswahlwerkzeuge.

Verwandte Themen