ความโปร่งใสของอัลฟ่าในวิดีโอ Chrome

Sam Dutton
François Beaufort
François Beaufort
GitHub

ความโปร่งใสแบบอัลฟ่าในวิดีโอ Chrome

ตอนนี้ Chrome 31 รองรับความโปร่งใสของอัลฟ่าของวิดีโอใน WebM แล้ว

กล่าวคือ Chrome จะนำเวอร์ชันอัลฟ่ามาพิจารณาเมื่อเล่น "green screen" วิดีโอที่เข้ารหัสเป็น WebM (VP8 และ VP9) ด้วย ช่องทางอัลฟ่า ซึ่งหมายความว่าคุณสามารถเล่นวิดีโอที่มีพื้นหลังโปร่งใสได้ ไม่ว่าจะผ่านหน้าเว็บ รูปภาพ หรือแม้แต่วิดีโออื่นๆ

มีการสาธิตที่ simpl.info/videoalpha ค่อนข้างเหนือจริงและขรุขระเล็กน้อย (ตามความเป็นจริง) แต่คุณพอจะมองออกแล้วก็ได้!

วิธีสร้างวิดีโอเวอร์ชันอัลฟ่า

วิธีการที่เราอธิบายใช้เครื่องมือโอเพนซอร์ส Blender และ ffmpeg

  1. ถ่ายภาพวัตถุของคุณหน้าพื้นหลังที่มีสีเดียว เช่น ภาพสว่าง ม่านสีเขียว
  2. ประมวลผลวิดีโอเพื่อสร้างภาพนิ่ง PNG เป็นอาร์เรย์แบบโปร่งใส
  3. เข้ารหัสเป็นรูปแบบวิดีโอ (ในกรณีนี้คือ WebM)

มี และเครื่องมือที่เป็นกรรมสิทธิ์สำหรับทำงานเดียวกันนี้ด้วย เช่น Adobe Afterเอฟเฟกต์ ซึ่งคุณอาจพบ ง่ายขึ้น

1. สร้างวิดีโอกรีนสกรีน

ก่อนอื่น คุณต้องถ่ายทำสิ่งที่ถ่ายแบบที่ทุกอย่าง สามารถ "ลบ" พื้นหลังได้ (ทำให้โปร่งใส) ด้วยการประมวลผลหลังจากนั้น

วิธีที่ง่ายที่สุดคือ ถ่ายไว้หน้าพื้นหลังที่มีสีเดียว เช่น หน้าจอหรือม่าน สีเขียวหรือสีน้ำเงินเป็นสีที่ใช้บ่อยที่สุด ซึ่งส่วนใหญ่เป็นเพราะแตกต่างจากโทนสีผิว

มีหลาย คู่มือ ออนไลน์ถ่ายทำวิดีโอกรีนสกรีน (หรือที่เรียกว่า โครมาคีย์) และสถานที่จำนวนมาก สำหรับซื้อสีเขียวและ ฉากหลังหน้าจอสีฟ้า หรือคุณจะทาสีพื้นหลังด้วยสีโครมาคีย์ก็ได้

คลิปมือถือ Great Gatsby VFX แสดงให้เห็นสิ่งที่จะได้รับจากการใช้กรีนสกรีน

เคล็ดลับบางประการสำหรับการถ่ายทำ

  • ตรวจสอบว่าวัตถุไม่มีเสื้อผ้าหรือวัตถุที่มีสีเดียวกัน เป็นฉากหลัง มิเช่นนั้นจะแสดงเป็น 'หลุม' ในวิดีโอสุดท้าย แม้แต่โลโก้หรือเครื่องประดับเล็กๆ ก็อาจสร้างปัญหาได้
  • ใช้การจัดแสงที่สม่ำเสมอ และสม่ำเสมอ และหลีกเลี่ยงเงา โดยมีจุดประสงค์เพื่อให้ ช่วงของสีที่เล็กที่สุดในพื้นหลัง ซึ่งจะ ต้องมีความโปร่งใส
  • การใช้ไฟกระจายหลายดวงเพื่อหลีกเลี่ยงเงาและสีพื้นหลัง รูปแบบต่างๆ
  • หลีกเลี่ยงพื้นหลังที่เป็นมันวาว: พื้นผิวด้านจะกระจายแสงได้ดีกว่า

2. สร้างวิดีโออัลฟ่าดิบจากวิดีโอกรีนสกรีน

ขั้นตอนต่อไปนี้อธิบายวิธีหนึ่งในการสร้างวิดีโอเวอร์ชันอัลฟ่าแบบข้อมูลดิบจากวิดีโอกรีนสกรีน

  1. เมื่อถ่ายวิดีโอกรีนสกรีนแล้ว คุณสามารถใช้เครื่องมือโอเพนซอร์ส เช่น Blender เพื่อแปลงวิดีโอ เป็นอาร์เรย์ของไฟล์ PNG ที่มีข้อมูลอัลฟ่า ใช้การเน้นสีของเครื่องปั่นเพื่อ นำกรีนสกรีนออกและทำให้โปร่งใส (โปรดทราบว่า PNG ไม่ใช่ บังคับ: รูปแบบใดก็ได้ที่เก็บรักษาข้อมูลช่องทางอัลฟ่าไว้ก็ไม่เป็นไร)

  2. แปลงอาร์เรย์ของไฟล์ PNG ให้เป็นวิดีโอ YUVA ดิบโดยใช้เครื่องมือโอเพนซอร์ส เช่น ffmpeg:

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

    หรือเข้ารหัสไฟล์ไปยัง WebM โดยตรงโดยใช้คำสั่ง ffmpeg ดังนี้

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

ถ้าคุณต้องการเพิ่มเสียง คุณสามารถใช้ ffmpeg เพื่อ mux ในนั้นด้วยคำสั่ง เช่น ดังนี้

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

3. เข้ารหัสวิดีโอเวอร์ชันอัลฟ่าไปยัง WebM

วิดีโออัลฟ่าดิบสามารถเข้ารหัสเป็น WebM ได้ 2 วิธี

  1. ด้วย ffmpeg: เราได้เพิ่มการรองรับ ffmpeg เพื่อเข้ารหัสวิดีโอ WebM เวอร์ชันอัลฟ่า

    ใช้ ffmpeg กับวิดีโออินพุตรวมถึงข้อมูลอัลฟ่า ตั้งค่ารูปแบบเอาต์พุตเป็น WebM และการเข้ารหัสจะดำเนินการโดยอัตโนมัติในรูปแบบที่ถูกต้องตาม ข้อมูลจำเพาะ (หมายเหตุ: ปัจจุบันคุณจะต้องใช้ ffmpeg เวอร์ชันล่าสุดจาก git Tree สำหรับ เพื่อทำงาน)

    ตัวอย่างคำสั่ง

    ffmpeg -i myAlphaVideo.webm output.webm

  2. การใช้เครื่องมือ Webm

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

    webm-tools คือชุดเครื่องมือโอเพนซอร์สง่ายๆ ที่เกี่ยวข้องกับ WebM ซึ่งดูแลโดยผู้เขียนโปรเจ็กต์ WebM ซึ่งรวมถึงเครื่องมือสำหรับสร้างวิดีโอ WebM ที่มีความโปร่งใสระดับอัลฟ่า

    เรียกใช้ไบนารีด้วย --help เพื่อดูรายการตัวเลือกที่ alpha_encoder รองรับ

4. การเล่นใน Chrome

หากต้องการเล่นไฟล์ WebM ที่เข้ารหัสใน Chrome เพียงตั้งค่าไฟล์เป็นแหล่งที่มาของ องค์ประกอบวิดีโอ

วิธีดำเนินการ

เราได้พูดคุยกับ Vignesh Venkatasubramanian วิศวกรของ Google เกี่ยวกับงานของเขาใน และได้สรุปความท้าทายหลักๆ ที่เกี่ยวข้องไว้ดังนี้

  • บิตสตรีม VP8 ไม่รองรับช่องทางอัลฟ่า เราจึงต้องนำ อัลฟ่าโดยไม่ทำลายบิตสตรีม VP8 โดยไม่ส่งผลใดๆ ผู้เล่น
  • โหมดแสดงภาพของ Chrome ไม่สามารถแสดงผลวิดีโอด้วยรุ่นอัลฟ่า
  • Chrome มีเส้นทางการแสดงผลหลายเส้นทางสำหรับอุปกรณ์ฮาร์ดแวร์/GPU หลายชิ้น ทุก ต้องเปลี่ยนเส้นทางการแสดงผลเพื่อรองรับการแสดงผลวิดีโอเวอร์ชันอัลฟ่า

ตัวอย่างกรณีการใช้งานที่น่าสนใจสำหรับความโปร่งใสของวิดีโออัลฟ่ามีดังนี้ เกม วิดีโอแบบอินเทอร์แอกทีฟ การเล่าเรื่องราวร่วมกัน (เพิ่มวิดีโอของคุณเองลงใน วิดีโอ/รูปภาพพื้นหลัง) วิดีโอที่มีตัวละครหรือพล็อตอื่น เว็บแอป ที่ใช้คอมโพเนนต์วิดีโอ แบบวางซ้อน

ขอให้สนุกกับการสร้างภาพยนตร์ แจ้งให้เราทราบหากคุณสร้างสรรค์สิ่งที่น่าตื่นตาตื่นใจด้วยอัลฟ่า ความโปร่งใส

แหล่งข้อมูลที่เป็นประโยชน์