Độ trong suốt của video trên Chrome

François Beaufort
François Beaufort

Tính minh bạch alpha trong video trên Chrome

Chrome 31 hiện hỗ trợ độ trong suốt alpha của video trong WebM.

Nói cách khác, Chrome sẽ xem xét kênh alpha khi phát các video "màn hình xanh lục" được mã hoá thành WebM (VP8VP9) bằng kênh alpha. Điều này có nghĩa là bạn có thể phát video có nền trong suốt: trên trang web, hình ảnh hoặc thậm chí là video khác.

Bạn có thể xem bản minh hoạ tại simpl.info/videoalpha. Khá siêu thực và hơi thô ở các cạnh (theo nghĩa đen) nhưng bạn có thể hiểu được!

Cách tạo video alpha

Phương pháp mà chúng tôi mô tả sử dụng các công cụ nguồn mở B viên và ffmpeg:

  1. Quay chủ thể của bạn trước một nền màu duy nhất, chẳng hạn như một bức màn màu xanh lục sáng.
  2. Xử lý video để tạo một mảng hình ảnh tĩnh PNG có dữ liệu trong suốt.
  3. Mã hoá thành định dạng video (trong trường hợp này là WebM).

Ngoài ra, còn có các công cụ độc quyền để thực hiện công việc tương tự, chẳng hạn như Adobe after hiệu ứng. Bạn có thể thấy công cụ này đơn giản hơn.

1. Tạo video trên màn hình xanh lục

Trước hết, bạn cần quay phim theo cách mà mọi thứ ở hậu cảnh đều có thể "xoá" (được làm trong suốt) bằng cách xử lý sau đó.

Cách dễ nhất để làm việc này là quay phim trước một nền màu duy nhất, chẳng hạn như màn hình hoặc rèm. Xanh lục hoặc xanh dương là những màu được sử dụng thường xuyên nhất, chủ yếu là do sự khác biệt giữa màu da.

một số hướng dẫn trên mạng để quay video màn hình xanh lục (còn gọi là chìa khoá chuyển màu) và nhiều nơi để mua phông nền màn hình xanh lục và xanh dương. Ngoài ra, bạn có thể vẽ nền bằng sơn chìa khoá màu.

Cuộn phim Great Gatsby VFX cho thấy mức độ có thể được hoàn thành bằng màn hình xanh lục.

Một số mẹo khi quay phim:

  • Đảm bảo chủ thể không có quần áo hoặc đối tượng có cùng màu với phông nền, nếu không, chúng sẽ xuất hiện dưới dạng "lỗ" trong video hoàn thiện. Ngay cả biểu trưng hoặc đồ trang sức nhỏ cũng có thể gặp vấn đề.
  • Sử dụng ánh sáng nhất quán, đồng đều và tránh bóng tối: mục tiêu là có dải màu nhỏ nhất có thể ở chế độ nền mà sau đó cần được làm trong suốt.
  • Việc sử dụng nhiều ánh sáng khuếch tán giúp tránh hiện tượng bóng đổ và biến thể màu nền.
  • Tránh nền sáng bóng: bề mặt mờ khuếch tán ánh sáng tốt hơn.

2. Tạo video alpha thô từ video màn hình xanh lục

Các bước sau đây mô tả một cách tạo video alpha thô từ video màn hình xanh lục:

  1. Sau khi quay video màn hình xanh lục, bạn có thể sử dụng công cụ nguồn mở như Blender để chuyển đổi video thành một mảng tệp PNG có dữ liệu alpha. Sử dụng tính năng khoá màu của Blender để loại bỏ màn hình xanh lục và làm cho màn hình trở nên trong suốt. (Lưu ý rằng PNG không bắt buộc: bạn có thể sử dụng bất kỳ định dạng nào lưu giữ dữ liệu kênh alpha.)
  2. Chuyển đổi mảng tệp PNG thành video YUVA thô bằng công cụ nguồn mở như ffmpeg:

    ffmpeg -i image%04d.png -pix_fmt yuva420p video.raw

    Ngoài ra, hãy mã hoá các tệp trực tiếp vào WebM, sử dụng lệnh ffmpeg như sau:

    ffmpeg -i image%04d.png output.webm

Nếu muốn thêm âm thanh, bạn có thể sử dụng ffmpeg để kết hợp âm thanh với một lệnh như sau:

ffmpeg -i image%04d.png -i audio.wav output.webm

3. Mã hoá video alpha vào WebM

Video alpha thô có thể được mã hoá tới WebM theo hai cách.

  1. Với ffmpeg: chúng tôi thêm tính năng hỗ trợ cho ffmpeg để mã hóa video alpha WebM.

    Sử dụng ffmpeg với video đầu vào bao gồm dữ liệu alpha, đặt định dạng đầu ra thành WebM và quá trình mã hoá sẽ tự động được thực hiện theo đúng định dạng theo thông số kỹ thuật. (Lưu ý: hiện tại bạn cần đảm bảo nhận phiên bản ffmpeg mới nhất từ cây git để tính năng này hoạt động.)

    Lệnh mẫu:

    ffmpeg -i myAlphaVideo.webm output.webm

  2. Sử dụng công cụ webm:

    git clone https://chromium.googlesource.com/webm/libvpx

    webm-tools là một tập hợp các công cụ nguồn mở đơn giản có liên quan đến WebM, do các tác giả của Dự án WebM duy trì, bao gồm công cụ để tạo video WebM có độ trong suốt alpha.

    Chạy tệp nhị phân bằng --help để xem danh sách các tuỳ chọn được alpha_encoder hỗ trợ.

4. Phát lại trong Chrome

Để phát tệp WebM được mã hoá trong Chrome, bạn chỉ cần đặt tệp đó làm nguồn của phần tử video.

Họ đã làm điều đó như thế nào?

Chúng tôi đã trò chuyện với kỹ sư Vignesh Venkatasubramanian của Google về công việc của ông trong dự án này. Ông tóm tắt những thách thức chính liên quan:

  • Bitstream VP8 không hỗ trợ kênh alpha. Vì vậy, chúng tôi phải kết hợp alpha mà không làm hỏng luồng bit VP8 cũng như không làm hỏng người chơi hiện tại.
  • Trình kết xuất của Chrome không thể kết xuất video có alpha.
  • Chrome có nhiều đường dẫn kết xuất cho nhiều thiết bị phần cứng/GPU. Mọi đường dẫn hiển thị phải thay đổi để hỗ trợ hiển thị video alpha.

Chúng tôi có thể nghĩ đến nhiều trường hợp sử dụng thú vị đối với tính minh bạch của video alpha: trò chơi, video tương tác, kể chuyện mang tính cộng tác (thêm video của riêng bạn vào video/hình nền), video có nhân vật hoặc cốt truyện thay thế, ứng dụng web sử dụng các thành phần video lớp phủ.

Chúc bạn làm phim vui vẻ! Hãy cho chúng tôi biết nếu bạn xây dựng thứ gì đó tuyệt vời với độ trong suốt alpha.

Thông tin hữu ích