Le document traite de la conception de sites web en mode 'mobile first', une approche essentielle pour optimiser l'expérience utilisateur sur mobile en intégrant la géolocalisation et des interfaces engageantes. Des ateliers présentés lors de l'événement 'VEM7 Voyage en Multimédia' présentent des études de cas sur l'impact du mobile et du responsive design sur la création de contenus adaptés. Les intervenants partagent des stratégies pour personnaliser l'expérience utilisateur et maximiser l'engagement des visiteurs grâce à des données ciblées.

1. Salle
#VEM7 Voyage en Multimédia | 3 - 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
La conception de sites web
en mode « mobile First »
Atelier i5
Animateur : Vivian VIDAL
Cédric CHABRY
Agence interactive
Jean-Baptiste DAVID
NOE interactive
Frédérique PACOTTE
Iris Interactive

2. Salle
#VEM7 Voyage en Multimédia | 3 - 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
Atelier i5
L’avènement de la connexion en mobilité impacte
la création des sites web.
Le responsive design permet un affichage optimisé
en lecture sur mobile. La conception de pages web
en mode « Mobile first » change la façon
d’appréhender l’expérience utilisateur en
valorisant la géolocalisation et le moment présent.
• Mobile first ça veut dire quoi concrètement ?
• Quand faut-il travailler en mobile first ?
• Comment faut-il s’y prendre ?
• Pourquoi suis-je concerné si je ne suis pas
développeur ?
La conception de sites web
en mode « mobile First »

3. > >

4. > >

5. > >> >

6. > >
>

7. > >
>
> >

9. 9
Étude de cas :
#VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
Atelier 15 : La conception de site web en mode « mobile First »

10. Atelier 15 : La conception de site web en mode « mobile First »
Je découvre la destination

11. Atelier 15 : La conception de site web en mode « mobile First »
Je découvre la destination

12. #VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
Atelier 15 : La conception de site web en mode « mobile First »

13. Atelier 15 : La conception de site web en mode « mobile First »
Je consulte les offres

14. Atelier 15 : La conception de site web en mode « mobile First »
Je réserve mon voyage

15. Atelier 15 : La conception de site web en mode « mobile First »

19. Atelier 15 : La conception de site web en mode « mobile First »

20. Atelier 15 : La conception de site web en mode « mobile First »

21. Atelier 15 : La conception de site web en mode « mobile First »

22. Atelier 15 : La conception de site web en mode « mobile First »

23. MOBILE FIRST + RESPONSIVE DESIGN
{ USER FIRST }

25. 25
#VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
montpellier-tourisme.fr

29. 29
#VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
montpellier-tourisme.fr

30. 30
#VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
montpellier-tourisme.fr

31. 31
#VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
montpellier-tourisme.fr

32. 32
#VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
montpellier-tourisme.fr

33. Etude de cas : chartreuse-tourisme.com
géolocalisation
Mobile First & expérience utilisateur (UX)

34. • Stimulation de
l’utilisateur par
un menu
accrocheur
• Expérience
spécifique si
l’utilisateur est
sur place,
détection via la
géolocalisation
Mobile First & expérience utilisateur (UX)
Géolocalisation

35. • Call to action :
situation
géographique à
préciser par
l’utilisateur (si pas
précisé)
• pour un service
très personnalisé
• on rassure
l’usager
Géolocalisation
Mobile First & expérience utilisateur (UX)

36. Géolocalisation
maximiser l’expérience et l’usage en mode carte
Mobile First & expérience utilisateur (UX)

37. Une interface utilisateur engageante
Mobile First
& expérience utilisateur (UX)
Etude de cas : lesmenuires.com (tablette)

38. 2 boutons « Call to action » dépendants de la stratégie commerciale
Une interface utilisateur engageante
Mobile First & expérience utilisateur (UX)

39. UI similaire, dans un service tierce, mais responsive
Une interface utilisateur engageante
Mobile First & expérience utilisateur (UX)

40. Une stratégie mobile first n’a de sens que si :
– on sait proposer un contenu différencié en
préparation de séjour et en situation de séjour
(géolocalisation).
– le mobile devient le point de contact
privilégié pour capter l’attention d’un client en
séjour
– on connaît suffisamment de choses (Data) sur
ses utilisateurs pour leur proposer des offres
qualifiées (smartdata)
Mobile first : le contenu first

41. Une qualification exemplaire des données SIT pour
une recherche sur mobile
– des résultats liés à la proximité (géolocalisation)
– des résultats liés au contexte (horaires, disponibilité, météo)
– le mobile devient alors l’outil déterminant d’une stratégie
ROPO (Research Online Pourchasse Offline) avec vos
prestataires
Mobile first : le contenu first
ROPO

42. #VEM7 Voyage en Multimédia | 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
Retrouvez toutes les informations et les
coordonnées des intervenants sur:
http://www.salon-
etourisme.com/intervenants-vem
Ou cliquez directement leur nom sur la première slide
Infos Intervenants

43. Salle
#VEM7 Voyage en Multimédia | 3 - 4 & 5 Février 2016 | Saint-Raphaël - Slides disponibles sur www.salon-etourisme.com
La conception de sites web
en mode « mobile First »
Atelier i5
Animateur : Vivian VIDAL
Cédric CHABRY
Agence interactive
Jean-Baptiste DAVID
NOE interactive
Frédérique PACOTTE
Iris Interactive