Communitygithub.com

landing-eec (Générateur de page d'offre EEC)

Génère une page d'atterrissage React déployable, spécifique à une marque et ciblée pour un public. Prend en charge plusieurs modes de cadrage (challenge, cours, sprint, bootcamp, atelier) avec une architecture de conversion identique.

Qu'est-ce que landing-eec (Générateur de page d'offre EEC) ?

Cette compétence (skill) est conçue pour générer automatiquement des pages d'atterrissage d'offre (landing pages) au format React JSX, prêtes à être déployées. Elle permet aux créateurs de contenu et aux marketeurs de produire rapidement des pages de vente percutantes pour différents types d'offres : challenge, cours, sprint, bootcamp ou atelier. Le système fonctionne à partir de trois modes d'entrée : soit en utilisant des profils de marque et d'audience complets, soit uniquement un profil de marque, soit une simple URL de marque. Dans tous les cas, la page générée est personnalisée avec un contenu marketing cohérent, utilisant un vocabulaire adapté au mode de cadrage choisi. Elle repose sur un système de tokens pour remplacer les éléments dynamiques (nom de l'offre, témoignages, etc.) et respecte des règles strictes de rédaction pour garantir une conversion optimale. La compétence est déclenchée par des phrases comme « crée une landing page pour [marque/client] » ou « génère une page d'offre à partir de ce profil de marque ». L'objectif est de remplacer la rédaction manuelle de contenu de page d'atterrissage par un processus automatisé, reproductible et aligné sur la stratégie de conversion de l'offre.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/rodney-hu/skills/tree/HEAD/skills/landing-eec
Voir l'original→Voir toutes les compétences

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

Documentation

Générateur de Page d'Offre EEC

Produit une page d'atterrissage d'offre spécifique à une marque et ciblée pour un public, sous forme d'artefact React .jsx déployable. Supporte cinq modes de cadrage — challenge, cours, sprint, bootcamp, atelier — avec une architecture de conversion identique. Tous les jetons de template sont remplacés par un contenu réel dérivé de l'identité de la marque, de l'offre et des données d'intelligence d'audience.

Contrat d'Entrée

# Un de ces modes d'entrée est requis :

mode_1_complet:
  profil_marque: string         # Sortie de la compétence brand-intelligence
  intelligence_audience: string # Sortie de la compétence audience-intelligence

mode_2_marque_seulement:
  profil_marque: string         # Sortie de la compétence brand-intelligence

mode_3_url_seulement:
  url: string                   # N'importe quelle URL HTTPS
  nom_marque: string | null     # Optionnel. Auto-extrait si absent.

# Surcharges optionnelles pour n'importe quel mode :
contexte_offre: string | null    # Titre spécifique de l'offre ou résumé s'il est connu
cadrage: challenge | cours | sprint | bootcamp | atelier | null
  # Si null ou non spécifié, le cadrage est auto-détecté dans la Phase 0

Ordre de priorité : Profils complets → marque seule → URL seule. Si des profils existent dans la conversation, utilisez-les plutôt que de les réextraire.

Workflow

Phase 0 — Sélection du Mode de Cadrage

Chargez d'abord references/framing-modes.md. Il contient tous les tableaux de vocabulaire et les règles de détection.

Si le cadrage est explicitement spécifié dans la requête → utilisez-le. Ignorez la détection.

S'il n'est pas spécifié, déduisez-le des signaux de la marque :

Signal de la MarqueMode Déduit
Transformation, création d'habitudes, contenu axé sur la communautéchallenge
Programme éducatif, expertise d'abord, certifications, connaissance B2Bcours
Public d'opérateurs/constructeurs, langage de vitesse, gains rapidessprint
Haut de gamme, intensif, ton « sans excuse »bootcamp
Accompagnement personnalisé, créatif, praticien, basé sur les compétencesatelier

Par défaut si toujours flou : challenge

Enregistrez le cadrage sélectionné. Chaque décision de contenu de la Phase 3 utilise le vocabulaire du tableau de ce mode dans references/framing-modes.md.

Phase 1 — Rassembler le Contexte de la Marque et de l'Audience

Profil de Marque + Intelligence d'Audience tous deux présents : Ignorer l'extraction. Les utiliser directement. Passer à la Phase 2.

Profil de Marque uniquement : Déduire les signaux d'audience à partir des échantillons de ton, des piliers de contenu et de la stratégie d'appel à l'action. Marquer les champs déduits avec (déduit).

URL uniquement : Effectuer une extraction légère :

  1. web_fetch l'URL — page d'accueil + page « à propos » si accessible
  2. Recherche web "[nom de la marque] [niche] public cible" et "[nom de la marque] offre"
  3. Extraire les champs minimum requis
  4. Passer à la Phase 2

Chargez references/token-mapping.md avant la Phase 2.

Phase 2 — Mapper les Signaux aux Jetons du Template

Remplir la carte des jetons. Chaque jeton requis doit avoir une valeur avant la Phase 3.

Jetons requis :

  • NOM_OFFRE
  • NOMBRE (toujours 5)
  • SUJET_ACTION
  • RESULTAT_TANGIBLE_1/2/3
  • FRUSTRATION_COURANTE
  • TITRE_JOUR_1–5
  • TEASER_JOUR_1–5
  • PRENOM_EXPEDITEUR, NOM_EXPEDITEUR, TITRE_EXPEDITEUR
  • BIOGRAPHIE_EXPEDITEUR

Jetons optionnels (dégrader avec élégance) :

  • NOMBRE_ABONNES
  • PUBLIC_SPECIFIQUE
  • TEMOIGNAGE_* (laisser des espaces réservés si aucun n'est disponible)

Définitions complètes des jetons et correspondance signal-jeton : references/token-mapping.md

Phase 3 — Rédiger le Contenu

En utilisant le tableau de vocabulaire du mode de cadrage sélectionné dans references/framing-modes.md, rédiger tout le contenu.

Règles complètes de rédaction par mode de cadrage : references/copy-principles.md

Nom de l'offre : Le mot de cadrage (Challenge / Cours / Sprint / Bootcamp / Atelier) apparaît dans la barre supérieure et le sourcil — pas nécessairement dans le titre de l'offre lui-même. Nommez l'offre par sa transformation.

  • Bon : « Le Sprint Réparation Pipeline »
  • Bon : « Le Cours Séquence d'Emails en 5 Jours »
  • À éviter : « Le Sprint Stack GTM », « Le Cours Marketing par Email »

Titre principal : Tirez le modèle du tableau de vocabulaire du mode sélectionné.

Sous-titre : Utilisez l'ouverture du mode comme point de départ. Remplissez trois résultats en suivant l'arc : clarté → actif/système → confiance.

Titres des jours : Axés sur l'action dans tous les modes. Le choix du verbe s'adapte au mode (voir Variantes d'Étiquettes de Jour dans references/framing-modes.md), mais tous les titres décrivent ce que le participant fait, pas ce qu'il apprend.

État de succès : Utilisez exactement le titre de succès et le sous-titre de succès du mode dans references/framing-modes.md. N'improvisez pas.

Phase 4 — Assembler la Page

  1. Charger assets/template.jsx comme base
  2. Remplacer l'objet CONTENT par tous les jetons renseignés, en utilisant des chaînes spécifiques au mode pour :
    • hero.eyebrow
    • primaryCta.buttonLabel et microcopy
    • whatToExpect.label et whatToExpect.intro
    • socialProof.label
    • author.label
    • secondaryCta.label, secondaryCta.supporting, secondaryCta.buttonLabel
    • Tableau trustSignals
    • Chaînes de l'état de succès dans le composant CtaForm (éditer le JSX directement)
    • Chaîne de l'étiquette de la barre supérieure dans le JSX
  3. Appliquer les surcharges de couleur de marque si des valeurs hexadécimales sont dans le profil de marque
    • --gold → accent principal de la marque (chaud, contraste élevé)
    • --bg → arrière-plan de la marque (garder foncé sauf si la marque est explicitement claire)
    • Thème clair : voir le tableau d'échange de couleurs dans references/token-mapping.md
  4. Mettre à jour author.initials avec les initiales réelles
  5. Fichier de sortie : /mnt/user-data/outputs/[slug-marque]-[mode]-page.jsx
  6. Présenter le fichier à l'utilisateur

Phase 5 — Présentation + Résumé

Marque : [nom]
Cadrage : [mode] — [raison en une ligne si auto-détecté]
Audience : [ICA en une ligne]
Nom de l'offre : [titre]
Arc de transformation : [problème] → [résultat]
Jetons déduits : [liste ou "aucun"]
Prochaine étape : [ce qui doit être fait avant la mise en ligne]

Arbre de Décision

Entrée reçue
│
├── Cadrage spécifié ?
│   ├── OUI → l'utiliser
│   └── NON → détecter à partir des signaux de marque → par défaut : challenge
│
├── Profil de Marque + Intel Audience en contexte ?
│   └── OUI → Phase 2
│
├── Profil de Marque seulement ?
│   └── OUI → déduire l'audience → Phase 2
│
└── URL seulement ?
    └── OUI → web_fetch + recherche → Phase 2

Normes de Qualité

Avant de produire le fichier final, vérifiez :

  • Aucun jeton {{PLACEHOLDER}} ne reste dans les champs requis
  • Le mode de cadrage est cohérent dans tout le document — pas de mélange de vocabulaire entre les modes
  • Les titres des jours sont axés sur l'action (verbe en premier si possible)
  • Le sous-titre utilise un langage de résultat, pas un langage d'apprentissage
  • Le libellé du bouton CTA correspond au mode sélectionné
  • L'état de succès correspond exactement au mode sélectionné
  • L'étiquette de la barre supérieure correspond au mode sélectionné
  • Les initiales de l'auteur correspondent au nom réel de l'expéditeur
  • Fichier nommé [slug-marque]-[mode]-page.jsx

Fichiers de Référence

FichierQuand le Charger
references/framing-modes.mdPhase 0 — charger en premier
references/token-mapping.mdAvant la Phase 2
references/copy-principles.mdAvant la Phase 3
assets/template.jsxPhase 4 — fichier de base

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

design-system-builder

Build a new design system from scratch, or audit/evolve an existing one. Trigger on "design system", "component library", "design tokens", "style guide", "audit my design system", "compare design systems", "harden my design system", or when asked to build reusable UI infrastructure meant to span more than one project.

Skills associés

steipete/sag

ElevenLabs text-to-speech with mac-style say UX.

community

steipete/oracle

Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.

community

steipete/peekaboo

Capture and automate macOS UI with the Peekaboo CLI.

community

mattpocock/design-an-interface

Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".

community

mattpocock/prototype

Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.

community

mattpocock/grill-me

Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".

community