remotion-render
Videos aus React/Remotion-Code rendern
Auch verfügbar von: inference-sh-6,inference-sh-7
Erstellen Sie professionelle Videos programmatisch aus React/Remotion TSX-Code. Übergeben Sie Komponenten-Code und erhalten Sie MP4-Ausgabe mit vollständiger Animationsunterstützung, einschließlich Springs, Sequenzen und Interpolation.
Die Skill-ZIP herunterladen
In Claude hochladen
Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen
Einschalten und loslegen
Teste es
Verwendung von "remotion-render". Rendern Sie ein Video mit einer hüpfenden Ball-Animation unter Verwendung von Spring-Physik
Erwartetes Ergebnis:
Ein 5-Sekunden-MP4-Video bei 60fps, das einen weißen Ball zeigt, der auf einem lila Hintergrund mit realistischer Spring-Physik hüpft
Verwendung von "remotion-render". Erstellen Sie eine animierte Titelkarte mit Unternehmens-Branding
Erwartetes Ergebnis:
Ein 3-Sekunden-Intro-Video mit Unternehmenslogo, das skaliert wird, Tagline, die eingeblendet wird, und sanfter Hintergrundgradient-Animation
Sicherheitsaudit
SicherAll static findings are false positives. The detected 'external_commands' patterns are markdown code fences in documentation, not actual shell execution. The 'pipe to shell' pattern is the standard documented install method for the inference.sh CLI with SHA-256 checksum verification. Network URLs are legitimate service integrations (inference.sh, remotion.dev). The skill makes API calls to inference.sh to render videos - this is intended functionality.
Risikofaktoren
🌐 Netzwerkzugriff (6)
Qualitätsbewertung
Was du bauen kannst
Datengesteuerte Marketing-Videos
Erstellen Sie personalisierte Videoinhalte aus Daten: dynamische Titel, animierte Counter, Produktpräsentationen
Entwickler-Tutorial-Animationen
Erstellen Sie Code-Tutorial-Videos mit animierter Syntaxhervorhebung, Code-Reveal-Effekten und dynamischen Diagrammen
Social-Media-Content-Automatisierung
Automatisieren Sie die Videoerstellung für soziale Plattformen mit benutzerdefinierten Animationen, Textüberlagerungen und Branding
Probiere diese Prompts
Rendern Sie ein Video mit ausblendendem Text 'Hello World' auf dunklem Hintergrund. Verwenden Sie 30fps, 3 Sekunden Dauer, 1920x1080 Auflösung.
Erstellen Sie eine Ladeanimation mit einem Counter, der von 0 auf 100% geht. Verwenden Sie Spring-Physik für sanfte Animation bei 60fps.
Erstellen Sie ein Video mit drei Textelementen, die nacheinander eingeblendet werden: 'First', 'Second', 'Third'. Jedes erscheint für 1 Sekunde.
Rendern Sie eine Balkendiagramm-Animation mit Datenwerten [{value: 30}, {value: 70}, {value: 50}]. Balken sollten von 0 auf ihre Werte animiert werden.Bewährte Verfahren
- Halten Sie Animationen unter 10 Sekunden für schnelleres Rendern
- Verwenden Sie Interpolation für sanfte Wertübergänge anstelle manueller Berechnungen
- Testen Sie den Code im Remotion Studio, bevor Sie ihn in der Produktion verwenden
- Übergeben Sie Props für dynamische Inhalte, anstatt Werte fest zu codieren
Vermeiden
- Vermeiden Sie komplexe 3D-Transformationen, die zusätzliche Bibliotheken erfordern
- Betten Sie keine großen base64-Bilder in den Code ein - verwenden Sie stattdessen externe URLs
- Vermeiden Sie das Rendern sehr langer Videos (>60 Sekunden) in einem einzigen Durchgang