---
url: "/fr/tinyimage/tidy.md"
description: "Alignez, réordonnez, renommez et numérotez les calques Figma sélectionnés avec l’espace de travail Tidy de TinyImage."
---

# Organiser les calques Figma avec Tidy

> Alignez, réordonnez, renommez et numérotez les calques Figma sélectionnés avec l’espace de travail Tidy de TinyImage.

### Tutoriel vidéo : ranger et renommer les calques automatiquement

[Embedded media](https://www.youtube-nocookie.com/embed/zXv4KhSr9qY)

[Suivez le tutoriel étape par étape](/tinyimage/tutorials/how-to-tidy-and-rename-layers-automatically-using-tiny-image).

Utilisez l’onglet **Tidy** pour transformer un ensemble désordonné de calques Figma en un canevas et une liste de calques bien organisés. Tidy peut détecter le sens de lecture visuel de la sélection, aligner les calques sur une grille d’espacement, faire correspondre l’ordre des calques à leur position sur le canevas, renommer les frames avec des numéros séquentiels et mettre à jour le texte de pagination d’une présentation.

[Video](/assets/videos/tinyimage/compress/tidy-layers.mp4)

## Préparer votre sélection {#prepare-your-selection}

1. Dans un fichier Figma Design, sélectionnez les calques à organiser.
2. Vérifiez que les calques sélectionnés sont frères, avec le même parent.
3. Ouvrez TinyImage et sélectionnez l’onglet **Tidy**.

L’état de la sélection indique combien de calques sont prêts et quel parent les contient. Tidy ne déplace et ne réordonne pas les calques situés dans un parent en Auto Layout ; sélectionnez plutôt des calques sur le canevas ou dans un frame ordinaire.

## Choisir les actions Tidy {#choose-the-tidy-actions}

Ouvrez **Actions** et activez la combinaison d’options de votre choix :

### Alignement sur la grille {#grid-alignment}

Détecte la disposition en lignes ou en colonnes la plus marquée et aligne les calques sélectionnés en utilisant l’espacement horizontal et vertical défini dans **Preferences**. Tidy tolère les petits décalages et les calques de tailles différentes lorsqu’ils partagent un bord ou un centre visuel. C’est la seule action activée par défaut.

### Renommage {#renaming}

Ajoute des numéros séquentiels selon la position de chaque calque sur le canevas. Avec le numéro de départ par défaut, `000`, les calques sont nommés `000`, `001`, `002`, et ainsi de suite.

### Ordre des calques {#layer-order}

Réordonne les calques sélectionnés dans le panneau Layers de Figma pour qu’ils correspondent à leur ordre visuel sur le canevas. Les calques sélectionnés restent regroupés en haut de la pile de calques de leur parent.

### Pagination de présentation {#presentation-pager}

Recherche les calques de texte correspondants dans chaque calque sélectionné et remplace leur texte par un numéro qui suit l’ordre du canevas en commençant à 1 : `1`, `2`, `3`, et ainsi de suite. Activez **Leading zero** dans Preferences pour obtenir `01`, `02`, `03`, et ainsi de suite.

## Configurer les préférences de Tidy {#configure-tidy-preferences}

Ouvrez **Preferences** pour configurer le fonctionnement des actions activées.

| Préférence | Ce qu’elle contrôle |
| --- | --- |
| **Grid spacing** | L’espacement horizontal et vertical entre les calques alignés. Les deux valent `100` px par défaut. |
| **Layout** | **Auto** détecte le sens de lecture visuel. Choisissez **Rows** ou **Columns** pour l’imposer. |
| **Wrap component instances** | Place les instances sélectionnées dans des frames de même taille lors de l’alignement sur la grille. |
| **Pager variable** | Le nom exact du calque de texte de pagination à mettre à jour. La valeur par défaut est `{current}`. |
| **Pager number** | Ajoute un zéro initial aux numéros de pagination, ce qui donne `01`, `02`, `03`, et ainsi de suite. |
| **Starting frame number** | La première valeur de `{n}` et le nombre de chiffres utilisé par `{n}` et `{total}`. La valeur par défaut est `000`. |
| **Rename strategy** | Remplace les noms existants, fusionne le numéro avec chaque nom ou applique un modèle personnalisé. |

### Détection automatique de la disposition {#automatic-layout-detection}

La disposition **Auto**, utilisée par défaut, compare les bandes visuelles horizontales et verticales de votre sélection. Une liste horizontale ou une grille large est organisée en lignes, tandis qu’une liste verticale ou une grille haute est organisée en colonnes. Tidy reconnaît les calques alignés par le haut, le centre ou le bas : les légers décalages et les frames de tailles différentes restent donc naturellement regroupés.

Choisissez **Rows** ou **Columns** lorsque vous voulez imposer un ordre de lecture précis au lieu d’utiliser le sens détecté.

### Stratégies de renommage {#rename-strategies}

- **Replace** utilise le numéro séquentiel comme nom complet du calque, par exemple `000`.
- **Merge** combine le numéro et le nom existant, par exemple `000_Home`.
- **Custom pattern** associe votre propre texte à des variables de nommage facultatives. Utilisez-le pour contrôler précisément l’emplacement des numéros et des noms de calques existants.

### Variables de nommage {#naming-variables}

Saisissez le texte de votre choix dans **Name pattern**, puis ajoutez des variables là où leurs valeurs doivent apparaître. Les variables sont facultatives : vous pouvez donc aussi appliquer le même nom fixe à tous les calques sélectionnés.

| Variable | Ce qu’elle ajoute |
| --- | --- |
| `{n}` | Le numéro séquentiel dans l’ordre du canevas, complété par des zéros selon **Starting frame number**. |
| `{total}` | Le nombre de calques sélectionnés, complété par des zéros jusqu’à la même largeur que `{n}`. |
| `{name}` | Le nom existant du calque. |
| `{parent}` | Le nom du calque parent commun. Pour les calques de premier niveau, il s’agit du nom de la page Figma. |
| `{type}` | Le type de calque, par exemple `Frame`, `Instance` ou `Component Set`. |
| `{page}` | Le nom de la page Figma actuelle. |
| `{row}` | Le numéro de ligne visuelle du calque, en commençant à 1. |
| `{column}` | Le numéro de colonne visuelle du calque, en commençant à 1. |

Par exemple, avec **Starting frame number** défini sur `001` :

| Modèle de nom | Exemple de résultat |
| --- | --- |
| `{n} Client Name` | `001 Client Name` |
| `Client Name {n}` | `Client Name 001` |
| `{n} {name}` | `001 Home` |
| `{n} of {total} {name}` | `001 of 024 Home` pour une sélection de 24 calques |
| `{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` pour chaque calque sélectionné |

## Lancer Tidy {#run-tidy}

Après avoir vérifié les Actions et les Preferences, sélectionnez **Tidy n Layers**. TinyImage applique chaque action activée à la sélection actuelle et indique combien de calques ont été rangés.

Utilisez la commande **Undo** habituelle de Figma si vous voulez rétablir les positions, les noms, l’ordre des calques, les conteneurs et les numéros de pagination précédents.

> **Tip:** Auto fonctionne mieux lorsque la sélection suggère déjà un sens de lecture visuel. Si une disposition volontairement irrégulière est détectée autrement que prévu, choisissez Rows ou Columns dans Preferences.

> **Note:** La police utilisée par les calques de texte de pagination correspondants doit être disponible dans Figma pour que TinyImage puisse mettre à jour leurs caractères.