Logo de Nicolas Alain

Création du site vitrine de la marque de Gin Bonhomie

Pour la création de cette marque de Gin bordelaise, j’ai réalisé le site internet de celle-ci dans le but de retranscrire l'image de marque à travers son unviers.

Découvrir le site
Bonhomie dans un navigateur internet

Un site minimaliste et percutant

En respectant la charte graphique de Bonhomie déjà établie par une agence de communication et en concertation avec le client, j'ai décidé de produire un site minimaliste avec les informations essentielles. Le but étant de transmettre l'expertise et le savoir-faire de cette marque de Gin, seules les informations pertinentes ont été mises en avant.

Bonhomie sur iPhone - Page à propos

Un optimisation pour tous les supports

La technique de l'adaptation responsive permet un affichage cohérent sur tous les appareils. L'objectif est ici de proposer la même expérience utilisateur à tous les visiteurs du site, quel que soit le support utilisé.

Ce projet s'est étendu sur plusieurs semaines. J'ai proposé un service sur mesure à l'équipe à travers plusieurs échanges et rendez-vous afin de rester à l'écoute tout en répondant à leurs besoins.

Réflexion et stratégie

Moodboard

Première étape : veille concurentielle et démarche du Moodboard

Wireframe du site internet de Bonhomie, sous Figma

Deuxième étape : réalisation d'un Wireframe sur tous les supports sous Figma

Maquette graphique validée par le client sous Figma

Troisième étape : validation de la maquette graphique finale avec le client







Veille et Moodboard

Cette étape a été nécessaire dans la mesure où la charte graphique n'était pas totalement complète à cette étape. Elle a permis au client de se projetter davantage et de donner cibler directement ce qu'il voulait et ne voulait pas.

Le Wireframe, le squelette du site internet

Après validation du moodboard, nous passons à l'étape de la création de la structure du site internet. Cela permet de définir les emplacements, dispositions, zones, sections ainsi que les pages.

Maquettes graphiques

Les maquettes graphiques permettent de projeter le client avant l'étape d'intégration. Les couleurs, les typographies, les contenus rédactionnels et les photographies sont alors disposées et ajustées en fonction des retours client.

Intégration sous Webflow

Cette plateforme complète offre la possibilité aux clients de garder la main sur les contenus "légers"et n'imposent pas d'effectuer des maintenances régulières. C'est à cette étape que j'ai intégré ce qui n'était jusqu'alors que des maquettes sur le CMS Webflow afin de les retrouver sur un seul et même site internet.

Animation et référencement naturel

Après plusieurs légers ajustements et validation du client, j'ai animé des éléments du site afin de le rendre plus dynamique. J'ai aussi configuré le site pour l'optimiser au SEO (référencement naturel).

Livraison

Après plusieurs semaines de conception, j'ai activé le site internet. Le résultat final a beaucoup plu à l'équipe.

Retour d’expérience

Ce projet m'a permis d'approfondir mes compétences Webflow ainsi que de consolider mes connaissances en programmation web (HTML, CSS, JS), de mettre en pratique les techniques de mise en page et de créer de nombreux visuels. Aujourd'hui, je collabore toujours avec Bonhomie dans le cadre de la mise à jour périodique de leur site internet.

« J’ai fait appel à Nicolas pour le lancement de mon site internet suite à la sortie de mon GIN. Nicolas s’est vu être à l’écoute et force de proposition ce qui nous a fortement aidé. Il est aussi très réactif, je le recommande sans hésiter. »

François Massiat

Fondateur de Bonhomie Gin

Mockup de la page d'accueuil du site

Mockup de la page où nous trouver