Feature Sections
persona-attributes-grid
stable Sur waimia · 1 Contenu inline (instance)Présenter les capacités
Grille persona 2×2 pain points / critères / objections / preuves avec footer méta sombre en trois colonnes.
Instances sur le site
Global 0 instance en page composable
-
src/pages/ressources/personas/[slug].astro
Aperçu
Comment l'utiliser
| Champ | Nature | Type | Requis | Bilingue | Bornes / valeurs |
|---|---|---|---|---|---|
background | Présentation | enum | Non | · | paper · paper-2 · paper-3 · ink |
blocks | Contenu | array | Oui | · | · |
meta | Contenu | array | Oui | · | · |
Déclinaisons · 18
Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 4 curées, 14 générées. Échantillon des 12 premières générées (sur 14) ; toutes accessibles en rendu isolé.
-
Persona attributs · papier
curéepersona-attributes-grid--paper -
Persona attributs · papier 2
curéepersona-attributes-grid--paper-2 -
Persona attributs · papier 3
curéepersona-attributes-grid--paper-3 -
Persona attributs · encre
curéepersona-attributes-grid--ink -
persona-attributes-grid · grille uniforme
généréepersona-attributes-grid--grid-uniform -
persona-attributes-grid · grille auto
généréepersona-attributes-grid--grid-auto -
persona-attributes-grid · grille asymétrique
généréepersona-attributes-grid--grid-asym -
persona-attributes-grid · liste
généréepersona-attributes-grid--list -
persona-attributes-grid · lignes séparées
généréepersona-attributes-grid--rows-divided -
persona-attributes-grid · bento vedette
généréepersona-attributes-grid--bento-feature -
persona-attributes-grid · vedette + split
généréepersona-attributes-grid--featured-split -
persona-attributes-grid · deux colonnes
généréepersona-attributes-grid--two-col -
persona-attributes-grid · alternance
généréepersona-attributes-grid--alternating -
persona-attributes-grid · jeu de cartes
généréepersona-attributes-grid--cards-deck -
persona-attributes-grid · liste média à gauche
généréepersona-attributes-grid--list-media-left -
persona-attributes-grid · grille 3 + vedette
généréepersona-attributes-grid--grid-3-featured
Comparer les déclinaisons · 16
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.
-
Persona attributs · papier
curéepersona-attributes-grid--paperbackground:paperOuvrir dans le builder -
Persona attributs · papier 2
curéepersona-attributes-grid--paper-2background:paper-2Ouvrir dans le builder -
Persona attributs · papier 3
curéepersona-attributes-grid--paper-3background:paper-3Ouvrir dans le builder -
Persona attributs · encre
curéepersona-attributes-grid--inkbackground:inkOuvrir dans le builder -
persona-attributes-grid · grille uniforme
généréepersona-attributes-grid--grid-uniformlayout:grid-uniformOuvrir dans le builder -
persona-attributes-grid · grille auto
généréepersona-attributes-grid--grid-autolayout:grid-autoOuvrir dans le builder -
persona-attributes-grid · grille asymétrique
généréepersona-attributes-grid--grid-asymlayout:grid-asymOuvrir dans le builder -
persona-attributes-grid · liste
généréepersona-attributes-grid--listlayout:listOuvrir dans le builder -
persona-attributes-grid · lignes séparées
généréepersona-attributes-grid--rows-dividedlayout:rows-dividedOuvrir dans le builder -
persona-attributes-grid · bento vedette
généréepersona-attributes-grid--bento-featurelayout:bento-featureOuvrir dans le builder -
persona-attributes-grid · vedette + split
généréepersona-attributes-grid--featured-splitlayout:featured-splitOuvrir dans le builder -
persona-attributes-grid · deux colonnes
généréepersona-attributes-grid--two-collayout:two-colOuvrir dans le builder -
persona-attributes-grid · alternance
généréepersona-attributes-grid--alternatinglayout:alternatingOuvrir dans le builder -
persona-attributes-grid · jeu de cartes
généréepersona-attributes-grid--cards-decklayout:cards-deckOuvrir dans le builder -
persona-attributes-grid · liste média à gauche
généréepersona-attributes-grid--list-media-leftlayout:list-media-leftOuvrir dans le builder -
persona-attributes-grid · grille 3 + vedette
généréepersona-attributes-grid--grid-3-featuredlayout:grid-3-featuredOuvrir dans le builder
Sections liées
Même famille
article-grid stable Grille de cartes d’articles/blog : image optionnelle, tag, titre, date, temps de lecture, extrait, auteur et lien, en 2 ou 3 colonnes. Le classique éditorial B2B.
SurvolImageIcônes +3 18 décl.case-card-grid stable Table éditoriale de cas clients en six colonnes (index, client, secteur, stack, impact, flèche) façon compte rendu d'audit.
Apparition au scrollSurvolDéfilement +3 31 décl.case-featured-grid stable Grille de cas clients « featured » : un cas mis en avant (colonne large, cover optionnelle) plus des cas secondaires en lignes numérotées, avec chip de provenance.
Apparition au scrollSurvolDéfilement +6 17 décl.challenges-grid stable Grille 2x2 de défis ou pain-points : numéro en coin, icône, titre et texte par carte, border-left accent et élévation au survol. Pose le problème avant la solution sur une landing.
SurvolIllustration au traitIcônes +4 16 décl.commitments-grid stable Grille hairline de 2 à 6 engagements ou garanties, titre display et corps sans, extrait de la page Méthode.
Zoom au survolApparition au scrollSurvol +8 17 décl.deliverables-grid stable Grille de livrables tangibles avec cards numérotées et tag format/durée, extraite des pages offre et détail.
Apparition au scrollSurvolDéfilement +4 29 décl.Même catégorie
architecture-diagram stable Diagramme d'architecture signature : N canaux d'entrée vers un système central et M sorties, avec boucle d'amélioration continue.
Apparition au scrollDéfilementIllustration au trait +1 23 décl.bento-grid stable Mosaique bento asymetrique de 5 cellules (1 grande 2x2 + 4 petites) pour valoriser les capacites cles avec une mise en page moderne.
IcônesCartesListe +1 26 décl.challenges-grid stable Grille 2x2 de défis ou pain-points : numéro en coin, icône, titre et texte par carte, border-left accent et élévation au survol. Pose le problème avant la solution sur une landing.
SurvolIllustration au traitIcônes +4 16 décl.coming-soon-pills stable Bande teaser fond paper-2 avec kicker, H2 et liste de pills pour éléments à venir.
ListeBadge1 colonne 16 décl.commitments-grid stable Grille hairline de 2 à 6 engagements ou garanties, titre display et corps sans, extrait de la page Méthode.
Zoom au survolApparition au scrollSurvol +8 17 décl.decision-list stable Arbre de décision : en-tête kicker et titre display à gauche, liste ordonnée numérotée d items à droite, hairlines fines.
Apparition au scrollDéfilementListe +1 17 décl.Similaires
feature-comparison-grid stable Différenciation légère « nous vs eux » en grille de cartes : 2 ou 3 colonnes, lignes cochées ou barrées, colonne mise en avant. Plus léger que la table comparative.
ListeCartes3 colonnes 18 décl.use-case-index stable Index éditorial de cas d'usage en lignes numérotées avec libellé italique, tag mono et lien d'ancrage solution.
Apparition au scrollSurvolDéfilement +2 17 décl.editorial-preview stable Index éditorial de publications en lignes numérotées (num · date · tag · titre italique · flèche), extrait de FieldNotes.
Apparition au scrollSurvolDéfilement +3 17 décl.why-stalls stable Section éditoriale "pourquoi X cale" : chapter label sticky à gauche + N FIG rows à droite avec row-lines.
DéfilementIllustration au trait2 colonnes +2 14 décl.feature-grid stable Grille de fonctionnalités pour structurer les bénéfices ou capacités principales d'une offre.
Zoom au survolApparition au scrollSurvol +8 22 décl.problems-grid stable Grille de problèmes/frictions auto-fit (3 cards min) : num + kicker + h3 + body, séparateurs hairline 1px.
Zoom au survolApparition au scrollSurvol +8 17 décl.Code
Données de la section (à placer dans sections[])
{
"type": "persona-attributes-grid",
"blocks": [
{
"kicker_fr": "§ Pain points",
"kicker_en": "§ Pain points",
"items_fr": [
"Trop de données dispersées pour décider vite.",
"CRM rempli mais peu exploité.",
"Priorités IA floues côté direction."
],
"items_en": [
"Too much scattered data to decide quickly.",
"CRM is filled but underused.",
"AI priorities remain unclear at leadership level."
]
},
{
"kicker_fr": "§ Critères de décision",
"kicker_en": "§ Decision criteria",
"items_fr": [
"ROI visible en moins de 90 jours.",
"Gouvernance claire des accès et données.",
"Adoption terrain sans formation lourde."
],
"items_en": [
"Visible ROI in under 90 days.",
"Clear governance for access and data.",
"Field adoption without heavy training."
]
},
{
"kicker_fr": "§ Objections",
"kicker_en": "§ Objections",
"items_fr": [
"Nous avons déjà testé ChatGPT.",
"Notre stack est trop spécifique.",
"Les équipes n’ont pas le temps."
],
"items_en": [
"We already tried ChatGPT.",
"Our stack is too specific.",
"Teams do not have time."
]
},
{
"kicker_fr": "§ Proof points",
"kicker_en": "§ Proof points",
"items_fr": [
"Audit en 5 jours.",
"Runbook transmis.",
"Mesure avant/après intégrée au projet."
],
"items_en": [
"Audit in 5 days.",
"Runbook transferred.",
"Before/after measurement built into the project."
]
}
],
"meta": [
{
"kicker_fr": "§ Budget",
"kicker_en": "§ Budget",
"value_fr": "5 à 35 K€",
"value_en": "€5K to €35K"
},
{
"kicker_fr": "§ Timeline",
"kicker_en": "§ Timeline",
"value_fr": "5 jours à 8 semaines",
"value_en": "5 days to 8 weeks"
},
{
"kicker_fr": "§ Taille entreprise",
"kicker_en": "§ Company size",
"value_fr": "PME · ETI marketing",
"value_en": "SMB · mid-market marketing"
}
]
}/library/section/persona-attributes-grid.json
Chemin du détail machine
/library/section/persona-attributes-grid.json