Wire-frame /zoning
Figma est notre ami. Un modèle très simplifié a été utilisé pour mettre sur papier notre idée principale. Ceci nous a permis de voir que nous voyons notre concept à peu près de la même façon. Cette première étape est primordiale avant d'engager un mock-up beaucoup plus réaliste, qui sera utilisé pour les itérations de tests.
Mockup
UI/UX! Nous avons souhaité développé chacun de son côté une version du plug-in que l'on avait en tête. Voici les résultats.
Les points très importants à mettre en avant et à utiliser obligatoirement sont identifiés en amont avec un Moscow (cf "idéation"). À cette issue, nous faisons un vote pour déterminer le vainqueur (proposition tout à gauche)! C'est celui-ci qui sera soumis aux itérations de tests.
Test,test,... test!
"Trop de couleurs différentes, on se perd. Mais on comprend relativement bien que, plus c'est rouge moins c'est mal!"
"Enlever le "foyer français" parce que c'est trop vague"
"Les émoticones coeur et planète ne font pas très professionnels"
"Il y a une faute dans le orange en bas à gauche : 14 fois plus, alors que c'est sensé être le meilleur du mode standard"
"Le registre complétètement différent (sur la forme) entre Standard et Je ne suis pas pressé, gêne"
"À ... km de chez vous : cela doit être écrit dans la même couleur"
"Il faut distinguer le client qui n'est pas pressé au client pressé de manière plus clair, en rassurant le client sur le jour maximum de livraison "
"Une manière plus ludique pourrait être faite pour comprendre plus rapidement le concept de "regrouper les articles en 1 commande"
"Il faut moins d'informations écrites sur une seule page, tout en réduisant au maximum le nombre de clics"
Ici, si le code couleur fait facilement comprendre le bienfait de ce plug-in : possibilité (ou pas) de regrouper les articles en 1 commande. En fonction du choix de l'utilisateur, il sera emmené soit sur le mode de livraison Standard (s'il a cliqué sur le rouge), soit sur le mode de livraison Pour la Planète (s'il a cliqué sur le vert).
"Il faut permettre au client de pouvoir, s'il a 40 articles, de pouvoir les rassembler en 12 commandes plutôt que 40! C'est déjà mieux !"
"Il faut pouvoir indiquer au client, pour chaque jour maximal de livraison, quel(s) article(s) est manquant(s)"
Dans cet exemple de commande de plusieurs articles, nous avons fait un visuel sur les produits manquants lorsque nous cliquons sur un des jours en rouge. Plus nous arrivons près des jours "verts", moins d'articles sont manquants (le 3 mai, 3 articles sont manquants ; le 6 mai, 1 seul article est manquant) et donc moins de commandes différentes sont envoyées.
Une fois cette étape faite, nous nous sommes intéressés à "comment je donne l'empreinte carbone de la commande aux clients, de façon la plus claire et pédagogique possible".
La suite dans l'onglet "Notre innovation" 💥😉