Comment migrer des designs et maquettes Sketch vers Figma ?

La migration de vos maquettes web, wireframes, et autres visuels Sketch vers Figma peut se faire très simplement.

Vous pourrez tout d'abord importer un fichier Sketch (.sketch) entier dans Figma, ce qui créera automatiquement un nouveau fichier Figma, reprenant l’ensemble des éléments graphique. Cette conversion d’un modèle graphique Sketch vers Figma se fait à 4 niveaux :  

• Conversion des pages
• Conversion des symboles
• Conversion des polices
• Conversion des styles

Conversion des pages Sketch

Figma vous permet de créer plusieurs pages au sein d’un même fichier. Chacune des pages de votre fichier Sketch seront donc recréées à l’identique lors de l’importation. Vous pourrez retrouver vos nouvelles pages Figma dans le panneau de Layer sur la gauche du mode éditeur.

Conversion des symboles en components

Figma dispose d’un fonctionnalité “Components”, semblable à la fonctionnalité “Symbols” de Sketch. Lors de l’exportation Sketch vers Figma, chacun de vos symboles seront donc transformés en components, et une page “Symbols” sera créée pour regrouper tous les nouveaux components du fichier.

Conversion des polices dans Figma

Les polices utilisées sur votre Fichier Sketch seront également reprises dans Figma lors de l’importation, à condition qu’elles existent déjà dans Figma. Figma utilise les polices du catalogue Google Web Font.

Il est possible que l’importation des polices ne se fasse pas correctement, vous aurez alors un message d’erreur "Missing fonts”. Pour résoudre ce problème, vous devrez importer vos nouvelles polices dans Figma, puis utiliser la fonctionnalité “Replace fonts” pour mettre à jour tous les textes d’un coup.

Conversion des styles

Les styles que vous aurez créé dans Sketch ne pourront malheureusement pas être copier dans Figma. Pour faciliter le design vous devrez donc créer des nouveaux styles dans Figma.

Importer un fichier Sketch dans Figma

Il existe plusieurs méthodes pour migrer des éléments ou fichiers Skecth vers Figma.

• Glisser / Déposer un fichier .sketch depuis un bureau vers le tableau de bord Figma.
• Télécharger un fichier .sketch depuis un nouveau fichier Figma
• Copier / Coller des éléments graphiques depuis un projet Sketch vers une page Figma

Voici comment importer un nouveau fichier Sketch depuis un fichier Figma :

1. Cliquer sur le menu en haut à gauche
2. Aller sur l’onglet “File”
3. Cliquer sur “New from Sketch File”
4. Sélectionner le fichier .sketch pour l’importer