--- url: "/de/tinyimage/tidy.md" description: "Richte ausgewählte Figma-Ebenen aus, ordne, benenne und nummeriere sie im Arbeitsbereich Tidy von TinyImage." --- # Figma-Ebenen mit Tidy ordnen > Richte ausgewählte Figma-Ebenen aus, ordne, benenne und nummeriere sie im Arbeitsbereich Tidy von TinyImage. ### Video-Tutorial: Ebenen automatisch aufräumen und umbenennen [Embedded media](https://www.youtube-nocookie.com/embed/zXv4KhSr9qY) [Folge dem Schritt-für-Schritt-Tutorial](/tinyimage/tutorials/how-to-tidy-and-rename-layers-automatically-using-tiny-image). Mit dem Tab **Tidy** machst du aus einer ungeordneten Gruppe von Figma-Ebenen einen aufgeräumten Canvas und eine übersichtliche Ebenenliste. Tidy kann den visuellen Fluss der Auswahl erkennen, Ebenen an einem Abstandsraster ausrichten, die Ebenenreihenfolge an ihre Position auf dem Canvas angleichen, Frames fortlaufend nummeriert umbenennen und Seitenzahlen in Präsentationen aktualisieren. [Video](/assets/videos/tinyimage/compress/tidy-layers.mp4) ## Deine Auswahl vorbereiten {#prepare-your-selection} 1. Wähle in einer Figma-Design-Datei die Ebenen aus, die du ordnen willst. 2. Achte darauf, dass die ausgewählten Ebenen Geschwister mit demselben übergeordneten Element sind. 3. Öffne TinyImage und wähle den Tab **Tidy**. Die Statusanzeige der Auswahl zeigt, wie viele Ebenen bereit sind und in welchem übergeordneten Element sie liegen. Tidy verschiebt und sortiert keine Ebenen innerhalb eines übergeordneten Elements mit Auto Layout; wähle stattdessen Ebenen auf dem Canvas oder in einem normalen Frame aus. ## Tidy-Aktionen wählen {#choose-the-tidy-actions} Öffne **Actions** und aktiviere eine beliebige Kombination dieser Optionen: ### Rasterausrichtung {#grid-alignment} Erkennt das deutlichste Zeilen- oder Spaltenlayout und richtet die ausgewählten Ebenen mit dem horizontalen und vertikalen Abstand aus **Preferences** aus. Tidy toleriert kleine Versätze und Ebenen unterschiedlicher Größe, wenn sie eine gemeinsame Kante oder Mitte haben. Das ist die einzige Aktion, die standardmäßig aktiviert ist. ### Umbenennen {#renaming} Fügt fortlaufende Nummern auf Basis der Position jeder Ebene auf dem Canvas hinzu. Mit der Standard-Startnummer `000` heißen die Ebenen `000`, `001`, `002` und so weiter. ### Ebenenreihenfolge {#layer-order} Sortiert die ausgewählten Ebenen im Ebenenbereich von Figma so um, dass sie ihrer visuellen Reihenfolge auf dem Canvas entsprechen. Die ausgewählten Ebenen bleiben zusammen oben im Ebenenstapel ihres übergeordneten Elements. ### Seitenzahlen in Präsentationen {#presentation-pager} Sucht passende Textebenen in jeder ausgewählten Ebene und ersetzt ihren Text durch eine bei eins beginnende Nummer in Canvas-Reihenfolge: `1`, `2`, `3` und so weiter. Aktiviere **Leading zero** in Preferences, um `01`, `02`, `03` und so weiter zu verwenden. ## Tidy-Einstellungen festlegen {#configure-tidy-preferences} Öffne **Preferences**, um festzulegen, wie die aktivierten Aktionen ausgeführt werden. | Einstellung | Was sie steuert | | --- | --- | | **Grid spacing** | Horizontaler und vertikaler Abstand zwischen ausgerichteten Ebenen. Beide sind standardmäßig `100` px. | | **Layout** | **Auto** erkennt den visuellen Fluss. Wähle **Rows** oder **Columns**, um ihn zu überschreiben. | | **Wrap component instances** | Legt ausgewählte Instanzen bei der Rasterausrichtung in gleich große Frames. | | **Pager variable** | Der genaue Name der Textebene mit der Seitenzahl, die aktualisiert werden soll. Standard ist `{current}`. | | **Pager number** | Fügt den Seitenzahlen eine führende Null hinzu, sodass `01`, `02`, `03` und so weiter entstehen. | | **Starting frame number** | Der erste Wert von `{n}` und die Stellenzahl, die `{n}` und `{total}` verwenden. Standard ist `000`. | | **Rename strategy** | Ersetzt vorhandene Namen, kombiniert die Nummer mit jedem Namen oder wendet ein eigenes Muster an. | ### Automatische Layouterkennung {#automatic-layout-detection} Das Standardlayout **Auto** vergleicht die vorhandenen horizontalen und vertikalen visuellen Bänder in deiner Auswahl. Eine horizontale Liste oder ein breites Raster wird in Zeilen angeordnet, eine vertikale Liste oder ein hohes Raster in Spalten. Tidy erkennt Ebenen, die oben, mittig oder unten bündig sind. So bleiben leichte Versätze und gemischte Frame-Größen natürlich gruppiert. Wähle **Rows** oder **Columns**, wenn du statt des erkannten Flusses eine bestimmte Lesereihenfolge erzwingen willst. ### Strategien zum Umbenennen {#rename-strategies} - **Replace** verwendet die fortlaufende Nummer als vollständigen Ebenennamen, zum Beispiel `000`. - **Merge** kombiniert die Nummer mit dem vorhandenen Namen, zum Beispiel `000_Home`. - **Custom pattern** kombiniert deinen eigenen Text mit optionalen Benennungsvariablen. Damit legst du genau fest, wo Nummern und vorhandene Ebenennamen erscheinen. ### Benennungsvariablen {#naming-variables} Gib unter **Name pattern** beliebigen Text ein und füge Variablen dort ein, wo ihre Werte erscheinen sollen. Die Variablen sind optional, du kannst also auch allen ausgewählten Ebenen denselben festen Namen geben. | Variable | Was sie einfügt | | --- | --- | | `{n}` | Die fortlaufende Nummer in Canvas-Reihenfolge, aufgefüllt auf die Stellenzahl von **Starting frame number**. | | `{total}` | Die Anzahl der ausgewählten Ebenen, aufgefüllt auf dieselbe Stellenzahl wie `{n}`. | | `{name}` | Den vorhandenen Namen der Ebene. | | `{parent}` | Den Namen der gemeinsamen übergeordneten Ebene. Bei Ebenen der obersten Ebene ist das der Name der Figma-Seite. | | `{type}` | Den Ebenentyp, zum Beispiel `Frame`, `Instance` oder `Component Set`. | | `{page}` | Den Namen der aktuellen Figma-Seite. | | `{row}` | Die bei eins beginnende Nummer der visuellen Zeile der Ebene. | | `{column}` | Die bei eins beginnende Nummer der visuellen Spalte der Ebene. | Beispiele mit **Starting frame number** auf `001`: | Name pattern | Beispielergebnis | | --- | --- | | `{n} Client Name` | `001 Client Name` | | `Client Name {n}` | `Client Name 001` | | `{n} {name}` | `001 Home` | | `{n} of {total} {name}` | `001 of 024 Home` bei einer Auswahl von 24 Ebenen | | `{parent} — {n} {name}` | `Client Screens — 001 Home` | | `{page} / {type} / {name}` | `Presentation / Frame / Home` | | `{n} Row {row}, Column {column}` | `001 Row 1, Column 1` | | `Client Name` | `Client Name` für jede ausgewählte Ebene | ## Tidy ausführen {#run-tidy} Wenn du Actions und Preferences geprüft hast, wähle **Tidy n Layers**. TinyImage wendet alle aktivierten Aktionen auf die aktuelle Auswahl an und meldet, wie viele Ebenen aufgeräumt wurden. Mit dem normalen Figma-Befehl **Undo** stellst du die vorherigen Positionen, Namen, Ebenenreihenfolgen, Wrapper und Seitenzahlen wieder her. > **Tip:** Auto funktioniert am besten, wenn die Auswahl bereits einen visuellen Fluss erkennen lässt. Wird ein absichtlich unregelmäßiges Layout anders erkannt als erwartet, wähle in Preferences Rows oder Columns. > **Note:** Die Schriftart der passenden Textebenen mit Seitenzahlen muss in Figma verfügbar sein, damit TinyImage ihre Zeichen aktualisieren kann.