remotion-script-writer

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

When to use

使用场景

Use this skill whenever you need to generate a comprehensive video script for creating a Remotion video. This skill is particularly useful for:
  • Product demo videos that showcase features of a web application or software product
  • Coding tutorials that explain a codebase or specific technical concepts with animated code
  • Animated videos with complex sequences, transitions, and visual effects
  • Data visualization videos that present statistics, charts, and dynamic data
  • Social media content with captions, effects, and platform-specific optimizations
This skill analyzes your codebase, understands your requirements, and generates a detailed JSON script that can be directly used by Remotion's agent skills to create the final video.
每当你需要生成用于创建Remotion视频的完整视频脚本时,即可使用此技能。该技能尤其适用于:
  • 产品演示视频:展示Web应用或软件产品的功能
  • 编程教程视频:通过代码动画解释代码库或特定技术概念
  • 复杂动画视频:包含复杂序列、转场和视觉效果的动画视频
  • 数据可视化视频:呈现统计数据、图表和动态数据的视频
  • 社交媒体内容:带字幕、特效且针对平台优化的内容
此技能会分析你的代码库,理解你的需求,并生成可直接被Remotion的Agent技能用于创建最终视频的详细JSON脚本。

How to use

使用方法

Read individual rule files for detailed explanations and examples:
  • rules/prompt-structure.md - Defines the input structure and requirements for the skill
  • rules/script-generation.md - The core prompt for generating detailed video scripts
  • rules/animation-patterns.md - Common animation patterns and timing guidelines
  • rules/scene-templates.md - Reusable scene templates for common video scenarios
阅读单个规则文件以获取详细说明和示例:
  • rules/prompt-structure.md - 定义技能的输入结构和要求
  • rules/script-generation.md - 生成详细视频脚本的核心提示词
  • rules/animation-patterns.md - 常见动画模式和时间指南
  • rules/scene-templates.md - 适用于常见视频场景的可复用场景模板

Quick Start

快速开始

1. Prepare Your Input

1. 准备输入内容

Create a JSON object with your video requirements:
json
{
  "goal": "Create a product demo video for our new task management app",
  "targetAudience": "Project managers and teams looking for productivity tools",
  "code": "/path/to/your/codebase",
  "language": "TypeScript",
  "videoType": "product-demo",
  "duration": 60,
  "style": "modern",
  "animations": ["fade", "slide", "typewriter"],
  "transitions": ["wipe", "fade"]
}
创建包含你的视频需求的JSON对象:
json
{
  "goal": "Create a product demo video for our new task management app",
  "targetAudience": "Project managers and teams looking for productivity tools",
  "code": "/path/to/your/codebase",
  "language": "TypeScript",
  "videoType": "product-demo",
  "duration": 60,
  "style": "modern",
  "animations": ["fade", "slide", "typewriter"],
  "transitions": ["wipe", "fade"]
}

2. Generate the Script

2. 生成脚本

Pass your input to the
remotion-script-writer
skill. The skill will:
  1. Analyze your codebase to identify key features and functionality
  2. Structure the video into logical scenes with appropriate timing
  3. Design visual elements, animations, and transitions for each scene
  4. Generate voiceover scripts synchronized with visuals
  5. List all required assets (images, fonts, audio, etc.)
  6. Specify technical requirements (Remotion packages, libraries)
将你的输入传递给
remotion-script-writer
技能。该技能会:
  1. 分析你的代码库,识别关键功能和特性
  2. 将视频结构化为具有合理时间安排的逻辑场景
  3. 为每个场景设计视觉元素、动画和转场效果
  4. 生成与视觉内容同步的旁白脚本
  5. 列出所有所需资源(图片、字体、音频等)
  6. 指定技术要求(Remotion包、库)

3. Use the Output

3. 使用输出结果

The skill generates a comprehensive JSON script that includes:
  • Video metadata: Title, duration, dimensions, fps, video type
  • Scene breakdown: Detailed specifications for each scene
  • Visual elements: Text, images, code, animations, transitions
  • Audio: Voiceover scripts and background music
  • Assets: Complete list of required images, fonts, icons, etc.
  • Technical requirements: Remotion packages and third-party libraries
该技能生成的完整JSON脚本包含:
  • 视频元数据:标题、时长、尺寸、帧率、视频类型
  • 场景细分:每个场景的详细规格
  • 视觉元素:文本、图片、代码、动画、转场
  • 音频:旁白脚本和背景音乐
  • 资源:所需图片、字体、图标等的完整列表
  • 技术要求:Remotion包和第三方库

4. Create the Video

4. 创建视频

Pass the generated script to Remotion's agent skills to:
  1. Generate React components for each scene
  2. Implement animations and transitions
  3. Set up the composition structure
  4. Preview the video in Remotion Studio
  5. Render the final video
将生成的脚本传递给Remotion的Agent技能,以:
  1. 为每个场景生成React组件
  2. 实现动画和转场效果
  3. 设置合成结构
  4. 在Remotion Studio中预览视频
  5. 渲染最终视频

Example Output

示例输出

See examples/product-demo-example.json for a complete example of a generated video script.
查看examples/product-demo-example.json,获取生成的视频脚本完整示例。

Supported Video Types

支持的视频类型

  • product-demo
    : Feature showcases, UI walkthroughs, product announcements
  • coding-tutorial
    : Code explanations, technical concepts, programming tutorials
  • animation
    : Creative animations, motion graphics, visual effects
  • data-visualization
    : Charts, graphs, statistics, animated data
  • social-media
    : Short-form content, viral videos, platform-optimized content
  • product-demo
    :功能展示、UI导览、产品发布
  • coding-tutorial
    :代码讲解、技术概念、编程教程
  • animation
    :创意动画、动态图形、视觉特效
  • data-visualization
    :图表、图形、统计数据、动态数据可视化
  • social-media
    :短视频内容、爆款视频、平台优化内容

Best Practices

最佳实践

The skill incorporates Remotion best practices:
  • All animations use
    useCurrentFrame()
    hook for frame-based timing
  • Spring animations with natural motion (
    damping: 200
    ) for smooth reveals
  • Proper sequencing with
    <Sequence>
    ,
    <Series>
    , and
    <TransitionSeries>
  • Typewriter effects using string slicing (not per-character opacity)
  • Deterministic animations (no
    Math.random()
    , use
    random()
    from remotion)
  • Premounting sequences with
    premountFor
    prop for better performance
  • Accurate duration calculation accounting for transition overlaps
该技能融入了Remotion的最佳实践:
  • 所有动画使用
    useCurrentFrame()
    钩子实现基于帧的时间控制
  • 使用自然运动的弹簧动画(
    damping: 200
    )实现平滑展示
  • 使用
    <Sequence>
    <Series>
    <TransitionSeries>
    实现合理的序列编排
  • 使用字符串切片实现打字机效果(而非逐字符透明度控制)
  • 确定性动画(不使用
    Math.random()
    ,使用Remotion提供的
    random()
  • 使用
    premountFor
    属性预加载序列以提升性能
  • 准确计算时长,考虑转场重叠时间

Customization

自定义

Modify the rule files to customize the skill:
  • prompt-structure.md
    : Add new input fields or validation rules
  • script-generation.md
    : Adjust the generation prompt or output format
  • animation-patterns.md
    : Add custom animation patterns and effects
  • scene-templates.md
    : Create new scene templates for specific use cases
修改规则文件以自定义技能:
  • prompt-structure.md
    :添加新的输入字段或验证规则
  • script-generation.md
    :调整生成提示词或输出格式
  • animation-patterns.md
    :添加自定义动画模式和效果
  • scene-templates.md
    :为特定使用场景创建新的场景模板

Advanced Features

高级功能

Codebase Analysis

代码库分析

The skill can analyze codebases from:
  • Local file paths
  • GitHub repositories (public or private)
  • Code snippets provided directly
It identifies:
  • Key functions and components
  • Data structures and APIs
  • User interactions and workflows
  • Technical architecture and patterns
该技能可分析来自以下来源的代码库:
  • 本地文件路径
  • GitHub仓库(公开或私有)
  • 直接提供的代码片段
它能识别:
  • 关键函数和组件
  • 数据结构和API
  • 用户交互和工作流程
  • 技术架构和模式

Dynamic Content

动态内容

Generate scripts with dynamic content:
  • Fetch data from APIs for real-time information
  • Calculate video duration based on content length
  • Adjust scene timing based on voiceover length
  • Parameterize content for multiple video variations
生成包含动态内容的脚本:
  • 从API获取数据以展示实时信息
  • 根据内容长度计算视频时长
  • 根据旁白长度调整场景时间
  • 为多个视频变体参数化内容

Branding Integration

品牌整合

Apply consistent branding:
  • Custom color schemes
  • Company logos and icons
  • Brand-specific fonts
  • Visual style guidelines
应用统一的品牌风格:
  • 自定义配色方案
  • 公司标志和图标
  • 品牌专属字体
  • 视觉风格指南

Limitations

局限性

  • Maximum recommended video duration: 5 minutes (for performance)
  • Code analysis works best with well-documented, structured code
  • Voiceover scripts are auto-generated and may require manual refinement
  • Asset generation (images, icons) is not included - assets must be provided or described
  • Complex 3D animations may require additional manual setup
  • 建议的最大视频时长:5分钟(考虑性能)
  • 代码分析在处理文档完善、结构清晰的代码时效果最佳
  • 旁白脚本为自动生成,可能需要手动调整
  • 不包含资源生成(图片、图标等)- 资源需自行提供或描述
  • 复杂3D动画可能需要额外的手动设置

Support

支持

For questions, issues, or feature requests:
  • Consult the README.md for detailed documentation
  • Check the examples directory for sample scripts
  • Visit remotion.dev for Remotion documentation
  • Join the Remotion Discord community for help and discussions
如有疑问、问题或功能请求:
  • 查阅README.md获取详细文档
  • 查看examples目录获取示例脚本
  • 访问remotion.dev获取Remotion官方文档
  • 加入Remotion Discord社区获取帮助和交流

Version

版本

Version: 1.0.0
Last Updated: January 2026
Created by: Manus AI
版本:1.0.0
最后更新:2026年1月
创建者:Manus AI