Formation Intégration Web et mobile / Développeur Front End Material Design - Conception d'interfaces utilisateurs

Partager cette formation Télécharger au format pdf Ajouter à mes favoris

Objectifs pédagogiques / Compétences visées

• Concevoir et réaliser une interface Material Design
• Décrire les implications du Material Design sur votre conception
• Modifier les concepts de base et les adapter à vos besoins.

Niveau requis

Avoir des notions de base de JavaScript, comprendre les notions d'UI / UX Design et maîtriser HTML et CSS.

Public concerné

Webmasters, maquettistes, infographistes, responsables de communication, chefs de projets et responsables de campagne multicanal.

Programme

Les grandes étapes du Web Design

• Skeuomorphisme
• Flat Design

Unifier les interfaces utilisateurs

• Importance de l'interface mobile
• Principes du Material Design

Découvrir les principes du Material Design

• Une interface "physique"
• L'animation au service de l'UX
• Le rôle de la profondeur
• Des compositions "responsive"

Démarrer avec Material Design

• Un workflow classique
• Prototype avec Adobe XD

Le Framework Materialize CSS

• Eléments du Framework
• Chargement du Framework
• Utilisation du CDN (Content Delivery Network)
• Démarrer

Principe des composants

• Réglages CSS
• Gestion des palettes de couleurs
• Gestion de la grilles de colonnes
• Helpers et utilitaires
• Médias responsive
• Ombres et profondeur
• Transitions
• Styles typographiques

Composants d'interface

• Tableaux
• Badges et notifications
• Les trois types de boutons
• Fil d'Ariane
• Cartes et gestion des contenus
• Collections et listes d'objets
• Boutons d'action flottant
• Footer
• Icones Google Fonts
• Barre de navigation
• Pagination
• Préchargement

Interactions JavaScript

• Initialisation
• Accordéon
• Menus déroulants
• Boîtes modales
• Eléments punaisés
• Barre de navigation latérale
• Onglets
• Infobulles
• Transitions

Modalités d’évaluation des acquis

• En cours de formation, par des productions
• Et, en fin de formation, par un questionnaire d'auto-évaluation ou une certification (M2i ou éditeur)

Partager cette formation Télécharger au format pdf Ajouter à mes favoris