One page · Interface front-end
Carousel Vertical : un carrousel photo à défilement vertical en HTML, CSS et JS
Carousel Vertical est un exercice d'intégration front-end que j'ai réalisé pour explorer une autre façon de parcourir une galerie d'images. Plutôt que le défilement horizontal classique, les visuels s'enchaînent à la verticale pour offrir une présentation photo immersive. C'est un projet de démonstration en une seule page, sans client réel : l'objectif est purement technique et esthétique.
Côté technique, j'ai construit l'interface en HTML, CSS et JavaScript, sans dépendance externe. La structure HTML reste simple et sémantique, la mise en forme et les transitions de défilement sont gérées en CSS, et le JavaScript orchestre la navigation entre les visuels. L'ensemble est pensé en responsive pour s'adapter aux affichages desktop, tablette et mobile tout en conservant la même fluidité.
Ce projet illustre mon travail d'intégration soignée et d'animation d'interface à partir des seules technologies natives du web. Il montre ma capacité à transformer une idée d'expérience utilisateur en une page concrète, fluide et adaptable, à structurer un défilement personnalisé et à soigner le rendu visuel d'une galerie sur tous les écrans.
Défilement vertical sur mesure
J'ai mis en place une navigation verticale entre les images en JavaScript, pour une lecture continue et immersive de la galerie photo.
Animation et transitions CSS
Les enchaînements entre visuels reposent sur des transitions CSS soignées, qui rendent le défilement fluide sans alourdir la page.
Intégration responsive
L'interface s'adapte aux affichages desktop, tablette et mobile tout en conservant la même expérience de défilement.
Version desktop
Version tablette
Carte Animee
Exercice front-end one page : une carte interactive qui masque ses informations puis les révèle au survol, en HTML, CSS et JS.
Carte QR Code
Exercice Frontend Mentor : j'ai reproduit en pixel-perfect une carte affichant un QR code, intégrée de zéro en HTML et CSS.
Carte Recapitulatif Commande
Exercice front-end issu du challenge Frontend Mentor « Order Summary Card » : une carte d'abonnement intégrée de zéro en HTML et CSS.
Un projet dans le même esprit ?
Parlez-moi de votre besoin : je vous dis rapidement ce qui est pertinent et réaliste.