Prompt này hướng dẫn tạo một video quảng bá dài 30 giây cho prompts.chat bằng cách sử dụng Remotion. Nội dung phác thảo các tài nguyên bắt buộc, bảng màu chủ đề, kiểu phông chữ và cấu trúc phân cảnh để giới thiệu hiệu quả các tính năng cũng như cộng đồng của nền tảng. Prompt bao gồm các kỹ thuật hoạt ảnh (animation) và hiệu ứng chuyển cảnh nhằm đảm bảo trải nghiệm xem mượt mà, cuốn hút, nhấn mạnh phạm vi tiếp cận toàn cầu của nền tảng và sự đa dạng của các loại prompt hiện có.
Tạo một video quảng bá dài 30 giây cho prompts.chat
Tài nguyên Bắt buộc
- https://prompts.chat/logo.svg - Tệp SVG Logo
- https://raw.githubusercontent.com/flekschas/simple-world-map/refs/heads/master/world-map.svg - Tệp SVG bản đồ thế giới dùng cho cảnh cộng đồng toàn cầu
Chủ đề Màu sắc (Giao diện Sáng - Light)
- Nền chính (Background): #ffffff
- Nền phụ (Background Alt): #f8fafc
- Màu chủ đạo (Primary): #6366f1 (Chàm - Indigo)
- Màu chủ đạo nhạt (Primary Light): #818cf8
- Màu nhấn (Accent): #22c55e (Xanh lá - Green)
- Chữ chính (Text): #0f172a
- Chữ mờ (Text Muted): #64748b
Phông chữ
- Inter (độ đậm: 400, 600, 700, 800)
---
Cấu trúc Phân cảnh (8 Cảnh)
Cảnh 1: Mở đầu (5s)
- Logo xuất hiện
- Logo đặt chính giữa, phóng to dần vào khung hình với hiệu ứng hoạt ảnh lò xo (spring animation)
- Sau hoạt ảnh logo: dòng chữ "prompts.chat" lộ diện từ trái sang phải ngay bên dưới logo bằng thuộc tính clip-path
- Dòng khẩu hiệu (tagline) xuất hiện: "The Free Social Platform for AI Prompts"
Cảnh 2: Cộng đồng Toàn cầu (4s)
- Bản đồ thế giới toàn màn hình (độ mờ 25% opacity) làm phông nền
- 16 chấm tròn hoạt động nhấp nháy lan tỏa (pulsing dots) tại các thành phố lớn (LA, NYC, Toronto, Sao Paulo, London, Paris, Berlin, Lagos, Moscow, Dubai, Mumbai, Beijing, Tokyo, Singapore, Sydney, Warsaw)
- Mỗi chấm có vòng xung nhịp bên ngoài, xung nhịp bên trong và chấm tâm phát sáng
- Tiêu đề: "A global community of prompt creators"
- Hàng thống kê số liệu: 8k+ users, 3k+ daily visitors, 1k+ prompts, 300+ contributors, 10+ languages
- Lớp phủ chuyển màu (gradient overlay) ở phía dưới cùng để đảm bảo chữ dễ đọc
Cảnh 3: Giải pháp (2.5s)
- Ba từ xuất hiện nối tiếp nhau với hoạt ảnh lò xo (spring animation): "Discover." "Share." "Collect."
- Mỗi từ mang một màu sắc khác nhau (primary, accent, primary light)
Cảnh 4: Được Xây dựng cho Tất cả Mọi người (4s)
- 8 biểu tượng chân dung người dùng (persona icons) trôi nổi quanh rìa màn hình với hoạt ảnh lơ lửng theo sóng sin/cos
- Các nhóm người dùng: Students, Teachers, Researchers, Developers, Artists, Writers, Marketers, Entrepreneurs
- Mỗi mục có khung chứa biểu tượng kích thước 130x130 với nền và viền màu tương ứng
- Tiêu đề chính giữa: "Built for everyone"
- Phụ đề: "One prompt away from your next breakthrough."
Cảnh 5: Các Loại Prompt (5s)
- Tiêu đề: "Prompts for every need"
- Khung giao diện kiểu trình duyệt (1400x800) có cụm nút đèn giao thông macOS và thanh URL hiển thị "prompts.chat"
- Ảnh chụp màn hình dạng lưới xếp gạch (masonry skeleton) cuộn dọc mượt mà với hoạt ảnh gia tốc (cubic ease-in-out)
- 7 nhãn hình viên thuốc (pill-shaped) trôi nổi quanh rìa kèm biểu tượng:
- Text (tím purple), Image (hồng pink), Video (vàng hổ phách amber), Audio (xanh lá green), Workflows (tím violet), Skills (xanh mòng két teal), JSON (đỏ red)
Cảnh 6: Tính năng Nổi bật (4s)
- 4 thẻ tính năng (feature cards) xuất hiện lần lượt với hoạt ảnh lò xo (spring animation):
- Prompt Library (biểu tượng cuốn sách) - "Thousands of prompts across all categories"
- Skills & Workflows (biểu tượng tia sét) - "Automate multi-step AI tasks"
- Community (biểu tượng nhóm người dùng) - "Share and discover from creators"
- Open Source (biểu tượng dấu cộng trong vòng tròn) - "Self-host with complete privacy"
Cảnh 7: Bằng chứng Xã hội / Uy tín (4s)
- Bộ đếm số sao GitHub chạy hoạt ảnh tăng dần (0 → 143,000+)
- Biểu tượng ngôi sao nằm cạnh con số
- Huy hiệu (Badge): "The First Prompt Library — Since December 2022" kèm biểu tượng chiếc cúp
- Văn bản: "Endorsed by OpenAI co-founders • Used by Harvard, Columbia & more"
Cảnh 8: Lời kêu gọi Hành động - CTA (3.5s)
- Hoạt ảnh nền phát sáng (dải chuyển màu tỏa tròn radial gradient co giãn nhẹ)
- Tiêu đề: "Start exploring today"
- Nút bấm lớn có logo + chữ "prompts.chat" (nền chuyển màu gradient, hiệu ứng nhịp đập nhẹ)
- Phụ đề: "Free & Open Source"
---
Hiệu ứng Chuyển cảnh (0.4s mỗi lần chuyển)
- Cảnh 1→2: Mờ dần (Fade)
- Cảnh 2→3: Trượt vào từ bên phải (Slide from right)
- Cảnh 3→4: Mờ dần (Fade)
- Cảnh 4→5: Mờ dần (Fade)
- Cảnh 5→6: Trượt vào từ bên phải (Slide from right)
- Cảnh 6→7: Trượt lên từ phía dưới (Slide from bottom)
- Cảnh 7→8: Mờ dần (Fade)
Các Kỹ thuật Hoạt ảnh Được Sử dụng
- `spring()` cho các hoạt ảnh co giãn tỷ lệ có độ nảy
- `interpolate()` cho độ mờ (opacity), vị trí (position) và vùng cắt (clip-path)
- `Easing.inOut(Easing.cubic)` cho chuyển động cuộn trang mượt mà
- `Math.sin()/Math.cos()` cho các hoạt ảnh trôi nổi lơ lửng
- Độ trễ lệch nhịp (Staggered delays) cho các phần tử xuất hiện nối tiếp nhau
Các Thành phần (Components) Chính
- Các component biểu tượng SVG tùy chỉnh cho toàn bộ icon (không dùng emoji)
- Component Logo với đường vẽ вектор chữ "P" của prompts.chat
- Component `FeatureCard` có thể tái sử dụng
- `TransitionSeries` để quản lý chuỗi chuyển tiếp giữa các cảnh