ShopAlike.fr a fait depuis peu peau neuve. C’est l’occasion d’en savoir plus sur la face cachée de la refonte totale d’un site en interrogeant Sascha Funda, le chef de produit du site.

Comment vous est venue l’idée de retravailler complètement l’apparence de la plateforme de shopping pour laquelle vous travaillez ?

Nous avions le sentiment que „l’ancien design“ ne correspondait plus à l’image que nous nous faisions de notre site. Nous voulions faire bénéficier à nos utilisateurs d’une interface simple, facile d’utilisation et surtout esthétique.
En tenant compte des différents feedbacks internes et externes que nous avions reçus, nous souhaitions proposer un site nouveau et intuitif.

D’autre part, notre entreprise devient de plus en plus grande et s’internationalise. Il nous fallait créer une véritable identité visuelle qui nous serait propre et qui permettrait de nous identifier facilement dans les différents pays dans lesquels nous sommes présents.

Comment avez-vous envisagé le „lifting“ de ShopAlike | LadenZeile ?

– L’idée centrale était de donner carte blanche à un graphiste pour améliorer l’identité globale de nos sites (un nouveau logo, une police d’écriture et une charte graphique).

– Nous ne voulions pas que le graphiste bride sa créativité avec des considérations techniques. En respectant notre brief, il a pu laisser s’exprimer son inventivité. Pour notre part, nous nous sommes occupés de la réalisation et de la mise en place technique du projet.

– A posteriori, séparer l’aspect „artistique“ et „technique“ était une bonne idée.

Sascha_Funda

Quelles étapes avez-vous suivies partant de l’idée pour aboutir à sa réalisation ?

1. – Premièrement nous avons constitué une équipe dédiée à cette tâche (deux hommes et deux femmes) en interne, une „dream team“ que nous voulions aussi hétérogène que possible (différentes ethnies, cultures, origines …). Cette équipe était chargée de trouver des réponses à différentes questions ; Qui sommes-nous ? Qui voulons-nous être ? Quel genre de message voulons-nous transmettre à travers notre design ? Etc …

2. – Nous avons ensuite transformé ce bilan en exigences et en lignes directrices que nous avons transmises à un designer graphique sous-traitant sous forme de brief.

3. – En tenant compte de nos consignes, ce graphiste nous a proposé différentes idées. Après en avoir discuté longuement au sein de notre équipe, nous en avons retenues trois qui respectaient nos critères.

4. – Nous avons soumis ces trois „finalistes“ au vote de l’ensemble des employés de ShopAlike | LadenZeile. Nous avons choisi celui qui remporta le plus de voix.

5. – Une fois le logo et les couleurs définies, nous avons travaillé un à un les visuels des différents types de pages pour avoir un premier aperçu concret du futur site. Nous voulions être certains que cette nouvelle apparence convienne à toutes nos pages, de la page d’accueil à la page produit.

6. – Une fois les visuels terminés et validés par la majorité, nous avons entamé la phase de réalisation technique. C’est à partir de ce moment que les choses se sont compliquées car en plus de changer le design, nous avons également travaillé sur de nouvelles fonctionnalités techniques.

7. – Pour minimiser les risques, nous avons commencé par apporter les modifications aux plateformes des pays les plus récents en réalisant un test A/B (en Hongrie et plus tard au Danemark). À ce moment nous avons observé attentivement les différentes statistiques (temps sur le site, taux de rebond, …). En tenant compte de ces mêmes chiffres nous avons encore apporté quelques ajustements au site, aux pages de marque, à la homepage…

8. – Maintenant que nous avons une version finale et définitive de notre interface, nous sommes sur le point de la mettre en place dans les 15 pays dans lesquels nous sommes présents à travers l’Europe. Nous sommes évidemment toujours en train de modifier certains détails dans le but de les améliorer et de proposer la meilleure expérience utilisateur possible, mais nous sommes très satisfaits du résultat

9. – La prochaine étape est d’adapter nos applications et nos pages mobiles au nouveau design.

Que représente le logo de votre plate-forme ?

Le nouveau logo représente un chariot de supermarché, les différentes zones de couleur qui l’entourent représentent les différentes catégories, produits et marques que les internautes peuvent retrouver sur ShopAlike. Nous voulions évoquer la variété d’articles disponibles sur notre site et émettre l’idée que notre interface est la meilleure pour faire du shopping sur internet.

Quels sont les nouvelles fonctionnalités que l’on découvrira avec le nouveau design ?

Notre première pensée était „Si nous modifions l’apparence du site, pourquoi ne pas en profiter pour apporter quelques modifications ?“, ainsi nous avons amélioré notre site :

Un contenu dynamique : désormais le site s’adaptera automatiquement à la taille de l’écran et il y aura plus d’items par ligne sur les grands écrans que sur les plus petits

Des photos plus grandes : l’utilisateur pourra afficher les photos en petit ou grand format

Une nouvelle barre de navigation : nous avons restructuré et épuré le menu complet pour améliorer et simplifier son utilisation

Des nouvelles pages de marques : là encore la structure est plus simple et davantage minimaliste pour ne pas encombrer la page

Des filtres mis en avant : ils auront une place plus importante sur la page, leur utilisation sera plus fluide

Qu’avez-vous retenu de cette expérience ?

Ne faire qu’une chose à la fois ! Si vous voulez changer le design de votre site web, lancez-vous, mais allez-y pas à pas. Ne brusquez pas les choses en voulant tout faire en même temps (changer l’apparence, apporter de nouvelles fonctions …). Cela prendrait plus de temps, mais rendrait aussi la phase de test inefficace. Un changement dans les KPIs est-il lié au nouveau logo ou à une nouvelle fonction ?

Ne pas hésiter à demander de l’aide. Faire appel à un designer graphique extérieur nous a permis par exemple d’avoir de véritables discussions constructives et de prendre une décision impartiale (nos relations entre collègues n’ayant pas entravé ou biaisé notre jugement).

Attentes v.s. réalité ?

Attente : Les gens aimeront le nouveau design du moment qu’il est plus beau que l’ancien.

Réalité: Nous avons essuyé de sévères critiques, ce qui est une bonne chose avec du recul.

A : Avec la nouvelle identité visuelle et les principaux story-boards, la mise en place du nouveau design sera un jeu d’enfant.
R : On n’imagine pas le nombre de pages différentes existantes sur un site web et la multitude de déclinaisons possibles telles que la variation du nombre de produits présents sur une page. Créer des prototypes „cliquables“ pour les différentes pages aurait été très utile.

A : Ce redesign nous prendra deux mois
R : Aucune chance ! Peu importe le temps que vous pensez nécessaire, il en faudra sans doute plus. Pour ne pas se perdre en cours de route, il faut toujours garder en tête son point de départ, la ligne directrice de son projet.

Un conseil personnel ?

Ne pas prendre les critiques personnellement, il y aura toujours des gens qui porteront un avis négatif sur votre travail. Prenez leurs avis comme une chance de progresser et d’avancer !

Oubliez l’idée que vous trouverez un logo qui plaira à tout le monde.

Discutez, échangez et surtout écoutez les critiques. Continuez de vous interroger, aussi épuisant que cela puisse être, ce sera forcément bénéfique.

Dans le cadre de la réalisation d’un tel projet, il faut tirer le meilleur de chacun en attribuant les taches de façon pertinente. Si votre graphisme n’est pas expert en expérience utilisateur, ne lui confiez pas cette responsabilité.

Quelles évolutions avez-vous observé concernant les KPIs depuis le redesign votre site ?

Les utilisateurs utilisent plus les filtres, ce qui est une bonne chose, c’est la valeur ajoutée de notre site !

Les autres indicateurs n’ont pas beaucoup changés, ce qui est aussi une bonne chose puisque cela signifie que les internautes continuent de trouver ce qu’ils cherchent et ne sont pas déroutés par le changement. Nous seront en mesure d’en dire plus en observant cela sur le long terme !

Voici la nouvelle interface.

shopalike

N’hésitez pas à visiter ce site et à faire des retours en commentant.