HURBAIN
Hurbain
Construction
WordPress
Direction artistique
2026
Mandat
Créer de toutes pièces une première présence web impactante et qui saurait retranscrire visuellement la crédibilité et la finesse de l’entreprise tout en faisant du web un véritable canal de génération de leads.
Objectifs
- Offrir à Hurbain une première présence web à la hauteur de la qualité de leur travail.
- Utiliser l’impact du site pour en faire un moteur de génération de leads.
- Refléter la qualité de l’image de marque à travers un site au design soigné et animé.
- Rejoindre une clientèle plus large grâce à un site entièrement bilingue FR/EN.
Un site qui met le travail en valeur
Le travail d’Hurbain parle d’abord par les yeux, on s’est donc dit que le site devait en faire autant. Avec cette idée en tête, on a conçu plusieurs modules aux dispositions variées, pensés pour laisser toute la place aux visuels et donner à l’équipe la liberté d’illustrer leurs projets avec un maximum de supports.
Pour éviter la monotonie et s’adapter à la diversité des livrables photographiques, les modules accueillent des images de formats et d’orientations multiples : carré, rectangle, paysage, portrait, plein écran.
Plusieurs éléments graphiques calligraphiques ont également été intégrés au site, venant renforcer le caractère raffiné et professionnel de la firme, par exemple la liste des services sur la page d’accueil ou encore la signature du fondateur, Guillaume Henry, qui se retouve à plusieurs endroits sur le site.
Pour élever le niveau du site et appuyer le rafraîchissement de l’image de marque, on a travaillé le dynamisme avec une série d’animations discrètes mais qui viennent faire toute la différence dans l’expérience globale.
La principale animation est celle de la couleur du fond, qui passe du blanc au noir selon le module en cours de défilement, mais il y a aussi un travail plus discret sur les images qui se révèlent au scroll et sur les titres de page qui apparaissent mot par mot, ajoutant une touche de finesse à la navigation.
On a égalment travaillé deux différents types de curseurs sur les cartes de projets pour donner davantage envie de cliquer : un simple rond « Voir le projet » pour les projets détaillés, et une image qui suit la souris au survol pour les autres.
Un dynamisme qui élève la marque
Un premier contact facilité
Puisque l’un des objectifs principaux du projet était de faire du web un canal de génération de leads, on a voulu s’assurer qu’un visiteur ne puisse jamais visiter une page sans avoir l’occasion de passer à l’action. Un CTA est donc présent en bas de chaque page principale, invitant à prendre contact.
Sur la page contact elle-même, on a multiplié les points d’entrée, téléphone, courriel, réseaux sociaux et formulaire, pour s’adapter aux préférences de chaque prospect. Finalement, l’ensemble du site a été développé en français et en anglais afin d’élargir le bassin de clients potentiels et ça, dès le lancement.
