Oui. Le principe est simple :

1. créer la maquette dans Figma

2. installer le plugin

3. importer les styles et les frames

4. finaliser le site dans Wix Studio

Wix Studio permet d’importer une maquette Figma et de récupérer automatiquement plusieurs éléments :

• images

• textes

• boutons

• conteneurs

• sections

• couleurs

• typographies

  
  

L’import permet donc de recréer rapidement la structure du design dans Wix Studio.

Certains éléments interactifs devront ensuite être ajustés dans l’éditeur, mais la base du site est déjà créée.

Les étapes pour passer de Figma à Wix Studio

Comment importer un design Figma dans Wix Studio

Étape 1 — Préparer la maquette Figma

Avant l’import, la maquette doit être proprement structurée.

Idéalement :

• créer une frame par section ou par page

• organiser les éléments clairement

• utiliser des styles pour les couleurs et les typographies

• prévoir une version mobile si possible

Une maquette bien organisée facilite l’import dans Wix Studio.

Étape 2 — Installer le plugin Figma to Wix Studio

Dans Figma :

1. ouvrir votre fichier

2. appuyer sur Cmd / Ctrl + K ou cliquez sur l'icone Figma à gauche > Widgets

3. rechercher Figma to Wix Studio dans les plugins

4. lancer le plugin

5. se connecter à son compte Wix

Ce plugin officiel permet d’exporter les designs vers Wix Studio.

Étape 3 — Importer les styles

Avant d’exporter les pages, il est recommandé d’importer les styles de design.

Le plugin détecte automatiquement :

• les couleurs

• les typographies

• les styles de texte

Ces styles seront ensuite disponibles dans Wix Studio.

Étape 4 — Exporter les frames Figma

Ensuite, il faut exporter les frames de la maquette.

Assurez vous de synchroniser d'abord les largeurs d'écrans entre la maquette et le site. Le canva Wix studio est en 1280px par defaut. Mais si votre maquette fait 1400px de large, changez la largeur dans Wix Studio.

Dans le plugin :

1. sélectionner une frame

2. cliquer sur Export Frame

3. lancer l’export

Le plugin analyse les éléments et les transforme en composants Wix Studio.

Étape 5 — Importer la maquette dans Wix Studio

Dans Wix Studio :

1. ouvrir votre site dans l’éditeur

2. accéder à Import from Figma

3. connecter votre fichier Figma

4. importer les frames

Chaque frame peut être importée comme :

• une page

• une section

• un container

La structure du design apparaît directement dans l’éditeur.

Étape 6 — Vérifier et finaliser le site dans Wix Studio

Après l’import, il faut vérifier le site avant la mise en ligne.

Responsive

• vérifier l’affichage tablette et mobile

• ajuster les conteneurs ou stacks si nécessaire

  
  

Paramétrage des éléments

• remplacer certains éléments par les composants Wix Studio (menus, formulaires…)

• vérifier les boutons et les liens

• Aller dans le tableau de bord > paramètrage pour vérifier les informations du site, le favicon, etc.

  
  

SEO

• ajouter les Title et Meta description

• vérifier les balises H1 / H2

• ajouter les alt text des images

  
  

Test utilisateurs et mise en ligne

• tester les pages

• vérifier les liens

• publier le site

Cette dernière étape permet de transformer la maquette importée en site web fonctionnel.

Ce que l’import Figma vers Wix Studio fait (et ne fait pas)

Les éléments interactifs doivent être ajoutés ensuite dans Wix Studio.

Exemple concret

Un designer crée dans Figma :

• une homepage

• une page service

• une page contact

  
  

Ensuite :

1. il exporte les styles

2. il exporte les frames

3. il importe les pages dans Wix Studio

4. il finalise le responsive et les fonctionnalités, vérifie le référencement et paramètre le site Wix studio.

   
   

Le design devient alors un site web prêt à être publié.

Peut-on importer directement un fichier Figma dans Wix ?

Oui, mais uniquement dans Wix Studio, pas dans l’éditeur Wix classique.

Le plugin Figma to Wix Studio est-il gratuit ?

Oui.Le plugin officiel est gratuit et disponible dans Figma.

L’import crée-t-il un site complet automatiquement ?

Non.Le plugin importe le design et la structure, mais certaines fonctionnalités doivent être ajoutées ensuite dans Wix Studio