Compétence Slice
Transformez un article, une note, un article universitaire ou un sujet brut en une vidéo verticale de cartes 1080×1920 — narrée, paginée au rythme de la TTS, avec 13 thèmes visuels couvrant 抖音 / 小红书 / 知乎 / X / 公众号 / 飞书 / TikTok / LinkedIn / 雪球 / 微博 / 即刻 / B 站 / 播客.
Renommé de
paper-slide→slice. Le produit s'appelle désormais Slice (voxflow.studio/apps/slice) ; l'ancien identifiant n'est plus enregistré.paper-slidene subsiste que comme l'un des 13 identifiants de thème.
Choisir la Route
| Contexte | Route | Notes |
|---|---|---|
| L'utilisateur souhaite le JSON du deck (sans rendu) — rapide, scriptable, pilotable par pipeline | CLI : voxflow slice <fichier.md> --theme <id> | Appelle /api/slice/deck directement (quota de 200 ; renommé depuis /api/paper-slide/slice dans #3307 Déploiement 2). Renvoie le jeu de 5 à 8 cartes au format JSON canonique validé par le même backend que l'application web, tous les 13 thèmes sont acceptés. Pas de MP4 — pipez --json vers des outils personnalisés, la composition Remotion locale (contributeurs), ou collez-le dans l'application web pour le rendu. |
| L'utilisateur itère sur un deck — modifications multi-tours du texte / de la structure avant de s'engager dans un rendu | CLI : voxflow slice stage <deck.json> | Démarre une page de prévisualisation locale (sans coût de quota) qui se recharge à chaud à chaque sauvegarde du JSON du deck. Boucle utile : voxflow slice ... -o deck.json → voxflow slice stage deck.json → modifier la consigne → relancer slice → la prévisualisation se met à jour instantanément. Voir Route Stage ci-dessous. |
| L'utilisateur souhaite un MP4 final + couverture (flux consommateur par défaut) | Application web : https://voxflow.studio/apps/slice | Le seul endroit qui exécute les exacts 6 thèmes Slice de bout en bout. Le niveau gratuit produit un MP4 9:16 + couverture multi-aspect (9:16/3:4/1:1). |
L'utilisateur souhaite une vidéo d'apparence similaire hors ligne via CLI mais le voxflow slice (deck uniquement) ne suffit pas | voxflow present ou voxflow picstory --style sketchnote | Approximation uniquement. Schémas visuels différents ; impossible de produire les thèmes editorial-mag / notion-card / brutalist / glass-dark de Slice. Voir Approximation CLI ci-dessous. |
Le dépôt local contient video-present/src/compositions/PaperSlide (contributeurs VoxFlow uniquement) | Script d'expérimentation Remotion local | Voir Route Remotion Locale. Remarque : le script d'expérimentation n'exerce que la composition paper-slide d'origine ; les 12 autres thèmes sont rendus uniquement via le worker cloud. |
| L'utilisateur ne souhaite que la stratégie ou le texte | Produire le JSON du deck via voxflow slice (ou à la main en suivant le schéma) ; leur indiquer quel moteur de rendu utiliser. | Le schéma du deck est indépendant du moteur de rendu ; le même JSON se rend dans n'importe quel thème. |
| L'utilisateur demande d'ouvrir le code source / de le distribuer | Gardez les API privées, les jetons, l'audio généré et les sorties MP4 en dehors du package de compétence. |
Flux de Travail
- Choisissez un thème qui correspond à la plateforme. Lisez
references/themes.mdune fois — il liste les 13 thèmes, leur signature visuelle, et la plateforme / type de contenu auquel chacun correspond. Ne vous rabattez pas surpaper-slidepour tout. - Choisissez un scénario. Un cas d'usage concret vaut mieux qu'un contenu générique : résumé d'article, mise à jour produit, compte-rendu de réunion, conseil de carrière, leçon de fondateur, commentaire de marché, revue d'incident.
- Rédigez un deck serré. 4 à 6 cartes : un titre + 3 à 5 corps. Une idée par carte de corps. Légendes suffisamment courtes pour tenir sur une ligne.
- Choisissez les visuels parmi des mots-clés contrôlés. Ne cherchez pas sur le web et ne générez pas d'images aléatoires au moment du rendu — choisissez un
figureKeywordcanonique ; le moteur de rendu le mappe sur une scène / pose / icône dessinée à la main locale. (Voirreferences/deck-schema.md.) - Effectuez le rendu via la route choisie. Application web pour les thèmes exacts ; CLI pour l'approximation ; script local pour les contributeurs.
- Vérifiez l'artefact. Vérifiez la durée, les dimensions (1080×1920), et au moins une image titre + une image corps avant de signaler la fin.
- Rapportez les chemins. Chemins absolus vers le MP4 / affiches / accessoires.
Lisez references/deck-schema.md lors de l'écriture du JSON du deck, du choix des mots-clés ou du débogage de la mise en page. Lisez references/example-decks.md pour des decks de départ. Lisez references/themes.md lors du choix d'un thème ou de l'explication des compromis entre thèmes.
Route Application Web (par défaut — fonctionne pour tout le monde)
https://voxflow.studio/apps/slice
Flux de travail :
- Collez l'article / la note dans le compositeur principal.
- L'IA le découpe en 5 à 8 cartes.
- Choisissez un thème (13 options — voir
references/themes.md) + une voix (6 voix de production : 男主播 / 霸总男声 / 闲聊男声 / 小美 / 小心 / 小徐). - Rendu → MP4 1080×1920 + couverture multi-aspect (9:16 / 3:4 / 1:1).
Dites à l'utilisateur qu'il s'agit de la seule route qui produit le rendu Slice exact pour les 13 thèmes — ce sont des compositions Remotion privées, non expédiées avec la CLI.
Route CLI Deck (voxflow slice)
Pour les utilisateurs qui souhaitent le JSON structuré du deck sans le rendu — rapide (un aller-retour, quota 200), pilotable par pipeline, conscient du thème. Il appelle le même backend /api/slice/deck que l'application web, donc la forme du deck est canonique.
voxflow slice article.md # thème par défaut : paper-slide
voxflow slice article.md --theme editorial-mag -o deck.json
voxflow slice --text "long article ..." --theme bold-poster --json | jq .deck
Quand utiliser cette route :
- L'utilisateur souhaite inspecter / itérer sur la qualité du découpage de l'IA avant de s'engager dans un rendu.
- L'utilisateur souhaite coller le deck dans le flux "importer un deck" de l'application web pour le rendre avec un thème différent.
- L'utilisateur est un contributeur avec la composition Remotion
video-present/src/compositions/PaperSlideprivée et souhaite effectuer le rendu du deck localement —voxflow slice ... --json -o props.jsonpuis alimenterprops.jsondans le script d'expérimentation. - L'utilisateur construit une automatisation qui nécessite une sortie structurée (par exemple, publier des cartes de connaissances sous forme de texte sur Twitter / 即刻 à partir de
deck.cards[*].caption + narration).
Limites :
- Pas de MP4. Le moteur de rendu cloud qui produit la vidéo 1080×1920 se trouve dans l'application web.
- Pas de TTS. Associez
voxflow sliceavecvoxflow narratesi vous souhaitez un audio par carte sans rendu.
Route Stage — voxflow slice stage (prévisualisation d'itération)
Pour la phase d'itération humaine dans la boucle avant de s'engager dans un rendu cloud. Stage démarre un serveur HTTP local avec rechargement à chaud — chaque sauvegarde du JSON du deck met à jour la page instantanément. Aucun coût de quota, aucun aller-retour réseau.
voxflow slice deck.md -o deck.json # 1. produire un deck (quota 200)
voxflow slice stage deck.json # 2. ouvrir la prévisualisation locale (gratuite)
# 3. modifier deck.json à la main ou relancer slice
# 4. la prévisualisation se recharge à chaud à la sauvegarde
Vous voulez un démarrage sans quota, sans connexion ? Utilisez directement l'exemple fourni :
voxflow slice stage examples/11-slice-stage/sample-deck.json
Drapeaux :
voxflow slice stage <deck.json> [--port <n>] [--theme <id>] [--no-open]
--port Par défaut 5180. Saute automatiquement +1 jusqu'à 5189 en cas de conflit.
--theme Verrouille la prévisualisation sur un thème (doit être l'un des 13 identifiants valides).
--no-open Ne lance pas automatiquement le navigateur (environnements CI / SSH / agent).
Quand utiliser Stage :
- L'utilisateur est dans une boucle d'édition multi-tours — modifications de copie, réorganisation des cartes, test A/B de thème — et rouvrir le MP4 à chaque itération est une friction coûteuse.
- L'utilisateur souhaite publier des cartes individuelles sous forme de texte brut sur des plateformes axées sur le texte (X / Twitter / 即刻 / Threads / Mastodon / commentaires de blog). Stage fournit à chaque carte un bouton "Copier le texte" (titre + légende + narration), et la barre d'outils du deck offre "Copier JSON / Télécharger .json / Copier en Markdown" pour le collage dans Notion / blog / 飞书. Les exports d'images / carrousels pour 小红书 / 微博 / 公众号 头图 arriveront dans une phase future une fois que les images fixes par carte seront disponibles.
- Boucles pilotées par IA où l'agent régénère
deck.jsonet l'humain révise via le navigateur — la page se met à jour sans que l'agent ait à réimprimer les chemins.
Utilitaires d'exportation de texte (Phase 1.4 texte uniquement)
L'interface utilisateur de Stage intègre des contrôles d'exportation axés sur le texte afin que les cartes puissent être réutilisées sur des plateformes de texte uniquement sans payer un rendu complet :
- "Copier le texte" par carte — cliquez sur le petit bouton sur n'importe quelle carte → le presse-papiers obtient
{titre}\n\n{légende (si distincte)}\n\n{narration}(tronqué). Déposez-le dans un tweet, un post 即刻, un extrait de blog. - Barre d'outils du deck — "Copier JSON" — copie l'intégralité du JSON du deck dans le presse-papiers (pour le pipeline vers des outils personnalisés / le partage avec un autre agent / la sauvegarde d'un instantané).
- Barre d'outils du deck — "Télécharger .json" — enregistre le deck sous
<titreSerie>.json(nom de fichier automatiquement assaini, limité à 60 caractères +.json). - Barre d'outils du deck — "Copier en Markdown" — formate l'intégralité du deck en Markdown (H1 = titreSerie, H2 par carte, narration en bloc de citation). Collez-le dans Notion / éditeur de blog / docs 飞书.
Les formateurs vivent dans lib/stage-core/deck-format.js (formatCardAsText, formatDeckAsMarkdown, suggestDeckFilename) et sont testés unitairement dans tests/deck-format.test.js. Leur source est transformée en chaîne dans le HTML servi via Function.prototype.toString() afin que le navigateur exécute le même code que les tests couvrent — une seule source de vérité, pas de double maintenance.
Les exports d'images / carrousels MP4 pour 小红书 / 微博 / 公众号 头图 ne sont PAS dans la Phase 1.4 texte uniquement. Ceux-ci arriveront dans une phase future une fois que les miniatures renderStill par carte seront disponibles (elles nécessitent un point de terminaison backend Remotion qui n'existe pas encore).
Ce que Stage n'est PAS :
- Pas encore un aperçu Remotion complet. Le MVP montre la structure du deck (cartes + JSON) ; les miniatures de thème rendues sur le cloud arrivent dans la Phase 1.3 via
renderStill. - Pas un substitut aux pixels du rendu final — les thèmes sont des compositions côté serveur. Stage prévisualise le texte du deck, pas les images vidéo finales.
Boucle d'édition avec l'IA (le flux de travail d'itération réel)
Stage n'essaie pas d'être Cursor — c'est un fermeur de boucle de feedback visuel qui transmet les consignes à l'outil d'IA que l'utilisateur a déjà ouvert (Claude Code, Cursor, ChatGPT, n'importe lequel). Deux éléments couvrent l'intégralité de la boucle d'édition :
| Intention | UX | Sortie |
|---|---|---|
| Réécriture complète d'une carte ("régénère cette carte, garde le reste") | Survolez la carte → bouton d'angle Modifier avec l'IA | Fenêtre modale avec une consigne : chemin du fichier + extrait JSON cards[N] + emplacement <votre instruction> |
| Réécriture locale d'une phrase ("juste cette phrase est incorrecte") | Sélectionnez du texte dans une carte → bouton flottant Modifier la sélection avec l'IA apparaît | Fenêtre modale avec une consigne : chemin du fichier + la sous-chaîne sélectionnée exacte entre guillemets + le JSON complet de la carte pour le contexte |
L'utilisateur tape l'instruction (par exemple "raccourcir à 12 caractères, plus viscéral"), clique sur Copier la consigne, la colle dans son IA. L'IA utilise ses outils d'édition de fichiers natifs (Edit de Claude Code, Apply de Cursor, etc.) pour réécrire le fichier. Le watcher SSE de Stage recharge à chaud la prévisualisation en ~150 ms. Bouclez jusqu'à satisfaction.
Pourquoi cette conception et non un chat intégré / serveur MCP : voir #3330 pour la justification complète de la conception (copier-coller universel vs MCP réservé à Claude Code, compromis coût vs couverture, future voie de mise à niveau MCP conditionnelle à la télémétrie d'utilisation).
Route d'Approximation CLI (solution de repli MP4 complet)
Si l'utilisateur doit avoir un MP4 à partir de la CLI uniquement (pas d'application web, pas d'accès contributeur Remotion), utilisez voxflow present ou voxflow picstory en solution de repli — ils couvrent la même forme article-vers-vidéo mais avec leurs propres schémas visuels, pas les 13 thèmes Slice exacts.
voxflow present --text "collez l'article ou le résumé" --style editorial --output slice-approx.mp4
voxflow picstory --topic "sujet" --style sketchnote --scenes 4 --output slice-sketch.mp4
Schéma CLI le plus proche par thème Slice :
| Thème Slice | Route CLI la plus proche |
|---|---|
| paper-slide | voxflow picstory --style sketchnote |
| editorial-mag | voxflow present --style editorial |
| bold-poster | voxflow present --style brutalist (poids le plus proche) |
| notion-card | voxflow present --style minimal |
| brutalist | voxflow present --style brutalist |
| glass-dark | voxflow present --style noir ou --style aurora |
| editorial-stencil | voxflow present --style editorial (pas d'équivalent letterbox / dual-tone) |
| broadsheet | voxflow present --style editorial (pas de palette saumon FT) |
| blueprint | voxflow picstory --style chalkboard (sensation de grille/diagramme la plus proche) |
| daisy-pastel | voxflow picstory --style sketchnote (pas d'équivalent d'illustration pastel) |
| showa-catalog | voxflow picstory --style vintage_newspaper (pas d'équivalent city-pop) |
| photo-feature | voxflow picstory --style photo (photo-feature nécessite imageUrl par carte — voir deck-schema) |
| atmospheric | voxflow present --style noir |
Dites toujours à l'utilisateur : "Ceci est un brouillon adjacent à Slice. Le moteur de rendu exact des 13 thèmes se trouve sur voxflow.studio/apps/slice."
Route Remotion Locale (contributeurs uniquement)
Ignorer si video-present/src/compositions/PaperSlide n'est pas dans votre dépôt — c'est du code privé ; les utilisateurs npm / compétences ne l'ont pas.
Depuis la racine du dépôt contributeur :
cd video-present
node scripts/paper-slide-experiments.mjs
Effectuer le rendu d'un sous-ensemble :
cd video-present
PAPER_SLIDE_EXPERIMENT_FILTER=research-reading node scripts/paper-slide-experiments.mjs
Vérifier les sorties :
ffprobe -v error -select_streams v:0 \
-show_entries stream=width,height,duration \
-of default=nw=1 out/paper-slide-experiments/research-reading.mp4
ffmpeg -y -hide_banner -loglevel error -ss 9 \
-i out/paper-slide-experiments/research-reading.mp4 \
-frames:v 1 -q:v 2 out/paper-slide-experiments/research-reading-body.jpg
Attendu : 1080×1920, 20-35 secondes, pas de flashs noirs, pas de débordement de légende, figure non rognée.
Règles d'Écriture des Decks (s'appliquent à tous les 13 thèmes)
- Carte titre : accroche, contraste ou promesse. Évitez les étiquettes abstraites comme "Introduction".
- Carte corps : une seule idée. Légende généralement inférieure à 16 caractères chinois ou 7 mots anglais.
- Narration : conversationnelle, 25-60 caractères chinois par carte corps.
- Mots-clés de scène (préférez-les lorsqu'ils conviennent) :
problem-framing,evidence-board,customer-pain,timeline-review,owner-deadline,risk-guardrail,cashflow-ledger,team-alignment,before-after,learning-loop,decision-fork,growth-system. - Mots-clés de figure / icône (accents visuels) :
thinking,running,climbing,stuck,celebrating,briefcase,users,target,clock,
…
[ tronqué pour la traduction ]