离大谱，我竟然在 VS Code 里做了个视频！|代码|动画|编程|背景音乐

大家好，我是程序员鱼皮。

最近发现一个很有意思的开源项目叫 Remotion，能用编程写代码的方式做动画视频，在 GitHub 上星星很多。

你可能会问：用代码做视频？那不得累死？

别急，我们当然不会自己写代码。让 AI 帮你写就完了！

用 AI 编程做动画的原理其实很简单：

AI 写代码
Remotion 把代码渲染成视频

官方给的动画成果展示

下面我带大家完整走一遍流程，从安装到出片，全程手把手，保姆皮上线~

视频版：https://bilibili.com/video/BV1qxFSzUEwo

一、安装 Remotion

首先，打开终端，输入一行命令快速安装 Remotion：

npx create-video@latest

执行之后，它会问你几个问题：

选一个模板 > 我选了 Hello World
项目名叫什么 > 就叫 myvideo
是否使用 TailwindCSS > 用呗
是否添加 AI 智能体技能 > 这个一定要加！

添加了这个技能之后，你就可以通过 AI 对话的方式，让 AI 帮你用这个库做动画了。

安装技能的时候，它会问你装到哪些智能体里、是当前项目安装还是全局安装。我建议直接全局安装，省得以后每个项目都要重新装一遍。

注意：你需要确保自己能访问 GitHub，不然可能会报错。

安装完成后，进到项目目录，安装依赖并运行：

npm install
npm run dev

打开浏览器，你会看到一个 Web 端的视频剪辑工具：

看看这界面，不知道的还以为是客户端软件呢！

页面左侧展示了不同的视频片段，每个片段其实都是通过代码渲染出来的。你删掉一段代码，对应的视频就没了：

在代码编辑器中按 Ctrl+Z 撤回，视频又出来了。是不是挺神奇的？

我们不可能自己写代码来做视频，肯定是让 AI 来。

打开一个 AI 编程工具，我这里用的是 VS Code + GitHub Copilot AI 插件，选了最新的模型 Opus 4.6，100 万上下文，还是很牛的。

我直接给 AI 发了这段话：

一条鱼头人正在唱中文 RAP，RAP 的内容是称赞一位叫程序员鱼皮的博主，屏幕上动态显示歌词（快闪风格）

你会看到，AI 直接找到了我们之前安装的 Remotion Best Practices 技能包，它会让 AI 知道怎么用编程的方式做动画。

然后它就开始编写动画代码了。等了一会儿，AI 完成了任务。

直接在浏览器中就能看到效果了，鱼头人 on the beat ~

怎么说呢，有点太抽象了 bro！不过毕竟是第一个 Demo 嘛，我也没有太高的预期。下面我们来搞个更有意思的、鸡动人心的（要素察觉）。

Demo 2、鸡你太美

新开一个 AI 对话框，这次我换了个更具体的需求：

帮我做一个小鸡一边打篮球一边 RAP 的爆款视频，大概 20 秒，要求有视觉冲击感、要足够洗脑，让人一看就想点赞、循环播放。


 我是傻子，你需要告诉我提供哪些素材，如果不理解需求，找我提问确认，并且最后完成视频。

然后你猜怎么着，AI 居然识别出了「鸡你太美」这个梗！不是哥们。

它说不需要我提供任何素材就能搞定，那就直接开干！

等它一顿操作之后，做出来了一个新视频，来看看效果：

不是哥们，你管这玩意叫 “小鸡”？胳膊和腿儿都分离了啊！是不是有点太抽象了？？？

而且目前没有背景音乐和唱 RAP 的音效，有点干巴，我只能脑补出 “鸡你太美，噔噔噔噔，北鼻……” 的音乐，还是要加点真实的素材。

三、用素材优化视频

由于动画是 AI 做的，它可能比我更清楚需要哪些素材、以及放到哪些位置，所以我让 AI 来引导我完善素材。

发送提示词：

现在的动画有点生硬，缺少真实的图片、背景音乐和音频，请你引导我应该怎么完善这些内容，我是傻子

AI 就会开始通过交互提问的方式来引导我，一步步告诉我该做什么。

AI 给出了方案，大概需要这些素材：

小鸡图片 > 我自己来找
背景音乐 > 我自己来找
篮球场背景图 > 让 AI 帮我搜
RAP 人声 > 用 AI 生成

下面，我们根据指引依次来搞定这些素材。

这两个素材比较简单，自己手动找就好了，没啥好说的。

AI 可以利用 Firecrawl Search 这个 MCP 工具来帮忙搜索网络图片。

如果你不知道怎么安装 MCP 工具，可以参考我的《AI 编程零基础入门教程》中 “优质 AI 编程扩展推荐” 这一节。

指路：ai.codefather.cn/vibe

鱼皮AI导航网站-免费AI编程教程

我跟 AI 说：

帮我下载背景图，要求背景图必须是鸡你太美这个梗的原始背景图，干净的背景图，不听话的话我就再也不用你了！

在我的威胁下，AI 乖乖听话，不仅找到了几张图，还说要帮我挑一个最好的，我都要感动哭了。

虽然中间有一张图被抠得只剩一个人了（人工智障），但最终还是找到了能用的背景图。

AI 推荐我用 Suno AI 来生成人声，还提供了生成人声的提示词。

直接打开官网注册登录，选择 Simple 简易模式，把歌词和要求粘进去：

中文说唱，嘻哈节拍，120BPM，时长 18 秒，歌词：
篮球在我手 全场我最秀
Crossover过掉你 无情暴扣
鸡你太美 Baby
左手运球 右手写RAP
三分线拔起 全网都炸裂
只因你太美

然后点击创建，一次性生成了多个版本的 RAP 人声：

我听了一下，免费模型生成的效果居然还不错！直接下载 MP3 音频文件，倍速一下就能用了。

4、让 AI 合成最终视频

所有素材都准备好了，我把文件按照要求放到项目目录里，然后跟 AI 说：

素材放好了

然后 AI 就开始替换素材，稍等一会儿，AI 的大作就完成了。来看看最终效果：

有了素材后，比之前纯靠 AI 生成 SVG 和 Emoji 的版本好了不少，背景图、背景音乐、RAP 人声、歌词动画都加上了。虽然还是有点生硬（比如中间的小鸡图片略显诡异），但整体已经有内味儿了。

四、优化思路

目前动画视频存在 2 个比较严重的问题，我说一下自己的优化思路。

问题 1、素材不够真实

如果完全让 AI 用代码绘制素材（SVG、Emoji 之类的），出来的东西比较抽象。所以建议自己多补充一些真实的图片素材，效果会好很多。

问题 2、声音和画面歌词对不上

可以先让 AI 生成歌词以及对应的时间线，然后把这个时间线同时交给 AI 做动画视频和 AI 生成音频。这样两边都是按照同一个时间线来编排的，画面和声音就能对上了。

最后

用 AI 编程的方式来做视频，在画面真实感和流畅度上肯定没法跟 Seedance、Sora、可灵这些视频生成模型比较。但它有自己的优势，比如完全可控、可编辑、可复现，而且不需要消耗 GPU 算力和昂贵的视频 API 费用，纯靠代码渲染就行。只要你描述到位、再人工多补充一些素材，做出来的效果其实也能满足很多场景。

我觉得这个工具比较适合做下面几类视频：