23 ressources relatives au prototypage à ajouter à ses favoris dès maintenant
Outil puissant à chaque étape du développement de produit, le prototypage peut prendre différentes formes. Les ressources suivantes vous aideront à affûter votre processus, que vous débutiez en prototypage ou que vous souhaitiez vous perfectionner dans ce domaine.
Partager 23 ressources relatives au prototypage à ajouter à ses favoris dès maintenant
Qu'il s'agisse d'optimiser une présentation, de mener une recherche utilisateur ou encore d'encourager les retours des parties prenantes, le prototypage aide grandement votre équipe à s'aligner sur une vision commune. Ce que vous apprendrez grâce à lui vous permettra d'itérer et, en fin de compte, de proposer un meilleur produit.
Dans la foulée d'une série d'améliorations en matière de prototypage We’re making it easier for you to bring your designs to life across mobile, tablet, and watch interfaces with a series of prototyping updates.
Behind the feature: Inline device frames
Commençons par les bases
Découvrez d'abord ci-dessous les fondamentaux du prototypage pour comprendre comment l'utiliser pour calibrer et accélérer le processus de développement de produit.
Vidéo : Créez des prototypes (8 minutes)
Obtenez un aperçu de la création d'un prototype interactif, y compris l'animation et l'incorporation de retours de vos testeurs.
Vidéo : Playlist relative au prototypage (50 minutes)
Plongez-vous dans une playlist YouTube qui aborde en toute simplicité des thématiques comme les courbes d'accélération, les transitions, l'animation automatique, le défilement, les cadres d'appareils, et plus encore.
Vidéo : Prototypage 101 (63 minutes)
Découvrez les bases de la navigation d'un cadre à l'autre à l'intérieur des prototypes, ainsi que des capacités plus avancées que vous pouvez débloquer grâce à des fonctionnalités telles que les composants interactifs.
Vidéo : Apprenez à utiliser Figma pour le développement de produit (Partie 1) (7 minutes)
Découvrez comment créer un prototype léger en tant que personne extérieure au design et impliquée dans le développement de produit en suivant le fichier de la communauté ci-dessous.
Vidéo : Apprenez à utiliser Figma pour le développement de produit (Partie 2) (17 minutes)
Dans la seconde partie de cette série, vous apprendrez à utiliser les transitions, l'animation automatique, les comportements de défilement et d'autres astuces qui vous aideront à concrétiser vos prototypes.
Fichier de la communauté : Prototypes accessibles dans Figma
Explorez le mode d'accessibilité des prototypes de Figma, celui qui permet aux lecteurs d'écran comme VoiceOver (Mac) et JAWS (Window) de lire les informations sur les designs quand vous les présentez en mode prototypage.
Affûtez vos présentations
Le prototypage ne se limite pas à la création d'une maquette produit. Il vous aide également à faire passer un message lors d'une présentation dans une salle de conférence ou de classe.
Vidéo : Réalisez une présentation avec Figma (70 minutes)
Tirez parti du prototypage pour créer des présentations à diapos dynamiques qui engagent votre public.
Vidéo : Conseils pour les présentations (2 minutes)
Ajoutez des éléments interactifs (écran mobile qu'on peut faire défiler, par ex.) à votre présentation en imbriquant des prototypes dans les diapos.
Vidéo : Réalisez une présentation avec l'application Figma (2 minutes)
Découvrez comment utiliser l'application mobile Figma pour cliquer sur vos diapos.
Découvrez la vidéo, l'animation et le flux
Incorporez des vidéos dans le plan de travail, animez vos prototypes et créez des transitions dynamiques avec les astuces et tutoriels suivants.
Vidéo : Utilisez du contenu vidéo dans les prototypes Figma (52 minutes)
Faites passer un prototype à un niveau d'esthétique et de réalisme supérieur en y ajoutant du contenu vidéo tout en assurant la gestion des états et leur continuité entre les cadres.
Plongez-vous dans l'atelier avec ce fichier de démarrage.
Vidéo : Sections et prototypage (2 minutes)
Tirez parti des sections dans un prototype pour conserver le flux d'un utilisateur et ainsi lui permettre de fermer puis de réouvrir un prototype et de reprendre là où il s'était arrêté.
Fichier de la communauté : Animations réactives
Incorporez des animations réactives aux transitions d'un prototype à l'aide de nos options de préréglage.
Lancez-vous avec ce fichier de la communauté.
Vidéo : Micro-animations (8 minutes)
Découvrez toutes les subtilités de la micro-animation en créant une icône cœur qui s'agite après avoir cliqué dessus.
Vidéo : Prototypez des transitions par superposition (8 minutes)
Servez-vous des composants interactifs afin de prototyper des transitions par superposition pour les miniatures.
Vidéo : Défilement collant (5 minutes)
Configurez un défilement collant pour les bannières permanentes et d'autres éléments dans vos prototypes.
Effet d'éclosion florale
Créez un champ de fleurs qui poussent à partir des canvas Figma.
Allez plus loin avec les variables
Découvrez le prototypage avancé avec les variables, lesquelles réduisent la complexité en diminuant considérablement le nombre de cadres dont vous aurez besoin pour concrétiser votre vision.
Vidéo : Réalisez un prototype avec des variables (13 minutes)
Commencez ici si vous découvrez les variables pour la première fois. Vous aurez ainsi accès à deux nouvelles actions de prototypage : configurez une variable (modification de la valeur de toute variable) et un conditionnel (introduction d'une logique if/else).
Vidéo : Prototypage avancé (56 minutes)
Familiarisez-vous davantage avec les variables et d'autres fonctionnalités de prototypage avancé par la mise en place d'une expérience d'achat en ligne.
Maîtrisez le fonctionnement des variables, de la logique conditionnelle et des expressions avec ce fichier de travail.
Vidéo : Utilisez des variables dans les prototypes 101 (30 minutes)
Découvrez tous les types de variables actuellement disponibles (expressions booléennes, nombres, chaînes de texte et couleurs) et apprenez à relier des variables de chaînes à des composants interactifs.
Vidéo : Les variables dans les prototypes 201 (34 minutes)
Apprenez à utiliser les modes de variables et la logique conditionnelle pour créer un prototype de panier d'achat plus réaliste qui effectue des calculs exacts.
Rattrapez les sessions Office Hours manquées
Nous organisons fréquemment des sessions en direct au cours desquelles nous présentons les nouvelles fonctionnalités, sollicitons le point de vue d'experts indépendants et résolvons les problèmes. En voici quelques-unes à revoir ci-dessous.
Vidéo : Prototypage et test utilisateur, questions-réponses (52 minutes)
Recevez des conseils pour réussir une session de test utilisateur à distance avec le prototypage.
Vidéo : Familiarisez-vous avec les composants interactifs (52 minutes)
Apprenez à affûter vos prototypes avec des composants interactifs réutilisables et partageables.
Vidéo : Prototypage de l'UI d'un jeu avec le plugin de prototypeur (57 minutes)
Découvrez comment tirer parti du plugin de prototypeurpour générer des prototypes de designs de jeu avec Aashrey Sharma, UX Designer chez Epic Games.
Félicitations ! Vous avez fait passer vos designs et présentations au niveau supérieur ! Quelles autres ressources aimeriez-vous consulter ? Faites-nous part de vos suggestions sur X.
