Video sản phẩm bằng React và Remotion: khung điền tên, tính năng, người dùng, lợi ích

Tóm tắt: Prompt giao vai nhà phát triển sáng tạo kiêm thiết kế motion, nhắc nghĩ về bố cục, chữ, nhịp và câu chuyện trước khi viết code.

Prompt giao cho Claude vai một nhà phát triển sáng tạo kiêm thiết kế motion graphics, dựng một video sản phẩm tinh tế chỉ bằng code với React và Remotion. Coi đây là một dự án motion graphics nhỏ: nghĩ về mối quan hệ giữa bố cục, chữ, nhịp và câu chuyện hình ảnh so với phần lập trình. Cuối prompt là bốn ô để điền: tên sản phẩm, tính năng, người dùng mục tiêu, lợi ích chính.

Vì sao nhiều người dừng lại xem?

Câu "nghĩ về bố cục, chữ, nhịp trước phần lập trình" đẩy Claude làm việc như nhà thiết kế, không chỉ như lập trình viên. Bốn ô thông tin ngắn gọn bắt bạn tự trả lời sản phẩm dành cho ai và giúp gì, đó cũng là phần khó nhất khi làm video giới thiệu.

Cách dùng với Claude Opus 5.5

Remotion là thư viện dựng video bằng React, nên prompt này cần Claude Code và máy đã cài Node.js. Điền bốn ô ở cuối prompt, dán vào một thư mục trống, để Claude tạo dự án và xuất video.

Prompt

Prompt gốc của tác giả:

You are a creative developer and motion graphics designer. Build a refined product video entirely through code using React and Remotion.

Treat this as a small motion graphics project. Think about the relationship between composition, typography, rhythm, and visual narrative versus implementation.

Project Details

Product Name: [Product Name]

Product Features: [Short Description]

Target Audience: [Audience]

Main Benefit: [One Clear Benefit]

Prompt by @shengtang135754, via Skillry / awesome-opus5-5-videos (MIT)

Câu hỏi thường gặp

Prompt này tạo ra cái gì?

Prompt giao cho Claude vai một nhà phát triển sáng tạo kiêm thiết kế motion graphics, dựng một video sản phẩm tinh tế chỉ bằng code với React và Remotion.

Muốn tự làm video sản phẩm bằng React và Remotion, bạn chuẩn bị những gì?

Bài này không gói gọn trong một file HTML: quy trình dùng Node.js, Remotion. Bạn cần để Claude chạy được lệnh trên máy, ví dụ Claude Code mở trong một thư mục trống, và cài sẵn Node.js nếu máy chưa có. Mình dùng Claude Opus 5.5; Claude tự viết code, tự chạy và xuất ra file video.

Prompt của @shengtang135754 có được sửa lại cho việc của bạn không?

Được. Prompt là của @shengtang135754, mình lấy qua Skillry và bộ awesome-opus5-5-videos (giấy phép MIT). Chỗ nên đổi trước là tên thương hiệu, câu chữ, màu và thời lượng. Khi chia sẻ lại, bạn ghi nguồn @shengtang135754 là đủ.

Previous
Previous

Video phổ biến khoa học theo khung: một câu hỏi, có móc tò mò, dẫn nguồn gốc

Next
Next

Video pixel toàn bộ tiến trình loài người, rồi thêm 30 năm tới