Tóm tắt nhanh:
ak-remotionlà skill kiến thức cho video làm bằng code React: nó mang 29 chủ đề luật của Remotion và chỉ đọc đúng phần cần cho việc bạn nhờ. Xong việc, nó kiểm lại video thật, không lấy preview làm bằng chứng. Video soạn bằng HTML/CSS thì dùngak-hyperframes.
Công khai: mình là maintainer của AgentKit và có quan hệ affiliate: link AgentKit trong bài là link affiliate, mua qua link này bạn được giảm 30%.
Tóm tắt
Dùng khi bạn làm video giới thiệu, video biểu đồ từ dữ liệu, thêm phụ đề, hay sửa một project Remotion bị nháy khi render. Không cần khi video soạn bằng HTML/CSS với thuộc tính thời gian data-*.
flowchart LR
A["Ý tưởng video hoặc code Remotion"] --> B{"Soạn bằng component React?"}
B -->|"Có"| C["ak-remotion"]
B -->|"Không, HTML/CSS"| D["ak-hyperframes"]
C --> E["Composition + code cảnh"]
E --> F["Video đã kiểm, kèm phần chưa kiểm được"]Bốn khái niệm cần nắm:
| Khái niệm | Câu hỏi | Ví dụ |
|---|---|---|
| Chuyển động theo khung hình | Vì sao hiệu ứng phải tính từ số khung hình chứ không dùng CSS? | Độ mờ tính bằng interpolate(frame, [0, 2 * fps], [0, 1]) thay cho transition: opacity 2s |
| Composition | Video này có ID gì, kích thước, fps, dài bao nhiêu khung? | Composition Promo 1920x1080, 30 fps, 450 khung (15 giây) |
| Sequence và thời gian | Cảnh nào xuất hiện lúc nào, dài bao lâu? | Tiêu đề nằm trong một Sequence bắt đầu ở giây 1, dài 2 giây; cảnh nối tiếp dùng Series |
| Bằng chứng xong | Lấy gì để chắc video đúng? | File mp4 đã render, đúng kích thước, fps, thời lượng, asset đủ, âm thanh khớp hình |
Thời gian luôn viết theo giây rồi nhân với fps, nên đổi fps không làm lệch nhịp video.
Prompt mẫu cho một video giới thiệu:
/ak-remotion Làm video giới thiệu <tên sản phẩm> dài 15 giây, 1920x1080, 30 fps.
Cảnh: logo hiện dần, tên sản phẩm bật vào, 3 tính năng lần lượt, cảnh cuối có lời kêu gọi.
Nhạc nền public/music.mp3, nhỏ dần trong 2 giây cuối.
Xong khi: render ra file mp4 và đã kiểm kích thước, fps, thời lượng, nhạc khớp hình.Skill này không có cờ.
Phần dưới đây là bản chi tiết: luồng chạy, 4 tình huống kèm prompt, lịch sử thay đổi theo bản ak và các lỗi hay vấp. Bản chi tiết và trang trực quan dành cho subscriber. Agent của bạn cũng tìm được trong đó qua MCP của portal.
Mở khi tài khoản có quyền subscriber
Bài này dành cho subscriber
Khi tài khoản có quyền, toàn bộ bài, bản visual tương tác và lệnh gọi từ agent đều mở.
- Đăng nhập hoặc tạo tài khoản modernEngineerQuyền đọc gắn với email tài khoản.
- Chọn gói trên trang Bảng giáGói 1, 3 hoặc 12 tháng, trả bằng chuyển khoản VietQR. Quyền đọc mở khoảng một phút sau khi tiền về.
- Hoặc nhập mã Facebook subscriberNgười ủng hộ trang qua Facebook nhận mã kích hoạt qua tin nhắn mỗi tháng.
Đã là subscriber? Đăng nhập để đọc.
Dùng bài này trong agent của bạn
Lấy API keyChép đoạn dưới, dán vào Claude Code, Codex hay agent bạn đang dùng. Agent đọc bài rồi đối chiếu với repo đang mở.
Đọc bài "ak-remotion: làm video bằng React với Remotion" trên modernEngineer rồi áp dụng vào repo này.
1. Gọi tool content_get của MCP server modernengineer với locale "vi", slug "ak-remotion". Nếu chưa nối MCP server modernengineer, dừng lại và hướng dẫn tôi nối theo https://modernengineer.dev/vi/mcp.
2. Tóm tắt các bước chính của bài, chỉ ra bước nào áp dụng được cho repo này.
3. Đề xuất thay đổi cụ thể và hỏi tôi trước khi sửa file.Nối MCP cho Claude Code (một lần)
claude mcp add --transport http modernengineer \
https://api.modernengineer.dev/mcp \
--header "Authorization: Bearer <API key>"Đọc trọn bài qua MCP cần API key của tài khoản subscriber hoặc đã mua guide này. Không có quyền, agent sẽ chỉ đọc được phần mở đầu.
- Phiên bản
- v1.0.0
- Cập nhật
- 22/10/2026
- Giấy phép
- Bảo lưu mọi quyền
- Slug
- ak-remotion
