mcpField
E
experts

experts

github.com/remotion-dev营销与增长68.6k293 次安装今天更新
代码仓库

关于 experts

用于在专家数据变化时重新生成首页专家动画并维护图片资源的仓库技能。它说明如何渲染和校验透明视频、复制到文档与推广页面，并同步肖像文件。

主要功能

  1. 01渲染透明 ProRes 母版
  2. 02编码 WebM 与 Safari HEVC 视频
  3. 03校验尺寸、时长和透明通道
  4. 04同步视频与肖像资源

适用场景

  1. 01专家数据变更后重新生成动画
  2. 02更新文档和首页的动画文件
  3. 03渲染新添加的专家卡片

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/remotion-dev/remotion --skill experts

安装后在 Claude Code 中输入/experts确认已加载。

附带文件agents/openai.yaml

详细介绍

专家

如何更新视频

每当 packages/promo-pages/src/components/experts/experts-data.tsx 中显示的专家发生变化时，都要重新生成首页专家动画。ExpertsGraphic 合成会直接导入此数组。

  1. 从当前分支渲染新的透明 ProRes 4444 母版。切勿转换现有的 WebM 或 MOV。

    cd packages/brand
bunx remotion render ExpertsGraphic /tmp/experts-graphic-master.mov \
  --codec=prores \
  --prores-profile=4444 \
  --pixel-format=yuva444p10le \
  --image-format=png \
  --timeout=120000 \
  --overwrite

  2. 确认母版报告的格式为 prores (4444)，像素格式为 yuva...，分辨率为 1080x1080。提取一帧 alpha 图像，并确认其并非完全不透明。

    ffmpeg -i /tmp/experts-graphic-master.mov
ffmpeg -y -i /tmp/experts-graphic-master.mov \
  -vf alphaextract -frames:v 1 /tmp/experts-graphic-alpha.png

  3. 编码透明的 540x540 Chrome WebM。

    ffmpeg -y -i /tmp/experts-graphic-master.mov \
  -vf scale=540:540 \
  -c:v libvpx \
  -pix_fmt yuva420p \
  -auto-alt-ref 0 \
  -an /tmp/experts-graphic.webm

  4. 编码 540x540 ProRes 中间文件，并将其转换为 Safari 的 HEVC 带 alpha 通道 MP4。

    ffmpeg -y -i /tmp/experts-graphic-master.mov \
  -vf scale=540:540 \
  -c:v prores_ks \
  -profile:v 4 \
  -pix_fmt yuva444p10le \
  -an /tmp/experts-graphic-540-prores.mov

avconvert \
  --source /tmp/experts-graphic-540-prores.mov \
  --preset PresetHEVCHighestQualityWithAlpha \
  --output /tmp/experts-graphic.mp4 \
  --replace

  5. 将两个输出文件复制到首页的两个使用位置。

    cp /tmp/experts-graphic.webm ../promo-pages/public/img/experts-graphic.webm
cp /tmp/experts-graphic.mp4 ../promo-pages/public/img/experts-graphic.mp4
cp /tmp/experts-graphic.webm ../docs/static/img/experts-graphic.webm
cp /tmp/experts-graphic.mp4 ../docs/static/img/experts-graphic.mp4

  6. 检查全部四个文件。每个文件的分辨率都必须为 540x540，时长都必须为 60 秒。Safari MP4 必须报告 major_brand: mp42、compatible_brands: isommp41mp42、Video: hevc (Main) (hvc1) 和 handler_name: Core Media Video。确认匹配的 docs 和 promo-pages 文件校验和相同。

不要提交任何 ProRes MOV。只提交两份 WebM 副本和两份 MP4 副本。

专家数据

数据的唯一真实来源是 packages/promo-pages/src/components/experts/experts-data.tsx。请在 packages/docs/static/img/freelancers 和 packages/promo-pages/public/img/freelancers 中都保留头像，且内容完全相同。

添加或更改专家后，从 packages/docs 渲染其专家卡片：

bun render-cards

确认预期的 packages/docs/static/generated/experts-<slug>.png 已渲染，而不是提示文件已存在。

评论

支持 Markdown