- Cet formation est passé
InVision est un outil utilisé par les concepteurs et les designers afin de concevoir leurs maquettes, gérer les versions, partager, commenter et itérer ses design pour créer des interfaces interactives. InVision se présente sous la forme d’une plateforme de travail collaboratif. Il permet de télécharger des fichiers de conception, d’ajouter des animations fonctionnelles au design. Gratuit et disponible sur PC et Mac.
Objectifs : Le stagiaire à l’issue de la formation sera capable de maitriser les fonctionnalités du logiciel InVision cloud, InVision studio et DSM, de réaliser des maquettes, des wireframes et des prototypes d'un site web ou d'une application mobile, de comprendre la méthodologie du design web et mobile, d'optimiser le workflow entre les designers et les développeurs.
Formation disponible
présentiel, individuel
Comment souhaitez vous suivre cette formation ?
Cette formation est disponible en présentiel, à distance ou en cours individuels. Suite aux changements récents du fonctionnement des comptes CPF, si nos liens CPF renvoient sur une erreur temporaire, merci de nous contacter au 04 42 31 43 55
Nous n'avons actuellement pas de dates, merci de nous contacter pour plus d'informations
Comment souhaitez vous suivre cette formation ?
Cette formation est disponible en présentiel, à distance ou en cours individuels. Suite aux changements récents du fonctionnement des comptes CPF, si nos liens CPF renvoient sur une erreur temporaire, merci de nous contacter au 04 42 31 43 55
Nous n'avons actuellement pas de dates, merci de nous contacter pour plus d'informations
Découvrir Invision cloud, Invision studio et dsm
• Décrire l’App Invision et ses principaux usages : UX/UI Design, Prototypage basse et haute définition, Cloud, Collaboration, …
• Découvrir Invision Studio et Invision DSM (Design System Manager)
• Identifier ses fonctionnalités phares
• Découvrir les dernières actualités Invision
• Profiter des ressources et modèles externes
Créer une interface graphique avec Freehand
• Organiser son travail (pages, plan de travail, groupe de calques)
• Mettre en place une grille
• Importer des objets graphiques vectoriel ou bitmap
• Importer un fichier Sketch
• Créer ou modifier des éléments d’interface directement depuis InVision (menu, boutons, fond d’écran)
• Gérer les effets visuels (ombre, dégradé, arrondi…)
• Gérer l’aspect typographique
Raconter son projet avec InVision Moodboard
• Raconter son idée, présenter une planche de tendance, une charte graphique, …
• Ajouter des images, des couleurs, des typographies, des notes
• Choisir différents types de grille (Masonry, Meticulous, Grid)
• Éditer le header, documenter et commenter les éléments du moodboard
• Gérer les options et partager le moodboard
Designer (ux/ui) avec InVision Studio
• Prendre en main l’interface et mémoriser les raccourcis principaux
• Exploiter le lanceur et importer des fichiers Sketch
• Créer des espaces de travail (artboards) et des calques
• Insérer des formes prédéfinies, créer des formes personnalisées
• Sélectionner, positionner, transformer, supprimer des éléments : taille, couleurs fond et contour, dégradés, motifs, transformation, rotation…
• Ajouter des effets : ombre interne ou externe, flou
• Maîtriser et modifier les courbes de Bézier
• Utiliser les opérations booléennes
• Utiliser les masques
• Ajouter et agencer des titres, des paragraphes
• Importer et éditer des éléments vectoriels ou bitmap
• Mettre en place des grilles (layout) et des repères
• Créer des composants et exploiter les fonctionnalités de l’override
• Exploiter les contraintes de redimensionnement
• Organiser son projet de l’UX à l’UI : web design vs app mobile
• Acquérir une bonne convention de nommage (fichiers, pages, composants…)
Prototyper dans InVision
• Se servir de Craft pour synchroniser ses écrans Photoshop ou Sketch avec InVision
• Profiter de l’outil Duplicate de Cfraft pour déployer les pages de listes ou galeries
• Ajouter des interactions, des évènements souris ou tactiles, des transitions
• Mettre en place des modèles d’interactions dans InVision
• Mettre en place des transitions avancées dans InVision Studio
Publier et partager un prototype
• Exporter ses écrans en fichiers pdf, jpg, …
• Visualiser ses écrans sur un mobile avec l’App mobile InVision
• Partager ses écrans le Cloud
• Exporter les éléments pour la production (code et assets)
• Commenter et échanger sur les pages et les éléments
• Exploiter l’outil d’Inspecteur pour les développeurs
• Récolter des retours utilisateurs
Optimiser son workflow avec InVision DSM
• Gérer depuis un seul endroit tous les éléments graphiques d’une marque
• Documenter les couleurs, styles de texte, styles de calques, icônes et composants
• Gérer les accès et les droits au Design System Manager
• Partager ses ressources avec les développeurs
