🔄 卡若AI 同步 2026-02-22 09:56 | 更新:总索引与入口、卡木、运营中枢工作台 | 排除 >20MB: 8 个
This commit is contained in:
6
.gitignore
vendored
6
.gitignore
vendored
@@ -91,7 +91,7 @@ _大文件外置/财务管理_data/chat.snapshot_收集.db
|
||||
01_卡资(金)/金仓_存储备份/大文件外置/财务管理_data/chat.snapshot_data.db
|
||||
01_卡资(金)/金仓_存储备份/大文件外置/财务管理_data/chat.snapshot_收集.db
|
||||
01_卡资(金)/金仓_存储备份/服务器管理/scripts/.venv_aliyun/lib/python3.14/site-packages/cryptography/hazmat/bindings/_rust.abi3.so
|
||||
03_卡木(木)/木叶_视频内容/Remotion程序化视频/10秒视频/node_modules/.cache/webpack/remotion-production-4.0.427/a233e9cccba253c3b0157f54cad843b8/0.pack
|
||||
03_卡木(木)/木叶_视频内容/Remotion程序化视频/10秒视频/node_modules/.remotion/chrome-headless-shell/mac-x64/chrome-headless-shell-mac-x64/chrome-headless-shell
|
||||
03_卡木(木)/木叶_视频内容/Remotion程序化视频/10秒视频/node_modules/@rspack/binding-darwin-x64/rspack.darwin-x64.node
|
||||
03_卡木(木)/木叶_视频内容/视频切片/切片动效包装/10秒视频/node_modules/.cache/webpack/remotion-production-4.0.427/a233e9cccba253c3b0157f54cad843b8/0.pack
|
||||
03_卡木(木)/木叶_视频内容/视频切片/切片动效包装/10秒视频/node_modules/.remotion/chrome-headless-shell/mac-x64/chrome-headless-shell-mac-x64/chrome-headless-shell
|
||||
03_卡木(木)/木叶_视频内容/视频切片/切片动效包装/10秒视频/node_modules/@rspack/binding-darwin-x64/rspack.darwin-x64.node
|
||||
# === 自动排除结束 ===
|
||||
|
||||
@@ -1,97 +0,0 @@
|
||||
---
|
||||
name: Remotion程序化视频
|
||||
description: 用 React 程序化生成视频,支持数据驱动、批量、模板化视频与动效。基于 remotion-dev/remotion。
|
||||
group: 木
|
||||
triggers: Remotion、程序化视频、React视频、批量生成视频、数据驱动视频、动效模板
|
||||
owner: 木叶
|
||||
version: "1.0"
|
||||
updated: "2026-02-17"
|
||||
---
|
||||
|
||||
# Remotion 程序化视频
|
||||
|
||||
## 能做什么(Capabilities)
|
||||
|
||||
- **用 React 写视频**:用 CSS/Canvas/SVG/WebGL 定义每一帧
|
||||
- **数据驱动**:变量、API、算法驱动画面变化
|
||||
- **批量生成**:同一模板批量产出(邀请函、封面、通知等)
|
||||
- **动效包装**:片头、转场、图形动画
|
||||
- **与切片协同**:切片产出 + Remotion 包装/合成
|
||||
|
||||
## 怎么用(Usage)
|
||||
|
||||
触发词:**Remotion**、**程序化视频**、**React视频**、**批量生成视频**、**数据驱动视频**、**动效模板**
|
||||
|
||||
## 核心概念速查
|
||||
|
||||
| 术语 | 含义 |
|
||||
|:---|:---|
|
||||
| **Composition** | 视频场景,定义宽高、时长、fps |
|
||||
| **useCurrentFrame()** | 当前帧号,驱动逐帧动画 |
|
||||
| **interpolate()** | 帧间数值插值 |
|
||||
| **Remotion Studio** | 本地预览界面 |
|
||||
| **Remotion Player** | 浏览器嵌入播放器 |
|
||||
|
||||
## 一键开始
|
||||
|
||||
```bash
|
||||
npx create-video@latest
|
||||
```
|
||||
|
||||
选模板后:
|
||||
|
||||
```bash
|
||||
npm run dev # 启动 Remotion Studio 预览
|
||||
npx remotion render # CLI 渲染
|
||||
```
|
||||
|
||||
## 主要包(npm)
|
||||
|
||||
| 包名 | 用途 |
|
||||
|:---|:---|
|
||||
| `remotion` | 核心 API |
|
||||
| `@remotion/player` | 浏览器播放 |
|
||||
| `@remotion/renderer` | Node 渲染 |
|
||||
| `@remotion/lambda` | AWS Lambda 云端渲染 |
|
||||
| `@remotion/three` | 3D 视频 |
|
||||
| `@remotion/lottie` | Lottie 动画 |
|
||||
| `@remotion/captions` | 字幕 |
|
||||
| `@remotion/tailwind` | TailwindCSS |
|
||||
|
||||
## 常用模板
|
||||
|
||||
| 模板 | 用途 |
|
||||
|:---|:---|
|
||||
| Hello World | 入门 |
|
||||
| Audiogram | 音频波形可视化 |
|
||||
| TikTok | 竖屏短视频 |
|
||||
| Three | 3D |
|
||||
| Prompt to Video / Motion | AI 文本→视频/动效 |
|
||||
| TTS Azure / Google | 语音合成 |
|
||||
| Music Visualization | 音乐可视化 |
|
||||
|
||||
## 渲染方式
|
||||
|
||||
| 方式 | 命令/说明 |
|
||||
|:---|:---|
|
||||
| 本地 CLI | `npx remotion render` |
|
||||
| Node 程序 | 使用 `@remotion/renderer` |
|
||||
| AWS Lambda | 大规模并发 |
|
||||
| GitHub Actions | CI 内渲染 |
|
||||
| Vercel | 有专门模板 |
|
||||
|
||||
输出:MP4、图片序列、音频、单帧图。
|
||||
|
||||
## 相关文件
|
||||
|
||||
- 参考资料:`参考资料/Remotion速查.md`
|
||||
- 官方文档:https://www.remotion.dev/docs
|
||||
- API:https://www.remotion.dev/api
|
||||
- 仓库:https://github.com/remotion-dev/remotion
|
||||
- 许可:特殊许可,商用可能需公司授权
|
||||
|
||||
## 依赖(Dependencies)
|
||||
|
||||
- Node 16+ 或 Bun 1.0.3+
|
||||
- React
|
||||
- 前置技能:可与「视频切片」配合使用(切片 → Remotion 包装)
|
||||
@@ -1,29 +0,0 @@
|
||||
# Remotion 速查
|
||||
|
||||
> 来源:remotion-dev/remotion | Stars 37k+
|
||||
|
||||
## 快速命令
|
||||
|
||||
```bash
|
||||
npx create-video@latest
|
||||
npm run dev
|
||||
npx remotion render
|
||||
```
|
||||
|
||||
## 核心 API
|
||||
|
||||
```tsx
|
||||
import { useCurrentFrame, interpolate, Composition, Sequence } from 'remotion';
|
||||
|
||||
// 当前帧号(0-based)
|
||||
const frame = useCurrentFrame();
|
||||
|
||||
// 插值:帧 [0,30] → 值 [0,100]
|
||||
const opacity = interpolate(frame, [0, 30], [0, 1]);
|
||||
```
|
||||
|
||||
## 与视频切片协同
|
||||
|
||||
1. **视频切片**:长视频 → 转录 → 切片 → 字幕烧录
|
||||
2. **Remotion**:片头/片尾包装、数据可视化、批量封面
|
||||
3. 可把切片产物作为 Remotion 的媒体素材输入
|
||||
@@ -1,6 +1,6 @@
|
||||
# 10 秒视频 · 程序化模板
|
||||
|
||||
> 来源:木叶 Remotion程序化视频 | 卡若AI 品牌短片
|
||||
> 来源:木叶 视频切片 · 切片动效包装 | 卡若AI 品牌短片
|
||||
|
||||
## 版本
|
||||
|
||||
65
03_卡木(木)/木叶_视频内容/视频切片/切片动效包装/参考资料/切片动效包装速查.md
Normal file
65
03_卡木(木)/木叶_视频内容/视频切片/切片动效包装/参考资料/切片动效包装速查.md
Normal file
@@ -0,0 +1,65 @@
|
||||
# 切片动效包装速查
|
||||
|
||||
> 视频切片的联动能力。用 React 程序化生成片头/片尾/封面,基于 remotion-dev/remotion。
|
||||
|
||||
## 联动规则(每次执行视频切片时必检查)
|
||||
|
||||
执行 **视频切片** 后,自动判断是否需要联动本能力:
|
||||
|
||||
| 场景 | 是否联动 | 操作 |
|
||||
|:---|:---|:---|
|
||||
| 用户明确要片头/片尾/包装 | ✓ | 调用 10秒视频 模板渲染,再与切片合成 |
|
||||
| 用户说「批量封面」「程序化包装」 | ✓ | 同上 |
|
||||
| 默认 Soul 切片、单视频成片 | 可选 | 提示用户可选用切片动效包装 |
|
||||
|
||||
## 10秒视频模板(卡若AI 品牌)
|
||||
|
||||
路径:`视频切片/切片动效包装/10秒视频/`
|
||||
|
||||
| Composition | 说明 |
|
||||
|:---|:---|
|
||||
| Video10s | 简洁版:渐变 + 标题 + 副标题 |
|
||||
| Video10sRich | 内容丰富版:粒子 + 极限环 + 流动线条 + 多段文字 |
|
||||
|
||||
规格:竖屏 1080×1920,10 秒,30fps。
|
||||
|
||||
### 一键命令
|
||||
|
||||
```bash
|
||||
cd 03_卡木(木)/木叶_视频内容/视频切片/切片动效包装/10秒视频
|
||||
|
||||
# 预览
|
||||
npm run dev
|
||||
|
||||
# 渲染片头(简洁版)
|
||||
npx remotion render src/index.ts Video10s /Users/karuo/Documents/卡若Ai的文件夹/导出/程序化视频/片头.mp4
|
||||
|
||||
# 渲染片头(丰富版)
|
||||
npx remotion render src/index.ts Video10sRich /Users/karuo/Documents/卡若Ai的文件夹/导出/程序化视频/片头_丰富.mp4
|
||||
```
|
||||
|
||||
## 与切片合成流程
|
||||
|
||||
```
|
||||
切片产出(clips_enhanced/)
|
||||
↓
|
||||
【可选】渲染片头/片尾(npx remotion render)
|
||||
↓
|
||||
ffmpeg 合成:片头 + 切片 + 片尾
|
||||
```
|
||||
|
||||
## 核心 API(扩展用)
|
||||
|
||||
```tsx
|
||||
import { useCurrentFrame, interpolate, Composition, Sequence } from 'remotion';
|
||||
const frame = useCurrentFrame();
|
||||
const opacity = interpolate(frame, [0, 30], [0, 1]);
|
||||
```
|
||||
|
||||
## 新建模板
|
||||
|
||||
```bash
|
||||
npx create-video@latest
|
||||
```
|
||||
|
||||
选 TikTok(竖屏)或 Hello World。文档:https://www.remotion.dev/docs
|
||||
@@ -63,3 +63,4 @@
|
||||
| 2026-02-22 09:12:03 | 🔄 卡若AI 同步 2026-02-22 09:12 | 更新:总索引与入口、火种知识模型、运营中枢参考资料、运营中枢工作台 | 排除 >20MB: 8 个 |
|
||||
| 2026-02-22 09:20:12 | 🔄 卡若AI 同步 2026-02-22 09:20 | 更新:金仓、卡木、运营中枢参考资料、运营中枢工作台 | 排除 >20MB: 8 个 |
|
||||
| 2026-02-22 09:27:09 | 🔄 卡若AI 同步 2026-02-22 09:27 | 更新:金仓、卡木、运营中枢工作台 | 排除 >20MB: 8 个 |
|
||||
| 2026-02-22 09:55:19 | 🔄 卡若AI 同步 2026-02-22 09:55 | 更新:金仓、水桥平台对接、水溪整理归档、卡木、运营中枢工作台 | 排除 >20MB: 8 个 |
|
||||
|
||||
@@ -66,3 +66,4 @@
|
||||
| 2026-02-22 09:12:03 | 成功 | 成功 | 🔄 卡若AI 同步 2026-02-22 09:12 | 更新:总索引与入口、火种知识模型、运营中枢参考资料、运营中枢工作台 | 排除 >20MB: 8 个 | [仓库](http://open.quwanzhi.com:3000/fnvtk/karuo-ai) [百科](http://open.quwanzhi.com:3000/fnvtk/karuo-ai/wiki) |
|
||||
| 2026-02-22 09:20:12 | 成功 | 成功 | 🔄 卡若AI 同步 2026-02-22 09:20 | 更新:金仓、卡木、运营中枢参考资料、运营中枢工作台 | 排除 >20MB: 8 个 | [仓库](http://open.quwanzhi.com:3000/fnvtk/karuo-ai) [百科](http://open.quwanzhi.com:3000/fnvtk/karuo-ai/wiki) |
|
||||
| 2026-02-22 09:27:09 | 成功 | 成功 | 🔄 卡若AI 同步 2026-02-22 09:27 | 更新:金仓、卡木、运营中枢工作台 | 排除 >20MB: 8 个 | [仓库](http://open.quwanzhi.com:3000/fnvtk/karuo-ai) [百科](http://open.quwanzhi.com:3000/fnvtk/karuo-ai/wiki) |
|
||||
| 2026-02-22 09:55:19 | 成功 | 成功 | 🔄 卡若AI 同步 2026-02-22 09:55 | 更新:金仓、水桥平台对接、水溪整理归档、卡木、运营中枢工作台 | 排除 >20MB: 8 个 | [仓库](http://open.quwanzhi.com:3000/fnvtk/karuo-ai) [百科](http://open.quwanzhi.com:3000/fnvtk/karuo-ai/wiki) |
|
||||
|
||||
Reference in New Issue
Block a user