Skillforge arrive bientôt sur mobile.

Ouvre le site sur un ordinateur ou une tablette pour parcourir les mods.

Mod · SKF/MOD.17-VS

Video Studio

Vidéos, diaporamas et animations en HTML avec HyperFrames, depuis Figma ou Remotion.

  • 7 skills : Vidéo et motion design
  • Claude, Gemini et Codex
  • Licences d'origine incluses

7 skills inclus

  • HyperFrames Video

    Fait créer, modifier et rendre des vidéos HyperFrames (HTML rendu image par image) par l'agent : contrat de rendu, projet éditable, boucle de travail.

    sf-hyperframes/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-hyperframes
    description: Read first to make, edit, animate or render any video with HyperFrames (HTML compositions render…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](references/plugin-in…
    # HyperFrames
    HyperFrames renders HTML to video by seeking a paused timeline frame by frame, so every render is identical;…
    ## When to use
    Any request to create, change or render a video. Related skills: `sf-hyperframes-cli` (every CLI command), `s…
    ## Setup

  • HyperFrames CLI

    Fait piloter à l'agent le CLI HyperFrames par tâche : vérifier, capturer des images, éditer la timeline, prévisualiser, rendre en local ou dans le cloud.

    sf-hyperframes-cli/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-hyperframes-cli
    description: Drives the HyperFrames CLI by job (scaffold, lint and check, snapshot frames, edit the timeline,…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](../sf-hyperframes/re…
    # HyperFrames CLI
    Run `npx hyperframes <command>` unless the project gives a wrapper; then use the wrapper. It needs Node.js 22…
    **Telemetry:** the CLI sends anonymous usage telemetry by default. Run it with `HYPERFRAMES_NO_TELEMETRY=1` u…
    ## Commands by job
    | Job | Commands |

  • HyperFrames Registry

    Fait chercher et installer par l'agent l'un des ~450 blocs et composants HyperFrames (transitions, titres, sous-titres, graphiques) avant de coder un effet.

    sf-hyperframes-registry/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-hyperframes-registry
    description: Finds and installs about 450 ready-made HyperFrames blocks and components as editable source (tr…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](../sf-hyperframes/re…
    # HyperFrames Registry
    Starting from an item is faster and usually better than writing the effect yourself, and an installed item is…
    ## Find and install
    ```bash
    npx hyperframes catalog --query "<what the beat should do, in English>" --json
    npx hyperframes add <name> --json # prints the written files and the mount snippet

  • Media for HyperFrames Video

    Fait trouver ou générer par l'agent musique, sons, images, logos, voix, avatars et étalonnages pour une vidéo HyperFrames, avec HeyGen ou des outils gratuits.

    sf-video-media/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-video-media
    description: Gets or makes any media for a HyperFrames video (music, sound effects, images, icons, logos, voi…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](../sf-hyperframes/re…
    # Media for HyperFrames
    Media lands as a local file in the project's `assets/` with a ledger record; renders never fetch. One verb fi…
    ```bash
    npx hyperframes media-use resolve --type <type> --intent "<what you need>" --project <dir>
    ```
    It prints one line, `resolved <id> → <path> (<type>, <metadata>)`. List reusable assets first with `--candida…

  • HyperFrames Slideshow

    Fait construire à l'agent une présentation HyperFrames jouée en direct : diapos, apparitions, hotspots, mode présentateur, ou portage d'une page existante.

    sf-video-slideshow/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-video-slideshow
    description: "Builds a HyperFrames slideshow to present live: slides, fragment reveals, branching hotspots an…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](../sf-hyperframes/re…
    # HyperFrames slideshow
    ## When to use
    A live deck rather than an MP4. For rendered videos use `sf-hyperframes`; for ready-made visuals search `sf-h…
    A slideshow is a normal composition (the `sf-hyperframes` contract applies) plus one JSON island that says wh…
    ## What changes from a video project

  • Figma to HyperFrames

    Fait importer par l'agent des éléments Figma dans une vidéo HyperFrames : assets, tokens de marque, composants éditables et storyboards animés.

    sf-figma-to-video/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-figma-to-video
    description: Brings Figma into a HyperFrames video as rendered assets, brand tokens, editable components, sto…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](../sf-hyperframes/re…
    # Figma → HyperFrames
    ## When to use
    Any Figma input to a HyperFrames project. Composition rules are in `sf-hyperframes`; other media in `sf-video…
    Every import happens at build time and freezes a local file with its source recorded under `.media/`, so rend…
    ## Access

  • Remotion to HyperFrames

    Fait porter par l'agent un projet Remotion ou une animation d'un autre outil vers HyperFrames, avec comparaison image par image contre l'original.

    sf-remotion-migration/SKILL.md, de heygen-com/hyperframes, licence Apache 2.0.

    ---
    name: sf-remotion-migration
    description: Brings existing video code or footage into HyperFrames and verifies it frame by frame against th…
    ---
    **Plugin installs:** before setup or freshness commands, follow [plugin execution rules](../sf-hyperframes/re…
    # Import into HyperFrames
    ## When to use
    Porting or reusing work from another tool. New videos from scratch go to `sf-hyperframes`.
    HyperFrames is the container: its tracks, sub-compositions and variables are editable in Studio whatever runs…
    | Level | For | How | Editable in Studio afterwards |

Extraits. Les dossiers complets sont livrés après le paiement.

Installation

Dézippe le dossier, ouvre un terminal dedans et lance bash install.sh : le script installe les skills pour Claude, Gemini et Codex, dans tous tes projets. Relance-le après une mise à jour, il remplace les anciennes versions sans rien dupliquer. Sur Windows, utilise Git Bash ou WSL.

Depuis Claude Code, sans ouvrir de terminal : lance Claude Code dans le dossier dézippé et demande-lui « installe ces skills ». Il exécute bash install.sh après ton accord. Les skills sont utilisables dans la session en cours ; si l'un n'apparaît pas, ouvre une nouvelle session. Un mod par dossier : refais la demande dans chaque dossier.

  • ClaudeSKILL.md

    bash install.sh claude copie chaque skill dans ~/.claude/skills/. Ajoute le dossier d'un projet à la fin de la commande pour l'installer dans ce projet seulement.

  • GeminiGEMINI.md

    bash install.sh gemini ajoute les skills à ~/.gemini/GEMINI.md, ou au GEMINI.md d'un projet si tu donnes son dossier.

  • CodexAGENTS.md

    bash install.sh codex ajoute les skills à ~/.codex/AGENTS.md, ou à l'AGENTS.md d'un projet si tu donnes son dossier.

  • Claude.aiclaude-ai/*.zip

    Dans Claude sur le web, l'app de bureau ou mobile, active d'abord l'exécution de code (Settings > Capabilities, « Code execution and file creation »). Puis Customize > Skills, bouton +, « Create skill », « Upload a skill », et choisis un fichier du dossier claude-ai/ de l'archive. Un zip contient un skill : importe-les un par un. Tous les plans y ont accès ; sur Team et Enterprise, l'exécution de code s'active dans les réglages de l'organisation.

  • Autres agentsAGENTS.md

    Cursor, GitHub Copilot et les autres agents qui lisent AGENTS.md : bash install.sh codex ~/mon-projet ajoute les skills à l’AGENTS.md de ton projet.

Autres mods