Connectez-vous à une bibliothèque de designs
Générez et affinez en utilisant vos composants, tokens et variables réels – et non un substitut d'UI que vous devrez remplacer plus tard.
Générez des flux de paiement sur votre canvas de conception
Créez des expériences de paiement e-commerce complètes avec l'agent Figma – en utilisant vos composants, vos tokens et vos styles réels. Décrivez le flux dont vous avez besoin et voyez-le prendre forme directement dans votre fichier.
Explorez les options de paiement avec une fidélité accrue
Générez de véritables flux de paiement en utilisant votre design system, afin que chaque écran semble prêt pour la production dès le départ.
Explorez davantage d'approches, plus rapidement
L'agent Figma génère des flux de paiement complets en utilisant vos composants et vos styles réels, et non pas des wireframes substituts. Testez différents nombres d'étapes, mises en page et progressions sans repartir de zéro à chaque fois.
Supprimez l'échafaudage, gardez le flux
Éliminez le travail répétitif lié à la configuration des résumés de panier, des champs de formulaire et des écrans de paiement. Décrivez ce dont vous avez besoin et laissez l'agent construire la structure pour que vous puissiez vous concentrer sur l'expérience.
Alignez votre équipe dès le départ
Les flux de paiement générés figurent dans le fichier sur lequel votre équipe travaille. Chacun voit la dernière version, peut commenter directement et élaborer immédiatement sur cette version – sans qu'aucun transfert séparé ne soit nécessaire.
Les fonctionnalités sous-jacentes à l'agent
Zoom sur ce qui différencie l'agent Figma, conçu pour le mode de travail des équipes design.
Génération de prompts parallèles
Exécutez plusieurs prompts en même temps pour comparer des approches en parallèle au lieu de perdre du temps à les tester une par une.
Fils partageables
Partagez un fil et votre équipe verra l'intégralité du prompt, du contexte et de l'historique d'itération sous-jacents au design. Aucun transfert séparé n'est nécessaire.
Compétences
Regroupez les workflows et les conventions de votre équipe dans des /commandes réutilisables que quiconque peut exécuter à la demande.
Figma semble être une extension naturelle de ma main. Je fais mon idéation de design directement sur le canvas, et maintenant l'agent s'en occupe jusqu'à la dernière ligne droite. Avec mes bibliothèques de designs connectées, je peux passer du design au code plus rapidement que jamais.
Andy Madrick
Designer produit, Notion
Démarrez avec l'agent Figma
Étape 1 : Ouvrez l'agent
Sélectionnez Agents dans le rail latéral gauche ou appuyez sur CMD + Entrée. Ajoutez une frame à votre canvas à l'endroit où le flux de paiement sera généré.
Étape 2 : Décrivez votre flux de paiement
Dites à l'agent ce dont vous avez besoin : nombre d'étapes, options de paiement, prise en charge du paiement invité. Orientez-le vers votre bibliothèque de designs afin qu'il utilise vos composants réels.
Étape 3 : Examinez sur le canvas
Vérifiez les écrans générés sur votre canvas. Affinez dans le même fil ou commencez un fil parallèle pour examiner une structure de flux différente.
Étape 4 : Continuez à itérer
Exécutez de nouveaux prompts pour ajuster les étapes, ajouter des ventes incitatives ou modifier la mise en page. Parce que toutes les données demeurent modifiables, vous pouvez optimiser le contenu manuellement ou continuer à exécuter des prompts.
Devenez un expert en agents
L'agent Figma Design est disponible
En savoir plusObservez l'agent IA de Figma en action et voyez comment l'utiliser dans vos propres workflows.
Travailler avec l'agent Figma
DémarrerTerrain de jeu pratique pour découvrir les fonctionnalités de l'agent Figma (des modifications en masse à la mise en œuvre du feedback), avec des instructions étape par étape intégrées.
Comment utiliser l'agent Figma dans vos workflows de conception
Regarder la vidéoApprenez à utiliser l'agent Figma dans vos workflows de conception grâce à un didacticiel étape par étape de l'équipe Figma.
FAQ
Un générateur de flux de paiement permet de concevoir les écrans et les étapes par lesquels les utilisateurs passent lors d'un achat : examen du panier, détails d'expédition, paiement et confirmation. Parce que l'agent Figma génère ces flux directement sur votre canvas en utilisant votre design system, vous obtenez des écrans prêts pour la production au lieu de simples wireframes. Un générateur de flux de paiement accélère le processus d'exploration de différentes structures et mises en page de paiement.
Un flux de paiement complet inclut généralement un récapitulatif du panier, un formulaire d'informations sur l'expédition, les détails de paiement, un examen de la commande et un écran de confirmation. Selon votre produit, vous pouvez ajouter des options de paiement invité, des adresses enregistrées, des champs de code de promotion ou des modules de vente incitative. L'agent Figma peut générer tous ces éléments en utilisant vos composants – il vous suffit de décrire ce que votre demande doit comprendre.
Il n'y a pas qu'une seule réponse correcte à cette question – cela dépend de votre produit et de votre audience. Certains sites de e-commerce utilisent un paiement en une seule page pour gagner en rapidité, tandis que d'autres scindent le paiement en trois à cinq étapes pour plus de clarté. L'agent Figma vous permet de générer et de comparer différents nombres d'étapes en parallèle, afin que vous puissiez évaluer ce qui fonctionne le mieux pour vos utilisateurs avant de choisir une approche.
L'agent Figma est disponible dans tous les forfaits payants de Figma. Vous le trouverez dans le rail latéral gauche de Figma Design. Dans la version bêta ouverte actuelle, il n'utilise pas de crédits d'IA – c'est donc le bon moment pour explorer, expérimenter et nous faire part de votre feedback.
Créez plus vite avec l'agent Figma
Ouvrez l'agent Figma depuis le rail latéral gauche ou appuyez sur CMD + Entrée. Décrivez le flux de paiement dont vous avez besoin (nombre d'étapes, options de paiement invité, modes de paiement) et orientez l'agent vers votre bibliothèque de designs. L'agent génère les écrans sur votre canvas en utilisant vos véritables composants. De là, vous pouvez affiner avec des prompts de suivi ou effectuer des modifications manuellement.