Les spécificités du logiciel
- Qu'est-ce que Sketch App ?
- Les atouts et les enjeux du logiciel.
- Découvrir les plug-ins essentiels : Craft, Zeplin, Anima...
- Les périmètres fonctionnels : wireframes, design system, style guide, maquette graphique interactive.
Travaux pratiques
Découverte de la manipulation.
Découvrir l'interface Sketch
- Barre d'outils et panneaux de propriété.
- Les plans de travail, pages et calques.
- Personnaliser la barre d'outils.
Travaux pratiques
Manipulation de l’interface de Sketch.
Prototyper une maquette graphique pour le web
- Les étapes de conception.
- Le design d'interface.
- La chorégraphie de contenu.
- Les tendances du design.
Travaux pratiques
Création d'une première maquette d'une page web responsive.
Interface d'application mobile
- Les interfaces d'application mobile.
- Définir le croquis de l'interface ou maquette filaire détaillée selon une chorégraphie de contenu adapté.
Travaux pratiques
Création d’une première interface mobile.
Designer avec Sketch
- Créer un plan de travail.
- Créer et gérer les calques.
- Utiliser les grilles et les repères.
- Créer et modifier des formes.
- Importer des éléments graphiques vectoriels et bitmap.
Travaux pratiques
Travail avec les calques et les repères.
Conceptualiser et ajouter des formes
- Sketch et les vecteurs.
- L’outil crayon.
- Créer, modifier et éditer des formes.
- Créer des éléments vectoriels avec l'outil plume.
- Manipuler les points d'ancrage.
- Les objets texte, les lignes et les bordures.
Travaux pratiques
Création de formes personnaliser avec l’outil plume.
Exporter les éléments graphiques
- Identifier les différents formats d’export pour le Web (SVG, PNG, JPEG, CSS).
- Exporter pour les écrans Retina ou HD.
- Réutiliser rapidement un style guide avec le plug-in Craft.
- Collaborer efficacement avec les développeurs (avec Sketch et Zeplin).
Travaux pratiques
Création d'un export pour le web.
Réaliser un prototype interactif avec Sketch et InVision
- Définir les zones réactives.
- Créer des liens entre les plans de travail.
- Exporter et partager le prototype interactif dans InVision.
Travaux pratiques
Création d'un prototype interactif.