PANORAMA RAPIDE            CONCEPTION MINI-FINGER            ou beaux sites optimisés pour l’expérience web mobile        ...
•     Grille simplifiée          fr.m.yahoo.com                                                                           ...
•     Grille simplifiée          m.mg.mail.yahoo.com                                                                      ...
•     Carrrousel fluide          m.sfr.fr                                                                                 ...
•     Grille simplifiée          m.samsung.com                                                                            ...
•     Popin          m.facebook.com                                                                               FORMAT  ...
•     Nav. icônes          mobile.twitter.com                                                                           PE...
m.flickr.com                                                                                                       SIMPLE ...
m.kayak.fr                                                                                   ERGO…                        ...
•     Info incitative          m.youtube.com                                                                              ...
m.espn.go.com                                                                                                       TYPO  ...
•     Traitement popin          google.com/m                                                                              ...
•     Fluidité des          mail.google.com                                                                               ...
•     Design épuré          bagcheck.com/mobile                                                                           ...
yiibu.com                                                                                                       TAILLE TYP...
edition.cnn.com/m                                                                                                       PR...
•     Background          bk.com                                                                                       IMA...
•     Taille des boutons          iphone.pagesjaunes.fr                                                                   ...
•     Rapidité menu          amazon.com                                                                                   ...
toysrus.digby.com                                                                            PUSH                         ...
•     Traitement popin          m.bestbuy.com                                                                             ...
underarmour.com                                                                              TRAITEMENT                   ...
•     Identité          threadless.com                                                                               SITE ...
voyages-sncf.mobi                                                                            CAS                          ...
m.ae.com                                                                                     ECOMMERCE                    ...
•     chemin de fer          mobile.walmart.com                                                                           ...
•     Filtres          m.boulanger.fr                                                                               FILTRE...
google.com/m                                                                                 SAISIE                       ...
saisie prédictive…                                                                           SAISIE                       ...
m.youtube.com                                                                                SAISIE                       ...
mobile.walmart.com                                                                           SAISIE                       ...
julien MUCKENSTURM                           SENIOR INFORMATION ARCHITECT                           jm@iafactory.fr© 2012 ...
Prochain SlideShare
Chargement dans…5
×

Belles expériences web mobile

4 535 vues

Publié le

Un panorama visuel de quelques beaux sites web optimisés pour l'expérience web mobile. A consulter depuis un smartphone tactile...

Publié dans : Technologie
0 commentaire
2 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
4 535
Sur SlideShare
0
Issues des intégrations
0
Intégrations
3 236
Actions
Partages
0
Téléchargements
0
Commentaires
0
J’aime
2
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Belles expériences web mobile

  1. 1. PANORAMA RAPIDE CONCEPTION MINI-FINGER ou beaux sites optimisés pour l’expérience web mobile MATERIALIZE YOUR NEXT SUCCESS© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 1 32
  2. 2. • Grille simplifiée fr.m.yahoo.com POUR LE • • Corps de typo Big finger TRAITEMENT GÉNÉRAL • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 2 32
  3. 3. • Grille simplifiée m.mg.mail.yahoo.com POUR LE • • Corps de typo Big finger TRAITEMENT GÉNÉRAL • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 3 32
  4. 4. • Carrrousel fluide m.sfr.fr DESIGN DU CARROUSEL • Format de pub (suggère le balayage tactile…) • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 4 32
  5. 5. • Grille simplifiée m.samsung.com POUR LE • Lisibilité TRAITEMENT GÉNÉRAL • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 5 32
  6. 6. • Popin m.facebook.com FORMAT ÉPURÉ • Nav. icônes CONTENT FIRST • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 6 32
  7. 7. • Nav. icônes mobile.twitter.com PERF. RAPIDITÉ CHARGMT • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 7 32
  8. 8. m.flickr.com SIMPLE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 8 32
  9. 9. m.kayak.fr ERGO… BIEN PENSÉ • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 9 32
  10. 10. • Info incitative m.youtube.com FORMAT ÉPURÉ • Search engine CONTENT FIRST • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 10 32
  11. 11. m.espn.go.com TYPO • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 11 32
  12. 12. • Traitement popin google.com/m POPIN • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 12 32
  13. 13. • Fluidité des mail.google.com transitions EFFETS • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 13 32
  14. 14. • Design épuré bagcheck.com/mobile BIG FINGER • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 14 32
  15. 15. yiibu.com TAILLE TYPO • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 15 32
  16. 16. edition.cnn.com/m PROPORTION • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 16 32
  17. 17. • Background bk.com IMAGE EN FOND (BG) ? • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 17 32
  18. 18. • Taille des boutons iphone.pagesjaunes.fr BIG FINGER • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 18 32
  19. 19. • Rapidité menu amazon.com VITESSE DE CHARGEMT • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 19 32
  20. 20. toysrus.digby.com PUSH COMMERCE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 20 32
  21. 21. • Traitement popin m.bestbuy.com POPIN • Refine en popin REFINE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 21 32
  22. 22. underarmour.com TRAITEMENT COM’ • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 22 32
  23. 23. • Identité threadless.com SITE AVEC ADN • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 23 32
  24. 24. voyages-sncf.mobi CAS CLINIQUE… SANS FIORITURES • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 24 32
  25. 25. m.ae.com ECOMMERCE MOBILE VISUEL (lourd) • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 25 32
  26. 26. • chemin de fer mobile.walmart.com FORMAT ÉPURÉ • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 26 32
  27. 27. • Filtres m.boulanger.fr FILTRES RESULTAT. • Fiche produit ONGLET FICHE PRODUIT • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 27 32
  28. 28. google.com/m SAISIE PREDICTIVE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 28 32
  29. 29. saisie prédictive… SAISIE PREDICTIVE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 29 32
  30. 30. m.youtube.com SAISIE PREDICTIVE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 30 32
  31. 31. mobile.walmart.com SAISIE PREDICTIVE • Sites relevés pour illustrer les tendances générales du design d’expérience web mobile. À CONSULTER • Points d’observation : encombrement général, charge des écrans, taille des items, part du visuel, traitement des header. DEPUIS UN SMARTPHONE TACTILE© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 31 32
  32. 32. julien MUCKENSTURM SENIOR INFORMATION ARCHITECT jm@iafactory.fr© 2012 IAFACTORY | Panorama visuel - expérience web mobile IAFACTORY | conseil en architecture de l’information | www.iafactory.fr | jm@iafactory.fr 32 32

×