Design System
Identité visuelle cohérente via Tailwind v4 @theme, glassmorphism, glow et typographie Inter/JetBrains Mono.
Projet personnel — Astro 5 & Creative Dev
Portfolio API
Ce site lui-même
Portfolio conçu comme une application haute performance — animations GSAP, mode Experience sonore avec beat detection, système de particules canvas interactif et design system cohérent via Tailwind v4. Un projet où technique et craft se rejoignent.
Portfolio API — Live
Core System Particules 90
Beat Frames 40
Build SSG
Scroll RAF
90 étoiles canvas
40 frames rolling avg.
SSG build statique Astro 5
0ms flash entre pages
Features
Un portfolio pensé comme un produit
Experience Mode
Mode sonore interactif avec Web Audio API, beat detection par analyse fréquentielle et synchronisation CSS.
Particle System
90 étoiles canvas avec attraction curseur, glow radial 6 stops, anti-accumulation et respiration 4–8 s.
Performance SSG
Build statique Astro 5, View Transitions, Content Layer API et smooth scroll Lenis synchronisé au RAF.
Architecture
Une stack orientée performance et expérience
Astro 5 — SSG + View Transitions
Content Layer API — projets Markdown
Composants Astro + TypeScript strict
Tailwind v4 @theme — Design System CSS
GSAP
Web Audio API
Canvas 2D
Lenis
Approche
Craft & attention au détail
Ce portfolio n'est pas qu'une vitrine — c'est un terrain d'exploration technique. Chaque feature (beat detection, attraction des particules, dégradation gracieuse des animations) a été conçue pour offrir une expérience mémorable sans sacrifier la performance ni l'accessibilité. Le résultat reflète ma façon d'aborder le développement : rigueur, plaisir du craft, et obsession du détail.
ArchitectureAnimationsWeb APIsUXPerformanceDesign System
Construction
Du design system aux particules canvas
Design System
Conception de la palette sombre violacée, des variables CSS et des composants réutilisables.
Animations
Intégration GSAP timeline Hero, glassmorphism, glow et transitions de navigation View Transitions.
Experience Mode
Développement du mode sonore : Web Audio API, beat detection et synchronisation CSS sur les battements.
Particle System
Système canvas 90 étoiles : trajectoires, glow radial, attraction souris et mécanisme anti-accumulation.
Stack technique
Technologies utilisées
Astro 5TypeScriptTailwind CSS v4GSAPLenisWeb Audio APICanvas APIHostinger
Envie de collaborer ?
Vous regardez
le projet en direct
Ce site est lui-même la démonstration de ce que je suis capable de concevoir et de livrer. Si vous cherchez quelqu'un qui allie vision technique et soin du produit, parlons-en.
Me contacter