17 septembre 2020-Temps de lecture : 4min

Comment réaliser un site catalogue clair pour présenter les différents univers VTech ?

VTech, c’est l’histoire d’une success story qui a débuté à Hong-Kong. C’est dans ce temple de la technologie que les premiers jouets éducatifs électroniques sont mis au point. Envahissant les marchés mondiaux, VTech s’installe en France en 1991 et devient rapidement le n°1 des jeux éducatifs électroniques, comme dans de nombreux autres pays.

Que manquait-il, alors, à ce leader incontesté ? Un site catalogue adapté aux marchés européens, qui présente de façon très claire les différentes marques et univers de la firme. Et c’est là que NewQuest se remonte les manches pour proposer un design et une expérience utilisateur sur mesure !

Des pages flexibles et modulables pour communiquer sur chaque univers

VTech, c’est plus de 400 références et 14 marques différentes. Nous devions donc imaginer une organisation simple et fonctionnelle pour les visiteurs du site. Pour cela, nous avons combiné plusieurs stratégies.

Dès l’arrivée sur le site, nous avons mis en place un slider où défilent les différents univers de Vtech. Chaque slide renvoie à la page descriptive de la marque. Si elles sont toutes construites sur le même gabarit, l’ambiance graphique est à chaque fois différente pour bien marquer leurs identités uniques.

slider vtech

Mais le gros du travail d’organisation a été réalisé sur les pages-produits. Le menu du header propose en effet des entrées par tranche d’âge. Elles sont bien plus intéressantes pour les parents en quête d’un jouet à offrir. Pour qu’ils puissent à la fois combiner cette entrée par âge avec l’univers de marque qu’ils préfèrent, nous avons imaginé un système de grille adaptable et flexible qui s’adapte parfaitement au nombre de produits de chaque marque.  Si une marque possède un seul produit dans la tranche d’âge sélectionné, il prendra les quatre blocs qui constituent une ligne. S’il y a plusieurs produits, en revanche, ils prendront chacun seulement un bloc.

présentation fiches produits grille

Et pour simplifier les recherches, nous avons mis en place un système de filtres. Par marque sur la colonne de gauche et par sous-univers sur le bandeau bleu en haut du listing.

filtre fiche produit site catalogue

Informer et rassurer les parents grâce à des fiches-produits complètes

Deuxième problématique que les équipes de VTech nous ont demandé de résoudre : rassurer les parents sur la sureté des jouets et les informer sur la manière de les utiliser. Les jouets éducatifs et électroniques peuvent être assez complexes. Comme pour votre dernier Iphone, il est souvent utile d’avoir une démonstration !

La quantité d’informations à intégrer dans chaque fiche-produit était conséquente. Nous avons donc opté pour un menu qui permet de naviguer dans la page à l’aide d’ancres. Et pour faire comprendre le fonctionnement des jouets, nous avons créé une section « Le jouet en détails ». A droite, une image présente le jouet avec des marqueurs numérotés. Quand on clique sur l’un d’entre eux, la section de droite s’active, affichant une photo et un texte explicatif sur la fonctionnalité du jouet.

ecommerce description fiche produit

Des animations pour dynamiser le site de VTech

Enfin, nous n’avons pas révolutionné la charte graphique de VTech. Mais nous l’avons quand même retravaillé pour apporter un peu de peps à son site internet. L’idée était de mettre en avant l’aspect électronique tout en restant dans le monde de l’enfance. Pour cela, nous avons utilisé des couleurs tantôt acidulées, tantôt plus douces et pastels. Pour dynamiser l’ensemble, nous avons également créé des animations au niveau du slider ainsi que lors du clic sur certains boutons.

animation site catalogue vitrine

 

En résumé, une refonte réussie pour VTech. La firme passe de la boutique en ligne à un site catalogue fourni, fluide et fonctionnel. Nous sommes vraiment fiers de cette collaboration, réalisée en liaison avec leurs équipes techniques à Hong-Kong. Elle fait désormais des émules. Après la mise en ligne du site français, les sites des autres pays européens s’alignent petit à petit sur le design que nous avons imaginé !

Ouvrez la discussion

En laissant un commentaire vous acceptez de laisser votre nom/ pseudo pour affichage sur le site et votre adresse mail pour pouvoir vous contacter à propos de votre commentaire uniquement si besoin. Vous pouvez à tout moment demander l’anonymisation de vos commentaires.

Laisser un commentaire

Un projet ou des idées ? On peut sûrement vous aider :)
dmd france EPI site catalogue

DMD France dépoussière l’image des vêtements de travail !

Positionné dans le top 5 des fabricants français de vêtements de travail, DMD France, c’est une épopée qui dure depuis 1894 ! Plus d’un siècle d’expérience et d’expertise pour équiper des générations de travailleurs. Et quand on possède ce genre d’histoire, il est absolument nécessaire de se réinventer pour ne pas passer pour un dinosaure du secteur. Continue reading DMD France dépoussière l’image des vêtements de travail !

Minalogic : un site vitrine, repaire de l’innovation numérique en Auvergne-Rhône-Alpes

Minalogic, c’est LE pôle de compétitivité des technologies du numérique en Auvergne-Rhône-Alpes. Une équipe d’experts qui accompagne ses adhérents dans leurs projets d’innovation et de croissance, pour leur permettre de se développer plus rapidement et plus sereinement, en France et dans le monde. Continue reading Minalogic : un site vitrine, repaire de l’innovation numérique en Auvergne-Rhône-Alpes
site ecommerce car cover newquest

Le configurateur de produits : cerise sur le gâteau pour Car Cover !

Car Cover, c’est LE spécialiste de la housse de protection automobile, numéro 1 sur son marché depuis plus de 30 ans. Que vous ayez un scooter Vespa ou une Ferrari de luxe, il a la solution pour que votre bébé mécanique soit à l’abri, bien protégé s’il doit rester un moment sans bouger ! Continue reading Le configurateur de produits : cerise sur le gâteau pour Car Cover !