Mode · produit configurable · Applications web
Stitch
Configure ta pièce, vois le prix
Scroll pour découvrir ↓
01 · Mode · produit configurable
Coupe, couleur, matière, prix live
Boutique mode — lookbook, configurateur, panier.
- 01
Configurateur
Chaque choix met à jour le rendu et le tarif.
- 02
Tailles
XS–XL — le panier sait ce que tu as choisi.
- 03
Récap
Ajout simulé avec prix final, sans checkout réel.
01b · Technique
Fiche technique
Stack, mise en ligne et mon rôle sur ce build — pour recruteurs et tech leads.
- Technologies
- Next.js
- TypeScript
- React
- Tailwind CSS
- Librairies & outils
- Framer Motion
- local state
- Déploiement
Démo /play — parcours produit sans API réelle
- Rôle
Produit · UI · flux métier
- Conditions
App démo interactive — intention produit claire
02 · Dans le produit
Un scroll, un écran
Chaque section se cale à l’écran — continue après le dernier pour revenir au récit.
Mode · produit configurable
Coupe, couleur, matière, prix live
6 articles
Configurateur
Stitch
Chaque choix met à jour le rendu et le tarif.
24 €
ConfigurerConfigure ta pièce
Flagship jouable · panier factice.
Configurateur
× 1
Tailles
× 1
Retour au récit
Tu as quitté les écrans démo — ensuite : tester, puis les notes de craft.
03 · Marques DTC
Moins d’abandon faute de visualisation
“On a baissé les retours taille en montrant la coupe.”
“Le prix live évite le choc panier.”
04 · Pièce
Configure ta pièce
Flagship jouable · panier factice.
- →Hero + sections sous la fold (pas juste une accroche)
- →Hiérarchie visuelle et CTA principal
- →Densité d’info vs lisibilité
05 · Même famille
D’autres directions du même type — pour comparer densités et ambiances.
06 · Ce qu’on regarde
- 01Hero + sections sous la fold (pas juste une accroche)
- 02Hiérarchie visuelle et CTA principal
- 03Densité d’info vs lisibilité
- 04États interactifs (hover, sélection, feedback)