Cách tự động chuyển dữ liệu trực tiếp thành video có thể chia sẻ
(recoveredfactory.net)- Đã xây dựng một workflow dựa trên web để biến dữ liệu trực tiếp được cập nhật vài ngày một lần thành video cho mạng xã hội mà không cần con người phải biên tập lại mỗi lần
- Nguồn gốc của video không phải là tệp dựng mà là một trang web ẩn, nơi Playwright điều khiển trình duyệt theo từng khung hình và ffmpeg ghép chúng thành MP4 và GIF
- Một file storyboard.ts ngắn cùng một playhead duy nhất sắp xếp số liệu hôm nay, hiệu ứng fade, điểm bắt đầu tháng 12 năm 2024 và giai đoạn tăng trưởng 18 tháng thành một clip khoảng 14 giây
- GitHub Action chạy theo lịch phát hiện thay đổi dữ liệu để build lại và triển khai lại trang, đồng thời tạo 4 bản cắt theo tỷ lệ khung hình và ngôn ngữ rồi xuất bản lên CDN CloudFront
- YouTube cho phép tải lên bản nháp không công khai nhưng Instagram chỉ hỗ trợ đăng công khai ngay lập tức, nên vẫn giữ bước phê duyệt của con người để rà soát cuối cùng và chỉnh sửa chú thích
Cấu trúc dùng trang web làm nguồn video
- Video không bắt đầu từ một dự án dựng riêng mà từ một trang chuyên dụng ẩn bên trong website
- Trang này được thiết kế cho màn hình 9:16 dọc dùng trên Reels, Shorts và TikTok
- Màn hình tái sử dụng các thành phần sẵn có của site trực tiếp
- Tiêu đề
- Con số tổng lớn
- Biểu đồ động
- Bản đồ toàn quốc
- Dòng credit nhỏ
- Hệ thống tận dụng animation theo timeline và hiệu ứng chuyển động của trình duyệt web, còn máy tính điều khiển một trình duyệt headless mà người dùng không nhìn thấy
- Có thể mở trực tiếp trong trình duyệt như một trang web thông thường để tua tới lui nhằm xem trước và debug
- Nó kế thừa nguyên vẹn framework đa ngôn ngữ của site để có thể capture video theo từng ngôn ngữ được hỗ trợ
- Asset bakery, pipeline dữ liệu và frontend của dự án này đã được công khai dưới dạng open source
storyboard.ts và playhead
- Chỉ một file storyboard.ts định nghĩa nhịp thời gian và chuyển cảnh của video như shot list của đạo diễn
- Cấu trúc gồm một vài beat có tên và thời lượng của chúng
- Giữ số liệu tổng của hôm nay trong 1,5 giây
- Fade 0,7 giây
- Giữ điểm tháng 12 năm 2024, nơi dữ liệu bắt đầu, trong 1,5 giây
- Sau đó phát tiến giai đoạn tăng trưởng 18 tháng
- Rồi quay lại ổn định ở màn hình của hôm nay
- Thành phẩm cuối cùng là một clip khoảng 14 giây
- Việc vẽ biểu đồ, hiển thị điểm trên bản đồ và tăng bộ đếm đều được gắn vào một playhead duy nhất để cùng chuyển động
- Playhead buộc mọi thành phần render cùng một trạng thái tại một timestamp cụ thể, giúp các yếu tố trên màn hình không bị lệch nhau
Cách “nướng” theo từng khung hình
- Tệp video thực tế được tạo bằng cách mở trang web trong trình duyệt headless và dùng Playwright để điều khiển Chromium
- Ban đầu người ta cho rằng có thể nhấn nút phát ảo rồi capture bằng ghi màn hình, nhưng ghi theo thời gian thực có thể gây rớt khung hình hoặc giật
- Cùng một video có thể chạy mượt trên máy local nhưng hoạt động khác trên phần cứng cloud, và trong các thử nghiệm đầu tiên đôi khi còn phát nhanh bất thường
- Để có kết quả ổn định hơn, thay vì ghi theo thời gian thực, hệ thống tạo từng khung hình như một flipbook
- Yêu cầu trang “hãy hiển thị trạng thái ở mốc 0,04 giây”
- Chụp screenshot
- Chuyển sang 0,08 giây rồi chụp lại
- Lặp lại quá trình này hàng trăm lần
- Vì tiến trình giống như lật từng trang của một trang giấy đứng yên, mỗi ảnh đều được capture ở trạng thái đã render hoàn chỉnh
- Kết quả là mang tính xác định và có thể kiểm thử, nghĩa là chạy hai lần phải cho ra các khung hình giống hệt nhau để xác minh
- Nếu tăng gấp đôi số khung hình thì thời gian tính toán và dung lượng lưu trữ cần cho việc render cũng tăng gần gấp đôi
Các xử lý chi tiết để ổn định render trên server
- Bản đồ toàn quốc dùng MapLibre GL JS, vốn thường render bằng mã WebGL kỳ vọng có GPU
- Vì server không có GPU nên Chromium được cấu hình dùng render bằng phần mềm
- Chậm hơn phần cứng đồ họa thực
- Nhưng có thể chạy với chất lượng gần như giống nhau trên hầu hết nền tảng
- Mỗi khung hình được lưu dưới dạng JPEG thay vì PNG
- Mã hóa PNG là phần chậm trong quá trình chụp screenshot
- Video đầu ra trông vẫn như nhau nên có lợi về tốc độ trên toàn bộ hàng trăm khung hình
- Cần một vài flag để trình duyệt headless chạy ổn định trên bare server bên trong container, và toàn bộ chi tiết có trong kho mã nguồn công khai
- Hàng trăm ảnh được tạo ra sau đó được ffmpeg nối lại thành MP4 và GIF lặp
Tự động hóa dựa trên GitHub Action
- Toàn bộ quá trình được nối vào pipeline dữ liệu tự động chạy bằng GitHub Action theo lịch
- Hệ thống kiểm tra mỗi ngày xem dữ liệu đã thay đổi bao nhiêu lần
- Khi có dữ liệu mới, job sẽ thực hiện
- Build lại site
- Triển khai lại site
- Tạo 4 bản cắt theo tổ hợp tỷ lệ vuông/dọc và tiếng Anh/tiếng Tây Ban Nha
- Xuất bản lên CDN CloudFront
- Trang tải xuống công khai cung cấp bản cắt mới nhất cho từng ngôn ngữ được hỗ trợ
- Bước cuối bao gồm tải bản nháp lên YouTube và gửi thông báo sẵn sàng đăng Instagram
- Script cho YouTube là publish-social-youtube.mjs
- Thông báo chuẩn bị đăng Instagram là notify-social-ready.mjs
- Tích hợp TikTok cũng đã được lên kế hoạch
Ranh giới giữa tự động hóa và kiểm soát biên tập
- Dự án này không loại trừ hoàn toàn tự động hóa, nhưng vẫn giữ khâu rà soát của con người trước khi mọi video được xuất bản
- Con người phụ trách kiểm soát biên tập với headline và caption, review cuối cùng và quyết định cách đăng
- Hệ thống tránh đăng tự động một cách mù quáng vì dữ liệu đầu vào có thể kém hoặc hệ thống có thể tạo ra kết quả sai
- YouTube dùng API chính thức để tạo video nháp không công khai
- API của Instagram chỉ hỗ trợ đăng công khai ngay lập tức, nên mỗi khi có dữ liệu mới hệ thống sẽ tạo bản nháp YouTube và gửi email nhắc phải đăng Instagram thủ công
Sản xuất video mạng xã hội kết thúc ở thiết kế web
- Ưu điểm của cách làm này là thiết kế video đồng thời cũng chính là thiết kế web
- Không phụ thuộc vào After Effects, xuất lại thủ công, số liệu cũ hay một web producer quá bận rộn
- Thay đổi màu sắc hay nhãn chỉ cần sửa một dòng và sẽ được phản ánh ở lần render tiếp theo
- Toàn bộ hệ thống được cấu thành từ vài trăm dòng glue code xoay quanh các công cụ sẵn có
- Pipeline dữ liệu
- Trình duyệt headless
- Bản đồ và biểu đồ vốn đã dùng trên site
- ffmpeg
- Chi phí vận hành chỉ ở mức vài đô la mỗi tháng
- Missouri Vehicle Stops MCP được nêu ra để so sánh hiện có vẻ tốn khoảng 50 USD mỗi tháng
- Asset bakery có chi phí trên mỗi người dùng thấp hơn MCP, còn MCP gần với một công cụ mang lại mức độ tương tác dữ liệu sâu hơn
Chiến lược và vai trò của “shortcut”
- Đây là chiến lược vừa đáp ứng các nền tảng phổ biến bằng tài sản tự động tạo chất lượng cao để chia sẻ, vừa hỗ trợ các công cụ dữ liệu hiện đại như MCP cho những người dùng muốn đi sâu hơn
- Mục tiêu không phải là một màn xiếc viral, cũng không phải một sản phẩm duy nhất dành cho một “đại chúng” mơ hồ hoặc cho tất cả mọi người
- Shortcut không phải mánh khóe, mà là cách tận dụng những nguồn lực đã có để đi xa hơn và bớt kiệt sức hơn
- Khi gắn kết các tài nguyên sẵn có bằng GitHub Action, bạn chỉ cần nghĩ đến video khi thực sự muốn làm video hoặc khi tình huống thực sự đòi hỏi
Chưa có bình luận nào.