UI Design

Présentation et architecture Présentation de l'UI Design Définition Son rôle Les enjeux Les grandes tendances du Web L'expérience utilisateur L'architecture Comprendre les devices et les checkpoints Composer à partir d'un wireframe Utiliser des grilles Penser en Responsive design Organiser son PSD Construction d'un site one page Header, navigation, contenu et footer Exercice Recomposer et adapter un site en One page initialement conçu pour les desktops pour une déclinaison en application mobile. Colorimétrie et polices Colorimétrie Définition L'usage des couleurs Le cercle chromatique Les types de combinaisons Les contrastes Le langage des couleurs Adobe color CC et autres outils indispensables Polices Définition Différence entre Police, Font et Typographie Les grandes familles typographiques Bien choisir ses polices Règles typographiques Google fonts et autres outils indispensables Logotype Comment créer un logo Exercice Création d'un logo à l'aide des Google fonts et d'Adobe Color CC Iconographie Définition Hiérarchie des composants visuels Les neurones miroirs - Jouer avec les connotations Jouer avec les connotations Exercices Analyses d'images (connotations et dénotations) Trouvez le bon visuel pour le bon environnement Réaliser un e-mailing Anatomie d'un e-mailing Définition Contraintes techniques Architecturer efficacement son E-mailing Découverte de Mailchimp Exercice Vous serez en charge de réaliser la maquette d'un emailing avec Adobe Photoshop et Mailchimp Réaliser des bannières en GIF animés Définition d'une bannière Les formats standards Optimiser votre déclinaison Animer votre bannière sur Photoshop Bien exporter vos bannières Découverte de Google Webdesigner Exercice Réalisation d'un jeu de 3 bannières Maquetter une application Exercice Réalisation d'une maquette d'application mobile de 3 pages à partir d'un prototype ou de wireframes