Comme chaque début de mois, notre agence digitale vous propose sa sélection de nos dernières trouvailles de sites web à l'expérience utilisateur incontournable. Découvrez notre TOP 3 pour le mois d’ Avril des sites avec expériences UI/UX* qui nous ont marquées, sélectionnées par notre expert du webdesign.
Playdoh, la galerie des espèces en voie d’apparition
Retour en enfance avec la galerie des espèces en voie d’apparition. À l’occasion de son 60ème anniversaire, Play-Doh, marque emblématique de pâte à modeler depuis les années 50, joue sur le sentiment affectif et l'imaginaire de sa cible pour transmettre aujourd’hui un message fort ! Il est facile de comprendre avec le nom de la campagne le lien avec les espèces en voie de disparition; Play-Doh cherche certainement à sensibiliser son jeune public et les encourager à soutenir et à s’intéresser à la cause animale. La marque nous propose sous forme d’exposition une immersion dans un univers épuré avec un doux son de savane. Sous forme d'une page full 3D, Play-Doh met en scène les fameuses et réalistes “espèces en voie d'apparition”. Ces animaux sortant de l’imaginaire des enfants sont représentés uniquement en pâte à modeler, le produit phare de la marque depuis des générations. Nous apprécions fortement ce côté interactif que nous offre la navigation. Si une espèce nous intrigue il suffit de cliquer dessus afin d’avoir une petite anecdote la concernant (possibilité de choisir entre français et anglais) avec une animation.
Si nous devions optimiser un point , nous travaillerions sur le zoom, dézoom. Après avoir regardé de plus près les modèles, on est obligé de cliquer sur la petite loupe ‘’dézoomer’’ pour continuer de visiter la galerie. Pourquoi ne pas avoir mis à la place un scroll pour dézoomer ou zoomer plus rapidement ? Attention à l'usage avec trackpad sur certains ordinateurs, il arrive que la page ne fonctionne pas correctement.
Cette nouvelle campagne réussit à augmenter le capital sympathie de la marque en traitant un sujet sensible en faisant appel à nos souvenirs d’enfance et à notre imaginaire. Cette campagne touche toutes les générations, les petits comme les grands avec une idée particulièrement rigolote et originale.
#games #promotional #web & interactive #colorful #parallax #gallery #3D #WebGL #three.js #GSAP animation #php
ClearMotion
L'avis que vous pouvez vous faire au premier regard sur ce site n’est pas forcément le bon. Faites preuve de curiosité !
Petite pépite en terme d’outils mis en application par l’équipe de designers, ce site est intrigant pour l’expérience utilisateur. La façon dont il met en place la présentation des bénéfices que peuvent vous apporter leurs produits sort de l’ordinaire. ClearMotion propose différents produits pour votre véhicule. Nous apprécions fortement les différentes présentations et démonstrations mises en lumière par des vidéos, l’emploi de gifs ou encore l'installation d’effets de parallax le tout mêlé à des présentations produits en 3D comme le font des grandes marques telles qu'Apple ou Dyson… La page technologie reste celle qui reflète au mieux la présentation et la coordination entre la 3D et le gif. Un vrai plaisir pour les yeux !
La mise en avant du produit est belle mais ses atouts sont peut-être un peu difficiles à cerner rapidement. Le jeu de couleurs entre le gris et le bleu vif serait un moyen pertinent pour mettre en avant l'intérêt et les exclusivités que proposent leurs produits.
#promotional #technology #animation #clean #3D #svg #bootstrap #ReactJS #webpack
Find a Happy Medium, de Disney
Pour la promotion de leur dernier film, “Un raccourci dans le temps” ou “ A Wrinkle in Time " en version anglaise, le géant Disney vous propose une expérience 100% mobile avec Meet the happy medium ! L’expérience sur mobile est devenu tendance, Disney s’est donc pris au jeu en vous proposant d’empiler un maximum de roches aussi haut que possible (un peu comme un exercice méditatif). Après avoir testé le jeu sur une interface mobile on se rend compte qu’il est tout à fait fluide et fonctionne correctement. Même s'il est de plus en plus fréquent de voir des expériences cross-devices (mobiles et desktop), Disney n'a pas souhaité suivre ce mouvement. Il est peut-être dommage de ne pas avoir cette interaction entre les deux supports mais cela ne change en rien que le jeu soit de très bonne qualité.
Pourquoi ne pas avoir proposé d’utiliser le téléphone comme manette pour placer les rochers sur le desktop ? Après tout il s’agit d’une pratique fréquente dans l’univers du jeu. Que ce soit la Wii-u, les drones jumelés avec les mobiles, ou la Nintendo Switch, c’est prouvé, les deux écrans ça plait ! L’ utilisateur aime cette interaction entre deux supports. En tout cas, cet outil de promotion est bien sympathique, on se prend très rapidement au jeu. Il ne vous reste qu'à faire grimper le score !
#film & tv #mobile app #promotional #GSAP animation #nginx
MENTION SPÉCIALE - Get Mesmerized !
Notre mention spéciale est dédiée au site de l’école de cuisine Hongroise Gastropolis ! Ce dernier nous propose une expérience sensorielle hypnotique, améliorant notre perception de la cuisine d’une manière unique. Nous vous invitons à apprécier les illustrations très travaillées liées à un storytelling poussé. La technique d’animation est d’un très bon niveau. Le jeu de couleurs est captivant, si ce n’est hypnotisant, tout le long de la présentation. Mais la séquence entre le lancement de la page et l’apparition du call to action pour atterrir sur la page de contact n’est-elle pas un peu trop longue ? On aurait peur de s’en lasser, mais ce n’est pas le cas, la beauté du site éveille une certaine curiosité sur les images ainsi que sur les transitions mises en place pour donner cet effet de profondeur à la page.
Le site ne propose pas tant de fonctionnalités que ça , après avoir cliqué sur le petit texte qui apparaît dans la partie inférieure de votre écran vous atterrissez sur une page de contact vous permettant de rentrant en contact avec l’école de cuisine ainsi que les liens de leurs différents réseaux sociaux. Notons le côté imaginatif et décalé déployé afin de se différencier des écoles concurrentes. Nous on adore !
La boucle est bouclée, vous vous êtes fait mesmériser !
L'agence123 est une agence digitale qui vous accompagne dans tous vos projets. Composée d’un pôle webdesign UI / UX, nous élaborons avec vous la meilleure expérience pour votre site internet ou e-commerce.
*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.