Remotion Interactivity
Guidance for structuring Remotion markup so the video stays editable in Remotion Studio: build scenes around what the user should be able to select, move, trim or style independently
- What
- Guidance for structuring Remotion markup so the video stays editable in Remotion Studio: build scenes around what the user should be able to select, move, trim or style independently
- Cost
- Free
- Needs
- Before you start: read this whole install prompt, tell me in a few lines what this skill does and what installing it involves, and wait for my go-ahead before you do anything else.
- Install
- Copy the installer prompt below into your Muse — your agent does the rest.
Curated by Skill Harbor — Guidance for structuring Remotion markup so the video stays editable in Remotion Studio: build scenes around what the user should be able to select, move, trim or style independently, expose editable values as schema fields on each instance, turn elements interactive with the Interactive components, keep text, styles, animations (inline interpolate() calls) and composition metadata inline so Studio can read them back and write edits to code, and make SVG paths editable with Interactive.Path from @remotion/paths. Two companion files cover editable timeline structure and inline effects. It is knowledge applied to the user's own Remotion code; no licence was found anywhere in the upstream repository at the pinned commit — see the licence note on this listing. By @remotion-dev, listed here with credit to its creator. Skill Harbor never reviews the code, review it yourself before use.
Version:
Install
Copy the install package below, then paste it into Muse📌 Pinned version: commit 6c67adcBefore you start: read this whole install prompt, tell me in a few lines what this skill does and what installing it involves, and wait for my go-ahead before you do anything else. Prerequisites — None to install this skill — no account, no key, no payment, and no executable code in its folder. It is knowledge for structuring my own Remotion markup for Studio interactivity; the only package it names, @remotion/paths for editable SVG paths, is added to my project at use time only. No licence was found anywhere in the upstream repository at the pinned commit, so no licence terms are stated for it. Install "Remotion Interactivity" for me. It teaches the agent to write Remotion markup that Remotion Studio can edit: structure each scene around independently editable units, give every schema key a default and a description so Studio shows it as a control, use Interactive components (including Interactive.Path from @remotion/paths for editable SVG paths and path keyframes), prefer inline text, inline styles and inline interpolate() animations over constants, spreads and extracted variables — because Studio can only read and keyframe what is written inline — and keep composition metadata inline on the <Composition> element. Its folder holds the main SKILL.md (frontmatter name remotion-interactivity), timeline-structure.md on editable timeline structure, inline-effects.md on keeping effects inline, its agents/openai.yaml policy file and its icon. Repository: https://github.com/remotion-dev/skills (the skill is the whole skills/remotion-interactivity/ folder at the pinned commit: SKILL.md plus 4 companion files, 5 files in total) Pinned version: install the code at commit 6c67adcd9cdbe6eb84d76342da89b225f9161cb2 exactly. Do not substitute a newer version. If this commit is unreachable, stop and tell me. 1. Clone https://github.com/remotion-dev/skills into a temporary folder, check out commit 6c67adcd9cdbe6eb84d76342da89b225f9161cb2, and copy the skills/remotion-interactivity/ folder from that checkout. Then compare every file in the folder with the fingerprints recorded for this listing on 2026-10-22: [FINGERPRINTS] - SKILL.md: SHA-256 17effa2e5c589391fd113e8c52b6e531f64dd350a069d69286ff1da9d1ccdedf - agents/openai.yaml: SHA-256 84cd86b0b10e1f8b5be97bbd46677d5f618304303d922f1016ce0ea6a015d4b9 - assets/remotion-icon.svg: SHA-256 5007669bd0555b0f4565b4e7176fa191310ab0039b2ed09d867a9270f5b0ce58 - inline-effects.md: SHA-256 e2204691164855f195ffefc88706785089153a1e97dae06781841575892a30a6 - timeline-structure.md: SHA-256 7edab50c1c594100a2512baf34483d8407c25df37234b0d36c18ad1d256b391b If a file does not match, it changed since the listing was prepared: do not install it yet, tell me what you found and let me decide. 2. Read SKILL.md in full, and tell me in plain words: what the skill does when used, what it connects to, whether it reads or sends any personal information or credentials, and anything that seems unusual. Stop on any red flag and tell me before going further. Confirm these points from the files: - The skill folder holds 5 files and no executable code: SKILL.md (frontmatter name remotion-interactivity), timeline-structure.md, inline-effects.md, agents/openai.yaml and the assets icon (an SVG file). - Nothing is sent anywhere during installation itself; the only download at install time is the skill folder from GitHub at the pinned commit. None of my project files are read or changed during installation. - At use time the agent only applies this knowledge while writing or refactoring my own Remotion markup locally, so that Studio can select, edit and write back the values; the one package it names, @remotion/paths, is added to my project only at use time. No credentials are read and nothing is sent anywhere. - The licence point from the prerequisites is part of the picture: no licence was found anywhere in the upstream repository at the pinned commit, so do not present this skill as MIT, Apache or open source. - Do not restructure any composition, add any package, open Studio, and do not use the skill in any way during this install: using it is a separate step that only starts when I ask for Remotion interactivity work later. 3. When I say "yes, install", install it as a skill: copy the whole remotion-interactivity folder into the agent's skills directory, in a folder named exactly "remotion-interactivity", keeping its 5 files in their original relative layout (SKILL.md at its root). 4. Verify with no network calls: frontmatter valid (name: remotion-interactivity), the 5 files in place with matching fingerprints. Do not run anything from the folder and do not use the skill to verify. 5. Report what was installed, where, and what I still need to do myself (for example: that no licence was found in the upstream repository, that it is knowledge-only for my own Remotion markup, and that using it is a separate step that only starts when I ask for interactivity work). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me.
Saved to your recent installs. Find it anytime on /connect.
🔒 Security, provenance and what this touches
The install prompt below already includes the vetting steps: your agent follows the community checklist before installing anything with executable code. Want more?
Questions
How do I install a build?
Every product page includes a copy-paste install prompt. Paste it into your Muse and it sets the build up for you — no manual configuration.
Where does my money go?
Straight to the seller. Skill Harbor never processes payments: checkout happens on the seller’s own page, usually Stripe.
What does the ✓ next to a creator’s name mean?
It means we confirmed the identity of the person behind the listing. It says nothing about the code itself — always check a build before installing it.