CommunityImagegithub.com

meadow-slides

Créez des présentations au format PowerPoint .pptx dans le système de design Meadow (fond noir, plaque vert acide #D3FF31, polices Geist/Syne, grille 1920×1080), avec possibilité d'exporter en plans Figma modifiables et de générer des prompts d'images pour les arrière-plans et illustrations.

Qu'est-ce que meadow-slides ?

Cette compétence permet de construire des présentations (slides, pitchs, offres commerciales, études de cas, one-pagers) dans le style distinctif de la marque Meadow. Elle repose sur un petit fichier JSON de spécification et un script Python qui positionne chaque élément sur une grille homogène, garantissant la cohérence typographique et chromatique. Les règles de conception sont strictes : fond sombre, une seule plaque vert acide par slide, polices Syne pour le texte latin et Geist pour le cyrillique, marges de 96px, espacements standardisés. La compétence vérifie automatiquement que le contenu tient dans les zones définies, que l'alignement optique est correct et que les polices sont disponibles. Elle propose plusieurs formats de sortie : PPTX standard, version portable pour Google Slides, PDF 1920×1080, et un export Figma. Elle intègre également une bibliothèque d'images (vagues abstraites, prairies, photos de personnes) et un générateur de prompts pour créer des visuels sur mesure avec des outils d'IA générative (comme Magnific). Toute modification de contenu ou de mise en page doit passer par le script, et non par une édition manuelle de la sortie, pour préserver l'intégrité du design.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/artbreez/meadow-skills/tree/HEAD/plugins/meadow-design/skills/meadow-slides

Installed? Explore more Image skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

Demander à votre IA préférée

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

Documentation

Meadow slides

Des présentations dans le style Meadow, construites à partir d'une petite spécification JSON par un script, pour que chaque diapositive repose sur la même grille, la même échelle typographique et les mêmes couleurs que les présentations commerciales de Meadow. Vous rédigez le contenu et choisissez les mises en page ; le script s'occupe du pixel et vous avertit si le texte ne tient pas.

scripts/meadow_deck.py   spec.json -> .pptx (+ --figma-json layout pour Figma)
scripts/preview.py       .pptx -> PNG par diapositive + planche contact (LibreOffice ou Keynote)
scripts/figma_render.js  dessine une diapositive du dump de mise en page via use_figma
scripts/install_fonts.sh installe Geist / Geist Mono / Syne pour l'utilisateur courant
references/layouts.md    chaque mise en page, ses champs et quand l'utiliser   <- à lire avant d'écrire une spec
references/design-system.md  tokens et règles derrière les mises en page    <- à lire quand on sort des layouts
references/image-prompts.md  bibliothèque de prompts pour l'imagerie du deck <- à lire quand le deck nécessite de nouvelles images
references/figma.md      recette de sortie Figma et ses pièges             <- à lire seulement si Figma est souhaité
examples/sample-deck.json      un deck de six diapositives couvrant les principales mises en page (données fictives)
examples/skill-intro-deck.json le deck qui présente cette compétence (images du README)

Workflow

  1. Obtenez d'abord le contenu. Demandez (ou extrayez du brief / vieux deck / document) le message de chaque diapositive. Si l'utilisateur vous remet un deck source à remettre en page, conservez son texte mot pour mot : ne changez que ce qu'on vous demande de changer, et proposez des coupes ou de nouveaux titres comme suggestion séparée. Les gens remarquent quand leur texte a été réécrit silencieusement.
  2. Plan. Une idée par diapositive. Mappez chaque diapositive à une mise en page de references/layouts.md (couverture → diapositives de contenu → contacts est l'arc habituel). Montrez le plan à l'utilisateur quand le deck dépasse ~6 diapositives ou que le brief est vague ; sinon passez directement à la construction.
  3. Vérifiez les chiffres. Les decks commerciaux vivent sur les budgets, CPM/CPV, vues. Recalculez les chiffres dérivés (CPM = budget / vues × 1000, totaux, pourcentages) avant la composition. S'ils ne tombent pas juste, composez quand même ce que l'utilisateur a donné, et dites-lui quels chiffres divergent et de combien. Un client fera le même calcul.
  4. Écrivez la spec (deck.json), voir l'exemple et references/layouts.md. Les images sont des noms courts groupés (wave-05, meadow-night-02, people-02-camera-blue) ou des chemins.
  5. Construction : python3 scripts/meadow_deck.py deck.json -o deck.pptx. Traitez chaque WARN comme un bug : raccourcissez le texte, divisez la diapositive ou changez de mise en page, puis reconstruisez. Les lignes WARN couvrent le texte qui déborde, le cyrillique composé en Syne (pas de glyphes cyrilliques), plus d'une plaque d'accent sur une diapositive, et la porte d'alignement, qui s'exécute à chaque construction :
    • texte non centré optiquement dans un pilulier, un chip, un bouton ou un badge (le padding d'encre à gauche/droite et la hauteur de capitale en haut/bas doivent correspondre à 1.5 px près) ;
    • contenu qui traverse les marges latérales de 96 px (les images qui débordent de la diapositive sont acceptables) ;
    • bords qui s'alignent presque, à 1–4 px d'écart : accrochez-les ou éloignez-les clairement ;
    • écarts inégaux dans une rangée ou une pile de cartes de même taille. Tout nouvel élément en forme de pilulier passe par Slide.pill(), qui le dimensionne et le centre ; le texte qui suit un autre texte en ligne (une icône après un nombre, une unité, un badge) est construit avec flow=True pour être vérifié quant à son ajustement mais pas contraint à la grille.
  6. Regardez-le. Le plus rapide, et fonctionne partout : ajoutez --png preview/ à la construction. Il dessine la même mise en page avec Pillow, en mesurant le texte comme le fait Keynote. Pour vérifier que le PPTX récupère les polices sur Mac, qlmanage -t -s 1600 -o preview/ deck.pptx rend la diapositive 1 via le système (aucune application ne s'ouvre). python3 scripts/preview.py deck.pptx utilise LibreOffice, ou Keynote en dernier recours : le scripting de Keynote peut se bloquer et laisser une boîte de dialogue sur l'écran de l'utilisateur, donc ne le réessayez pas en boucle. Ouvrez contact-sheet.png et les diapositives individuelles. Vérifiez l'alignement, le tassement, le contraste sur les photos, les demi-cartes vides et les collisions avec le pied de page. Les rendus Office nécessitent que les polices soient installées (scripts/install_fonts.sh).
  7. Livrez le .pptx. Mentionnez que les destinataires ont besoin des polices (assets/fonts, toutes libres sous licence OFL) ou qu'ils doivent utiliser la construction --portable (voir ci-dessous).
  8. Figma (optionnel) quand demandé : suivez references/figma.md. N'écrivez pas dans le fichier Figma de quelqu'un à moins qu'il ne l'ait demandé.

Règles qui donnent le look Meadow

Voici les règles que les gens vérifient en premier. Les mises en page les appliquent déjà, donc elles comptent surtout quand vous écrivez du contenu ou modifiez une mise en page.

  • Fond sombre, une plaque citron vert. Fond #0E1013, cartes #1A1D21, rangées intérieures #23262B. Citron vert #D3FF31 marque la seule chose dont parle la diapositive (l'offre, le résultat, le callout clé). Deux plaques citron vert sur une diapositive aplatissent la hiérarchie. Ne peignez pas une carte au hasard en citron vert juste pour avoir un accent : une diapositive peut n'en avoir aucun. Le texte sur citron vert est quasi noir, jamais blanc.
  • Polices. Un titre écrit en latin est composé en Syne, même dans un deck russe (un nom de produit comme «Meadow Slides» sur une couverture). Un titre contenant du cyrillique est en Geist, car Syne n'a pas de cyrillique. Le script décide par titre (couverture, section, énoncé, titre de diapositive et de contacts), alors écrivez le titre dans la langue dans laquelle vous voulez qu'il soit composé. Le corps de texte est toujours en Geist, les étiquettes en Geist Mono capitales, les nombres/KPIs isolés en Syne (à partir de ~36 px).
  • Grille. Marges de 96 px, en-tête (sourcil mono + titre 64 px) en haut, contenu entre y=264 et y=944, pied de page = logo + NN / NN. Intervalles 24, rayon de carte 24, padding 40.
  • Dites-le avec des surfaces, pas des traits. Les cartes sont séparées par le remplissage, pas par des contours. Le seul élément avec contour est un chip de catégorie (1 px blanc 18 %).
  • Pas de noms de concurrents dans le texte. Logos clients / témoignages seulement si l'utilisateur les a fournis.
  • Typographie : le script colle les prépositions/conjonctions courtes et les tirets avec une espace insécable (NBSP) pour que les lignes ne se terminent pas par «в», «и», «—». Écrivez les nombres comme 10 000+, $5 000, 1,5 млн dans les decks russes.
  • Graphiques : barres sombres pleines sur citron vert ou citron vert sur sombre, ligne de base à zéro, hauteurs proportionnelles aux données. Un noir semi-transparent sur citron vert devient boueux, donc ne l'utilisez pas.

Images

Incluses : 6 vagues bleues/citron vert abstraites (wave-01…06), 3 prairies nocturnes (meadow-night-01…03), 4 photos de personnes lifestyle (people-…), et des glyphes de plateforme blancs (instagram, tiktok, youtube, vk, telegram, x, linkedin, twitch). Les vagues conviennent aux couvertures et aux séparateurs de sections, les prairies aux contacts et aux diapositives de clôture, les photos de personnes aux contacts et aux diapositives image-texte.

Lorsque le deck a besoin de quelque chose de nouveau (une couverture thématique comme l'atelier de contenu, une scène pour un cas), écrivez des prompts à partir de references/image-prompts.md : préfixe style maison + scène + note de composition pour l'emplacement qu'il remplit. Si un outil de génération d'images est connecté (par exemple images_generate du MCP Magnific), proposez de générer ; sinon transmettez les prompts et intégrez les fichiers retournés dans la spec par chemin.

Variantes de sortie

  • --portable : mappe chaque graisse à Regular/Bold de la même famille. Utilisez-le pour l'import Google Slides ou pour les destinataires qui ne peuvent pas installer les polices. La hiérarchie survit, la nuance non.
  • --figma-json layout.json : exporte la mise en page calculée pour le rendu Figma.
  • Notes du présentateur : ajoutez "notes" à n'importe quelle diapositive. Elles vont dans deck-notes.md à côté du PPTX, car Keynote refuse d'ouvrir un PPTX qui a des diapositives de notes écrites par python-pptx. --embed-notes les met à l'intérieur, pour les decks qui ne seront ouverts que dans PowerPoint.
  • PDF : ajoutez --pdf deck.pdf (rendu complet 1920×1080 de chaque diapositive, texte non sélectionnable). Utilisez-le quand quelqu'un demande un PDF à envoyer ou à lire ; pas besoin de Keynote ni de LibreOffice.

Quand les mises en page ne suffisent pas

Préférez diviser le contenu sur deux diapositives plutôt que de le comprimer. Si une diapositive a vraiment besoin d'une nouvelle disposition, ajoutez une fonction layout_<nom> à scripts/meadow_deck.py construite avec les mêmes helpers (header, card, grid, bullets, kpi_tile, footer) et tokens, afin qu'elle hérite du système. Lisez references/design-system.md avant de le faire.

Skills associés