当前位置:首页>java>我用Remotion做了5个视频,用代码生成视频

我用Remotion做了5个视频,用代码生成视频

  • 2026-10-13 20:11:50
我用Remotion做了5个视频,用代码生成视频

最近在做一个产品项目的时候,接触到这个开源视频生成工具。

然后我为了给大家展示它的核心能力,我做了五个案例视频。

这样大家也许会有些灵感什么时候可以用它来做视频。

用编程工具或者一些agent都能做,我这个是在manus里面做的。

告诉它说用remotion框架制作视频,你把视频的要求和数据给到即可。

官网也有不少案例:

下面看看素人我做的一些案例:


Remotion:用代码写视频

Remotion 是一个革命性的视频制作框架,它的核心理念是:用 React 代码编写视频。

没错,就是那个你用来写网页的 React。

想象一下:

  • 视频的每一帧都是一个 React 组件
  • 动画效果用 CSS 和 JavaScript 控制
  • 数据驱动视频内容
  • 使用 Git 管理视频项目
  • 团队协作就像开发网页一样简单

听起来很酷?让我通过五个实际案例来展示 Remotion 能做什么。


我做的五个视频案例

 案例一:文字动画秀(15秒)

视频:01-文字动画.mp4

这是我做的第一个视频,用来展示丰富的文字动画效果:

  • 弹跳飞入
    :标题从下方飞入,带物理弹跳效果
  • 打字机效果
    :副标题逐字显示,配合光标闪烁
  • 旋转弹出
    :三个关键词依次弹出并旋转360度
  • 发光效果
    :全局放大并发光,营造高潮感
  • 音效同步
    :每个动画都配合精准的音效

案例二:产品展示视频(20秒)

 视频:02-产品展示.mp4

已关注
关注
重播 分享 赞

这个视频模拟了真实的产品推广场景:

  • 产品图片滑入
    :从左侧滑入并放大
  • 卖点卡片展示
    :三个卖点依次从右侧滑入
  • 价格增长动画
    :从0滚动到999
  • 优惠标签闪烁
    :吸引注意力
  • CTA按钮
    :带呼吸光晕效果

 案例三:数据可视化(18秒)

视频:03-数据可视化.mp4

已关注
关注
重播 分享 赞

这个视频展示了专业的数据可视化能力:

  • 数字增长动画
    :三个关键指标同时增长,带缓动效果
  • 柱状图
    :从底部增长到不同高度
  • 进度环
    :SVG 路径动画,从0%到85%
  • 庆祝效果
    :背景渐变色变化,营造氛围

数据驱动视频

最强大的地方在于:数据和视频完全分离。

const data = { sales: 1000000, orders: 5420, customers: 3280, };

修改数据,重新渲染,就是一个全新的视频。

 案例四:代码演示(15秒)

 视频:04-代码演示.mp4

已关注
关注
重播 分享 赞

这个视频展示了 Terminal 命令演示:

  • 打字机效果
    :命令逐字输入
  • 光标闪烁
    :模拟真实终端
  • 输出逐行显示
    :安装过程可视化
  • 打字音效
    :每个字符输入都有音效

技术教程的最佳伴侣如果你做技术教程,Remotion 可以帮你:• 自动生成代码演示视频• 精确控制每一帧的内容• 轻松修改和更新• 保持视觉风格统一

 案例五:AI大事件回顾(120秒)

视频:AI狂飙的一年-2025-2026全球AI大事件.mp4

已关注
关注
重播 分享 赞

这是从视频本身效果来看,不错的,120秒的AI大事件回顾视频,包含8个精彩章节,唯一欠缺的是内容还不够全面:

开场(8秒):标题爆炸式展开,地球旋转特效

第一章:中国突围(12秒):DeepSeek 600万美元成本革命

第二章:美国反击(20秒):5000亿美元三大计划

第三章:全球竞赛(25秒):欧盟、日本、韩国、中东布局

第四章:里程碑时刻(15秒):ChatGPT 10亿用户

第五章:AI投资狂潮(15秒):2.52万亿美元投资

第六章:未来展望(15秒):AI Agent、开源、安全

结尾(10秒):关键词云总结

视频亮点

1. 内容全面

  • DeepSeek 600万美元训练成本,媲美OpenAI o1
  • 美国星际之门计划:5000亿美元
  • ChatGPT突破10亿用户(2025年7月)
  • 中国算力平台贯通:1085万架标准机架
  • 2026年全球AI投资预测:2.52万亿美元

2. 画面精致

  • 8个章节独立设计,每个都有独特的主题色
  • 科技感配色方案(深蓝、科技蓝、中国红、金色)
  • AI生成的精美图片(地球、Logo、数据中心、火箭)
  • 流畅的过渡动画

3. 动效惊艳

  • 数字滚动增长动画(从0到600万、10亿、2.52万亿)
  • 卡片旋转飞入特效
  • 粒子系统和光效
  • SVG曲线绘制(用户增长曲线)
  • 3D旋转效果(地球、AI大脑)

Remotion 的五大核心优势

1. 程序化

所有动画都是用代码编写,可以精确控制每一帧。不再依赖鼠标拖拽,一切都在你的掌控之中。

2. 可复用

组件化设计,动画逻辑可以轻松复用。写一次,用无数次。

3. 超灵活

从文字动画到数据可视化,从产品展示到代码演示,从15秒短视频到120秒长视频,Remotion 可以实现任何你想要的视频效果。

4. 易维护

代码即视频,使用 Git 管理,团队协作就像开发网页一样简单。

5. 高质量

输出 Full HD 甚至 4K 视频,支持多种编码格式,满足各种平台需求。


适合谁使用?

Remotion 特别适合:

  • 程序员
    :会 React 就能做视频
  • 数据分析师
    :用数据驱动视频生成
  • 内容创作者
    :批量生成相似视频
  • 产品经理
    :快速制作产品演示
  • 教育工作者
    :制作教学动画

但对于需要批量生成、数据驱动、程序化控制的场景,Remotion 是无可替代的。


相关资源

  • Remotion 官网
    :https://www.remotion.dev/
  • GitHub 仓库
    :https://github.com/remotion-dev/remotion
  • 官方文档
    :https://www.remotion.dev/docs/
  • 示例项目
    :https://www.remotion.dev/showcase
关注娇姐,持续分享AI干货和资讯

最新文章

随机文章