Skills remotion

📦

remotion

Name: remotion
Author: google-labs-code

Low Risk 📁 Filesystem access⚙️ External commands🌐 Network access⚡ Contains scripts

Create Remotion walkthrough videos from Stitch screens

Teams need fast, consistent walkthrough videos for app screens, but manual editing is slow. This skill automates screen retrieval and Remotion composition to produce ready to render videos with transitions and overlays.

Supports: Claude Codex Code(CC)

🥉 75 Bronze

Download the skill ZIP

Upload in Claude

Go to Settings → Capabilities → Skills → Upload skill

Toggle on and start using

Test it

Using "remotion". Create a walkthrough for the Calculator App project.

Expected outcome:

Outlined the steps to fetch Stitch screens and download assets.
Specified the screen manifest fields and timing plan.
Described the Remotion components to create and how to preview.

Using "remotion". Render a release highlight video with slide transitions.

Expected outcome:

Delivered a rendering checklist, recommended transition settings, and the expected output filenames.

Security Audit

Low Risk

v1 • 2/12/2026

Static analysis flagged weak cryptography and backtick execution patterns, but review shows these are documentation or template literals with no cryptographic use or runtime command execution. A helper script downloads assets with curl and writes to a user provided path, which is expected but implies network and filesystem activity.

Files scanned

924

Lines analyzed

findings

Total audits

Low Risk Issues (4)

examples/screens.json:15 examples/screens.json:26 examples/screens.json:37 examples/screens.json:48 examples/WalkthroughComposition.tsx:42 README.md:3 README.md:7 README.md:9 README.md:10 README.md:96 README.md:97 resources/composition-checklist.md:15 resources/composition-checklist.md:42 resources/screen-slide-template.tsx:7 resources/screen-slide-template.tsx:15 resources/screen-slide-template.tsx:108 resources/screen-slide-template.tsx:117 SKILL.md:3 SKILL.md:15 SKILL.md:27 SKILL.md:60 SKILL.md:93 SKILL.md:131 SKILL.md:151 SKILL.md:160 SKILL.md:265 SKILL.md:336

Weak cryptography false positive in documentation

Flagged lines are descriptive text or JSON fields and do not call cryptographic APIs. No hashing or encryption logic is present.

examples/WalkthroughComposition.tsx:7

Path traversal false positive in local import

The relative import of ../screens.json is static and not built from user input, so it does not enable path traversal.

README.md:45-53 resources/composition-checklist.md:8-10 resources/composition-checklist.md:70 resources/composition-checklist.md:116 resources/screen-slide-template.tsx:67 SKILL.md:37-64 SKILL.md:74-85 SKILL.md:112-119 SKILL.md:144-168 SKILL.md:198-200 SKILL.md:217-228 SKILL.md:236-259 SKILL.md:306-308 SKILL.md:362-375

Command examples in documentation

Backticks appear in markdown code examples and template literals. These are not executed by the skill runtime.

scripts/download-stitch-asset.sh:4-25 scripts/download-stitch-asset.sh:31-32

Helper script downloads remote assets

The download script uses curl to fetch a URL and write to a provided path. This is expected for asset retrieval but implies network and filesystem activity.

Risk Factors

📁 Filesystem access (4)

examples/WalkthroughComposition.tsx:7 scripts/download-stitch-asset.sh:31 scripts/download-stitch-asset.sh:32 scripts/download-stitch-asset.sh:32

⚙️ External commands (98)

🌐 Network access (8)

scripts/download-stitch-asset.sh:4 scripts/download-stitch-asset.sh:10 SKILL.md:306 SKILL.md:389 SKILL.md:390 SKILL.md:391 SKILL.md:392 SKILL.md:393

⚡ Contains scripts (1)

scripts/download-stitch-asset.sh:1

Audited by: codex

Quality Score

Architecture

100

Maintainability

Content

Community

Security

Spec Compliance

What You Can Build

Produce a product walkthrough video

Generate a narrated screen-by-screen video to explain an app flow.

Create a design review demo

Compile Stitch screens into a timed walkthrough for stakeholder review.

Ship a release highlight clip

Render a short video that showcases new features with callouts.

Try These Prompts

Build a basic walkthrough

Create a Remotion walkthrough video for my Stitch project and include fade transitions and screen titles.

Tune timing and transitions

Adjust the composition so each screen shows for 4 seconds and use slide transitions between major steps.

Add text callouts from HTML

Extract key labels from Stitch HTML and add timed callouts to each screen.

Render deliverables

Render the walkthrough to MP4 and WebM formats and summarize the output locations.

Best Practices

Keep screen metadata aligned with actual image dimensions.
Preview in Remotion Studio before final rendering.
Store assets in a dedicated public folder with stable paths.

Avoid

Do not reference missing or moved asset paths in the manifest.
Do not mix screen sizes without explicit scaling rules.
Do not render without verifying timing and transition pacing.

Frequently Asked Questions

What inputs do I need to start?

You need a Stitch project ID or name and access to Remotion tooling.

Can it work without the Remotion MCP server?

Yes, it can use the Remotion CLI if it is installed.

Does it download images automatically?

It can download screenshots when given Stitch download URLs.

Can I customize transitions and timing?

Yes, the manifest and composition settings control timing and effects.

Will it generate voiceovers?

No, it only outlines how to add voiceovers in Remotion.

What formats can I render?

It can guide rendering to common formats such as MP4 and WebM.

Developer Details

Author

google-labs-code

License

MIT

Repository

https://github.com/google-labs-code/stitch-skills/tree/main/skills/remotion/

Ref

main

File structure

📁 examples/

📄 screens.json

📄 WalkthroughComposition.tsx

📁 resources/

📄 composition-checklist.md

📄 screen-slide-template.tsx

📁 scripts/

📄 download-stitch-asset.sh

📄 README.md

📄 SKILL.md