infographie

Infographie éditoriale

Style de référence : le post « Anthropic entre dans le conseil ». Ce post contient :

• un titre lourd sur deux lignes, la deuxième ligne dans la couleur d'accent ;
• une phrase d'accroche : une phrase simple expliquant ce qui s'est passé ;
• un grand objet principal composé de parties, avec des étiquettes numérotées pointant vers elles ;
• un fait secondaire ;
• une rangée « Pourquoi cela arrive » avec trois colonnes d'icônes ;
• une ligne d'auteur et une ligne de sources.

L'objectif est d'expliquer une idée en environ 10 secondes.

Format

• Par défaut : une image autonome, 1080×1350 (4:5). Cela convient aux flux LinkedIn et Instagram et est très facile à sauvegarder.
• En tant que slide de carrousel : la taille correspond aux carrousels, donc le PNG peut être inséré comme {"type": "photo", "image": "images/x.png", "fit": "contain"}, ou copié comme couverture.
• En tant que slide de présentation : le format 4:5 ne correspond pas au format 16:9. Créez une mise en page séparée 16:9 si l'utilisateur en a besoin.

Éléments :

• Template : pipeline/remotion/src/Infographic.tsx.
• Construction : pipeline/build_infographic.py.
• Chaque infographie vit dans son propre dossier infographics/<slug>/ avec un fichier infographic.json et un sous-dossier images/ optionnel.
• Sortie : out/infographics/<slug>.png.

1. Choisissez une idée qui a des parties

Bonnes idées :

• une action avec 2 à 4 composants : « Anthropic entre dans le conseil » avec stratégie, opérations et technologie ;
• une architecture : les sources, connecteurs, planification et sorties de la Morning Loop ;
• un cadre ou un avant → après.

Si l'idée est un seul nombre, utilisez une slide de carrousel graphic ou un format court. Si elle nécessite plus de 4 parties, créez un carrousel.

2. Rédigez le texte (serré)

• titre : deux lignes, 2 à 4 mots chacune, avec un point à la fin de la ligne 2. La ligne 2 est la révélation.
  • Exemples : ["Anthropic enters", "consulting."], ["Your AI chief", "of staff."].
• phrase d'accroche : une phrase, au maximum 25 mots : qui a fait quoi, et pourquoi c'est important.
• légendes : 2 à 4 éléments. Chacun a un title de 1 à 2 mots et un text d'au plus 12 mots.
  • Ils se lisent de haut en bas, donc ordonnez-les comme une séquence ou comme des couches (en haut = le plus stratégique).
• côté : optionnel. Un fait frappant, d'au plus 22 mots, par exemple « former 10 000 ingénieurs d'ici 2027… ».
• pourquoi : un titre tel que « Pourquoi ils le font » ou « Pourquoi en construire un », plus exactement 3 éléments. Chaque élément a un title de 2 à 3 mots et un text d'au plus 7 mots.
• signature : {"name", "org"}. sources : les publications, l'épisode, ou « Fringe Lines podcast, ».

Honnêteté :

• Chaque fait nécessite une source que vous pouvez nommer dans sources.
• N'ajoutez pas de chiffres que la source ne mentionne pas.
• Nuancez (« selon des informations », « d'après le S-1 ») lorsqu'un seul média a rapporté l'information.

3. Visuel principal

• Par défaut : la pile de blocs intégrée ("hero": {"label": "Anthropic"}). Elle dessine un bloc isométrique de couleur d'accent par légende, alternativement décalé, avec des lignes de repère aboutissant sur chaque bloc, et l'étiquette sur le bloc supérieur. Elle ne nécessite aucun fichier image.
• Visuel image : "hero": {"image": "images/hero.png", "fit": "contain"}. Utilisez une capture d'écran du produit, un graphique ou une diapositive du partage d'écran de l'épisode, ou une image d'objet/lieu fournie. Jamais les hôtes ou des personnes réelles : pas de cadres de caméra ni de portraits.
• Images générées par IA (comme le rendu en béton de la référence) : uniquement sur demande de l'utilisateur, par exemple via le connecteur Canva. Pas de vraies personnes, et pas de fausses « photos » d'événements réels.

4. infographics/<slug>/infographic.json

{
  "headline": ["Your AI chief", "of staff."],
  "dek": "Quinn's \"Morning Loop\" agent reads his work tools every weekday at 8 AM and hands him a brief before he opens his laptop.",
  "hero": {"label": "Morning Loop"},
  "callouts": [
    {"title": "Sources", "text": "Outlook mail, calendar and To-Do, Slack, Asana, SharePoint."},
    {"title": "Connectors", "text": "Approved enterprise connectors reach into each source."}
  ],
  "side": {"title": "Closing the loop", "text": "At the end of the day he replies to the brief…"},
  "why": {"title": "Why build one", "items": [
    {"icon": "clock", "title": "Start ahead", "text": "The triage is done before 9."},
    {"icon": "check", "title": "Nothing slips", "text": "It flags what you missed."},
    {"icon": "plug", "title": "No new tools", "text": "Uses the stack you already pay for."}
  ]},
  "byline": {"name": "Fringe Lines", "org": "Episode of Oct 30, 2026"},
  "sources": "Fringe Lines podcast, Oct 30, 2026.",
  "accent": "#FF5A1F"
}

• Icônes : chart rings target users bolt shield dollar clock globe check mail calendar plug brain. Ajoutez-en une nouvelle à la carte Icon dans Infographic.tsx si nécessaire : un chemin de trait 36×36.
• Accent : par défaut l'orange de Fringe Lines. Le rouge de la référence est #C8231B.

5. Rendu et QA

~/.shorts-skill/bin/python pipeline/build_infographic.py infographics/<slug>

Le rendu prend environ 20 s. Ouvrez le PNG et vérifiez :

• Le titre tient en 2 lignes. Sinon, raccourcissez-le ; ne le réduisez pas.

• La phrase d'accroche tient en 3 lignes ou moins.

• Les textes des légendes ne se chevauchent pas. Avec 4 légendes, chaque texte doit rester en 2 lignes ou moins, donc coupez les mots.

• Chaque ligne de repère aboutit sur son bloc.

• La note latérale n'empiète pas sur la zone « pourquoi ».

• Les trois colonnes « pourquoi » sont équilibrées (longueurs de texte similaires).

• La ligne des sources tient sur 2 lignes.

• Aucun hôte, invité ou personne réelle n'apparaît nulle part.

Rapportez le chemin du PNG, les sources utilisées, et tout ce qui nécessite une vérification des faits.