Le pôle webdesign de notre agence web vous a déniché une sélection de sites à l’UI et UX incontournables ! Découvrez le TOP du mois d’avril.
Les Petits M'O
Les musées d’Orsay et de l’Orangerie ont lancé une belle initiative culturelle originale avec Les petits M’O. Ce site interactif est entièrement destiné aux enfants et a pour objectif de les accompagner dans l’univers des deux musées.
La totalité des ressources est pensée pour un jeune public avec des contenus et un ton adaptés. L’expérience est complète, des présentations des oeuvres et des artistes aux podcasts racontant l’histoire d’un enfant et de son environnement inspirés d’une des oeuvres.
Le site est à la fois drôle, ludique et éducatif, avec des mascottes accompagnant les enfants. Le parcours numérique continue pendant la visite réelle des musées.
Le gros plus : la carte interactive animée avec de jolies illustrations dans lesquelles on navigue avec la souris ou le doigt sur smartphone et tablette. On peut se balader dans le paysage pour entrer dans les musées. On en voudrait même davantage : seulement 20 oeuvres sont présentées pour le moment.
Niveau UX, la surbrillance des éléments est discrète, un enfant pourrait passer à côté, notamment sur mobile où elle est complètement invisible et l’expérience est donc impossible à vivre.
#illustration #animation #culture #game #interaction #colorful #UI #UX #HTML5
Pusher
Branchez vos écouteurs et plongez dans l’expérience audiovisuelle de Pusher Music. Le site évolue autour du concept de pièces sombres, qui ne sont non pas sans rappeler les studios d’enregistrement de musique. Chaque section du menu est représenté par une pièce différente avec des cubes flottants, s’animant au survol, présentant les projets. L’effet de transition entre les pièces est d’autant plus impressionnant puisque le menu burger s’anime en même temps. Il faut tout de même nuancer en précisant que l’intégralité du site est basé sur un seul type de transition, et pourrait donc offrir une expérience encore plus intéressante avec plus d’originalité.
Contre toute attente, les transitions marchent tout aussi bien avec le scroll sur mobile, en plus de l’effet parallax ajouté lorsque l’on bouge son téléphone. En revanche, le menu ne fonctionne pas du tout sur ce terminal.
#audio #music #transitions #interaction #WebGL
Questions À Réaction
De nouveau un site conçu pour de jeunes utilisateurs ! Cette fois-ci, c’est Air France qui prend l’initiative de répondre à toutes les petites questions que se posent les enfants sur les avions. Ainsi, les “Pourquoi l’avion ne bat pas des ailes pour voler ?” trouveront réponse sur cette machine à questions, améliorant ainsi l’expérience des enfants (et de leurs parents) pendant leurs voyages. Ce site éducatif et interactif donne parole au personnel d’Air France à travers des vidéos.
La gamification séduit les petits comme les plus grands : on dirige l’avion avec sa souris pour aller de nuage en nuage et voir les questions/réponses. L’animation est beaucoup plus intuitive et simple sur mobile où toucher l’écran suffit pour se déplacer.
On apprécie la charte graphique et les transitions utilisées qui viennent donner une expérience globale ergonomique et satisfaisante. Seul bémol, on peut facilement se perdre dans le ciel, malgré le score de progression.
#culture #game #illustration #color #interactive #design #HTML5
MENTION SPÉCIALE : Schizinfo
C’est à l’occasion des 15e journées de la schizophrénie que le site Schizinfo.com propose de mieux comprendre, et reconnaître, cette maladie. En maintenant la barre d’espace appuyée, on s’immerge, grâce à des vidéos de qualité, dans la tête d’un malade sans suivi thérapeutique qui perçoit de la malveillance autour de lui. En la relâchant, on passe dans la tête de celui qui bénéficie d’un tel suivi et qui décrit sa maladie de façon humoristique et touchante.
L’objectif du site est clair : il permet de combattre les idées reçues et de sensibiliser en éduquant sur les symptômes de la schizophrénie. Une très belle initiative qui mérite d’être connue.
#web #interactive #storytelling #music #effects #JS
*UI : Interface utilisateur, l’UI correspond au design fonctionnel du site en jouant sur la sensibilité de l’internaute.
*UX : Expérience Utilisateur, l’UX prend en compte le parcours de l’internaute et facilite son expérience au sein du site internet.
L'agence123 est une agence digitale qui vous accompagne dans tous vos projets digitaux. Composée d’un pôle webdesign UI / UX, nous élaborons avec vous la meilleure expérience pour votre site internet ou e-commerce.
