Filtrer par
Date

JOUR 1 DE LA FORMATION Le Responsive design au service de votre stratégie digitale et client Définition et enjeux du Responsive design Qu'est-ce que le responsive design ?  Pourquoi a-t-on besoin du responsive design ? usage web et la mobilité Qu'est-ce qui rend un site internet responsive ? Analyse d'exemples de sites actuels responsive : de site média et e-commerce Comprendre les principaux concepts du responsive design Contrôle du viewport Comprendre la densité écran et l'impact sur la lecture pour l'internaute/mobinaute Designer son projet pour des densités d'écran différentes  Media queries  Points pivots  Grilles fluides  Rendre les images responsive  Le futur pour les images responsive : 5K et 8K Proposer des formulaires responsive  Optimiser les performances offertes par le responsive : taux de rebond, clics, conversion Mettre en place une stratégie responsive Les stratégies en fonction des contextes  Mockups / Schémas  Planifier un responsive design : budget, planning  Construire sa stratégie de contenu pour un site responsive Le contexte mobile  Designer spécifiquement pour mobile  Assumptions / Mythes / Réalité  La flexibilité du code  Frameworks : frameworks en grilles fluides  Tester son projet responsive design  Outils gratuits et payant pour le responsive design : Bootstrap Etude de cas : analyse de la stratégie Responsive de Pixmania Mettre en place une architecture responsive Maîtriser les avantages et inconvénients :      responsive vs site dédié      responsive vs application      responsive design & l'emailing JOUR 2 DE LA FORMATION Journée de mise en pratique : piloter un projet responsive design en cohérence avec sa stratégie marketing Révision : définition et usages du HTML et CSS Qu'est-ce qu'une feuille de style ? Construire une page HTML Exemples : le formateur analysera des exemples multi-sectoriels Planifier son responsive design Planification du contenu  Création des mockups  Définir son Responsive UX  Structurer les régions de sa page et les contenus pour du multi-device Construire sa mise en page responsive Contrôle du viewport  Styles par défaut  Définition des points pivots  Définition des medias queries  Mise en page basique : pour desktop, tablette, mobile Comprendre les enjeux de navigation et des utilisateurs Définir la stratégie de navigation et recenser l'ensemble de ses besoins marketing pour faciliter l'étape de mise en recette Structurer ses menus      que faire en cas de menus complexes  Designer ses menus  Animation et frameworks Javascript (Jquery, scriptaculous, mootools..)  Gérer les changements de taille  Réduire un menu pour les petits appareils  Gérer les sous-menus avec le tactile      remplacer le roll-over  Parer les conflits  Fournir un échappement  Remplacement dynamique  Conversions  menu to select  select to menu Richmedia : image, vidéo, son en responsive design Images et vidéo fluides  CSS à la place des images  Polices d'icônes  Galerie d'images  Son Les fonctions spécifiques mobiles Formulaires  Fonctions téléphones  Icônes Gérer les ressources Avec Modernizr  Respond.js  Gestion conditionnelle Les participants devront se munir de leur PC, tablette et smartphone. La partie révision HTML et CSS de la seconde journée, permet aux personnes débutantes de se mettre à niveau sur les fondamentaux et de suivre la journée de mise en pratique.

Lieu
Durée
Présence

Présentiel

1 795 € TTC Soit 2 154 € HT

JOUR 1 DE LA FORMATION Les business models pour porter l'innovation Analyse d'exemples de business models « nouvelle génération » : Amazon, Google Analyse des stratégies de start up Les éléments favorisant le succès et les éléments limitants Développer des produits et services innovants Rupture des croyances limitantes  Instaurer de nouvelles grilles de lecture, de valeurs et d'analyse sociétale et entrepreneuriale Quelle nouvelle culture entrepreneuriale ? Placer et conserver une innovation User centric Etude de cas: méthodologies et outils pour développer produit et service innovant avec le digital Cas pratique: définir une carte d'empathie et pathway afin de replacer l'utilisateur au cœur de la réflexion Profils et compétences à développer Faire monter en compétences les collaborateurs et managers Recruter de nouveaux profils Les stratégies de rupture à mettre en œuvre Utiliser les matrices BMNG, CK de l'Océan bleu Le financement et les levées de fond dans ce nouveau contexte Le suivi et l'analyse ROIste : définir des indicateurs simples  Quelle créativité visuelle mettre en œuvre ? Organiser ses équipes afin d'intégrer l'innovation digitale et ses leviers de croissance Les nouvelles méthodes de travail : les comprendre et les implémenter Recruter, faire évoluer les compétences, valoriser de nouveaux profils/compétences   Ateliers de mise en pratique :  Exemples à succès A partir d'exemples de start-up et d'entreprises de différents secteurs, les participants analysent et construisent les étapes de la transformation d'un business à l'ère du digital. Les participants pourront, appréhender les outils et les méthodologies utiles à la transition numérique. - Etablir un business model : comment gérer la rupture avec le modèle actuel et définir les axes de son nouveau BM ? - Définir et mettre en place une organisation optimale : stimuler l'innovation en interne, comment accompagner le changement technologique, organisationnel et business auprès de l'ensemble des collaborateurs - Etablir une grille de maturité de la marque/entreprise digitale afin d'accompagner son évolution - Lancement de produits/services innovants : le plan de commercialisation - Comment suivre et analyser les nouvelles actions ? - Recrutement et gestion de nouveaux profils de prestataires A la fin de la session, le formateur transmettra aux participants une liste actualisée des ouvrages et blogs à lire ou à suivre

Lieu
Durée
Présence

Présentiel

1 895 € TTC Soit 2 274 € HT

Cas fil rouge Tout au long de la formation, vous pourrez constituer votre "boîte à outils" afin de construire votre stratégie de communication digitale et planifier les actions les plus adaptées à votre stratégie de communication. Vous pourrez également découvrir ou renforcer votre compréhension des réseaux sociaux afin de définir vos objectifs de présence, opter pour une présence forte sur les réseaux les plus compatibles avec les messages que vous souhaitez porter. Rappel historique sur l’émergence des réseaux sociaux Du web au web 2.0 : les étapes-clés Aujourd’hui, tous webmasters : quelles implications sur les métiers du digital ? Tous acteurs sur les réseaux sociaux : quelle transformation des circuits de validation des principaux outils de communication ? Réseaux sociaux : nouveaux enjeux, usages et outils Les enjeux de la communication digitale pour les collectivités territoriales Quels sont les nouveaux enjeux de la communication ? La révolution des médias sociaux et les impacts sur le secteur public Une nouvelle approche participative et collaborative Les chiffres clés du Social Media Du site «vitrine» institutionnel à la participation interactive Comprendre les enjeux de la communication digitale pour l'élu Adapter les réseaux sociaux aux besoins spécifiques d'une collectivité Comment la collectivité peut-elle s'approprier le digital pour répondre à ses différents besoins de communication ? Définir ses objectifs en lien avec la stratégie de communication globale Communication de proximité Quelle communication auprès d'autres publics? Par quels supports ? Les notions essentielles de la communication digitale et du community management Transmission de l'information : par quels canaux? Marketing territorial : les fondamentaux d'une marque de territoire Concurrence entre territoires : comment vous démarquer? Comment mieux mettre en avant les atouts de votre collectivité? Anticipez les évolutions des social medias afin d'être présent là où on ne vous attend pas! Cas pratique: intégrer les canaux digitaux à votre plan de communication Snapchat, Twitter, Facebook : maîtriser pas à pas ces outils par la pratique Boîte à outils opérationnelle : Snapchat, Facebook, Twitter : mode d’emploi ! - Comment choisir les réseaux sociaux sur lesquels être présent et les intégrer pleinement à votre stratégie de communication? - Pour quels messages? Quels objectifs? Facebook : créer et animer une page - Fonctionnement et animation de votre Timeline - Comment relayer une page ? - Les solutions de promotion sur Facebook Twitter : créer et animer son compte - Quel usage spécifique pour une structure publique ? - Fonctionnement Les personnes influentes, celles qui sont susceptibles de relayer vos activités facilement… Distinguer les différents profils de contact indispensables à votre communauté Comment construire ou renforcer votre stratégie « réseaux sociaux » ? Communication digitale et marketing territorial Les fondamentaux du web social : adapter sa relation avec les usagers / citoyens Se faire entendre : stratégie d'animation et de conversation sur les réseaux sociaux Elaborer une stratégie éditoriale et monitorer une page Reprises média : comment les animer en pratiques ? Quels sont vos leviers pour valoriser vos actions ? Surveiller votre e-reputation : les bonnes pratiques Mise en pratique : analyser des exemples de posts sur les réseaux, déterminer s’ils sont adaptés selon les objectifs de communication visés Définir sa stratégie de présence sur les réseaux sociaux Définir ses objectifs et ses publics cibles Storytelling : raconter votre collectivité en fonction du positionnement choisi L'importance d'être engagé dans la démarche Développer et animer la communauté de votre collectivité Nouer une relation de communauté : comment comprendre et intégrer les codes et la vie de réseau Enrichir votre réseau : objectifs principaux Identifier vos cibles et analyser leurs besoins : quelle démarche, quels outils d’analyse ? Conversation et modération : quand faut-il intervenir ? S’appuyer sur vos influenceurs, véritables relais de communication : générer de l'interaction et développer son réseau d'ambassadeurs Interagir avec les influenceurs Véhiculer une image positive et pratiquer l’autodérision Savoir personnaliser ses échanges Faire preuve de réactivité pour couper court aux rumeurs, repérer les trolls Promouvoir son compte on et offline Focus sur la communication de crise en ligne : les bons réflexes Les réseaux sociaux comme nouveaux leviers pour prolonger le service public : exemple Mise en application : analyse de 2 pages d’activité sur les réseaux sociaux, en extraire des informations importantes : - A qui s’adresse cette communication ? - Pour quel usage ? - Quelle relation souhaitez-vous nouer avec communauté ? - Quel choix de contenus ? - Quelle administration du compte ? Stratégie d'animation et de conversation Elaborer une stratégie éditoriale et monitorer la page Gérer une crise sur les médias sociaux Suivre et être réactif aux actualités : l’agilité à l’heure du numérique Constituer et alimenter votre veille Comment évaluer la fiabilité de vos sources ? Quelques conseils Trouver les comptes à suivre en fonction de votre stratégie de communication Organiser votre veille en pratique Comment et pourquoi créer des listes sur Twitter ? Tweetdeck, scoop.it… Quelques outils de tableau de veille, de curation de données faciles à prendre en main Mesurer l’efficacité de vos actions Analyser vos résultats pour améliorer votre communication digitale Se fixer des objectifs et les comparer avec les résultats : quelle démarche d’évaluation spécifique à la communication en ligne ? Abonnement, portée, engagement, clics… Maîtriser vos indicateurs de base Savoir interpréter ces résultats et en tirer vos axes de progression Mise en pratique : construire vos tableaux de bord pour évaluer vos actions sur les réseaux sociaux et les analyser

Lieu
Durée
Présence

Présentiel

1 695 € TTC Soit 2 034 € HT

"JOUR 1 DE LA FORMATION Analyser les tendances du web social Les évolutions de comportement du consommateur provoquées par le web social Les impacts des évolutions du Web social pour les marques en B2C Panorama des médias sociaux: chiffres clés, usages et contenus spécifiques Définir sa stratégie de marque sur les médias sociaux en B2C Ecoute des médias sociaux : le prérequis à la stratégie Quelle place pour les médias sociaux dans une approche omnicanal ? Comment sélectionner les médias sociaux où la marque doit être présente ? Définir les objectifs de sa marque et les indicateurs de performance Définir un plan social marketing et un plan éditorial Focus sur les principaux réseaux sociaux: Facebook  Instagram  Twitter  Youtube  Pinterest Etudes de cas de marque sur chaque réseau Pour chaque réseau seront abordés les axes suivants : Les usages des membres Faire de la veille pour savoir ce qui se dit sur votre marque Les pages de marques, les applications, les groupes de discussion... Les spécificités des applications mobiles des médias sociaux Les outils de médiatisation Les indicateurs de performance selon les objectifs (engagement, ROI...) Les outils de statistiques Les médias sociaux, la visibilité et la réputation des marques L'animation et la créativité pour générer de l'engagement La co-création à travers les réseaux sociaux La gestion omnicanal des médias sociaux en B2C Les synergies entre les médias sociaux Les outils de gestion multi médias sociaux"

Lieu
Durée
Présence

Présentiel

1 € TTC Soit 1 € HT

JOUR 1 DE LA FORMATION Retour sur les fondamentaux de la relation client Comprendre les évolutions des attentes du client : interactivité, écoute, relation one-to-one Qu’est-ce que la connaissance client ? Appréhender les composantes du CRM global (CRM classique, e-CRM, social CRM) Comprendre les bases du CRM analytique Intégrer la méthodologie d’un projet CRM Comprendre les enjeux de la gestion de la relation client sur les médias sociaux Réduire le délai de traitement global d’une demande client sur les médias sociaux Replacer le client au sein des processus de l’entreprise Maîtriser les enjeux e-réputation, fidélisation et le potentiel business du social CRM Cas pratique : analyse d’une feuille de route d’une stratégie social CRM Qu’est-ce que le social CRM : intégrer les piliers de la social relation client Comprendre les étapes clés du social CRM : connaissance, satisfaction, fidélisation et marketing ciblé Outils et dispositifs : intégrer le « social scoring », la « social relation client » et le « social marketing » Appréhender le cycle de la relation client sur les réseaux sociaux : du « social commerce » au « social care » Etude de cas : analyse du cycle d’une campagne social CRM Construire votre stratégie social CRM : utiliser les réseaux sociaux comme outil de CRM Quels réseaux sociaux prioriser en fonction de ses objectifs : focus sur l’utilisation de Facebook, Twitter, Viadeo, Linkedin comme outils de social CRM, quid d’offres spécifiques ? Quelles données sociales pertinentes collecter ? Critères de sélection et outils potentiels JOUR 2 DE LA FORMATION Comment orienter sa stratégie conversationnelle en fonction de ses objectifs prioritaires ? Identifier et animer des évangélisateurs des réseaux sociaux pour les impliquer dans la relation client Arbitrer entre la stratégie social média, social CRM, supports digitaux et mobile Utilisation intelligente des données : du social scoring au social marketing Engager des actions de marketing en fonction des données participatives et comportementales issues des médias sociaux externes et du site Internet Etude de cas : Analyse de l'intégration du social CRM et social marketing à une campagne 360° Accompagner l'organisation et la conduite globale du changement Impulser une démarche de test & learn Impliquer l'ensemble des acteurs dans le processus de gestion sociale de la relation client : une approche multicanal et un suivi des interactions Comment intégrer les données issues du social CRM au CRM existant Comment faire porter le projet par l'ensemble des membres de l'organisation : repenser les interactions dans la gestion de la relation client Impulser le changement dans l'organisation en capitalisant sur le social CRM Mesurer les actions et retombées de son social CRM Quels objectifs fixer et quels résultats attendre de la mise en place d'un social CRM ? Quels indicateurs mettre en place ?  Quels nouveaux KPI pour prendre en compte la qualité du service client et du social CRM ? Mesurer les retombées sur les objectifs commerciaux et business

Lieu
Durée
Présence

Présentiel

1 795 € TTC Soit 2 154 € HT

JOUR 1 DE LA FORMATION Les bases des médias sociaux en BtoB : impacts sur les stratégies digitales Les différences entre les médias sociaux et les réseaux sociaux Les cas d'usages des réseaux sociaux en BtoB : veille, storytelling, brand content... L'impact d'une présence sociale sur SEO Le cas particulier du blog et son importance dans une stratégie Web marketing en BtoB Les étalons du web social et communautaire en BtoB : impacts sur les strategies digitales Les fondements des médias sociaux BtoB : storytelling, brand content... Utiliser les médias sociaux pour gérer son image business Réorienter sa stratégie de réseau, de veille, de collecte et de communication Repenser son marketing Adapter sa stratégie aux cycles de vente plus longs Fournir et relayer du contenu de qualité Socialiser les contenus sur les bons réseaux Focus sur les principaux médias sociaux et leurs fonctionnalités BtoB Les réseaux sociaux professionnels incontournables :  Facebook un réseau inutile ?  Linkedin, Viadéo (Etudes des outils spécifiques : communautés, hubs…) Twitter Youtube, Dailymotion, Viméo  SlideShare ScoopIt / Timely Google+ Xing Smartpanda, open2leads, jkpm etc… Panorama des réseaux professionnels d'experts (Muxi, Expeert), des réseaux professionnels sectoriels (public, e-commerce, digital, tourisme, loisirs et luxe etc…) et des réseaux géo-localisés Etude de cas : analyse d'exemples de communautés professionnelles Cas pratique : définissez votre stratégie pour créer et animer votre réseau social Quelles ressources ? Quels objectifs ? BtoB ou B to small-B quels médias choisir ? Sur quoi investir ? Qui doit-être le porte-parole de l'entreprise sur les médias BtoB ? Comprendre le rôle des dirigeants et le personal branding Valoriser et utiliser l'image des dirigeants pour servir l'entreprise Concept de Networking inter-dirigeants sur les réseaux sociaux Générer des leads commerciaux en BtoB Augmenter le nombre de contacts entrants grâce aux réseaux sociaux Réduire le coût d'acquisition Utiliser les contenus pour capturer des leads et les pré-qualifier Favoriser l'interconnexion des dispositifs de social marketing et de web marketing traditionnel Compatibilité entre les actions déjà mise en place par un service communication/marketing et de potentielles nouvelles actions social media Monétisation et ROI Comment monitorer, mesurer les actions ? Quels indicateurs quantitatifs et qualitatifs ? Quels sont les outils de pilotage à mettre en place ? Quelles interprétations donner ? Comment s'assurer d'un ROI Bonnes pratiques au travers de business cases BtoB - Mise en place d'un web eco-système automatique sur les réseaux sociaux - Techniques du blog collaboratif d'entreprise Etude de cas : analyse de l'organisation globale d'une campagne BtoB Analyse des chartes, planning de publication, reporting, formulaires, feedback etc… et comparaison avec une campagne BtoC

Lieu
Durée
Présence

Présentiel

1 095 € TTC Soit 1 314 € HT

Développement d'applications Web avec React.js Définir et comprendre le rôle de React.js dans le développement front-end • Comprendre le rôle et l'intérêt de React.js dans le développement Web • Appréhender les fonctionnalités de base de React.js : virtual DOM, .jsx, composants… • Identifier les différentes utilisations de React.js et son écosystème : application Web, embarquée, native… ➔ Étude de cas : différentes utilisations de React.js Maîtriser l'installation et l'utilisation des concepts de base • Récupérer et intégrer React.js dans ses pages : rôle des différents scripts, utilisation d'un CDN ou d'un REPL • Développer une page simple et la tester dans le navigateur • Comprendre la hiérarchie des composants et le fonctionnement du “virtual DOM” • Concevoir son application sous forme d'un ”arbre“ de composants indépendants et réutilisables • Appréhender le JSX et en comprendre les bases : attributs, éléments enfants, méthode render()… • Afficher des données dans son JSX : utilisation des variables et expressions JavaScript en JSX ➔ Exercice : construire une première page (écriture et intégration des scripts, création de balises JSX, test et débogage dans le navigateur) Créer des interfaces Web à l'aide de JavaScript et du JSX • Créer son premier composant React : différence entre composants ”fonctionnels“ et ”classes“ • Affecter des propriétés à ses composants pour modifier leur comportement • Créer une hiérarchie de composants et les imbriquer : passage de propriétés, interaction entre composants • Personnaliser l'aspect de ses composants : gestion des styles et des CSS avec React.js • Gérer les interactions des utilisateurs et y répondre correctement : événements souris, clavier, formulaires… ➔ Exercice : créer une mini-application de personnalisation de cartes de visites (conception de la hiérarchie DOM, construction de l'interface, implémentation des composants, réponse aux inputs de l'utilisateur) Développer des applications Web avec React.js • Comprendre les mécanismes de base des classes en JavaScript : constructeur, méthodes, super()… • Utiliser le ”state“ d'un composant pour implémenter une logique interne • Différencier l'utilisation du ”state” de celle des ”props“ : mutabilité vs immutabilité, fonctions ”pures“ et ”impures“ • Maîtriser le ”cycle de vie“ d'un composant et savoir choisir à quelle étape intervenir : componentDidMount, componentWillUnmount… • Appréhender le fl ux des données et la façon de les distribuer d'un composant à l'autre • Utiliser le rendu conditionnel pour afficher / masquer un élément en fonction de l'état de l'application • Utiliser array.prototype.map() et la propriété ”key“ pour générer des listes de composants • Créer des formulaires en manipulant les données à l'aide du ”state“ de ses composants de saisie • Concevoir des composants spécialisés en utilisant la composition : utilisation de props.children, différence avec l'héritage… • Générer une version ”production“ de son application : utilisation basique d'un ”bundler“ • Découvrir des usages avancés : Flux et Redux, Higher Order Components, React Router… ➔ Exercice : créer une application de gestion musicale (affichage des artistes et des albums, navigation dans l'application, ajout de données via un formulaire, tri et filtrage des données)

Lieu
Durée
Présence

Présentiel

2 000 € TTC Soit 2 400 € HT

Workshop : code créatif Atelier 1 : vue d'ensemble (travail collectif) • Introduire les notions-clés du code créatif • Découvrir les différentes utilisations du code créatif • Identifier les plates-formes de développement et comparer leurs avantages et inconvénients • Comprendre les limites de la programmation créative Atelier 2 : les techniques de programmation (travail collectif et restitution en sous-groupe) • Utiliser le contexte 2D et les méthodes de dessin vectoriel • Réviser les fonctions trigonométriques de base • Reproduire des oeuvres génératives 2D et composer des variations Atelier 3 : vers le GLSL (travail collectif) • Pratiquer le traitement d'image pixel par pixel • Comprendre la notion de fl ux et identifi er les limitations du CPU • Analyser le workfl ow GPU (Graphics Processing Unit) • Utiliser le GLSL (OpenGL Shading Language) pour le traitement pixel par pixel sur le GPU • Comparer les avantages et les inconvénients de l'approche vectorielle Atelier 4 : travailler avec le GLSL (travail individuel et restitution en sous-groupe) • Reformuler les méthodes de dessin vectoriel en GLSL • Introduire la 3D et revisiter les oeuvres génératives 2D • Produire une animation générative 2D / 3D

Lieu
Durée
Présence

Présentiel

1 950 € TTC Soit 2 340 € HT

Node.js Définir et comprendre le rôle de Node.js dans l'écosystème du Web • Comprendre le rôle et la place de Node.js dans le développement Web • Appréhender les fonctionnalités de base de Node.js : développement serveur, caractère asynchrone et scaling… • Identifier les différentes utilisations de Node.js : côté serveur, en local, embarqué dans une application… • Comprendre l'écosystème Node.js : le rôle des modules JavaScript et de npm • Lire un fi chier package.json pour appréhender un projet ➔ Étude de cas autour de la démonstration des utilisations de Node.js Maîtriser l'installation et l'utilisation des commandes de base • Récupérer et installer Node.js et npm • Connaître les commandes de base du Shell ou du Terminal • Lancer, arrêter et mettre à jour Node.js et npm, exécuter un script JavaScript • Écrire son premier script : lancer un serveur, répondre à une requête, lire un fichier • Utiliser le fi chier package.json : création, mise à jour, installation • Récupérer et configurer un projet JavaScript existant ➔ Exercice : installation et configuration de Node.js et npm / Création d'un premier script / Exploration des commandes de base Installer des modules npm et utiliser des scripts existants • Installer et utiliser des modules JavaScript avec npm • Découvrir les modules populaires, identifier les modules utiles • Utiliser npm pour des projets front-end : installation de bibliothèques ou de frameworks tiers • Intégrer et utiliser les modules JavaScript dans ses propres scripts • Effectuer les opérations de base : copie automatisée de fichiers, minification et concaténation de scripts… ➔ Exercice : création et organisation d'un projet Web / Création de scripts pour copier des fichiers / Minifier ou concaténer du code JS / CSS Créer et utiliser des outils d'automatisation et de workflow • Résoudre les problématiques grâce à l'automatisation : tâches répétitives et complexes, travail en équipe • Découvrir les outils d'automatisation les plus populaires : Grunt, Gulp, npm • Créer et configurer un serveur de développement • Recharger le navigateur automatiquement à la sauvegarde d'un fichier • Utiliser des outils de type LiveReload pour accélérer le développement ou l'intégration des pages • Lancer automatiquement la concaténation et la minification de ses fichiers .js et .css • Compiler automatiquement ses fichiers .less ou .scss • Optimiser ses images pour la production : réduction du poids des fichiers, création de spritesheets… • Générer un dossier dist avec la version production de son application / site ➔ Exercice : création et configuration de tâches d'automatisation (rechargement ”live“ des pages Web, copie des fichiers de production, compilation des sources JS et CSS…)

Lieu
Durée
Présence

Présentiel

1 300 € TTC Soit 1 560 € HT

Atomic Design Découvrir les guides de style et les design patterns (processus de découpage et inventaire) • Comprendre l'intérêt d'utiliser un guide de style pour une équipe Web • Identifier les composants Web design • Appréhender le processus de découpage en patterns • Créer un inventaire de patterns : logos (variations et résolutions), typographies, thèmes de couleurs, tendances iconographiques, systèmes de menus, éléments d'action, composants complexes… ➔ Exercice : créer une check-list de composants (méthode des 20 secondes, tendances UI, slide de découpage…) Choisir ses outils • Identifier des outils de mockup et de découpage en patterns : Sketch, XD et les plugins associés • Comparer les solutions de guides de style automatisés : Static HTML, KSS Node, Pattern Lab • Découvrir les langages de templating dynamiques : Mustache, Underscore et Twig ➔ Étude de cas : comparer les logiciels, les langages, les méthodes Appliquer la méthode de conception Atomic Design pour réaliser un guide de style • Expérimenter les formats de patterns Atomic : atomes, molécules, organismes, templates, pages • Nommer et organiser ses patterns ➔ Étude de cas : analyser un guide de style remarquable Composer un guide de style dans Pattern Lab • Installer Pattern Lab (version Node / PHP) • Tester et modifi er le code des différents patterns • Construire ses motifs (patterns) dans Pattern Lab • Créer un composant Twig • Ajouter des styles au composant • Présenter rapidement les templates avec des contenus réels en ajoutant des données (JSON) • Associer des commentaires au composant (syntaxe Markdown) • Créer des variantes du composant • Visualiser et tester dans les différentes résolutions d'affichage ➔ Exercices : créer un guide de style / Expérimenter le ”in-browser design“ Maintenir et synchroniser son guide de style • Pérenniser et faire évoluer son guide de style • Synchroniser son guide de style avec son environnement de production ➔ Étude de cas : analyse d'écosystèmes existants

Lieu
Durée
Présence

Présentiel

1 600 € TTC Soit 1 920 € HT

RacontR pour les annonceurs Découvrir l'interface de RacontR • Identifier les différentes pages du projet dans le scénario et apprendre à faire une copie de sauvegarde • Ouvrir l'éditeur de pages • Découvrir les différents panneaux de l'éditeur de pages • Localiser et comprendre l'ajout et la modification des médias ➔ Quiz de compréhension Charger et remplacer des médias • Cibler l'image à remplacer dans l'éditeur de pages • Noter les dimensions de l'image • Recadrer la nouvelle image • Charger l'image dans la fenêtre Média • Remplacer une image utilisée dans plusieurs pages ➔ Exercice : remplacer un logo présent sur plusieurs pages d'un projet Éditer du contenu au sein d'une page • Modifier le contenu d'un bloc texte • Remplacer une image par une autre • Intervertir deux vidéos au sein d'une mise en pages • Lancer l'aperçu pour visualiser ses modifications • Publier son projet ➔ Exercice : modifier différents types de média au sein d'une page Éditer des éléments interactif • Comprendre le principe des calques • Identifier les propriétés d'un élément animé • Modifier un bloc texte dont l'opacité est à zéro • Changer les valeurs d'un plugin Chart • Découvrir le plugin Popin ➔ Exercice : modifier des éléments complexes au sein d'une page

Lieu
Durée
Présence

Présentiel

650 € TTC Soit 780 € HT

RacontR pour les agences Définir les caractéristiques d'une expérience interactive sur le Web • Distinguer les différents types de navigation utilisateur • Comprendre la narration interactive, le rythme • Hiérarchiser l'information et définir le format du projet • Donner envie, capter l'attention, rendre l'information ludique • Prendre en compte les impératifs techniques et matériels des différents supports Web ➔ Exercice : concevoir un wireframe qui sert le fond et incite l'internaute à consulter l'intégralité du projet Trouver la forme qui sert au mieux le fond • Ajuster ses ambitions pour coller au budget et au planning • Définir une mise en pages dans Photoshop • Optimiser son fichier pour une importation dans RacontR • Adapter la mise en pages et les interactions en fonction du support de diffusion • Importer une maquette Photoshop dans RacontR ➔ Exercice : créer une mise en pages d'un long format et optimiser le fichier pour RacontR Produire efficacement avec RacontR • Identifier le scénario, l'import de médias, les paramètres du projet et l'éditeur de pages • Animer des éléments lors d'un clic • Explorer les différentes interactions et agir sur les propriétés d'un élément • Gagner en efficacité en utilisant la cinématique inversée • Contrôler les médias audio et vidéo ➔ Exercice : intégrer 3 sections du long format au sein de RacontR Exploiter au mieux les plugins • Utiliser le plugin Bouton • Mettre en forme des données chiffrées avec les plugins Bar Chart, Round Chart, Dataviz et Counter • Gagner en efficacité avec les plugins Popin, Embeder et Menu • Cartographier avec Google Maps • Ajouter du vectoriel avec les plugins Icon et MorphSVG • Jouer avec les images • Interagir avec les internautes via le plugin Quiz • Ajouter une touche sociale grâce aux plugins Social, Social Feed et Disqus ➔ Exercice : utiliser tous les plugins Ajouter de l'animation et de l'interactivité avancée • Apprivoiser la Timeline • Jouer avec les actions de contrôle de la Timeline • Placer une vidéo en master • Jouer une animation au scroll • Découvrir les effets d'animation et l'importance du timing ➔ Exercice : réaliser une vidéo interactive et animer des éléments au scroll

Lieu
Durée
Présence

Présentiel

1 600 € TTC Soit 1 920 € HT

InVision Studio Appréhender les spécificités du logiciel • Délimiter les périmètres fonctionnels (UI, wireframes, design system, prototypes de site ou d'application) • Découvrir l'interface ➔ Étude de cas : analyse de productions réalisées avec InVision Studio Créer une interface graphique • 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 ➔ Exercice : réalisation d'une interface graphique de site responsive (desktop, tablette, smartphone) Créer des interactions • Ajouter une interaction • Définir l'événement déclencheur (trigger) et le plan de travail de destination • Tester l'interaction ➔ Exercice : réalisation d'un menu de navigation interactif et création d'un bouton Simuler des animations • Paramétrer une transition prédéfinie et une transition entre des plans de travail • Régler la durée • Modifier l'animation à l'aide de la Timeline ➔ Exercice : création d'effets animés Produire efficacement avec InVision • Créer des objets réutilisables avec les composants • Créer des composants imbriqués ➔ Exercice : création d'une bibliothèque de composants Publier et partager un prototype • Publier un prototype sur InVision • Partager le prototype • Utiliser le mode Inspect d'InVision pour collaborer efficacement avec les développeurs • Exporter les images (SVG, PNG, JPEG) • Exporter une image pour les écrans Retina ou HD ➔ Exercice : export des différents éléments graphiques, publication du prototype sur InVision

Lieu
Durée
Présence

Présentiel

750 € TTC Soit 900 € HT

Design émotionnel S'approprier les notions fondamentales du design émotionnel • Différencier les notions d'affect, d'humeur, d'émotion et de cognition • Comprendre le rôle des émotions dans le champ des interfaces homme-machine • Distinguer les émotions : typologie et granularité émotionnelle • Appréhender les champs d'application du design émotionnel ➔ Exercice : exprimer une situation émotionnelle avec les matériaux à disposition Évaluer les aspects émotionnels des expériences client • Comprendre le cycle produit-émotion et les relations humains / systèmes • Reconnaître et évaluer le registre émotionnel dans les interfaces (IHM) et apprécier leur impact dans l'expérience utilisateur (UX) • Identifier l'impact de l'émotion sur le comportement des clients • Analyser les facteurs-clés pour offrir une expérience client émotionnelle ➔ Étude de cas : distinguer les aspects émotionnels d'une interface digitale interactive et les représenter dans une carte Utiliser les émotions pour engager l'utilisateur • S'adresser aux 3 cerveaux (théorie de Norman) • Reconnaître les principaux déclencheurs et modèles de conception émotionnelle • Provoquer des émotions positives • Décrypter et prévenir les émotions négatives • Justifier ses choix de conception auprès de ses clients et de son équipe • Mesurer la dimension émotionnelle d'une interface • Anticiper les apports de l'intelligence artificielle ➔ Exercice : conception et prise en main des outils de référence

Lieu
Durée
Présence

Présentiel

750 € TTC Soit 900 € HT

SXO (Search eXperience Optimization) Définir un parcours utilisateur • Appréhender les critères UX dans l'algorithme de Google • Déterminer les traces numériques pour enrichir le parcours de sa cible • Jouer sur la qualité des contenus ➔ Exercice : optimiser la présence d'une marque via le SXO Adapter son site à une logique SXO • Comprendre l'impact sur la navigation • Séduire le client • Analyser les comportements avec de nouveaux outils et des KPI ➔ Exercice : orienter un site existant vers une logique SXO

Lieu
Durée
Présence

Présentiel

400 € TTC Soit 480 € HT

SMO (Social Media Optimization) Identifier les opportunités du SMO • Comprendre l'importance du SMO sur le positionnement d'une marque dans les moteurs de recherche • Analyser l'impact sur le parcours utilisateur ➔ Étude de cas : analyse de différents positionnements Optimiser sa présence sur les réseaux sociaux pour générer du trafic sur son site • Activer les bons leviers - la gestion des avis (focus sur Google My Business) - les pages Facebook et LinkedIn - le VSEO avec YouTube - les images avec Pinterest ➔ Exercice : aider un site à développer des traces sociales pertinentes pour son activité

Lieu
Durée
Présence

Présentiel

400 € TTC Soit 480 € HT

Concevoir et diffuser une oeuvre narrative sur les réseaux sociaux Comprendre les codes et la sociologie de chaque réseau social • Distinguer les différents usages sur les 4 réseaux sociaux majeurs (Facebook, Twitter, Instagram, Snapchat) • Identifier les codes visuels et textuels propres à chaque réseau social ➔ Étude de cas : évaluer la structuration de l'audience sur chaque réseau social Découvrir les expériences sociales narratives les plus abouties de ces dernières années • Identifier les différents types d'oeuvres sociales narratives • Déterminer les narrations les plus appropriées à chaque réseau social • Produire et financer des oeuvres sociales narratives ➔ Études de cas : découvrir les secrets de fabrication de la BD Instagram ”Été“, de la fiction Snapchat ”#PLS“ et du docufiction Facebook ”Léon Vivien“ Développer un concept narratif original • Constituer la bonne équipe créative • Mettre en place les bons outils de collaboration • Choisir la bonne méthode de gestion de projet ➔ Exercice : atelier collectif d'idéation autour d'un thème donné / Rédiger un synopsis pour le concept imaginé dans cet atelier / Écrire une séquence qui servira de base à un prototype du concept Produire des images tests avec un mobile et des outils simples • Découvrir les outils de publication appropriés à chaque réseau social • Préparer le tournage ou la création des contenus pour le prototype • Réaliser un storyboard du prototype ➔ Exercice : prise en main d'outils de tournage et montage simple / Produire des contenus "tests" pour le prototype Prototyper un concept et expérimenter sa diffusion à une échelle réduite • Découvrir les différentes stratégies de diffusion d'un projet de narration sociale • Planifier la diffusion d'une oeuvre narrative sur les réseaux sociaux • Diffuser les contenus ”tests“ sur un compte créé pour l'occasion ➔ Exercice : présenter le prototype au reste du groupe et recueillir les retours

Lieu
Durée
Présence

Présentiel

1 300 € TTC Soit 1 560 € HT

Gérer son identité numérique et sa e-réputation Appréhender les enjeux de l'e-réputation pour sa marque • Déterminer les traces numériques qui remontent dans les moteurs de recherche • Identifier l'importance de l'e-réputation - dans une stratégie de personnal branding - pour une entreprise ➔ Étude de cas : analyse de traces numériques Faire de cette e-réputation un atout commercial • Démultiplier les traces positives • Redéfinir sa e-réputation en s'appuyant sur une ligne éditoriale pérenne • Éliminer des traces négatives • Développer les traces sociales (SMO) ➔ Exercice : aider une marque à mieux se positionner vis-à-vis de Google Suivre sa e-réputation avec des outils simples et accessibles • Utiliser les outils de Google • Piloter sa e-réputation grâce aux moteurs et outils d'alerte • Optimiser sa veille à travers les réseaux sociaux ➔ Exercice : prise en main de différents outils simples d'utilisation Gérer les avis et commentaires • Savoir répondre : les bonnes pratiques • Préparer un social media handbook pour un usage quotidien • Réagir efficacement en cas de crise (bad buzz, rumeurs…) • Intégrer les problématiques légales : connaître ses droits • Développer une charte ➔ Exercice : mettre en oeuvre un plan d'action pour gérer une crise (bad buzz, rumeurs…)

Lieu
Durée
Présence

Présentiel

1 350 € TTC Soit 1 620 € HT

Facebook Ads : les meilleures pratiques Définir sa stratégie publicitaire • Connaître et comprendre la politique de Facebook • Appliquer les bonnes pratiques du pixel de Facebook • Établir un plan publicitaire ➔ Exercice : élaborer la stratégie publicitaire d'une entreprise ou d'une marque Maîtriser le ciblage publicitaire • Découvrir les différents outils de ciblage • Maîtriser les températures d'audiences • Déterminer le profil type de son client idéal • Trouver et affiner sa cible avec les statistiques d'audience • Créer des audiences (similaires, démographiques, par connexion) • Identifier les fonctionnalités de retargeting • Évaluer les meilleurs placements ➔ Exercice : sélectionner et créer une audience idéale selon un cas pratique donné Gérer la création des publicités • Distinguer les 3 outils de configuration publicitaire : sur la page, sur le gestionnaire de publicités, sur le Power Editor • Maîtriser les 3 niveaux de Power Editor : Campagnes / Ensembles de publicités / Publicités • Identifier les différents formats publicitaires (vidéo, carrousel, image…) • Composer des visuels et des textes d'accroche impactants • Mesurer ses conversions avec le pixel Facebook ➔ Exercice : créer sa première pub dans Power Editor Suivre et optimiser ses publicités • Valider la pertinence et l'efficacité d'une publicité • Agir pour réajuster les mauvaises performances • Établir des rapports simples et efficaces ➔ Exercice : définir un plan d'action adapté à son entreprise

Lieu
Durée
Présence

Présentiel

1 400 € TTC Soit 1 680 € HT

MOD - Marketing de contenu et gestion éditoriale Appréhender les bases de l'inbound marketing • Observer l'impact du digital sur la communication de marque • S'initier aux principes de base de l'inbound marketing ➔ Étude de cas : analyse de contenus de marque remarquables Établir une stratégie de contenus cohérente • Décliner des personas et identifier leurs comportement et attentes • Découvrir les différentes familles de contenus à déployer en fonction des objectifs • Concevoir une charte éditoriale distinctive • Planifier la production de contenus ➔ Atelier : proposer des idées de contenus autour d'un cas fictif à l'aide d'un outil de brainstorming collaboratif Maîtriser les techniques d'écriture pour le Web • Appréhender les comportements de lecture à l'écran • S'initier à l'ergonomie éditoriale et aux codes du Web • Optimiser son contenu pour les moteurs de recherche ➔ Étude de cas : examiner l'optimisation éditoriale d'une page Web à travers un cas réel Transformer les contenus de marque en leviers d'engagement forts • Assimiler les principes du storytelling • Déployer des contenus interactifs ➔ Atelier : enrichir des propositions de contenus en y incluant un levier d'engagement Expérimenter la méthode du lean content • Savoir recycler ses propres contenus ou des contenus issus de la curation • Structurer une veille pour organiser son sourcing de contenus ➔ Atelier : mettre en place une veille RSS en toute simplicité avec Feedly Évaluer sa stratégie de contenus • Identifier les deux types d'audit de contenus • Découvrir les outils et méthodes pour mettre en place un audit éditorial ➔ Exercice : évaluer la performance éditoriale de quelques blogs et sites

Lieu
Durée
Présence

Présentiel

1 300 € TTC Soit 1 560 € HT

MOD - WooCommerce : créer et gérer sa boutique sous WordPress Comprendre le fonctionnement d'une boutique WooCommerce • Découvrir WooCommerce et son écosystème (plugins, thèmes) • Comprendre le fonctionnement général d'une boutique • Installer et configurer WordPress pour WooCommerce ➔ Analyse de sites utilisant WooCommerce Installer et confi gurer WooCommerce • Installer le plugin WooCommerce • Configurer les paramètres généraux : pages, frais de port… • Choisir et installer un thème adapté pour WooCommerce • Personnaliser le thème WooCommerce • Se familiariser avec l'interface de WooCommerce ➔ Exercice : créer une boutique WooCommerce Maîtriser les fonctionnalités de base de WooCommerce • Créer des produits et gérer le catalogue (catégories, produits mis en avant…) • Différencier les types de produits (simples, variables, téléchargeables…) • Ajouter des produits liés et utiliser les codes promo • Configurer les modes de paiement ➔ Exercice : créer un catalogue de produits, simuler des achats Personnaliser sa boutique et assurer un suivi efficace des commandes • Gérer les commandes et le suivi • Maîtriser les statuts de commande • Créer des comptes pour ses collaborateurs • Utiliser les rapports pour suivre l'évolution de la boutique • Modifier l'affichage des pages via la feuille de style ➔ Exercice : gérer le fonctionnement d'une boutique Installer des plugins et optimiser son référencement • Optimiser ses URL pour le référencement naturel • Utiliser Google Analytics pour booster ses ventes ➔ Exercice : optimiser le référencement de ses pages

Lieu
Durée
Présence

Présentiel

1 300 € TTC Soit 1 560 € HT

MOD - WordPress pour les créatifs Gérer un projet Web avec WordPress • Établir un cahier des charges • Identifier les besoins de création graphique • Identifier les objectifs et le public du site • Lister et hiérarchiser les contenus • Organiser l'arborescence du site • Élaborer le système de navigation • Créer des maquettes fonctionnelles (wireframes) • Appréhender les possibilités de personnalisation graphique d'un thème ➔ Partage d'expériences / Études de cas / Analyse de sites WordPress Héberger et installer un site WordPress • Comprendre la structure de WordPress • Choisir le serveur et le nom de domaine • Créer la base de données et configurer le FTP • Installer WordPress (local / distant) • Comprendre l'interface de WordPress • Configurer les fonctionnalités de base ➔ Exercice : installation et paramétrage d'un site WordPress Créer et organiser des contenus • Créer des pages et des articles • Ajouter des images • Créer des liens (internes, externes…) • Paramétrer un menu de navigation • Configurer la page d'accueil ➔ Exercice : mise en place des contenus dans un site WordPress Installer des extensions et utiliser des widgets • Insérer un plan Google Maps, un formulaire de contact, un plugin de sauvegarde • Connaître les extensions incontournables ➔ Exercice : installation et paramétrage de plusieurs extensions WordPress Personnaliser le graphisme d'un site WordPress • Préparer et optimiser les images avec Photoshop • Identifier les meilleurs thèmes gratuits ou Premium pour les graphistes • Identifier les possibilités et les limites de personnalisation graphique d'un thème • Modifier l'en-tête pour intégrer un logo • Modifier l'arrière-plan et les couleurs • Modifier / ajouter des polices • Modifier la feuille de style d'un thème WordPress - localiser la feuille de style du thème - modifier des styles existants - ajouter de nouveaux styles - ajouter une Google Fonts - appliquer les styles • Utiliser un constructeur de pages pour WordPress • Identifier les bonnes pratiques pour personnaliser un thème ➔ Exercices : analyse de thèmes WordPress populaires / Adaptation graphique d'un thème WordPress / Création et personnalisation d'un site vitrine Gérer la sécurité et la maintenance d'un site WordPress • Sécuriser un site WordPress - sauvegarder la base de données et le wp-content - exporter et importer un contenu dans WordPress pour dupliquer un site - effectuer les mises à jour pour optimiser et sécuriser son site ➔ Exercices : sauvegarde complète d'un site WordPress / Installation d'une extension pour automatiser la sauvegarde

Lieu
Durée
Présence

Présentiel

1 900 € TTC Soit 2 280 € HT

MOD - Le design d'interface avec Experience Design (XD) Appréhender les spécificités du logiciel • Découvrir l'interface et les raccourcis • Créer un nouveau projet • Gérer les plans de travail • Régler la grille ➔ Exercice : créer une base de travail pour une interface mobile Créer des éléments • Appréhender les outils de dessin • Régler l'apparence • Utiliser les couleurs, dégradés, transparences et ombres • Appliquer des angles arrondis • Maîtriser les subtilités de l'outil Plume • Combiner des formes et les modifier ➔ Exercice : concevoir des icônes Travailler avec des imports • Ajouter du texte de fichiers externes • Différencier texte de point et zone de texte • Préparer des images avec Photoshop • Importer des images • Gérer les masques • Importer des éléments vectoriels • Concevoir des compositions • Gérer les objets au sein des plans de travail • Créer des grilles de répétition • Personnaliser les grilles de répétition • Créer et gérer les symboles • Utiliser les kits d'interface ➔ Exercices : créer efficacement des listes à données multiples / Redessiner l'interface d'une application Créer une navigation dynamique • Définir une page d'accueil • Créer des boutons avec liens • Définir des transitions ➔ Exercice : simuler les interactions et transitions d'une interface Finaliser son projet • Exporter les plans de travail et éléments • Adapter le design à un autre format • Prévisualiser le projet dans le logiciel ou sur un périphérique mobile • Enregistrer une vidéo du projet • Partager le projet en ligne et activer les commentaires ➔ Exercice : organiser l'export d'éléments d'interface

Lieu
Durée
Présence

Présentiel

1 300 € TTC Soit 1 560 € HT

Le site Keytoform utilise des cookies. En continuant votre visite sur notre site, vous donnez votre accord à notre utilisation des cookies. Pour en savoir plus, cliquer ici.

Fermer