00:00:00看看我们制作的这段解说视频。
00:00:02火星,这颗红色的星球,几个世纪以来一直令全人类着迷。
00:00:08它是太阳系中距离太阳第四近的行星,就在地球的外侧。
00:00:14这段视频并不是用 After Effects 剪辑的。
00:00:16我们没有调整过关键帧,也没有进行过任何手动动画制作。
00:00:21而是 Claude 调用了内置的新版 Remotion Agent 技能,为我们构建并渲染了它。
00:00:26动作、时机,一切的一切,只需通过提示词就能完成。
00:00:30但首先,我们来聊聊 Claude 技能。
00:00:33如果你最近一直在关注 AI 动态,就会发现 Claude 技能是当下最热门的话题。
00:00:38每个人都在谈论它们,但它们到底是什么呢?
00:00:43它们其实就是教学手册,教 Claude 如何掌握特定的工具和工作流。
00:00:49这些专业知识包能让 Claude 从一个通用助手
00:00:54摇身一变成为视频制作、数据分析或自动化等领域的专家。
00:01:00当技能与 Claude Code 以及 Thorpe 的代理编码工具结合时,
00:01:05就能解锁无比强大的功能。
00:01:07现在,轮到 Remotion 了。
00:01:09这是一个让你能用 React 代码创建视频的框架,
00:01:13使用的正是驱动现代网站的同款技术。
00:01:15但问题在于:
00:01:16Remotion 虽然极其强大,但也非常复杂。
00:01:20你需要理解 React、动画库、时间函数以及视频渲染。
00:01:26这是一款开发者工具,对大多数人来说门槛太高了。
00:01:30这就是为什么 Remotion Agent 技能会成为“游戏规则改变者”。
00:01:33它赋予了 Claude 关于 Remotion 整个框架的深度知识,
00:01:37比如如何构建合成、编排动画、
00:01:41管理时机、处理资产等等。
00:01:45所以 Claude 不再是瞎猜视频代码,而是像专业的 Remotion 开发者一样
00:01:50精通整个框架。
00:01:53这套配置和开发者用来自动生成视频的配置完全一样。
00:01:58在视频结束时,
00:02:00你将能够通过提示词来导演专业的动态图形。
00:02:04那我们开始吧。
00:02:05首先,我们需要安装 Remotion Claude 技能。
00:02:08为此,我们要输入这条命令。
00:02:11你可以在 Remotion 官网工具中找到这条命令。
00:02:14我们将通过按空格键并回车,从列表中选择所有这些模型。
00:02:19当项目中安装好 Claude 技能后,
00:02:22我们现在打开 Claude Code 终端,要求它启动一个新的 Remotion 项目。
00:02:28让我们等待它完成设置。
00:02:30现在项目和模板已经设置完成了。
00:02:38只需按照这里的指示启动 Remotion Studio 即可。
00:02:42来看看效果如何。太棒了。
00:02:45这就是 Remotion 的样子。
00:02:46它就像一个视频编辑应用,但每个场景都是通过编程实现的。
00:02:51既然项目已经安装好,你也了解了 Remotion 的样子,
00:02:56那我们进入开发阶段吧。
00:02:59我们的开发分为九个阶段。
00:03:02第 1 到第 3 阶段将建立 Claude 运行的系统。
00:03:07第 4 到第 7 阶段负责创建素材并定义可用的组件。
00:03:13第 8 到第 9 阶段则是最终执行。
00:03:16话不多说,我们开始吧。
00:03:19首先当然是第 1 阶段。
00:03:21既然一切都安装好了,
00:03:25让我们打开专门为这个视频制作的构建指南。
00:03:29虽然这个构建指南是针对我们要做的这个特定视频的,
00:03:35但一旦你理解了这些提示词的工作原理,
00:03:39你也可以改装这个指南,用它来制作你想要的其他视频。
00:03:42如果你想要这份提示词的副本,
00:03:44可以查看我们的免费社区,我们会在那里上传这类指南。
00:03:48这样你也可以用 AI 进行创作。
00:03:51让我们复制第 1 阶段的提示词,然后粘贴到 Claude Code 中。
00:03:56然后按回车。
00:03:57这个提示词的作用是建立一个技术基础,
00:04:02让 Claude 在整个开发过程中遵循。
00:04:06你可以把它看作是它应该遵循的规则和模式。
00:04:09这一点非常重要,因为大多数项目失败
00:04:13并不是因为制作者缺乏视觉方向,
00:04:16而是因为没有给 AI 具体的规则,导致它最后开始自作主张。
00:04:23一旦第 1 阶段完成,就会是这个样子。
00:04:27系统会创建一个开发说明 Markdown 文件。
00:04:31Claude 已经打好了基础。
00:04:34现在可以进入下一阶段,也就是第 2 阶段。
00:04:37现在我们要为这个视频确立美术风格和视觉系统。
00:04:42这是工作流中非常、非常关键的一步。
00:04:46到目前为止,我们已经设置好了环境,并确保 Claude 真正理解了 Remotion。
00:04:52而这里要做的是,在 Claude 编写任何实际代码之前,告诉它该如何进行视觉思考。
00:05:00请再次打开构建指南。
00:05:03你会看到标为“第 2 阶段”的部分。
00:05:05你可以直接原封不动地复制整个提示词。
00:05:10然后回到终端里的 Claude Code。
00:05:15粘贴提示词并按回车。
00:05:17然后让 Claude 处理一会儿。
00:05:21我想在这里停一下,解释一下为什么这个提示词如此重要。
00:05:25因为很多人在这里要么直接跳过,要么试图过度控制。
00:05:30这个提示词现在还不是让 Claude 构建完整的视频。
00:05:35它在建立的是系统化思维。
00:05:39就像我们在为 Claude 即将构建的世界定义规则一样。
00:05:43你可以把它理解为创意指导,而不是具体指令。
00:05:46我们要告诉 Claude 诸如整体基调、视觉约束、
00:05:52动态效果的质感,以及在没有明确定义时如何做出设计决策。
00:06:00这非常重要,因为我们不可能描述视频中的每一个像素,对吧?
00:06:07那是不可能的。
00:06:08但同时,我们也不希望 Claude 随机猜测,或者创造出完全不符合我们风格的模式。
00:06:15所以这个提示词实现了“无须微操的控制”。
00:06:19它给了 Claude 一个运行框架。
00:06:22与其让它猜测什么是“简洁”或“现代”,不如让我们拥有共同的定义。
00:06:29这样它就不会产生幻觉,而是同时具备技术能力
00:06:33和创意护栏,从而正确地工作。
00:06:36好,让我们按回车,等待 Claude 处理。
00:06:39好了,Claude 完成后,你会看到它创建了一个美术指导文件,
00:06:44概述了它该如何推理并执行未来的决策。
00:06:48进入实际开发时,在这个环节不要害怕反复调整,
00:06:55你肯定希望项目符合你想要的美术方向。
00:06:58所以你可能需要要求 Claude 更改或添加某些内容。
00:07:02就这样,我们开启了工作流的下一阶段。
00:07:07我们现在与 AI 之间有了共同的视觉语言。
00:07:12这样在编写任何合成或序列之前,Claude 就已经知道该如何思考这个视频了。
00:07:18这意义重大。
00:07:19到这一步,我们已经成功确立了美术方向和视觉控制。
00:07:24虽然还没开始制作视频,
00:07:26但我们已经打好了基础,这让实际的构建过程变得可预测且专业。
00:07:31美术方向定好后,接下来的任务是精心编写视频的故事脚本。
00:07:37这一步将最终完善我们所需的系统。
00:07:40我们的重点从“视频感觉如何”转向“每一刻具体发生了什么”。
00:07:47这里的目标非常简单:
00:07:49定义场景、流程和时机。
00:07:52这样在动画制作之前,视频的逻辑就已经通顺了。
00:07:56好,回到构建指南,找到第 3 阶段的提示词。
00:08:02全部复制。
00:08:03准备好后,回到 Claude Code。
00:08:08粘贴提示词并按回车。
00:08:10现在等待 Claude 处理。
00:08:13Claude 正在利用我们之前定义的美术方向来创建时间轴。
00:08:18它在决定我们需要多少个场景,每个场景负责什么,
00:08:23以及每个瞬间在屏幕上停留多长时间。
00:08:27这正是我们能够制作出 10 秒或 60 秒视频的关键,
00:08:32让它感觉是有意为之,而不是仓促或随机的。
00:08:36Claude 完成后,你会看到视频的场景拆解。
00:08:40每个场景都有明确的角色。
00:08:43通常会有开场悬念、核心信息、辅助瞬间和结尾,对吧?
00:08:52这实际上就是一份脚本化的分镜。
00:08:56就像是用文字代替画面写出来的分镜表。
00:09:02在这一步,你可以要求 Claude 进行微调。
00:09:05如果某个场景不符合你的设想,直说就行。
00:09:10如果你想重新排列部分顺序或完全删除某一段,现在就是最佳时机。
00:09:15这是另一个容易让人卡住的地方。
00:09:17他们觉得必须全盘接受第一次的输出。
00:09:20其实不然。
00:09:21把它当作一份可以协作修改的草案就好。
00:09:25就是这样。
00:09:27在这个案例中,结构看起来很扎实,对吧?
00:09:30节奏合理,场景衔接逻辑通顺,也符合我们预期的长度。
00:09:37所以与其继续迭代,我们准备给 Claude 发出确认信号。
00:09:41你只需要告诉 Claude 继续执行,
00:09:45并根据这个结构创建分镜文件。
00:09:48一旦你下达指令,Claude 就会生成一个专用文件,
00:09:52代表视频的完整时间轴。
00:09:55这个文件就成了我们要构建的内容的唯一事实来源。
00:10:00就这样,视频的故事脚本锁定了。
00:10:04我们知道发生了什么,什么时候发生,以及为什么存在。
00:10:08虽然还没做动画,但最难的创意决策已经完成了。
00:10:13分镜完成后,我们进入第 4 阶段,
00:10:18即定义我们的素材清单。
00:10:20这一步起初可能觉得可有可无,
00:10:24但如果你想要干净、一致的结果,它其实至关重要。
00:10:28目标很简单:定义有哪些素材,
00:10:33以及它们在被创建、动画化或放置之前应该长什么样。
00:10:38这一步至关重要,因为它在设计决策和场景逻辑之间建立了分离。
00:10:44这种分离可以防止后期出现崩坏。
00:10:48原因如下:
00:10:50如果你要求 Claude 同时设计素材、决定外观、
00:10:54并想好它在场景中的位置。
00:10:59你是在一个步骤里堆叠了太多的决策,这就容易失败。
00:11:04结果往往会不一致,效果很差。
00:11:07所以,回到构建指南,复制第 4 阶段的提示词。
00:11:11复制好后,回到 Claude 终端,粘贴并回车。
00:11:17现在等待 Claude 处理。
00:11:19在运行期间,我来解释一下这个提示词在幕后做了什么。
00:11:24它现在还不是在创建视觉效果。
00:11:25它在为我们需要的每个素材定义设计参数。
00:11:29比如物件、颜色用法等等。
00:11:33这里常见的错误是跳过这一步,让每个场景自己发明素材。
00:11:39那样做会导致每个场景看起来都很呆板,且缺乏整体感。
00:11:45Claude 完成后,会创建一个布局清晰的素材清单文件。
00:11:53每个素材都有名称和定义的参数。
00:11:57到这一步,除非漏掉了什么或有明显多余的东西,否则不需要改动太多。
00:12:04如果你想添加或更改,直接告诉 Claude 即可。
00:12:10就这样,我们现在有了一份完整的素材清单和一套约束它们的设计系统。
00:12:17这意味着当 Claude 开始生成 Remotion 组件时,
00:12:22它不再是瞎猜外观。
00:12:25它会直接从这份清单中调用。
00:12:28素材规范锁定后,我们进入第 5 阶段,
00:12:33也就是实际生成这些素材。
00:12:36我们现在要制作出将在整个视频中使用的具体部件。
00:12:42到目前为止,我们一直在刻意将各个关注点分开。
00:12:48先定义系统,再定美术方向、分镜,最后是刚才的素材规范。
00:12:56而这一步会将这些定义转化为实际可用的素材,而不会混淆职责,
00:13:04这让 Claude Code 能够在指令和上下文非常明确的情况下进行开发。
00:13:10这就是为什么这个方法如此可靠。
00:13:13让我们走一遍流程。
00:13:15再次从构建指南中获取第 5 阶段提示词,粘贴到 Claude 终端。
00:13:20但在按回车之前,有一点很重要。
00:13:23当你在处理包含大量不同类别素材的大型项目时,
00:13:29按类别分批生成是明智之举。
00:13:33我的意思是,在提示词中加入一条规则,告诉 Claude
00:13:37一次只生成一个素材类别。
00:13:40这能降低 AI 产生幻觉的几率,也减少了
00:13:45Claude 在不相关的素材间遗漏风格定义的可能性。
00:13:49在我们的案例中,这个视频的素材清单并不庞大。
00:13:53所以我们可以直接一次性生成所有内容。
00:13:57只要记住,随着项目规模扩大,分批处理将成为最佳实践。
00:14:03好了,这一步通常需要一些时间,所以请保持耐心。
00:14:08完成后,花点时间快速浏览一下输出,确认所需的所有素材是否都在。
00:14:15通常情况下,你可以在 SRC 文件夹中找到所有内容。
00:14:20就这样,我们现在拥有了一整套生成好的、随时可用的素材。
00:14:25这些不再是抽象的概念了。
00:14:28它们是真实的构建模块,将在不同场景中重复使用,
00:14:32这也正是能让视频获得我们想要的连贯性的关键。
00:14:36所有素材准备就绪后,下一步就是赋予它们动效。
00:14:41这是第六阶段,目标是定义每个素材的动作行为。
00:14:47现在还不是制作最终场景,只是创建将在各处复用的动效建筑块。
00:14:53你可以把它们理解为“动效原语”。
00:14:56基本上,我们是在为整个视频创建一套通用的动效语言。
00:15:01所以,在制作指南中直接复制第六阶段的提示词,然后粘贴到 Claude 终端中。
00:15:07现在这里有一个重要的观念转变。
00:15:10我们不需要在这里表现得过于专业。
00:15:13我们不需要列出每一个关键帧,或者详细描述每一个动画。
00:15:18我们之所以能这样做,是因为我们之前的铺垫工作。
00:15:23因为在项目的前几个阶段,我们已经确立了 Claude 的思考方式。
00:15:28我们通过那些 Markdown 文件定义了开发规则、模式、视觉原则、叙事方式,
00:15:33以及设计约束。
00:15:37这让 Claude 对我们追求的风格、节奏和基调有了深刻的理解。
00:15:44所以到了这一步,我们可以信任它去评估整个项目,
00:15:48并提出合理的动效模式。
00:15:50提示词粘贴进去后,直接按回车即可。
00:15:55Claude 会开始分析素材并生成动效原语。
00:15:58这里常见的错误是试图过度控制这一步骤。
00:16:02如果你尝试在此时进行微观管理,
00:16:05你最终会将特定场景的动作固化到你的动效系统中。
00:16:10这会导致后续难以重复使用。
00:16:13相反,我们的目标是建立灵活、通用的动效模式,
00:16:17让整个视频感觉和谐统一。
00:16:21这并不意味着 Claude 第一次就能做到完美。
00:16:25这没关系。
00:16:26我们的任务不是指望初次尝试就得到完美无瑕的动效,对吧?
00:16:31我们的任务是获得一个强大的基础。
00:16:34稍后看到场景输出时,我们肯定会回来对特定瞬间进行润色。
00:16:39经过一番处理,Claude 完成了任务。
00:16:42就这样,我们现在为项目定义好了一套动效原语。
00:16:47它们可重复使用、具有一致性,并且符合我们之前建立的视觉
00:16:52和叙事系统。
00:16:54这是一个巨大的里程碑。
00:16:57我们现在有了素材,也有了动效。
00:17:00我们距离将这一切转化为视频已经非常接近了。
00:17:04现在进入第七和第八阶段。
00:17:06在这些部分,我们基本上是把所有东西黏合在一起。
00:17:09这些提示词要求 Claude 执行的一些操作,
00:17:12可能在早期阶段已经考虑进去了。
00:17:17但运行它们仍然很重要,以创建必要的组件
00:17:22并确保没有任何遗漏。
00:17:25只需在 Claude 终端中运行它们,
00:17:28并让 Claude 跳过已经完成的部分。
00:17:31好了,大功告成,
00:17:34我们终于可以开始构建场景并组装视频了。
00:17:40这就是第九阶段。
00:17:42坦白说,这是整个工作流程中最轻松的部分,
00:17:46因为所有的深度思考都已经提前完成了。
00:17:50所以,让我们继续加油。
00:17:51在这一步,Claude 不再是盲目猜测。
00:17:54它是在我们精心搭建的系统内执行任务。
00:17:57我们的目标非常简单。
00:17:59为每个场景生成代码。
00:18:02查看效果如何。
00:18:05然后将所有内容组装成一段精美的最终视频。
00:18:10首先,从指南中复制第九阶段的提示词,
00:18:13粘贴到 Claude 终端,然后按回车。
00:18:17这个提示词的作用是指令 Claude
00:18:21利用我们目前创建的所有成果
00:18:23开始构建实际的动态场景。
00:18:26美术指导、分镜、素材
00:18:29和动效原语都在这里汇聚一堂。
00:18:32理想情况下,特别是对于较大的项目,
00:18:35你可能希望逐个生成场景。
00:18:38这也是我们这样设计提示词的原因。
00:18:41尽管这只是一段一分三十秒的视频,
00:18:45但尽早学会这种最佳实践会让你以后少走很多弯路。
00:18:49当场景被单独生成时,
00:18:52调试迭代起来要容易得多,
00:18:55你可以进行针对性的修改,而不会破坏整个视频。
00:18:59所以,在第一个场景完成后,我们继续生成剩余的场景。
00:19:04完成后,我们要实际看看成果。
00:19:08你可以让 Claude 为你运行 Remotion Studio,
00:19:10它会给你一个 URL。
00:19:12或者你也可以直接在终端运行 npm start。
00:19:16现在我们进入了 Remotion Studio,让我们按下播放键。
00:19:21你可以立即看到,美术指导
00:19:24和视觉风格在每个场景中都保持了一致。
00:19:28这是一个非常好的信号。
00:19:29如果视频感觉有点平淡,那完全是预料之中的。
00:19:34目前我们只是创建了场景,还没有
00:19:38完全组装视频或对转场进行精修。
00:19:42所以从这里开始,我们会回到 Claude 代码界面,
00:19:45提出观察到的问题,并明确告诉 Claude 我们想要改进的地方。
00:19:50比如关于场景如何移动的具体参数。
00:19:56这里使用的具体提示词并不那么重要。
00:19:58你的输出可能会在每个部分都与我的有所不同。
00:20:04这里使用的具体提示词其实没那么关键。
00:20:07你的输出在每个环节可能都会和我的不太一样。
00:20:10这其实是件好事,因为这正是你开始
00:20:14培养打磨和调试自己作品技能的时刻。
00:20:17你不再只是单纯地执行提示词。
00:20:20你正在做出最终的判断。
00:20:22完成之后,我们再次检查视频。
00:20:25就这样,一切都感觉更紧凑了。
00:20:28动作更流畅,转场更自然,
00:20:31视频终于开始有了设计感,而不是机械的堆砌。
00:20:35好了,我们还没结束。
00:20:37最后的一层是配音和背景音乐。
00:20:41为此,我们将使用 11 Labs SDK。
00:20:44我们会快速完成这一部分。
00:20:46只需前往 11 Labs 文档。
00:20:49找到适合你环境的命令。
00:20:52由于我们使用的是 Node.js,就用那个就好。
00:20:56然后让 Claude 运行命令,配置 11 Labs 的配音和音乐集成。
00:21:03Claude 会为你创建一个 ENV 文件,你只需将 11 Labs API 密钥粘贴进去。
00:21:09之后,你可以让 Claude 生成一段
00:21:13与你制作的视频相匹配的配音脚本。
00:21:16连接并完成后,让我们再次检查输出效果。
00:21:20火星,那颗红色星球,几个世纪以来一直令全人类着迷。
00:21:27它是离太阳第四近的行星,就在我们太阳系中地球的后方。
00:21:31在最近处,火星距离地球 2.25 亿公里。
00:21:37乘航天器需要七个月的航程。
00:21:41你需要带上耐心。
00:21:42火星的大小约为地球的一半,虽小却同样迷人。
00:21:48火星的一天与地球几乎相同:24 小时 37 分钟。
00:21:54但一年呢?需要 687 个地球日,几乎是我们的两年。
00:22:01那里的大气极其稀薄,仅为地球的 1%。
00:22:05你肯定需要一套宇航服。
00:22:07为什么它这么红?
00:22:09氧化铁——也就是铁锈,覆盖了整个表面,赋予了火星标志性的颜色。
00:22:15火星拥有奥林匹斯山,这是太阳系中最大的火山,
00:22:19高度是珠穆朗玛峰的三倍。
00:22:21那里还有水,冰封在两极,也可能隐藏在地下,
00:22:27这是未来探索的关键。
00:22:29我们已经派出了五辆火星车:旅居者号、勇气号、机遇号、好奇号和毅力号。
00:22:37总有一天,人类会踏上火星,
00:22:40我们会建立栖息地,插上旗帜,将它称为我们的第二个家。
00:22:45火星在等待着!
00:22:46现在,这就是我们的火星科普视频的样子。
00:22:51一段完整构建、经过润色、简洁且专业的科普视频。
00:22:56它是基于系统构建的,而非盲目猜测。
00:22:59叙事感很棒,视觉效果出众,而且每个转场
00:23:05都非常丝滑。
00:23:12好了,让我们跳出来稍微回顾一下刚才的工作。
00:23:16我们从一个空文件夹开始,最终得到了一段完整渲染的专业视频。
00:23:22没有使用 After Effects,没有时间轴,没有手动打关键帧。
00:23:26我们将 Claude Code、Remotion 和 Agent 技能结合成一个统一的系统。
00:23:32我们是在导演结果,而不是手动构建每一个碎片。
00:23:38这是你今天就可以发布、交付并接入工作流的真实成果。
00:23:44这也是更深层次的启示。
00:23:47AI 的力量不仅仅在于速度,而在于这些工具能够协同工作。
00:23:52当 Claude Code 能理解 Remotion,而技能又能在正确的时间注入知识时,
00:23:59你就不再是一个人在战斗,而是在带领一支小团队。
00:24:05这就是从“使用 AI”到“用 AI 构建”的转变。
00:24:09从此以后,你不仅是在制作视频,你是在构建视觉系统。
00:24:14你可以调整氛围、更换数据、生成新版本并发布,无需等待任何人。
00:24:21这并没有取代创造力,反而放大了它。
00:24:26一旦掌握了这个工作流,你可以将其应用于产品演示、
00:24:30社交短片、客户项目或任何你想交付的内容。
00:24:34如果你想进一步深入学习,那正是我们在 AnyNoCode 高级社区所做的事情。
00:24:40我们拆解像这样的真实工作流,教你如何利用 AI 获利,
00:24:46你将与专业的创始人及开发者们并肩学习。
00:24:50此外,你还可以获取我们的 AI 网站设计课程,助你更快落地。
00:24:54如果你喜欢这个视频,请点赞并订阅,
00:24:58以后还会有更多这样的教程。
00:25:01我们下期再见。