← Toutes les démos
Cosmétique propre · DTC · Aubagne

OleaBeauté

Soins essentiels, formules minérales.

Scroll

Le client fictif

Camille Roussel, 32 ans, ex-R&D L'Oréal puis Caudalie. Elle a fondé Olea en 2021 pour formuler sans compromis. Cinq personnes au labo d'Aubagne, six produits dans la collection. Elle veut un site qui vende sans crier, qui éduque autant qu'il convertit.

L'objectif business

Passer de 50 K€ à 200 K€ de chiffre mensuel en 12 mois en DTC pur (zéro Sephora, zéro intermédiaire). Taux de conversion cible : 3,2 %. Panier moyen cible : 95 €. Récurrence : 2,4 commandes par cliente sur 18 mois.

Plan Modulyx

Pro
99 €/mois · Boutique illimitée · Stripe Connect · CRM clients · Newsletter avancée

Modules SaaS activés

0 modules orchestrés sans une ligne de code

🛍️

Boutique complète

Catalogue 6 produits, fiches détaillées, stock temps réel, badges (Nouveau, Best-seller), filtres par catégorie.

🛒

Panier persistant

Panier sauvegardé entre sessions, suggestions cross-sell, frais de port calculés en temps réel.

💳

Checkout Stripe

Tunnel d'achat optimisé : Stripe Express, Apple Pay, Google Pay, paiement en 3x sans frais via Klarna.

Reviews vérifiées

11 avis clients réels, badge "achat vérifié", tri par utilité, modération anti-fraude.

🎁

Codes promo + parrainage

Codes saisonniers, programme de parrainage 10 % parrain / 10 € filleul, abandon panier J+1 J+3 J+7.

📰

Journal CMS

3 articles éducatifs (formulation, co-culture, tests cliniques) — content marketing pour SEO + conversion.

📧

Newsletter segmentée

Segmentation par produit acheté, anniversaire, panier abandonné. Open rate cible 35 %.

📊

Analytics e-commerce

Funnel visite → produit → panier → paiement, attribution multi-canal (organique, social, parrainage).

ISR + edge cache

Pages produits mises en cache 60s, déstockage en temps réel via webhook Stripe.

Architecture du site

0 pages générées et personnalisables

01/accueilAccueil
02/boutiqueBoutique
03/journalJournal
04/histoireL'histoire
05/contactContact

Stack sous le capot

La même infrastructure que Linear, Stripe, Vercel.

FrameworkNext.js 14 App Router · Server Components · Edge Runtime
RenduISR 60s · cache Vercel Edge · streaming React
Base donnéesPostgreSQL Supabase · Prisma 5 · pooling pgbouncer
HébergementVercel · CDN global · auto-scaling
MédiasCloudflare R2 · AVIF/WebP responsive · lazy loading
PaiementStripe Connect · Apple/Google Pay · webhook idempotent · PCI off-scope
CRM clientsTags auto · scoring LTV · segmentation événements achat
PerformanceLighthouse 95+ mobile · TTFB < 200ms · CLS 0

L'effet wow

Ce qui fait la différence sur ce site.

🎯

Quiz routine 5 questions

Multi-step animé Framer Motion : préoccupation, zone, texture, fréquence, budget. Recommandation produits scorée par tags + catégories. Top 3 cards avec badge "MATCH PARFAIT" sur le 1er.

🛍️

Fiche produit immersive

Layout split sticky 50/50 : carousel photos + thumbnails + panel info collé droite. Onglets Description / Détails / Avis avec layoutId animation. Cross-sell "Vous aimerez aussi".

🛒

Cart drawer slide-right

Panel qui glisse depuis la droite (spring 320/32), backdrop blur 8px. Free shipping bar animée, stepper qty (− / +), totaux temps réel. Toute la conversion sans changer de page.

Hero split + halo doré

Layout 60/40 photo produit hero + texte serif italique. Halo doré pulsant en background, parallax sur la photo au scroll, badge ✦ "Nouveau" accent uppercase.

🌊

Smooth scroll + Listing premium

Lenis exponentiel custom partout. Listing /boutique en grid 2 cols (vs 3-4 standard) avec filtres Tous/Visage/Corps + tri Best/New/Prix, image swap au hover.

Prêt à voir le site en action ?

Tout ce que vous venez de lire est disponible dans Modulyx, sans une ligne de code, prêt à être adapté à votre activité.