Site vitrine · Design & animation
Kessem
Un site vitrine de studio web où chaque animation compte, sans jamais faire ramer la page.
Kessem est un studio web indépendant, lancé en 2024. J'ai conçu et développé son site vitrine, du design jusqu'au code. Le but était d'avoir un site qui donne envie de faire appel au studio : une vraie identité et des animations travaillées, mais rien qui ralentisse la page. J'ai passé du temps sur le rythme du scroll et les transitions entre sections, tout en surveillant les performances à chaque étape.
Un site qui se remarque et reste rapide
Un studio web ne peut pas se permettre un site lent ou banal, puisque c'est sa propre vitrine. Je voulais quelque chose qui attire l'œil et inspire confiance dès les premières secondes, sans tomber dans l'effet gadget. Le vrai défi était de tenir les deux en même temps : une page qui bouge et qui a du caractère, et qui charge vite même sur un vieux téléphone. Tout le reste des choix a découlé de cet équilibre.
Une direction claire et éditoriale
L'identité est sobre et éditoriale. Beaucoup d'espace, une typographie soignée, et de petits repères techniques en majuscules (numéros de section, labels courts) qui donnent un côté studio. Le site est pensé en plusieurs langues, dont l'hébreu, ce qui a demandé de gérer proprement la lecture de droite à gauche. J'ai gardé une grille simple pour que tout reste lisible, du grand titre d'accueil jusqu'au tableau comparatif.
Des animations au service du contenu
Rien ne bouge juste pour le plaisir. Au chargement, un compteur monte jusqu'à 100 % avant de révéler la page. Les chiffres clés (délais, pourcentages) s'incrémentent depuis zéro quand ils entrent à l'écran. Le scroll est adouci et les sections apparaissent au bon moment, sans à-coups. J'ai utilisé Framer Motion et GSAP pour le détail des transitions, et Lenis pour le défilement. Le mouvement guide la lecture au lieu de la gêner.
Rapide malgré tous les effets
Le plus dur, c'est de garder tout ça rapide. Le site tourne sous Next.js, avec des images en formats modernes (AVIF, WebP) et un chargement échelonné pour ne pas tout demander d'un coup. Les animations sont écrites pour rester fluides et se coupent si l'utilisateur préfère réduire le mouvement. J'ai testé sur mobile tout au long du projet et suivi les Core Web Vitals pour rester dans le vert. L'idée était qu'on remarque le style, pas le temps de chargement.
Un projet en tête ?
Me contacter