用途：在 @remotion/effects 包中新增一个效果时使用本技能，按既定流程完成从实现到文档、测试与预览资源的全部改动。
主要能力与流程：
- 选择效果形态：新效果优先使用 WebGL2 后端，仅当 WebGL 无法表达时才用 2D。简单效果用单文件 packages/effects/src/<effect-name>.ts；需要多个着色器、运行时辅助或多个文件时用目录加顶层再导出文件。命名遵循包内既有约定：文件/子路径用 kebab-case，函数用 camelCase，参数类型用 PascalCase，效果类型字符串为 remotion/<kebab-case-name>。
- 实现效果：从 remotion 导入 SequenceSchema 与 Internals，使用 const {createEffect, createWebGL2ContextError} = Internals;。定义默认值常量、用 satisfies SequenceSchema 定义 schema、导出参数类型、在 resolve() 中解析默认值、用 validate-effect-param.ts 与 color-utils.ts 的辅助函数校验参数；WebGL2 不可获取时抛出 createWebGL2ContextError('<effect name> effect')；documentationLink 指向 https://www.remotion.dev/docs/effects/<slug>；calculateKey() 需包含所有已解析参数。可参考 halftone.ts、blur/blur-runtime.ts、chromatic-aberration/chromatic-aberration-runtime.ts、wave/wave-runtime.ts。
- 注册包入口：更新 packages/effects/bundle.ts 与 packages/effects/package.json 的 exports 和 typesVersions；目录实现需加顶层再导出文件。
- 测试：更新 packages/effects/src/test/effect-params.test.ts，覆盖文档链接、默认参数、必填参数、非法值与错误子串、不同参数产生不同 effectKey。运行 cd packages/effects 后 bun test src/test 与 bunx turbo make --filter="@remotion/effects"。
- 文档：创建 packages/docs/docs/effects/<effect-name>.mdx，按既有页面格式写 frontmatter、H1、EffectsDemo、twoslash 示例、各选项小节、disabled? 与 See also；更新 sidebars.ts 与 table-of-contents.tsx，articles.ts 由卡片生成器生成。
- 交互演示：创建 packages/docs/components/effects/effects-<effect-name>-preview.tsx，使用 fit="cover"，并在 effects-demos/registry.ts 注册。
- 目录预览：在 packages/docs/src/remotion/Root.tsx 添加 Still，用 bunx remotion still 渲染 PNG，提交组合与图片。
- 生成文档卡片：cd packages/docs 后运行 bun render-cards.ts，提交生成图片与 frontmatter 的 image 行。
- 更新 Remotion 技能：在 packages/skills/skills/remotion/SKILL.md 的 Available effects 行加入 effectName()，顺序与 table-of-contents.tsx 一致，保持简洁。
- 格式化与验证：cd packages/effects 后 bunx oxfmt src --write，再 cd ../.. 运行 bun run build 与 bun run formatting；提交前检查 git diff --check 与 git status --short。
限制与常见问题：不要遗漏 package.json 的 exports 与 typesVersions，否则子路径导入不可用；不要遗漏 bundle.ts；不要忘记更新 SKILL.md 的效果列表；不要在 packages/docs/src/remotion 留下临时渲染入口；不要用手写 SVG 作为效果目录预览；除非效果有意改变 alpha，否则保留 alpha；像素计算需注意画布存储预乘 alpha，WebGL 颜色计算常需先反预乘再计算亮度或阈值，最后再预乘输出。