Je suis séduit par la qualité des infographies sur le site officiel de la FIFA...

Ci-dessous, la fiche d'un joueur. J'aime particulièrement le "heatmap" du terrain. Habituellement, j'ai affaire à ce type de représentation pour comprendre les comportements de lecture des interfaces web. Ici, rien à voir : les zones "chaudes" correspondent aux endroits de la pelouse que le joueur aura le plus piétiné. Efficace pour comprendre les zones couvertes par un joueur, sa tendance à tenir sa place ou à ratisser large.

Chaque but fait l'objet d'une reconstitution en 3D, que l'on peut décider de jouer à plusieurs vitesses et sous différents angles...

Creusez encore un peu et vous aurez accès à des statistiques chirurgicales : pourcentage de réussite des passes courtes, des passes moyennes, des passes longues, des centres, des corners, vitesse de course avec et sans ballon, et bien plus encore.

Et voilà que Monsieur-tout-le-monde se retrouve potentiellement dans la peau d'un coach, avec toutes les données de match imaginables pour éclairer le débat. Les comparaisons de performances sont possibles, entre équipes, entre joueurs individuels.

L'information est proposée sous de nombreux angles : équipe, joueur, match,...

Par exemple, ci-dessous, l'équipe du Brésil dispose de "sa" page d'accueil, avec ses résultats propres, son calendrier, ses analyses, ses commentaires, ses photos, ses vidéos, etc.

Du point de vue technique, la FIFA a fait le choix d'utiliser Flash... démontrant par la même occasion que Flash (en attendant le HTML 5?) est bien plus qu'un outil d'animation. On orchestre ici une véritable base de données de contenus, richement mis en scène sur le plan graphique, reliés les uns aux autres et actualisés en temps réel.

Certains sites d'entreprises pourraient, je trouve, puiser ici quelques bonnes pratiques :

• La production d'un site riche où chaque page est quasiment une page d'accueil, un point d'entrée, une mise en scène propre.
• La mise en valeur visuelle de données chiffrées.
• L'interconnexion des données à travers des passerelles en tous sens.
• Le mélange harmonieux des genres : vidéos, photos, textes, données, commentaires,...

Dans la foulée du poster "Comment plaire à Google", téléchargé par près de 4000 personnes, j'ai le grand plaisir de vous annoncer un tout nouveau poster sur le thème de la lisibilité des pages web.

Venez le télécharger gratuitement ici :

http://www.60questions.net/fichesdepros/posters-web.htm

(au format A3 ou A4)

Vos commentaires seront appréciés comme toujours.

Je vous ai déjà parlé de boutons ici et là, de même que là-bas et là-bas aussi.

Ce que j'aime dans ce design de boutons :

• On y combine créativité ET ergonomie
• On y dose les effets (un bouton principal, un bouton secondaire)
• La métaphore graphique fonctionne (balle, gazon)
• Le texte est aussi incisif que l'image
• Le contraste de couleurs est maximal
• L'impact visuel déchire, sans empiéter le moins du monde sur la fonctionnalité

Source : http://tigerwoodsonline.ea.com/ via Elements of Design (excellente collection de variété d'options de design pour différents cas de figure : boutons, pieds de page, navigation, formulaires, et bien plus!) via Usaddict (excellent blog d'ergonomie web très pragmatique, alimenté par Thierry Bouillot, Jean-François Nogier, Loïc Nunez et Céline Uguen).