離大譜，我竟然在 VS Code 里做了個(gè)視頻！

大家好，我是程序員魚皮。

最近發(fā)現(xiàn)一個(gè)很有意思的開源項(xiàng)目叫 Remotion，能用編程寫代碼的方式做動(dòng)畫視頻，在 GitHub 上星星很多。

你可能會(huì)問(wèn)：用代碼做視頻？那不得累死？

別急，我們當(dāng)然不會(huì)自己寫代碼。讓 AI 幫你寫就完了！

用 AI 編程做動(dòng)畫的原理其實(shí)很簡(jiǎn)單：

• AI 寫代碼

• Remotion 把代碼渲染成視頻

下面我?guī)Т蠹彝暾咭槐榱鞒蹋瑥陌惭b到出片，全程手把手，保姆皮上線~

視頻版：https://bilibili.com/video/BV1qxFSzUEwo

一、安裝 Remotion

首先，打開終端，輸入一行命令快速安裝 Remotion：

npx create-video@latest

執(zhí)行之后，它會(huì)問(wèn)你幾個(gè)問(wèn)題：

1. 選一個(gè)模板 > 我選了 Hello World

2. 項(xiàng)目名叫什么 > 就叫 myvideo

3. 是否使用 TailwindCSS > 用唄

4. 是否添加 AI 智能體技能 > 這個(gè)一定要加！

添加了這個(gè)技能之后，你就可以通過(guò) AI 對(duì)話的方式，讓 AI 幫你用這個(gè)庫(kù)做動(dòng)畫了。

安裝技能的時(shí)候，它會(huì)問(wèn)你裝到哪些智能體里、是當(dāng)前項(xiàng)目安裝還是全局安裝。我建議直接全局安裝，省得以后每個(gè)項(xiàng)目都要重新裝一遍。

注意：你需要確保自己能訪問(wèn) GitHub，不然可能會(huì)報(bào)錯(cuò)。

安裝完成后，進(jìn)到項(xiàng)目目錄，安裝依賴并運(yùn)行：

npm install
npm run dev

打開瀏覽器，你會(huì)看到一個(gè) Web 端的視頻剪輯工具：

看看這界面，不知道的還以為是客戶端軟件呢！

頁(yè)面左側(cè)展示了不同的視頻片段，每個(gè)片段其實(shí)都是通過(guò)代碼渲染出來(lái)的。你刪掉一段代碼，對(duì)應(yīng)的視頻就沒了：

在代碼編輯器中按 Ctrl+Z 撤回，視頻又出來(lái)了。是不是挺神奇的？

二、讓 AI 幫你做視頻

我們不可能自己寫代碼來(lái)做視頻，肯定是讓 AI 來(lái)。

打開一個(gè) AI 編程工具，我這里用的是 VS Code + GitHub Copilot AI 插件，選了最新的模型 Opus 4.6，100 萬(wàn)上下文，還是很牛的。

Demo 1、魚頭人唱 RAP

我直接給 AI 發(fā)了這段話：

一條魚頭人正在唱中文 RAP，RAP 的內(nèi)容是稱贊一位叫程序員魚皮的博主，屏幕上動(dòng)態(tài)顯示歌詞（快閃風(fēng)格）

你會(huì)看到，AI 直接找到了我們之前安裝的 Remotion Best Practices 技能包，它會(huì)讓 AI 知道怎么用編程的方式做動(dòng)畫。

然后它就開始編寫動(dòng)畫代碼了。等了一會(huì)兒，AI 完成了任務(wù)。

直接在瀏覽器中就能看到效果了，魚頭人 on the beat ~

怎么說(shuō)呢，有點(diǎn)太抽象了 bro！不過(guò)畢竟是第一個(gè) Demo 嘛，我也沒有太高的預(yù)期。下面我們來(lái)搞個(gè)更有意思的、雞動(dòng)人心的（要素察覺）。

Demo 2、雞你太美

新開一個(gè) AI 對(duì)話框，這次我換了個(gè)更具體的需求：

幫我做一個(gè)小雞一邊打籃球一邊 RAP 的爆款視頻，大概 20 秒，要求有視覺沖擊感、要足夠洗腦，讓人一看就想點(diǎn)贊、循環(huán)播放。


 我是傻子，你需要告訴我提供哪些素材，如果不理解需求，找我提問(wèn)確認(rèn)，并且最后完成視頻。

然后你猜怎么著，AI 居然識(shí)別出了「雞你太美」這個(gè)梗！不是哥們。

它說(shuō)不需要我提供任何素材就能搞定，那就直接開干！

等它一頓操作之后，做出來(lái)了一個(gè)新視頻，來(lái)看看效果：

不是哥們，你管這玩意叫 “小雞”？胳膊和腿兒都分離了啊！是不是有點(diǎn)太抽象了？？？

而且目前沒有背景音樂(lè)和唱 RAP 的音效，有點(diǎn)干巴，我只能腦補(bǔ)出 “雞你太美，噔噔噔噔，北鼻……” 的音樂(lè)，還是要加點(diǎn)真實(shí)的素材。

三、用素材優(yōu)化視頻

由于動(dòng)畫是 AI 做的，它可能比我更清楚需要哪些素材、以及放到哪些位置，所以我讓 AI 來(lái)引導(dǎo)我完善素材。

發(fā)送提示詞：

現(xiàn)在的動(dòng)畫有點(diǎn)生硬，缺少真實(shí)的圖片、背景音樂(lè)和音頻，請(qǐng)你引導(dǎo)我應(yīng)該怎么完善這些內(nèi)容，我是傻子

AI 就會(huì)開始通過(guò)交互提問(wèn)的方式來(lái)引導(dǎo)我，一步步告訴我該做什么。

AI 給出了方案，大概需要這些素材：

1. 小雞圖片 > 我自己來(lái)找

2. 背景音樂(lè) > 我自己來(lái)找

3. 籃球場(chǎng)背景圖 > 讓 AI 幫我搜

4. RAP 人聲 > 用 AI 生成

下面，我們根據(jù)指引依次來(lái)搞定這些素材。

1、準(zhǔn)備小雞圖片和背景音樂(lè)

這兩個(gè)素材比較簡(jiǎn)單，自己手動(dòng)找就好了，沒啥好說(shuō)的。

2、讓 AI 幫忙搜背景圖

AI 可以利用 Firecrawl Search 這個(gè) MCP 工具來(lái)幫忙搜索網(wǎng)絡(luò)圖片。

如果你不知道怎么安裝 MCP 工具，可以參考我的《AI 編程零基礎(chǔ)入門教程》中 “優(yōu)質(zhì) AI 編程擴(kuò)展推薦” 這一節(jié)。

指路：ai.codefather.cn/vibe

我跟 AI 說(shuō)：

幫我下載背景圖，要求背景圖必須是雞你太美這個(gè)梗的原始背景圖，干凈的背景圖，不聽話的話我就再也不用你了！

在我的威脅下，AI 乖乖聽話，不僅找到了幾張圖，還說(shuō)要幫我挑一個(gè)最好的，我都要感動(dòng)哭了。

雖然中間有一張圖被摳得只剩一個(gè)人了（人工智障），但最終還是找到了能用的背景圖。

3、用 Suno 生成 RAP 人聲

AI 推薦我用 Suno AI 來(lái)生成人聲，還提供了生成人聲的提示詞。

直接打開官網(wǎng)注冊(cè)登錄，選擇 Simple 簡(jiǎn)易模式，把歌詞和要求粘進(jìn)去：

中文說(shuō)唱，嘻哈節(jié)拍，120BPM，時(shí)長(zhǎng) 18 秒，歌詞：
籃球在我手 全場(chǎng)我最秀
Crossover過(guò)掉你 無(wú)情暴扣
雞你太美 Baby
左手運(yùn)球 右手寫RAP
三分線拔起 全網(wǎng)都炸裂
只因你太美

然后點(diǎn)擊創(chuàng)建，一次性生成了多個(gè)版本的 RAP 人聲：

我聽了一下，免費(fèi)模型生成的效果居然還不錯(cuò)！直接下載 MP3 音頻文件，倍速一下就能用了。

4、讓 AI 合成最終視頻

所有素材都準(zhǔn)備好了，我把文件按照要求放到項(xiàng)目目錄里，然后跟 AI 說(shuō)：

素材放好了

然后 AI 就開始替換素材，稍等一會(huì)兒，AI 的大作就完成了。來(lái)看看最終效果：

有了素材后，比之前純靠 AI 生成 SVG 和 Emoji 的版本好了不少，背景圖、背景音樂(lè)、RAP 人聲、歌詞動(dòng)畫都加上了。雖然還是有點(diǎn)生硬（比如中間的小雞圖片略顯詭異），但整體已經(jīng)有內(nèi)味兒了。

四、優(yōu)化思路

目前動(dòng)畫視頻存在 2 個(gè)比較嚴(yán)重的問(wèn)題，我說(shuō)一下自己的優(yōu)化思路。

問(wèn)題 1、素材不夠真實(shí)

如果完全讓 AI 用代碼繪制素材（SVG、Emoji 之類的），出來(lái)的東西比較抽象。所以建議自己多補(bǔ)充一些真實(shí)的圖片素材，效果會(huì)好很多。

問(wèn)題 2、聲音和畫面歌詞對(duì)不上

可以先讓 AI 生成歌詞以及對(duì)應(yīng)的時(shí)間線，然后把這個(gè)時(shí)間線同時(shí)交給 AI 做動(dòng)畫視頻和 AI 生成音頻。這樣兩邊都是按照同一個(gè)時(shí)間線來(lái)編排的，畫面和聲音就能對(duì)上了。

最后

用 AI 編程的方式來(lái)做視頻，在畫面真實(shí)感和流暢度上肯定沒法跟 Seedance、Sora、可靈這些視頻生成模型比較。但它有自己的優(yōu)勢(shì)，比如完全可控、可編輯、可復(fù)現(xiàn)，而且不需要消耗 GPU 算力和昂貴的視頻 API 費(fèi)用，純靠代碼渲染就行。只要你描述到位、再人工多補(bǔ)充一些素材，做出來(lái)的效果其實(shí)也能滿足很多場(chǎng)景。

我覺得這個(gè)工具比較適合做下面幾類視頻：

• 動(dòng)畫演示視頻：比如講解一個(gè)知識(shí)點(diǎn)，讓 AI 幫你變成動(dòng)畫

• 快閃文字類視頻：歌詞快閃、文字動(dòng)效這類

• 抽象整活視頻：雞你太美這種梗視頻

• 知識(shí)科普動(dòng)畫：雖然看起來(lái)生硬，但能幫別人快速理解知識(shí)

感興趣的同學(xué)可以自己去試試，Remotion 是完全開源免費(fèi)的：

開源倉(cāng)庫(kù)：https://github.com/remotion-dev/remotion

也歡迎大家在評(píng)論區(qū)分享你用 AI 編程做出來(lái)的視頻，看看誰(shuí)的最抽象~

一些對(duì)大家有用的資源：
100+ 編程學(xué)習(xí)路線 / 實(shí)戰(zhàn)項(xiàng)目 / 求職指導(dǎo)
100+ 簡(jiǎn)歷模板
300+ 企業(yè)面試題庫(kù) mianshiya.com
500+ AI 資源大全
1 對(duì) 1 模擬面試
動(dòng)畫學(xué)算法教程