Communitygithub.com

papercut

Génère un reel dans le style Papercut : papier de construction découpé en couches, grain, bords déchirés, bandes d'ombre, ombres portées, animation de découpage rigide, lent mouvement de caméra, bandeaux adhésifs et légendes mot par mot. Utilisez lorsque l'utilisateur mentionne cut paper, papercraft, paper cutout, paper collage, construction paper, ou demande l'aspect artisanal par défaut.

Qu'est-ce que papercut ?

La compétence `papercut` est un style visuel pour la bibliothèque `motion-explainer`. Elle permet de générer des animations explicatives qui imitent l'esthétique du papier de construction découpé. Ce style inclut des éléments distinctifs comme le grain du papier, les bords irréguliers, des bandes d'ombres empilées pour simuler la profondeur, des ombres portées douces, et des légendes sous forme d'étiquettes déchirées apparaissant mot par mot. L'animation est volontairement rigide et saccadée, avec un lent mouvement de caméra et un effet de « boil » (micro-oscillation) sur les bandeaux et les étiquettes. Cette compétence est utile pour créer des vidéos explicatives au look artisanal et chaleureux, particulièrement adaptées aux réseaux sociaux comme Instagram ou TikTok. Elle est compatible avec les moteurs d'animation Remotion (basé sur React) et fframes (basé sur Rust). Elle fournit un kit de composants prêts à l'emploi (comme `<Paper lift torn>`, `<Slab>`, `<TapeBanner>`, `<WordTagCaptions>`) et inclut des scripts de scaffolding, des guides de style, et une checklist QA pour garantir la cohérence visuelle. Le pipeline standard (`motion-explainer`, `motion-script`, `motion-storyboard`, `motion-build`, `motion-qa`) est entièrement compatible : il suffit de définir la variable d'environnement `$MOTION_STYLE` sur `papercut`.

Compatible avec~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/boytegar/motion-skills/tree/HEAD/style/papercut

Demander à votre IA préférée

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

Documentation


name: papercut description: Génère un reel dans le style Papercut : papier de construction découpé en couches, grain, bords déchirés, bandes d'ombre, ombres portées, animation de découpage rigide, lent mouvement de caméra, bandeaux adhésifs et légendes mot par mot. Utilisez lorsque l'utilisateur mentionne cut paper, papercraft, paper cutout, paper collage, construction paper, ou demande l'aspect artisanal par défaut.

Papier de construction en couches : grain, bords déchirés, bandes d'ombre, lent mouvement de caméra et animation de type stop-motion avec micro-oscillations.

Ceci est l'un des styles de la bibliothèque motion-explainer. Il fournit les trois mêmes éléments que tous les autres styles : un fichier manifeste style.json, un moteur Remotion et un moteur fframes. Les compétences du pipeline (motion-explainer, motion-script, motion-storyboard, motion-build, motion-qa) utilisent toutes le nom du style comme $MOTION_STYLE, donc rien d'autre dans le flux de travail ne change lorsque vous choisissez celui-ci.

Quand l'utiliser

Utilisez ce style lorsque le brief correspond à son ADN ci-dessous. Lisez d'abord docs/style-guide.md : c'est la référence, ce fichier est l'index.

ADN du style

  1. Chaque objet est un morceau de papier de construction plat : un remplissage uni, un grain de papier fin multiplié à ~10 %, un bord légèrement irrégulier (comme découpé aux ciseaux), et une ombre portée douce (0 x, 3-6px y, 6-10px de flou, 30 % de noir). Pas de dégradés ni de contours.
  2. L'ombrage est réalisé par des pièces découpées empilées : une bande plus foncée en dessous et une bande plus claire en surbrillance, jamais de fusion.
  3. Vues orthographiques uniquement, épaisses et lisibles à la taille d'un téléphone, lumière venant du haut à gauche.
  4. La saturation est mesurée : arrière-plans poussiéreux et atténués, couleurs vives réservées aux personnages, aux légendes et aux signaux d'état.
  5. La caméra dans le monde dérive doucement ; seuls la bande et les étiquettes oscillent, animées en deux temps.

Palette : crème #DACEC0, encre #1C1B17, ruban adhésif #C3B284, héros #D67354, légendes #3968AD, étiquettes #C9573C

Composants du kit

Remotion, importable depuis ../lib/<fichier> (le kit est synchronisé dans le répertoire src/lib/ de chaque projet) :

composantdescription
<Paper lift torn>le conteneur de base : grain de papier, filtre SVG rugueux ou déchiré, ombre portée
<Slab x y w h color shade hi>la primitive : un rectangle en papier découpé avec une bande d'ombre, une bande de surbrillance et du grain
<Disc x y d color>une pièce circulaire découpée pour les hublots, les roues, les rivets
<Pill x y text>une petite étiquette en papier
<Card x y w h lines>une fiche en papier avec des lignes de remplissage
<PopIn at>entrée par ressort avec un léger basculement de stabilisation
<Backdrop name>un décor en papier préparé avec un floorY connu
<CameraPush>le mouvement de la caméra dans le monde
<TapeBanner text>le bandeau titre adhésif, un fait essentiel par temps
<WordTagCaptions captions>légendes par étiquettes déchirées, un mot par étiquette, apparaissant au début de chaque mot
<CutSeries scenes cuts>le moteur de transition entre les ensembles de scènes

Rien n'oscille dans le vide

La section 2 de docs/style-guide.md est l'ADN du style. docs/frame-breakdown.md est un exemple travaillé d'environ 28 secondes ; copiez sa densité d'événements, pas son contenu.

Moteurs

moteurcheminpoint d'entrée
remotionremotion/template/, kit/, sync_kit.sh, CATALOG.md, AGENT_BRIEF.md
fframesfframes/Cargo.toml, src/ (lib, tokens, kit, look, video, main), tools/ff.sh

Moteurs enregistrés : remotion, fframes.

Générer un épisode

# depuis la racine de la bibliothèque, avec MOTION_LIB résolu
./core/new_episode.sh <series-dir> 01-slug Episode out-name --style papercut --engine remotion
./core/new_episode.sh <series-dir> 01-slug Episode out-name --style papercut --engine fframes

Ou nommez le style dans un fichier SERIES.md / episode.json avec "style": "papercut" et laissez motion_style_of le prendre en charge.

QA pour ce style

Vérifiez ces points sur chaque planche de contacts avant de déclarer une scène terminée ; le reste de la checklist dans motion-qa s'applique toujours.

  • Tout semble en papier : grain, bord rugueux, ombre portée, ombrage par pièces empilées, pas de contours ni de dégradés.
  • La caméra dans le monde se déplace doucement ; seuls la bande et les étiquettes oscillent.
  • La bande est adhésive, 3-7 mots, un fait par temps, ne répète jamais la voix off.
  • Les légendes sont une étiquette déchirée par mot, inclinée, apparaissant au début, dans la bande 68-80 %.
  • Un événement visuel sur chaque mot accentué, avec un mouvement ambiant toujours actif.

Fichiers

  • docs/style-guide.md
  • docs/style-prompt.md
  • docs/motion-principles.md
  • docs/asset-prompts.md
  • docs/frame-breakdown.md
  • remotion/CATALOG.md
  • remotion/AGENT_BRIEF.md
  • remotion/RECIPES.md
  • style.json : le manifeste (canevas, liste des moteurs, chemins des documents, racines audio)
  • sample.png : une image représentative

Individual skills in this repo

This repo contains 6 individual skills — each has its own dedicated page.

bang-motion

Render a reel in the Bang Motion style: high-end cinematic motion graphics with a multi-layer glowing-horizon background, floating colour-mesh blobs, living film grain, frosted-glass UI cards, editorial kinetic typography, a breathing camera, and anti-PPT pacing. Use when the user says cinematic motion graphic, promo opener, product launch reel, kinetic typography, SaaS product tour, glassmorphic UI, anti-slides, or asks for a video that moves like footage instead of a deck. Gunakan skill ini setiap kali user meminta "video promo", "opener", "intro animasi", "motion graphic", "bumper", "kinetic typography", "animasi teks sinematik", "explainer", "video penjelasan" (jurnalisme visual, kartun edukasi, kolase), atau menunjukkan referensi video promosi/explainer dan ingin dibuatkan versi web-nya — bahkan bila mereka tidak menyebut kata "motion graphic" secara eksplisit. Juga gunakan bila user mengeluh hasil animasi web "seperti PPT/presentasi" dan ingin lebih sinematik, atau ingin meren...

isometric

Render a reel in the Isometric style: calm precise product line art in 2:1 dimetric isometric on a white or dark ground, drawn only with constant 2px hairlines, white-filled faces so nearer objects hide farther lines, rounded slabs with visible thickness, stacked layers, repeated-part grids, and one tiny dark accent per frame. Use when the user says isometric, product line art, technical illustration, exploded hardware view, or asks for a clean documentation-grade diagram look.

motion-build

Build and render a papercut episode from a storyboard with the library. Scaffolds the project, builds scenes with parallel agents, assets and audio, renders the mp4, then harvests reusables. Use for "build the reel", "scaffold an episode", "rebuild scene 4", "render it".

motion-explainer

Make a papercut reel, video or explainer end to end. Short vertical (9:16) cut-paper explainers from a link (repo, product page, announcement), idea to mp4. Also routes partial asks to the stage skills and hands out the style prompt for other tools.

motion-script

Turn a link into a papercut reel script. Researches a sourced facts list, writes the 75-95 word script on the 10-beat spine, a banner fact track, a staging table with one set per banner, and the humour pass. Use for "write the script", "research this repo for a reel".

motion-storyboard

Storyboard a papercut script before any code. Writes the Camera / Cut table, one block per scene with frame-level events on each stressed word, the SFX plan and the proof beat. Use for "storyboard this script" or "plan the camera moves and cuts".

Skills associés