Kingsbury Creative
Le défi
On avait besoin d'un site qui démontre tout ce qu'on dit aux clients qu'on peut faire, sans utiliser aucun des outils qu'on leur dit de ne pas utiliser. Pas de WordPress, pas de constructeurs de pages, pas de frameworks. Le site lui-même devait être le portfolio.
Il devait aussi être entièrement bilingue (anglais et français), assez rapide pour bien scorer sur les Core Web Vitals, accessible, et visuellement assez distinctif pour se démarquer de tous les autres sites d'agences dans la vallée de l'Outaouais.
L'approche
On a écrit chaque ligne à partir de zéro. PHP 8 gère le routage et l'i18n bilingue avec des préfixes d'URL (/en/, /fr/). Vite compile le CSS et JavaScript avec remplacement de modules à chaud pendant le développement.
La section héro a une animation canvas sur mesure (« Build Lines ») avec des lignes ondulées, des points voyageurs qui s'illuminent en traversant des nœuds, et une interaction à la souris. GSAP et ScrollTrigger alimentent toutes les animations liées au défilement : sections de processus épinglées, révélations de sections, et le morphing des panneaux de services.
Lenis fournit un défilement fluide synchronisé avec ScrollTrigger. Le système de design vit dans des propriétés CSS personnalisées. On change un fichier et tout le site change de thème.
Le résultat
Le site est en ligne depuis mars 2026. Il est entièrement bilingue avec des balises hreflang propres au Canada, des polices auto-hébergées, aucune requête bloquante, et un score Lighthouse de performance dans le vert.
Il est devenu ce qu'il devait être : 26 articles publiés, onze pages de destination pour des villes de la Vallée, des études de cas, un outil de demande d'audit, et un formulaire de contact qui écrit dans notre propre petit CRM. Chacune de ces pages a été écrite, construite et déployée avec le même processus qu'un client reçoit.
Il est aussi accessible selon WCAG 2.1, et il cache quelques surprises pour les curieux (voir le code source, essayer le code Konami, ou demander pour la Vallée). Le site est le portfolio. Chaque animation de défilement, chaque interaction, chaque décision de design est une démonstration en direct du travail qu'on fait pour les clients.