Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Progressive Web App, la clé de votre écosystème mobile

2,824 views

Published on

Support de mon intervention sur les Progressive Web Apps lors des Rencontres Nationales de la Communication Numérique
du 28 septembre 2017 à Paris.

Published in: Marketing
  • Be the first to comment

Progressive Web App, la clé de votre écosystème mobile

  1. 1. FredCavazza.net@fredcavazza #capcomnet Progressive Web App, la clé de votre écosystème mobile Rencontres Nationales de la Communication Numérique 28 septembre 2017
  2. 2. FredCavazza.net@fredcavazza #capcomnet Frédéric Cavazza ? • Marketing technologist • Consultant et conférencier • 20 ans d’expérience dans le web • 1 blog : FredCavazza.net • 2 livres :
  3. 3. FredCavazza.net@fredcavazza #capcomnet Sommaire • Le mobile dévore le monde
 Chiffres-clés, usages et impacts • Oubliez les applications, pensez écosystème
 Pourquoi les applications ne sont plus viables ?
 Quelles sont les autres solutions ? • Le B-A-BA des PWA
 Qu’est-ce qu’une Progressive Web App ?
 Quelle différence avec le Responsive Web Design ?
 Qui les utilisent ? Pour quels objectifs ?
  4. 4. FredCavazza.net@fredcavazza #capcomnet Le mobile dévore le monde (depuis 2011)
  5. 5. FredCavazza.net@fredcavazza #capcomnet Nous vivons dans un quotidien numérique Il y a plus de numérique que d’analogique dans l’information, la communication, le divertissement… notamment grâce à l’hégémonie des smartphones
  6. 6. FredCavazza.net@fredcavazza #capcomnet Le smartphone dans la journée des consommateurs Source : Deloitte, septembre 2016 23% des français n’éteignent jamais leur smartphone
  7. 7. FredCavazza.net@fredcavazza #capcomnet Mobile > Desktop Supports de consultation : Mobile = 52% Desktop = 43% Tablet = 5% Ventes mondiales : Source : IDC, 2016 Source : StatCounter, mai 2017
  8. 8. FredCavazza.net@fredcavazza #capcomnet MOBILE > DESKTOP Source : eMarketer, mars 2017 Source : ComScore, avril 2017 Investissements publicitaires (FR) : Temps passé :
  9. 9. FredCavazza.net@fredcavazza #capcomnet Le marketing doit se transformer No Parking, No Business No Mobile, No Business Les dogmes du XXe siècle sont des anachronismes
  10. 10. FredCavazza.net@fredcavazza #capcomnet Oubliez les applications mobiles, pensez écosystème mobile
  11. 11. FredCavazza.net@fredcavazza #capcomnet Android > 2.000.000.000 Les 3/4 des smartphones en circulation sont sous Android, une application iPhone ne touchera q’une petite partie des utilisateurs
  12. 12. FredCavazza.net@fredcavazza #capcomnet Les applications mobiles sont reines,
 mais malheureusement pas la vôtre ! 😃 😳 Source : Flurry Analytics, avril 2017 Social + divertissement + jeux + utilitaires = 95% du temps passé
  13. 13. FredCavazza.net@fredcavazza #capcomnet Nombre moyen d’applications mobiles utilisées par jour (source : AppAnnie, Q1 2017) Moins de 10 applications sont régulièrement utilisées Les mobinautes ont déjà développé leurs habitudes 😩
  14. 14. FredCavazza.net@fredcavazza #capcomnet Moins de 10 M de mobinautes français ont téléchargé une app. ou + (sur 35 M) Source : MMA FR Un réel phénomène d’app fatigue 1 mobinaute US sur 2 ne télécharge plus d’application Source : Comscore 3/4 des mobinautes français ne téléchargent plus de nouvelles applications mars- 17
  15. 15. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗
  16. 16. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗 🤔
  17. 17. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗 🤔 🙂
  18. 18. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗 🤔 🙂 😕
  19. 19. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗 🤔 🙂 😕 ☹
  20. 20. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗 🤔 🙂 😕 ☹ 😠
  21. 21. FredCavazza.net@fredcavazza #capcomnet Une application mobile ne couvre qu’une petite partie des cas d’usages 🤗 🤔 🙂 😕 ☹ 😠 😖
  22. 22. FredCavazza.net@fredcavazza #capcomnet Tout est question de contexte Toucher la bonne personne, au bon endroit, au bon moment… sans l’obliger à télécharger une application de 28 Mo !
  23. 23. FredCavazza.net@fredcavazza #capcomnet Votre objectif est de couvrir le plus de micro-moments possibles S’insérer de façon élégante dans le quotidien des mobinautes Source : BCG, mai 2015
  24. 24. FredCavazza.net@fredcavazza #capcomnet Les différents formats de présence • Application native / hybride • Site responsive / RESS • Site mobile dédié • Pages AMP / Instant Articles • Bannières / publicités natives • Résultats sponsorisés • Promotions géolocalisées / in-store • Notifications (in app, assistants…) • Chatbot (Messenger, Kik, Viber…) • Assistants personnels (Siri, Google…) Les smartphones offrent de nombreuses possibilités de toucher vos clients
  25. 25. FredCavazza.net@fredcavazza #capcomnet Progressive Web App, la solution ultime ?
  26. 26. FredCavazza.net@fredcavazza #capcomnet Les limites du RWD Le responsive web design est une transition pour mieux appréhender les terminaux mobiles ☹ Poids des pages 😖 Temps de chargement 😥 Complexité du code 😱 Adéquation au contexte mobile « Naaaaan c’est booooon, notre site est responsive… »
  27. 27. FredCavazza.net@fredcavazza #capcomnet La révolution des PWA Les Progressive Web Apps offrent tous les avantages des sites mobiles et des applications natives sans les inconvénients • Accès immédiat • Icône sur l’écran d’accueil • Fonctionnement hors-ligne • Stockage persistent • Mises à jour transparentes • Accès aux ressources syst. • Interface uniforme…
  28. 28. FredCavazza.net@fredcavazza #capcomnet Concrètement, c’est quoi une PWA ? • Un site web (accessible librement depuis une URL et non une app store, et peut donc être référencé sur Google) • Optimisé pour les smartphones (mise en page adaptative, compatible avec les Accelerated Mobile Pages…) • Qui reproduit l’expérience d’une application (icône sur l’écran d’accueil, cadre du navigateur pas affiché…) • Qui offre le même niveau de service (fluidité, rapidité, consultation hors ligne, utilisation du GPS, de l’appareil photo…) • Mais qui est utilise les technologies web (pas besoin de recruter un nouveau développeur ou d’avoir recours à un prestataire) Avec les Progressive Web Apps , vous n’avez aucun compromis à faire
  29. 29. FredCavazza.net@fredcavazza #capcomnet Ex : Forbes
  30. 30. FredCavazza.net@fredcavazza #capcomnet Ex : Forbes Icône sur l’écran d’accueil Même prise en charge par l’OS qu’une appli native
  31. 31. FredCavazza.net@fredcavazza #capcomnet Ex : Financial Times Ajout à l’écran d’accueil à la seconde visite Stockage des articles pour lecture hors-ligne
  32. 32. FredCavazza.net@fredcavazza #capcomnet Ex : Lancôme Notifications push Géolocalisation
  33. 33. FredCavazza.net@fredcavazza #capcomnet Ex : Wego Récupération automatique du profil Recherches en arrière plan
  34. 34. FredCavazza.net@fredcavazza #capcomnet Ex : Voice Recorder Utilisation du micro Édition et stockage des mémos vocaux
  35. 35. FredCavazza.net@fredcavazza #capcomnet Ex : Utilitaires Utilisation du micro Utilisation de l’appareil photo
  36. 36. FredCavazza.net@fredcavazza #capcomnet Ex : 2048 Icône sur l’écran d’accueil Manipulation fluide
  37. 37. FredCavazza.net@fredcavazza #capcomnet Ex : Rio Run Stockage des enregistrements audio Géolocalisation Fonctionnement hors-ligne
  38. 38. FredCavazza.net@fredcavazza #capcomnet Tous les avantages des applications natives sans les inconvénients • Accès immédiat aux contenus, services et offres • Icône sur l’écran d’accueil • Fonctionnement hors-ligne • Mises à jour transparentes sans passer par le processus d’approbation des app stores • Accès aux ressources systèmes (GPS, appareil photo, contacts, micro, notifications…) • Fonctionnalités équivalents à une applications native (notifications, sauvegarde des données…) Les PWA sont la clé de voute de votre écosystème mobile
  39. 39. FredCavazza.net@fredcavazza #capcomnet Conclusion
  40. 40. FredCavazza.net@fredcavazza #capcomnet Making smartphone great again! 😜
  41. 41. FredCavazza.net@fredcavazza #capcomnet Merci de votre attention

×