// Process (visual timeline) + Cases (featured + smaller, animated chart) // ── useReveal hook: marks an element for the global reveal observer ── function useReveal() { const ref = React.useRef(null); React.useEffect(() => { const el = ref.current; if (!el) return; el.classList.add("reveal"); }, []); return ref; } window.useReveal = useReveal; // ── Process — vertical visual timeline ────────────────────────── function Process() { const steps = [ { n: "01", t: "Audit & feuille de route", d: "On analyse votre activité et vos enjeux pour identifier les opportunités IA à plus fort impact. Vous repartez avec un plan d'action chiffré et priorisé.", visual: , duration: "", }, { n: "02", t: "Déploiement", d: "Intégration dans vos outils existants, branchement des données, sécurité, accès équipes. Vous voyez l'IA tourner sur vos vrais cas d'usage en quelques semaines.", visual: , duration: "", }, { n: "03", t: "Suivi & amélioration", d: "Maintenance, monitoring, ajustements. Vos outils IA gagnent en précision au fil de l'usage. Un suivi continu pour faire évoluer la solution avec vous.", visual: , duration: "en continu", }, ]; return (
/ Notre méthode

De l'idée au déploiement, en quelques semaines.

{/* Vertical accent line — left side */}
{steps.map((s, i) => ( ))}
); } function ProcessStep({ n, t, d, visual, duration, idx, last }) { const ref = useReveal(); return (
{n}
{/* Content — left */}
{duration && (
{duration}
)}

{t}

{d &&

{d}

}
{/* Visual — right */}
{visual}
); } // ── Process visuals ───────────────────────────────────────────── function AuditVisual() { // Grid of dots with one highlighted (the opportunity discovered) const rows = 7, cols = 11; return ( {Array.from({ length: rows }).map((_, r) => Array.from({ length: cols }).map((_, c) => { const x = 12 + c * 20; const y = 12 + r * 20; const isHot = (r === 3 && c === 5); const isWarm = (r === 2 && c === 4) || (r === 4 && c === 6) || (r === 3 && c === 7); return ; }) )} OPPORTUNITÉ ); } function DeployVisual() { // Flow diagram: sources → agent → outputs (compact, balanced) return ( {/* Sources (left) */} CRM EMAIL DOCS {/* Agent center */} AGENT {/* Outputs (right) */} TEAMS EMAIL DB {/* Connectors */} {/* Data flow particles */} ); } function MonitorVisual() { // Bar chart that grows: usage / precision over time return ( {/* axes */} {/* grid */} {[40, 60, 80, 100].map(y => ( ))} {/* bars */} {[ { x: 38, h: 30 }, { x: 60, h: 45 }, { x: 82, h: 38 }, { x: 104, h: 56 }, { x: 126, h: 64 }, { x: 148, h: 72 }, { x: 170, h: 84 }, { x: 192, h: 92 }, ].map((b, i) => ( = 6 ? "var(--accent)" : "var(--ink)"} opacity={i >= 6 ? 1 : 0.18}> ))} {/* trend line */} +38% ); } // ── Cases — featured + grid ───────────────────────────────────── function Cases() { const featured = { industry: "Cabinet dentaire · 4 dentistes · Paris", title: "Un assistant IA qui répond aux questions des patients et prend les rendez-vous 24h/7j.", desc: "Disponible par appel et par SMS, l'assistant répond aux questions des patients à toute heure (horaires, tarifs, motifs de consultation, urgences), propose des créneaux, gère les annulations et envoie les rappels.", metrics: [ { v: "+38%", l: "RDV pris hors horaires" }, ], }; const small = [ { industry: "Pizzeria · Tomate & Mozza · Gironde", title: "Un service de click & collect automatisé, de la commande à la prise en charge.", desc: "L'IA prend les commandes en ligne, confirme la préparation, gère les modifications et envoie les notifications de retrait. L'équipe en salle ne décroche plus le téléphone pendant le coup de feu.", metric: { v: "+20%", l: "de chiffre d'affaires" }, }, { industry: "Cabinet de conseil · 100+ collab. · Paris", title: "Une plateforme IA interne qui automatise les tâches répétitives des équipes.", desc: "Plusieurs agents IA spécialisés (gestion de mails, rédaction de devis, reporting, suivi de dossiers, support interne) regroupés dans une interface unique. Les collaborateurs déclenchent les automatisations à la demande.", metric: { v: "6 h/sem", l: "récupérées par collaborateur" }, }, ]; return (
/ Cas clients

50+ entreprises nous ont fait confiance.

9 entreprises sur 10 renouvellent leur collaboration au-delà du premier projet avec Pulse.

{small.map((c, i) => )}
); } function ProofItem({ v, l, accent }) { return (
{v} {l}
); } function ProofSep() { return ; } function CaseFeatured({ industry, title, desc, metrics }) { const ref = useReveal(); return (
{/* Background chart */}
{industry}

{title}

{desc}

{metrics.map((m, i) => (
{m.v} {m.l}
))}
); } function CaseSmall({ industry, title, desc, metric }) { const ref = useReveal(); return (
{industry}

{title}

{desc}

{metric.v} {metric.l}
); } Object.assign(window, { Process, Cases });