关于 remotion-best-practices
面向处理 Remotion 代码的技能指南,按主题提供可查阅的规则和代码示例,涵盖动画、媒体、合成与渲染相关知识。
主要功能
- 01Remotion 动画与转场规则
- 02音频和视频处理指南
- 03字幕与音效参考
- 04组合与动态元数据规则
- 05图表及文本测量方法
适用场景
- 01查找 Remotion 动画实现方式
- 02为合成添加字幕或音效
- 03处理视频素材与音频可视化
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ calesthio/ openmontage --skill remotion-best-practices安装后在 Claude Code 中输入/remotion-best-practices确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
rules/3d.mdanimations.mdassets.mdaudio-visualization.mdaudio.mdcalculate-metadata.mdcan-decode.mdcharts.mdcompositions.mddisplay-captions.mdextract-frames.mdffmpeg.mdfonts.mdget-audio-duration.mdget-video-dimensions.mdget-video-duration.mdgifs.mdimages.mdimport-srt-captions.mdlight-leaks.mdlottie.mdmaps.mdmeasuring-dom-nodes.mdmeasuring-text.mdparameters.mdsequencing.mdsfx.mdrules/assets/charts-bar-chart.tsxtext-animations-typewriter.tsxtext-animations-word-highlight.tsx详细介绍
适用场景
处理 Remotion 代码时,请使用此技能来获取相关领域知识。
字幕
处理字幕时,请加载 ./rules/subtitles.md 文件以了解更多信息。
使用 FFmpeg
对于某些视频操作,例如剪辑视频或检测静音,应使用 FFmpeg。请加载 ./rules/ffmpeg.md 文件以了解更多信息。
音频可视化
需要将音频可视化(频谱条、波形、低音响应效果)时,请加载 ./rules/audio-visualization.md 文件以了解更多信息。
音效
需要使用音效时,请加载 ./rules/sound-effects.md 文件以了解更多信息。
使用方法
阅读各个规则文件,了解详细说明和代码示例:
- rules/3d.md - 使用 Three.js 和 React Three Fiber 在 Remotion 中创建 3D 内容
- rules/animations.md - Remotion 动画基础技能
- rules/assets.md - 将图像、视频、音频和字体导入 Remotion
- rules/audio.md - 在 Remotion 中使用音频和声音,包括导入、裁剪、音量、速度和音高
- rules/calculate-metadata.md - 动态设置合成时长、尺寸和 props
- rules/can-decode.md - 使用 Mediabunny 检查浏览器是否能解码视频
- rules/charts.md - Remotion 的图表和数据可视化模式(柱状图、饼图、折线图、股票图表)
- rules/compositions.md - 定义合成、静帧、文件夹、默认 props 和动态元数据
- rules/extract-frames.md - 使用 Mediabunny 从视频的指定时间戳提取帧
- rules/fonts.md - 在 Remotion 中加载 Google Fonts 和本地字体
- rules/get-audio-duration.md - 使用 Mediabunny 获取音频文件的时长(秒)
- rules/get-video-dimensions.md - 使用 Mediabunny 获取视频文件的宽度和高度
- rules/get-video-duration.md - 使用 Mediabunny 获取视频文件的时长(秒)
- rules/gifs.md - 将 GIF 与 Remotion 时间轴同步显示
- rules/images.md - 使用 Img 组件在 Remotion 中嵌入图像
- rules/light-leaks.md - 使用 @remotion/light-leaks 创建漏光叠加效果
- rules/lottie.md - 在 Remotion 中嵌入 Lottie 动画
- rules/measuring-dom-nodes.md - 在 Remotion 中测量 DOM 元素尺寸
- rules/measuring-text.md - 测量文本尺寸、使文本适应容器并检查溢出
- rules/sequencing.md - Remotion 的序列编排模式,包括延迟、裁剪和限制项目时长
- rules/tailwind.md - 在 Remotion 中使用 TailwindCSS
- rules/text-animations.md - Remotion 的排版和文本动画模式
- rules/timing.md - Remotion 中的插值曲线,包括线性、缓动和弹簧动画
- rules/transitions.md - Remotion 的场景转场模式
- rules/transparent-videos.md - 渲染透明视频
- rules/trimming.md - Remotion 的裁剪模式,包括剪掉动画的开头或结尾
- rules/videos.md - 在 Remotion 中嵌入视频,包括裁剪、音量、速度、循环和音高
- rules/parameters.md - 添加 Zod schema,使视频支持参数化
- rules/maps.md - 使用 Mapbox 添加地图并制作动画
- rules/voiceover.md - 使用 ElevenLabs TTS 为 Remotion 合成添加 AI 生成的旁白
评论
支持 Markdown