Communitygithub.com

emrecv/motion-graphics-director

创建并精修快速、简洁的Remotion动态图形和视觉解说视频,包含强开场钩子、克制的视觉元素、来源明确的图标和Logo、ElevenLabs旁白以及精准的逐帧动画。适用于代码生成的视频,而非交互式网站动画。

motion-graphics-director 是什么?

Motion Graphics Director 是一个专门用于创建高质量、代码驱动的动态图形视频的AI技能,基于Remotion框架。它强调在视频前三秒内建立强有力的视觉钩子,使用简洁、克制的设计语言(如大量留白、中性配色、无装饰元素),并通过ElevenLabs旁白引导解说,而非依赖文字标题或背景音乐。该技能提供了一套完整的创意默认值和生产流程,包括从提取项目需求、编写脚本、设计分镜到最终渲染和交付的每一步指导。它支持包括Claude Code、Cursor、Codex在内的多种AI编码环境,通过引用详细的参考文档(如艺术指导、技术解说、音频处理等),确保输出的视频在视觉和技术上都达到专业水准。其核心优势在于将动态图形设计的最佳实践与AI辅助的代码生成相结合,帮助用户快速产出具有叙事力的解释性视频,同时保持素材来源的可靠性和代码实现的可维护性。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/emrecv/motion-graphics-director/tree/HEAD/skills/motion-graphics-director

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

动态图形导演

让机制或想法立即变得有趣。下面的默认创意档案反映了创作者的偏好;用户的明确项目简介可以覆盖它。仅技术成功不等于视觉成功。

创意默认值

  • 前三秒内设置钩子。 以令人惊讶的视觉对比、可识别的问题、转变或具体的回报开场。立即开始行动。在钩子之前,不要有介绍标题卡、Logo预卷或缓慢的解释。单独测试30fps下的前90帧。
  • 快速、简洁的运动,带有精心设计的缓动。 从1-3秒的视觉节拍和30fps下的8-18帧主体运动开始;根据旁白和理解力进行调整。这些是起始范围,不是强制性的剪切。推进思路,而不是停留在已完成的场景上。保持因果序列清晰易懂。
  • 一个焦点和大量的留白。 留白意味着呼吸空间,包括在深色背景上。使用克制的中性或柔和色彩,不要有霓虹或发光效果,不要有装饰性边框或轮廓卡片。使用适度的圆角,在1080px宽的中等面板上约为12-24像素;保持比例。
  • 旁白承载解释。 默认使用英语,配合ElevenLabs配音。避免大标题、段落、常规字幕、步骤计数器、章节标签、进度条、装饰性品牌标题和警告/免责声明覆盖层。当有助于识别正在移动的事物时,允许使用一个简短的1-4字标题或短标签。将来源、注意事项和实现说明保留在交付文档中;使旁白准确而不杂乱画面。仅在要求时提供单独的字幕。
  • 使用设计好的素材。 从统一风格的图集中获取简洁的现代图标,从官方品牌资源中获取真实的相关产品Logo。不要发明通用的占位符SVG图标或假Logo。匹配光学尺寸、描边权重和风格。遵循 icons-and-logos.md。
  • 无背景音乐。 使用语音加上选择性的音效。音效标记重要事件,且必须低于语音。Bencho不是依赖项,其素材不包含在内。

从项目开始工作

检查现有的源代码、素材、脚本、锁定的依赖项和先前的决策。对于新的Remotion项目,运行 python3 <skill>/scripts/new_project.py <new-directory>,然后在该目录中运行 npm ci。捆绑的项目提供了经过测试的渲染和媒体辅助工具。其FORM和CDN组合是遗留的技术示例,不是当前的视觉指导示例:不要将它们的长时间镜头、标题、标签、颜色或图标绘制复制到新影片中。

保持内容、视觉标记、旁白、素材和时序可独立编辑。使用本地媒体和加载的字体进行最终渲染。对于不熟悉的API,请查阅官方Remotion技能,并匹配已安装的版本,而不是静默升级。

制作流程

  1. 提取受众、一个要点、平台、时长、参考资料、素材、语言和语音。默认值:1080 × 1920,30fps,大约20秒。仅针对缺失的信息进行提问。
  2. 同时编写开场视觉和第一句口语。规划一个简短的因果镜头列表,包含可变长度的节拍。阅读 art-direction.md;对于流程解释,还要阅读 technical-explainers.md。对照主要来源验证技术声明。
  3. 当风格未定时,展示两种真正不同的方向,并附上代表性的风格帧。如果用户已经选择了外观,则直接进行。不要引入常规的审批门槛。
  4. 编写简洁的语音脚本,获取素材,并遵循 audio.md。在锁定编辑之前,生成或导入已批准的ElevenLabs旁白。如果访问权限或语音选择缺失,则准备脚本和动态分镜;清晰标识占位符时序,不要编造完成后的旁白。
  5. 构建开场3秒和一个代表性的过渡。使用 motion-and-remotion.md。一旦钩子和运动效果良好,再扩展影片。修正受影响的场景,而不是重复渲染所有内容。
  6. 使用 review.md 进行审查:开场钩子、节奏、因果清晰度、克制的构图、语音对齐、选择性音效、无音乐。在输出最终MP4之前,渲染一个全帧率预览。

实现不变量

从帧编号推导动画,包括缓动和音频包络。无自主CSS动画、挂钟计时器或未设定种子的随机性。独立的帧渲染和擦洗必须一致。等待实际的字体和素材。使用加载的字体测量文本;对长文本进行重新排版,而不是不加区分地缩小。

快速并不意味着突兀,缓动并不意味着弹跳。使用受控的加速和稳定,协调的重叠和直接剪切(在有用时)。切勿仅根据静态图像或峰值测量声称已观看或听取过输出。

交付与改进

交付可播放的视频、可编辑的项目、素材来源出处以及一份关于实际检查的简洁记录。将文档保留在视频本身之外。对于技能更改,使用 evaluation.md;根据观察到的失败来改进规则,而不是声称保证的质量或速度。

相关技能