# BẢNG CHECKLIST TÀI NGUYÊN BỔ SUNG TRANG CHỦ ### Cửu Long Media & Technology (Creative Production Studio & Tech Agency) > Tài liệu này liệt kê chi tiết các tài nguyên thực tế cần đội ngũ quản trị / media sản xuất cung cấp để thay thế các vị trí placeholder `` trên trang chủ (`resources/views/home.blade.php`). --- ## 1. Danh Sách Tài Nguyên Cần Cung Cấp | STT | Vị Trí Section | Loại Tài Nguyên | SL | Định Dạng Khuyến Nghị | Độ Phân Giải / Thông Số Kỹ Thuật | Ghi Chú Yêu Cầu | |:---:|:---|:---|:---:|:---:|:---|:---| | **1** | **Section 2: Showreel** | Video Master Showreel (Desktop) | 1 | MP4 (H.264/H.265) + WebM | **1080p (1920x1080)** hoặc 4K, 30-60s, bitrate ~8-12 Mbps, âm thanh stereo 48kHz | Đoạn phim tổng hợp các cảnh quay đẹp nhất, TVC, sự kiện đã thực hiện. Đã qua xử lý màu. | | **2** | **Section 2: Showreel** | Video Showreel (Mobile) | 1 | MP4 (H.264) + WebM | **720p (1280x720)**, 30-60s, bitrate ~3-5 Mbps, tối ưu dung lượng < 15MB | Nén tối ưu cho mạng di động 4G/5G, tải mượt trên iPhone/Android. | | **3** | **Section 2: Showreel** | Poster Frame Tĩnh | 1 | WebP / JPG | **1920x1080**, dung lượng < 250KB | Frame hình ấn tượng nhất của showreel, hiển thị trước khi bấm play. | | **4** | **Section 2: Showreel** | File Phụ Đề / Transcript | 1 | VTT (`.vtt`) | Tiếng Việt UTF-8 chuẩn WebVTT | Dành cho người khiếm thính hoặc xem không bật tiếng. | | **5** | **Section 4: Quy Trình** | Ảnh gốc RAW Flat (S-Log3) | 1 | WebP / JPG | **1920x1080**, cùng frame với ảnh color grade | Ảnh quay từ máy RED hoặc Sony FX6 ở chế độ flat/log chưa qua chỉnh màu (nhạt màu, tương phản thấp). | | **6** | **Section 4: Quy Trình** | Ảnh Final Color Grade | 1 | WebP / JPG | **1920x1080**, chuẩn màu điện ảnh | Ảnh sau khi đã cân chỉnh màu (Color Grading) hoàn chỉnh trong DaVinci Resolve (Teal & Orange). | | **7** | **Section 9: Case Studies** | Video Preview Ngắn (Hover Play) | 3 - 5 | MP4 / WebM | **720p (1280x720)**, độ dài 10-15s, loop vô hạn, không tiếng, dung lượng < 5MB/clip | Dùng cho hiệu ứng tự động phát preview khi di chuột qua card dự án Video/TVC. | | **8** | **Section 9: Case Studies** | Ảnh chụp Full-page Web/App | 2 - 3 | WebP / PNG | Chiều rộng **1200 - 1440px**, chiều dài đầy đủ toàn trang | Chụp cuộn từ đầu đến chân trang web/app thật (không cắt xén), dùng cho hiệu ứng Live Scroll mockup. | | **9** | **Section 10: Hậu Trường** | Ảnh Ekip Quay Phim Thực Địa | 1 | WebP / JPG | Tỉ lệ 16:9 ngang (**1200x675**) | Bắt trọn khoảnh khắc đạo diễn, quay phim, gimbal/boom tác nghiệp tại bối cảnh sông nước Mekong. | | **10** | **Section 10: Hậu Trường** | Ảnh Phòng Master Color Grading | 1 | WebP / JPG | Tỉ lệ 4:3 hoặc 1:1 (**800x800**) | Bàn máy DaVinci Resolve Studio, bảng màu Micro Panel, màn hình tham chiếu EIZO. | | **11** | **Section 10: Hậu Trường** | Ảnh Họp Kỹ Thuật & Code Sprint | 1 | WebP / JPG | Tỉ lệ 4:3 hoặc 1:1 (**800x800**) | Đội ngũ lập trình thảo luận kiến trúc hệ thống, màn hình hiển thị code/diagram. | | **12** | **Section 10: Hậu Trường** | Ảnh Tác Nghiệp Flycam / Gimbal | 1 | WebP / JPG | Tỉ lệ 16:9 hoặc 3:2 (**800x533**) | Pilot điều khiển drone DJI Mavic 3 Cine săn góc bình minh hoặc flycam trên sông. | | **13** | **Section 10: Hậu Trường** | Ảnh Bàn Dựng Phim Premiere/AE | 1 | WebP / JPG | Tỉ lệ 16:9 hoặc 3:2 (**800x533**) | Góc làm việc dựng phim đa màn hình, timeline hàng chục track video/audio. | | **14** | **Trang Media: Case Studies** | Video/Ảnh Thumbnail Sacombank | 1 | MP4 / WebP | 720p (1280x720) | Cần ảnh/khung hình thật trích từ clip quay Sacom Nha Trang. Không dùng AI/Stock. | | **15** | **Trang Media: Case Studies** | Video/Ảnh Thumbnail Hoya Lens | 1 | MP4 / WebP | 720p (1280x720) | Cần ảnh thật từ dự án Team Building & Gala Mũi Né. Không dùng AI/Stock. | | **16** | **Trang Media: Case Studies** | Video/Ảnh Thumbnail RAKUS | 1 | MP4 / WebP | 720p (1280x720) | Cần ảnh thật từ dự án Team Building Nha Trang. Không dùng AI/Stock. | | **17** | **Trang Media: Case Studies** | Video/Ảnh Thumbnail Kredivo | 1 | MP4 / WebP | 720p (1280x720) | Cần ảnh thật từ dự án Dạ Tiệc Kredivo TP.HCM. Không dùng AI/Stock. | --- ## 2. Hướng Dẫn Nén Video Chuẩn Web Bằng FFmpeg Nếu bạn có file video gốc chất lượng cao từ bàn dựng (ProRes hoặc MP4 dung lượng lớn), vui lòng chạy các lệnh FFmpeg sau để nén thành chuẩn web-ready trước khi lưu vào `public/videos/`: ```bash # 1. Tạo bản 1080p Web-ready (bitrate ~10Mbps, preset slow, audio AAC 192k) ffmpeg -i showreel_master.mov -c:v libx264 -preset slow -crf 20 -maxrate 12M -bufsize 24M -pix_fmt yuv420p -movflags +faststart -c:a aac -b:a 192k showreel-1080p.mp4 # 2. Tạo bản 720p Mobile (bitrate ~4Mbps) ffmpeg -i showreel_master.mov -vf scale=1280:720 -c:v libx264 -preset slow -crf 22 -maxrate 5M -bufsize 10M -pix_fmt yuv420p -movflags +faststart -c:a aac -b:a 128k showreel-720p.mp4 # 3. Tạo bản WebM cho trình duyệt hiện đại ffmpeg -i showreel_master.mov -c:v libvpx-vp9 -b:v 8M -c:a libopus -b:a 128k showreel-1080p.webm # 4. Trích xuất poster frame (lấy frame tại giây thứ 5) ffmpeg -ss 00:00:05 -i showreel_master.mov -vframes 1 -q:v 2 showreel-poster.webp ``` --- ## 3. Thư Mục Lưu Trữ Đề Xuất - Video: `public/videos/` (Ví dụ: `public/videos/showreel-1080p.mp4`, `public/videos/showreel-720p.mp4`) - Ảnh Before/After: `public/images/pipeline/` (Ví dụ: `raw-slog3.webp`, `graded-cine.webp`) - Ảnh Hậu trường: `public/images/bts/` (Ví dụ: `bts-shooting-1.webp`, `bts-colorist-2.webp`, ...) - Screenshot Web/App: `public/images/case-studies/` (Ví dụ: `vmedia-fullpage.webp`, `martech-fullpage.webp`)