16 avril 2018-Temps de lecture : 6min

Avec MyEvian, personnalisez vos bouteilles d’eau minérale à votre image

Que ce soit pour un cadeau professionnel avec votre logo, une personnalisation pour un mariage, un baptême, un anniversaire ou simplement pour la beauté de l’objet, de plus en plus d’entreprises proposent à leurs clients de customiser leur produit à leur image.

Cadeau Maestro, Josette & Tic, Bragard, l’Olympique Lyonnais ou beaucoup d’autres de nos clients ont fait ce choix de la personnalisation de produits. Et aujourd’hui, c’est pour vous présenter le projet de personnalisation de bouteilles MyEvian que nous vous écrivons !

Avec Danone Eaux France, nous n’en sommes plus vraiment à notre coup d’essai. Après plusieurs années de belles collaborations, que ce soit pour le déploiement devianchezvous.com, pour dévoiler nos ambitions sur notre travail sur le eCommerce Worldwide de Danone, pour le renouveau des box d’abonnements Comme un Jeu d’enfant by Bledina ou pour… [Ah non, ça, nous n’avons pas encore le droit d’en parler 🙂 ], c’est toujours un plaisir de retrouver leurs équipes et d’échanger avec eux sur leurs projets. Pour ce nouveau projet, MyEvian vous propose de personnaliser vos bouteilles d’eau minérale en verre evian et de les réceptionner chez vous en un clic.

UNE IDENTITÉ VISUELLE FORTE

Comme toutes les histoires de refonte, celle du site MyEvian commence par une refonte graphique. Plus épurée que la première version, la nouvelle charte est dans la continuité de celle que nous avons mise en place sur le site d’evianchezvous.com, nous permettant de maintenir une unité graphique entre les différents sites de la marque.

EXPÉRIENCE & ERGON-EAU-MIE

Maintenant, place à la nouvelle expérience ! L’équipe MyEvian voulait proposer quelque chose de nouveau à leurs clients, une expérience de personnalisation et d’achat encore plus dynamique et interactive que la version précédente. Aussi, notre équipe a travaillé pour offrir la meilleure expérience possible lors de la configuration de votre bouteille d’eau à travers un processus plus simple, optimisé et ergonomique, qui ne limite plus la créativité des consommateurs. Rappelons qu’avant il n’était possible de personnaliser vos bouteilles qu’avec du texte et des symboles. On était alors loin d’exploiter les capacités maximum d’un configurateur by NQ !

La bouteille evian étant forcément associée à l’image de la marque, la qualité de la personnalisation et du produit fini se doit d’être irréprochable. C’est avec cette problématique en tête que notre équipe a réfléchi à quelques astuces permettant à l’internaute d’obtenir un résultat optimal très facilement.

 

Bon Jamie, comment ça fonctionne techniquement parlant ? Eh bien nous sommes contents que vous vous posiez la question 😉

L’idée derrière un configurateur est de proposer une expérience nouvelle aux utilisateurs et leur permettre de créer simplement un produit unique. Pas question donc de se retrouver face à une dizaine d’étapes toutes plus compliqués les unes que les autres ! L’équipe NewQuest a donc simplifié au maximum le processus de personnalisation pour optimiser l’expérience du consommateur sans pour autant le limiter dans sa créativité.

Une fois la photo que vous souhaitez mettre sur votre bouteille importée, celle-ci est automatiquement centrée dans l’espace prévu et respecte ainsi forme de la bouteille. Le resize de ces photos est quant à lui, de base, homothétique : l’image garde les propositions si vous choisissez de la réduire ou de l’agrandir afin qu’elle corresponde à la taille de la bouteille. 

LA MINUTE TECHNIQUE

Amis geek, accrochez-vous, ça commence maintenant !

Magento, Full Page Cache, AWS, Git, Docker, Apache 2.4, PHP 7.1, MySQL 5.7, Potrace, SVG, Curl, NPM, iconv, JavaScript, mcrypt, PDO, ImageMagick, Redis, Varnish, CDN,… Voilà un aperçu de ce qui se cache derrière cette pépite de technologie !

Déchiffrons un peu tout ça quand même !

Le nouveau site de MyEvian a donc été développé sur une plateforme Magento, utilisant PHP 7.1 et MySQL 5.7. Celui-ci est hébergé sur Amazon Web Service, le service de « cloud computing » du groupe Amazon. Ne voulant pas nous arrêter là et pour aller au bout des choses, nous avons ajouté à ça :

  • CDN (Content Delivery Network) : permet des distributions de médias et apporte donc plus de sécurité, de rapidité et de confort utilisateurs
  • Varnish : un serveur de cache permettant la mise en cache des requêtes HTTP
  • Redis : un système de gestion de base de données permettant de meilleurs performances en évitant les accès disques

Tout ça est bien ficelé dans des conteneurs Docker et permet d’automatiser le déploiement d’applications et par la même occasion de faciliter nos déploiements automatiques via GIT (pas besoin de vous le décrire celui-là ?)

Dernière petite chose niveau performance, on n’a pas résisté à l’option Full Page Cache que propose Magento.

Revenons maintenant à ce qui nous intéresse le plus : Le configurateur !

La grande nouveauté de ce configurateur sur MyEvian, c’est la possibilité d’uploader ses propres visuels qui viendront se graver sur votre bouteille en verre.

En d’autres termes, vous chargez votre image, logo ou photo, celle-ci va subir plusieurs traitements afin qu’elle soit convertit en un joli SVG monochrome qui vous permettra de le redimensionner, le faire pivoter et bien d’autres actions vous permettant d’exprimer votre créativité jusqu’au bout (on aime tellement JavaScript pour ça).

Après l’upload de votre photo, il vous sera alors proposer de choisir parmi 3 images ayant subi un traitement différent selon la photo d’origine. À vous de choisir votre rendu préféré (la beauté étant subjective !).

Si on reparle technique, vous l’aurez compris, c’est bien sûr pour ces traitements et conversions que l’on a eu recourt à Potrace. Un programme open source permettant de tracer un bitmap, c’est-à-dire permettant de convertir votre image en graphique vectoriel (et en l’occurrence, au format SVG) parfaitement net et redimensionnable sans crainte. La conversion du visuel en monochrome (avec un choix de couleurs quand même) est indispensable car nous parlons bien de gravure sur verre et non d’impression ! Le visuel généré est directement lu par la machine de personnalisation située à l’usine Evian.

Précision, qui semble logique en 2018 mais sait-on jamais, le site MyEvian et son configurateur sont bien évidemment responsive et fonctionnent tout aussi bien quel que soit le support sur lequel vous allez l’utiliser !

Encore une belle réalisation pour l’équipe NewQuest avec des challenges et de beaux développements mais surtout, un grand plaisir pour nous de continuer à collaborer avec les équipes de Danone que l’on remercie pour leur confiance.

Configurateur produit

P.S : Il est recommandé de boire 1,5 à 2L d’eau par jour et on avoue que c’est drôlement plus sympa quand votre bouteille est personnalisée 😉

Ouvrez la discussion

Laisser un commentaire

Un projet ou des idées ? On peut sûrement vous aider :)
PurePara

PurePara, votre parapharmacie à portée de clic

Si vous aussi vous avez déjà rêvé d’avoir votre parapharmacie à portée de clic, ne cherchez plus ! Purepara est le site qu’il vous faut. La parapharmacie française en ligne vous propose depuis ses débuts une vaste sélection de produits à petits prix. De quoi répondre aux envies de chacun : produits de beauté et soins de laboratoires, compléments alimentaires, minceur, articles de santé, bébé … Le site de Purepara vous réserve plus d’une surprise ;) Continue reading PurePara, votre parapharmacie à portée de clic
Application Jean Lain Occasion

Trouvez la voiture de vos rêves avec l’application Jean Lain Occasions

Si vous habitez en Rhône-Alpes, et plus précisément en Savoie et dans les départements limitrophes, il y a fort à parier que le nom Jean Lain vous dise quelque chose ! Aujourd’hui, Jean Lain Automobiles, c’est plus de 70 concessions réparties entre la Savoie, la Haute-Savoie, l’Isère et l’Ain, figurant ainsi parmi les entreprises les plus importantes de la région. Continue reading Trouvez la voiture de vos rêves avec l’application Jean Lain Occasions