// Développeur & designer web senior · Lyon, FR

Des sites, conçusde zéro —l’IA, c’est l’outil.

Je suis Yolan — un développeur senior qui architecture des sites et boutiques rapides et multilingues, ligne après ligne. L’IA accélère le métier ; elle ne remplace jamais le jugement. Maîtrisée, pas subie.

Voir les réalisations →La philosophie

growth.tsx — ce que rapporte un bon codeen direct

Visiteurs48k+0 %

Clics13k27 % CTR

Profit€92k▲ livré

Next.jsReactTypeScriptTailwindSanity CMSNode.jsStripeFramer MotionGraphQLVercelHeadlessi18nSEOWeb PerformanceAI-assistedNext.jsReactTypeScriptTailwindSanity CMSNode.jsStripeFramer MotionGraphQLVercelHeadlessi18nSEOWeb PerformanceAI-assisted

01 Ce que j’apporte

Pas un template.
Une boîte à outils, faite main.

Chaque capacité ci-dessous est conçue de zéro et éprouvée sur un projet réel, mis en production. Aucun page builder, aucun boilerplate — juste du code que je maîtrise de bout en bout.

[ design_systems ]

Design systems, des tokens jusqu’en haut

Échelles typographiques, couleurs, espacements, motion et composants — un système cohérent, pas un tas de CSS.

AaAaAaAa

CAS : Spiree — système de dégradés ↗

[ motion ]

Motion cinématique, piloté au scroll

Scroll sectionné, chapitres collants et chorégraphie de révélation — au budget de performance, jamais gratuit.

CAS : Milo Weiler — scroll en 7 chapitres ↗

[ i18n ]

Routage multilingue

EN · FR · NL avec un SEO localisé intégré.

FR EN NL

CAS : Bermuda ↗

[ headless_cms ]

CMS headless

Publiez vos modifications de contenu sans développeur dans la boucle.

query allProducts {
title, price, slug
}

CAS : Nu · Sanity ↗

[ commerce ]

Commerce & paiements

Des paiements Stripe & Twint qui convertissent.

POST /checkout → 200
stripe.session.create()

CAS : Nu boutique ↗

[ performance · seo ]

Optimisé Lighthouse, prêt pour la recherche

Imagerie différée, balisage sémantique et Core Web Vitals au propre — rapide pour les utilisateurs comme pour Google.

Performance · SEO · Best Practices
LCP 1.1s · CLS 0.00 · TTI 1.4s

CAS : Milo Weiler ↗

[ theme · accent ]

Clair & sombre, par conception

Thème, accent, typographie — chaque décision visuelle est un token. Changez-en un et tout le système suit, en direct.

Faites-le vôtre ↑

02 La stack, en profondeur

Pas de WordPress.
Du code personnalisé.

Aucun page builder, aucune prolifération de plugins, aucun thème à dompter. Chaque site est écrit de zéro dans une stack moderne que je connais assez pour la plier. Les trois outils ci-dessous font le gros du travail — faites défiler, et chacun s’ouvre dès que la ligne l’atteint.

Chaque site que je construis est une application Next.js. L’App Router me donne les server components, le streaming et le routage par fichiers — les pages sont rendues côté serveur pour la vitesse et le SEO, puis seules les parties qui doivent être interactives sont hydratées. Un seul framework, de la page marketing au paiement.

App Router & React Server Components
SSG · ISR · SSR choisis par route
next/image — optimisation automatique
Routage i18n natif — en · fr · nl
Code splitting au niveau des routes
Prêt pour l’edge, déployé sur Vercel

CAS : Milo Weiler — 55 projets, Lighthouse au top ↗

Le contenu vit dans Sanity, totalement découplé du front-end. Les éditeurs mettent à jour produits, articles et imagerie dans un Studio que je taille sur mesure pour leur workflow ; j’interroge exactement la forme dont chaque page a besoin avec GROQ et je la rends via Portable Text. Aucun développeur dans la boucle pour les modifications du quotidien.

Schémas Studio sur mesure par client
GROQ — n’interroger que ce qui est rendu
Contenu riche en Portable Text
Aperçu des brouillons & mises à jour en temps réel
Pipeline d’images sur un CDN global
Rebuilds déclenchés par webhook

CAS : Nu — un catalogue clean-beauty piloté par CMS ↗

Le paiement tourne sur Stripe. Les sessions sont créées côté serveur, confirmées par des webhooks signés et réconciliées avant toute expédition — sécurisé par conception, sans jamais faire confiance au navigateur. Le multidevise et Twint donnent aux clients belges et de l’UE les moyens de paiement qu’ils utilisent réellement.

Checkout Sessions côté serveur
Traitement par webhook signé
Tarification multidevise
Twint & cartes pour l’UE
PaymentIntents avec SCA
Logique de TVA & d’expédition

CAS : Nu boutique — un parcours d’achat sans friction ↗

Chaque révélation, chapitre de scroll et fioriture au survol tourne sur GSAP. ScrollTrigger épingle les sections et lie l’animation à la position de scroll ; les timelines séquencent la chorégraphie à l’image près. C’est la différence entre un site qui se charge et un site qui bouge — au budget de performance, jamais gratuit.

ScrollTrigger — scènes pilotées au scroll
Timelines pour le motion séquencé
Pin & scrub des chapitres collants
Transforms compatibles GPU uniquement
Conscient du reduced-motion
60 fps sur mobile milieu de gamme

CAS : Milo Weiler — chorégraphie de scroll en 7 chapitres ↗

yolan@ywdesign — zsh

// De zéro, à chaque fois

Voilà à quoi ressemble
un « sans template ».

Un site monté comme je travaille vraiment — l’architecture d’abord, le design system ensuite, puis la mise en production. Le jugement est humain ; la vitesse, c’est l’outillage.

Plonger dans la technologie →

// Plus la distribution de soutien

RReact 18UI · composants

TSTypeScriptTypes · sûreté

TTailwindStyling · tokens

NNode.jsRuntime · APIs

MMongoDBNoSQL · données

RxReduxÉtat · panier

GQGraphQLRequêtes typées

VVercelHébergement · edge

03 Réalisations choisies

Livré, en production.

De vrais sites pour de vrais clients, en Belgique et au-delà — multilingues, rapides et conçus pour convertir.

E-commerce beauté & bien-être

Nu

Une boutique clean-beauty multilingue — un rythme éditorial posé autour d’un parcours d’achat sans friction, piloté par CMS.

Étude de cas →Visiter ↗

Portfolio de photographie

Milo Weiler

Un portfolio sombre et cinématique découpé en sept chapitres de scroll — 55 projets, navigation de chapitres collante, scores Lighthouse au top.

Étude de cas →Visiter ↗

Agence événementielle · Belgique

Bermuda Events

Un site de marque premium qui met en scène les productions passées à grande échelle, avec un tunnel de contact conçu pour qualifier les bons leads.

Étude de cas →Visiter ↗

Marque d’activewear · 100 % Merino

Spiree

Le site d’une marque de sportswear indépendante — système de dégradés audacieux, collections Sun & Moon, un récit qui prime.

Étude de cas →Visiter ↗

04 La philosophie

Un outil puissant.
Maîtrisé,
pas subi.

J’exploite l’IA comme un artisan exploite un outil électrique — pour la vitesse et l’effet de levier, jamais pour lui céder la réflexion. L’application n’est pas le travail. Le jugement, oui.

Je possède l’architecture

L’IA esquisse ; je décide de la structure, des arbitrages et du modèle de données. Le plan est humain.

Chaque ligne livrée est comprise

Rien n’atteint la production que je ne puisse lire, refactoriser et défendre. Aucune boîte noire.

La vitesse, sans perdre le pourquoi

L’IA élimine le travail répétitif pour laisser plus de temps au métier, à la performance et aux détails qui comptent.

L’outil sert le développeur

Maîtrisé, pas subi. L’ingénieur senior reste aux commandes — toujours.

05 Ma façon de travailler

Un pipeline transparent.

Cinq étapes, du départ à la mise en production. La ligne se trace à mesure que vous faites défiler — chaque étape s’allume dès que vous l’atteignez.

Découverte

Objectifs, audience, budget — et ce que signifie vraiment le succès avant qu’une seule ligne soit écrite.

Architecture

Stack, modèle de données et structure décidés en amont — le plan est humain.

Design

Un vrai système que vous voyez tôt et auquel vous réagissez, affiné ensemble — pas une maquette figée.

Construction

Codé à la main, accéléré par l’IA, multilingue et prêt pour le SEO — chaque ligne livrée est comprise.

Mise en production

Mesurer, itérer, et je reste présent pour la suite, quelle qu’elle soit.

// Contact

Un projet
qui mérite d’être construit ?

Du fichier vierge au produit livré. Dites-moi ce que vous avez en tête — je vous dirai comment je le construirais.

Démarrer un projet →WhatsApp

contact@ywdesign.co · +33 7 65 60 14 15 · Lyon, FR

Pas un template.Une boîte à outils, faite main.

Design systems, des tokens jusqu’en haut

Motion cinématique, piloté au scroll

Routage multilingue

CMS headless

Commerce & paiements

Optimisé Lighthouse, prêt pour la recherche

Clair & sombre, par conception

Pas de WordPress.Du code personnalisé.

Voilà à quoi ressembleun « sans template ».

Livré, en production.

Nu

Milo Weiler

Bermuda Events

Spiree

Un outil puissant.Maîtrisé,pas subi.

Un pipeline transparent.

Découverte

Architecture

Design

Construction

Mise en production

Un projetqui mérite d’être construit ?

Pas un template.
Une boîte à outils, faite main.

Pas de WordPress.
Du code personnalisé.

Voilà à quoi ressemble
un « sans template ».

Un outil puissant.
Maîtrisé,
pas subi.

Un projet
qui mérite d’être construit ?