Conférence au salon E-Commerce Paris 2012 de Stéphane Lecouturier Directeur Création & User Experience, altima°.
Applications (iPhone, Android, iPad…) ? Site mobile ? Ou site responsive qui s’adapte à tous les devices ?
Même si l’enjeu du mobile est devenu une évidence, la tactique pour l’aborder l’est beaucoup moins.
Clarifiez votre vision du mobile en 45 minutes de démêlage de l’univers bouillonnant du cross-device.
6. au menu
Steve Jobs + Mona Lisa
+ Bruce Lee + Karl Lagerfeld
+ les septs nains + George Clooney…
+ 2 SCOOPS !
+ des surprises pour ceux qui restent
jusqu’au bout…
8. Le « Web Responsive » : c’est quoi ?
Une nouvelle démarche de design de site web
qui s’appuie sur la capacité des navigateurs
à détecter les caractéristiques du device.
Plutôt que de construire différents sites pour différents
types de devices, l’approche « responsive »
consiste en un seul site qui s’adapte
à plusieurs devices et ainsi de supporter
davantage de devices sans devoir développer
et maintenir plusieurs sites différents.
30. performance matters!
100 ms d’attente = 1 % de vente en moins
(manque à gagner potentiel de 191 millions de $ en 2008)
400 ms d’attente =
5 à 9 % de perte de trafic
500 ms d’attente = baisse de trafic de 20 %
Le coût de la lenteur augmente de jour en jour
1 s d’attente = baisse des revenus de 4 %
Sources: slideshare.net/stubbornella/designing-fast-websites-presentation & slideshare.net/markstanton/speed-matters
34. Be formless.
Shapeless, like water.
If you put water into a cup,
it becomes the cup.
You put water into a bottle
and it becomes the bottle.
You put it in a teapot,
it becomes the teapot.
Be water, my friend. Bruce Lee
http://www.youtube.com/watch?v=pGFf3SRP1bE
37. le responsive =
nouvel eldorado du web ?
m-commerce en France = 13,4 milliards d’euros en 2015
Xerfi 03/2012
Dans 5 ans, 19,2 milliards d'euros seront générés
grâce au m-commerce dans sept pays d'Europe,
dont 3,1 en France. Forrester 07/2012
63. framework
et architecture technique
• comment s’effectue
le rendering des pages HTML ?
• framework commun web et mobile ?
• quels formats d’images ?
65. performance
et hébergement
• même hébergement web et mobile ?
• gestion du cache ?
• optimisation des médias
à la volée pour le mobile ?
• comment je détecte les devices ?
66. Comparison of Mobile & Desktop RWD Views
By Jason Grigsby
#fail
http://www.uie.com/uietips/online_uietips/uietips__09_11_12.html
68. architecture
de l’information
• mes catégories produits
sont-elles adaptées au mobile ?
• mes contenus sont-ils adaptés
pour le mobile ?
• dois-je adapter mon site en fonction
du contexte ?
74. j’ai déjà un site
et/ou des applis !
• comment transformer mon site web
en responsive sans tout refondre ?
• mon site web est-il compatible iPad ?
75. j’ai déjà un site
et/ou des applis !
• dois-je conserver mes applis ?
• est-ce que je peux encapsuler
du HTML dans mes applis ?
• comment je fais pour scanner
un code barre sans appli ?
76. comprendre ou définir
l’écosytème digital
• à quoi sert mon site web…
• à quoi servent mes applis…
• qui sont mes clients…
• quels devices utilisent-ils…
• dans quel contexte…
• d’où vient mon CA…
84. case-study
• un site web pour inscription et
commande de magazines
• + des applis : pour la consultation
• 95 % d’utilisation tablette
• contrainte Apple in app purchase :
30 % de mon CA menacé