hero-conversion-funnel · Composant Waimia

Instances sur le site

Global 1 instance sur 1 page

Page	Position	Contenu	Variante
/services/template-service-ref	`section 1`	Growth System IA	ink

Composé inline inline · non éditable ici

src/components/templates/ConversionFunnelTemplate.astro

Aperçu

Comment l'utiliser

Intention

Énoncer la proposition de valeur

Rôle de page

Héros

Modèle de contenu

Contenu inline (instance)

Contrat de slots

Champ	Nature	Type	Requis	Bilingue	Bornes / valeurs
`background`	Présentation	`enum`	Non	·	paper · paper-2 · paper-3 · ink
`funnel_num`	Contenu	`text`	Oui	·	·
`variant`	Présentation	`enum`	Non	·	split · sumie · minimal
`media_src`	Contenu	`image`	Non	·	·
`media_alt`	Contenu	`text`	Non	fr / en	·
`media_register`	Contenu	`enum`	Non	·	lineart · editorial
`h1`	Contenu	`text`	Oui	fr / en	·
`lede`	Contenu	`text`	Oui	fr / en	·
`meta_pills`	Contenu	`array`	Non	·	0..6
`benefits`	Contenu	`array`	Non	·	0..8
`proof`	Contenu	`text`	Non	fr / en	·
`cta_primary`	Contenu	`object`	Oui	·	·
`cta_secondary`	Contenu	`object`	Non	·	·
`stats`	Contenu	`array`	Non	·	0..4

Déclinaisons · 15

Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 2 curées, 13 générées. Échantillon des 12 premières générées (sur 13) ; toutes accessibles en rendu isolé.

Hero entonnoir · split · registre line-art · papier
curée
hero-conversion-funnel--split-lineart-paper
Hero entonnoir · split · registre éditorial · papier 2
curée
hero-conversion-funnel--split-editorial-paper-2
hero-conversion-funnel · split
générée
hero-conversion-funnel--split
hero-conversion-funnel · centré
générée
hero-conversion-funnel--centered
hero-conversion-funnel · masthead
générée
hero-conversion-funnel--masthead
hero-conversion-funnel · entonnoir
générée
hero-conversion-funnel--funnel
hero-conversion-funnel · image pleine
générée
hero-conversion-funnel--full-bleed-image
hero-conversion-funnel · empilé
générée
hero-conversion-funnel--stacked
hero-conversion-funnel · minimal
générée
hero-conversion-funnel--minimal
hero-conversion-funnel · avec formulaire
générée
hero-conversion-funnel--with-form
hero-conversion-funnel · split inversé
générée
hero-conversion-funnel--split-reverse
hero-conversion-funnel · fond vidéo
générée
hero-conversion-funnel--video-bg
hero-conversion-funnel · centré étroit
générée
hero-conversion-funnel--centered-narrow
hero-conversion-funnel · avec bande de logos
générée
hero-conversion-funnel--with-logos-strip

Comparer les déclinaisons · 14

Chaque déclinaison, résumée par son écart d'axes face à la démo par défaut du type : seuls les axes qui changent une valeur sont listés. Ouvre-la dans le builder pour l'assembler dans une page.

Hero entonnoir · split · registre line-art · papier
curée
hero-conversion-funnel--split-lineart-paper
background:paper
Ouvrir dans le builder
Hero entonnoir · split · registre éditorial · papier 2
curée
hero-conversion-funnel--split-editorial-paper-2
media_register:editorialmedia_src:/images/illustrations/ds/gentleman-craftsman-go-work-paper.webpmedia_alt_fr:Illustration éditoriale : artisan au travailmedia_alt_en:Editorial illustration: craftsman at workbackground:paper-2
Ouvrir dans le builder
hero-conversion-funnel · split
générée
hero-conversion-funnel--split
layout:split
Ouvrir dans le builder
hero-conversion-funnel · centré
générée
hero-conversion-funnel--centered
layout:centered
Ouvrir dans le builder
hero-conversion-funnel · masthead
générée
hero-conversion-funnel--masthead
layout:masthead
Ouvrir dans le builder
hero-conversion-funnel · entonnoir
générée
hero-conversion-funnel--funnel
layout:funnel
Ouvrir dans le builder
hero-conversion-funnel · image pleine
générée
hero-conversion-funnel--full-bleed-image
layout:full-bleed-image
Ouvrir dans le builder
hero-conversion-funnel · empilé
générée
hero-conversion-funnel--stacked
layout:stacked
Ouvrir dans le builder
hero-conversion-funnel · minimal
générée
hero-conversion-funnel--minimal
layout:minimal
Ouvrir dans le builder
hero-conversion-funnel · avec formulaire
générée
hero-conversion-funnel--with-form
layout:with-form
Ouvrir dans le builder
hero-conversion-funnel · split inversé
générée
hero-conversion-funnel--split-reverse
layout:split-reverse
Ouvrir dans le builder
hero-conversion-funnel · fond vidéo
générée
hero-conversion-funnel--video-bg
layout:video-bg
Ouvrir dans le builder
hero-conversion-funnel · centré étroit
générée
hero-conversion-funnel--centered-narrow
layout:centered-narrow
Ouvrir dans le builder
hero-conversion-funnel · avec bande de logos
générée
hero-conversion-funnel--with-logos-strip
layout:with-logos-strip
Ouvrir dans le builder

Sections liées

Même famille

hero-academy-hub stable

Hero hub académie : kicker mono, h1 display, lede et bande de stats mono (cours, parcours, alumni).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.

hero-asymmetric-grid stable

Héro plein écran en grille multi-lignes asymétrique : titre serif pleine largeur, rangée 2 colonnes (label + lede + 2 CTA à gauche, label + puces fléchées à droite), puis bande de 4 KPI dont la dernière cellule est inversée en ink. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

hero-atlas stable

Hero Atlas en deux colonnes avec signature grid, copy éditoriale, CTAs et mini-map des quatre piliers.

hero Hero Header Sections Apparition au scrollDéfilementImage de fond +4 16 décl.

hero-author stable

Hero de page auteur : 2-col copy/portrait, breadcrumb équipe, role eyebrow, h1 split prénom+nom italic accent, lede display.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.

hero-baseline-stats stable

Héro plein écran à impact typographique : kicker, titre serif géant et lede court en tête, rangée de 4 KPI poussée en baseline (séparée par une hairline forte). CTA optionnel, pas de média. Variante paper et ink, responsive (KPI 2 colonnes sur mobile).

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

hero-capability-band stable

Héro plein écran : titre serif accent et lede alignés à gauche (~70 % de large), puis une bande de capacités asymétrique pleine largeur de 5 cellules dont la 3e (large, accent) porte un KPI serif, les 4 autres des capacités mono. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

Même catégorie

hero-academy-hub stable

Hero hub académie : kicker mono, h1 display, lede et bande de stats mono (cours, parcours, alumni).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.

hero-asymmetric-grid stable

Héro plein écran en grille multi-lignes asymétrique : titre serif pleine largeur, rangée 2 colonnes (label + lede + 2 CTA à gauche, label + puces fléchées à droite), puis bande de 4 KPI dont la dernière cellule est inversée en ink. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

hero-atlas stable

Hero Atlas en deux colonnes avec signature grid, copy éditoriale, CTAs et mini-map des quatre piliers.

hero Hero Header Sections Apparition au scrollDéfilementImage de fond +4 16 décl.

hero-author stable

Hero de page auteur : 2-col copy/portrait, breadcrumb équipe, role eyebrow, h1 split prénom+nom italic accent, lede display.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.

hero-baseline-stats stable

Héro plein écran à impact typographique : kicker, titre serif géant et lede court en tête, rangée de 4 KPI poussée en baseline (séparée par une hairline forte). CTA optionnel, pas de média. Variante paper et ink, responsive (KPI 2 colonnes sur mobile).

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

hero-capability-band stable

Héro plein écran : titre serif accent et lede alignés à gauche (~70 % de large), puis une bande de capacités asymétrique pleine largeur de 5 cellules dont la 3e (large, accent) porte un KPI serif, les 4 autres des capacités mono. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

Similaires

hero-pillar-hub stable

Hero de page pilier avec titre maximal et grille de statistiques quatre colonnes optionnelle.

hero Hero Header Sections Apparition au scrollDéfilementPlusieurs images +8 16 décl.

hero-hub-stats stable

Hero hub avec stats : meta kicker double + numéro § accent + h1 maximal, lede, grille KeyMetric 4-col en pied avec accent.

hero Hero Header Sections Apparition au scrollDéfilementPlusieurs images +8 16 décl.

hero-social-proof stable

Hero centré avec preuve sociale above-the-fold : titre, CTA, note clients optionnelle et bande de chiffres clés (StatRow) sous le pli haut.

hero Hero Header Sections Apparition au scrollDéfilementBoutons +2 16 décl.

hero-stack-rhythm stable

Héro plein écran en une seule colonne resserrée, au rythme vertical généreux : fil d'Ariane, kicker, titre serif, lede, badges inline séparés par hairlines, 2 CTA, bande de 4 KPI. Variante paper et ink, responsive.

hero Hero Header Sections SurvolIllustration au traitBoutons +4 14 décl.

hero-sector stable

Hero de page secteur ou département : SVG rotated 15° accent, dept kicker, h1 + lead italique, CTA et meta, tags secteurs.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +7 16 décl.

hero-tech-layer stable

Hero de couche technologique : triangles SVG signature, layer badge (claude/os/orch), h1 + lead italique, CTA et meta.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +7 16 décl.

Code

Données de la section (à placer dans sections[])

{
  "type": "hero-conversion-funnel",
  "variant": "split",
  "media_register": "lineart",
  "media_src": "/images/line-art/dispositif-flow.svg",
  "media_alt_fr": "Schéma : outils dispersés, orchestration centrale, résultat mesuré",
  "media_alt_en": "Diagram: scattered tools, central orchestration, measured result",
  "funnel_num": "§ Flagship 01",
  "h1_fr": "Site web <i>IA-first</i>.<br/>Leads automatisés.",
  "h1_en": "AI-first <i>website</i>.<br/>Automated leads.",
  "lede_fr": "Trois agents IA orchestrent acquisition, contenu et CRM. Résultat mesuré en 90 jours.",
  "lede_en": "Three AI agents orchestrate acquisition, content, and CRM. Result measured in 90 days.",
  "meta_pills": [
    {
      "label_fr": "Offre signature",
      "label_en": "Signature offer"
    },
    {
      "label_fr": "Acquisition → conversion → activation",
      "label_en": "Acquisition → conversion → activation"
    },
    {
      "label_fr": "Agent éditeur inclus",
      "label_en": "Editor agent included"
    }
  ],
  "benefits": [
    {
      "label_fr": "Lighthouse 100/100/100/100 garanti",
      "label_en": "Lighthouse 100/100/100/100 guaranteed"
    },
    {
      "label_fr": "8 articles SEO/mois automatisés",
      "label_en": "8 automated SEO articles/month"
    },
    {
      "label_fr": "Relances CRM < 1h",
      "label_en": "CRM follow-ups in < 1h"
    },
    {
      "label_fr": "90 jours pour le ROI mesuré",
      "label_en": "90 days to measured ROI"
    }
  ],
  "proof_fr": "Médiane 6 mois sur 12 PME · +340% leads qualifiés · −72% temps content",
  "proof_en": "6-month median on 12 SMBs · +340% qualified leads · −72% content time",
  "cta_primary": {
    "label_fr": "Voir les tarifs ↓",
    "label_en": "See pricing ↓",
    "href": "#pricing",
    "variant": "primary"
  },
  "cta_secondary": {
    "label_fr": "Voir la démo",
    "label_en": "See the demo",
    "href": "#demo",
    "variant": "ghost"
  },
  "stats": [
    {
      "value": "+340%",
      "label_fr": "leads qualifiés",
      "label_en": "qualified leads"
    },
    {
      "value": "−72%",
      "label_fr": "temps content",
      "label_en": "content time"
    },
    {
      "value": "8",
      "label_fr": "articles/mois auto",
      "label_en": "articles/month auto"
    },
    {
      "value": "90j",
      "label_fr": "ROI mesuré",
      "label_en": "measured ROI"
    }
  ]
}

Pour un agent / MCP

Détail machine de cette section (intention, rôle, contrat de slots, sections liées).

/library/section/hero-conversion-funnel.json

Chemin du détail machine

/library/section/hero-conversion-funnel.json