Undervlog

Menu
  • หน้าแรก
  • คลิปและบทความ
    • การทำ Live
    • การทำ Content
    • ข่าวสารและรีวิว
    • Vlog
    • อุปกรณ์ที่ผมใช้
  • คอร์สเรียนออนไลน์
  • งานสอนและเซ็ตระบบ Live
  • ติดต่อ
  • Home
  • About Me
  • Contact
Home
การทำ Live
OBS Studio Trick 01 : ทำ Logo แบบโปร่งใส เพื่อมาใช้ใน Live
การทำ Live

OBS Studio Trick 01 : ทำ Logo แบบโปร่งใส เพื่อมาใช้ใน Live

Esp Thitivesa 6 years ago
  • Facebook
Prev Article Next Article

ในการแคสเกมหรือทำรายการ Live ผ่านแพลตฟอร์มต่างๆ จะเห็นว่าคนที่ทำกับเป็นอาชีพก็จะมีโลโกสวยๆ ไม่ว่าจะเป็นภาพนิ่งหรือวิดีโออยู่ที่มุมใดมุมหนึ่งเสมอ ซึ่งเราจำเป็นจะต้องสร้างโลโกที่มี “ความโปร่งใส” เพื่อให้มองทะลุไฟล์โลโกนี้ไปเห็นตัวคลิปหรือภาพจากกล้อง สำหรับคนที่โปรฯ เรื่องวิดีโอแล้วคงรู้สึกว่าเรื่องนี้ทำได้ง่ายๆ แต่สำหรับคนที่ยังไม่รู้จะทำยังไงให้โลโกโปร่งใสมองทะลุไปพื้นหลัง มาดูบทความนี้กัน

การทำไฟล์ Logo แบบภาพนิ่ง

ผมจะใช้ Photoshop ในการสร้างไฟล์ Logo แบบโปร่งใส ขึ้นมา แต่ก่อนอื่น เราต้องกำหนดขนาดให้เหมาะสมกับ Live ของเราก่อน ถ้าทั่วๆ ไปแล้ว ควรจะเป็นขนาด 1920×1080 เพื่อที่จะเป็นภาพอัตราส่วน 16:9

Logo แบบโปร่งใส

จากนั้นเราจะได้หน้าว่างๆ มาแบบนี้

Logo แบบโปร่งใส

Double Click ที่ Layer ตรงกรอบสีแดง จากนั้นกดปุ่ม OK เพื่อแปลงให้เป็น Layer ที่สามารถลบได้ แต่เรายังไม่ลบตอนนี้

Logo แบบโปร่งใส

คลิกที่กรอบสีแดงตามภาพเพื่อสร้าง Layer ใหม่ เราจะใช้ Layer นี้ เพื่อทำการวาด Logo ของเราขึ้นมา

Logo แบบโปร่งใส

ทำการวาดและตกแต่ง Logo จากนั้นวางลงในตำแหน่งที่เราต้องการจะให้ Logo นี้ปรากฏใน Live ของเรา

Logo แบบโปร่งใส

เสร็จแล้วให้คลิกตรง Layer 0 แล้วกดปุ่ม Delete ที่ Keyboard เพื่อลบ Background สีขาวออกไป (ตอนแรกเราเก็บไว้เพื่อให้วาด Logo ได้ง่ายและชัดเจน ตอนนี้ไม่จำเป็นก็กำจัดมันซะ)

Logo แบบโปร่งใส

พื้นหลังจะเป็นกรอบตารางหมากรุก เทา สลับ ขาว ซึ่งแปลว่าพื้นหลังของเราตอนนี้โปร่งใสแล้ว

Logo แบบโปร่งใส

คลิกที่ File > Export > Save for web

Logo แบบโปร่งใส

เลือก Format ตามกรอบสีแดงเป็น PNG-24 และติ๊กถูกตรง Transparency เอาไว้ เพื่อให้พื้นหลังโปร่งใส จากนั้นให้ Save ไว้ในเครื่องของเรา

Logo แบบโปร่งใส

เมื่อจะใช้งาน Logo ใน OBS Studio เลือก + ที่ Source > Image

Logo แบบโปร่งใส

อย่างที่ผมเคยบอกทุกครั้งในคลิป ให้ตั้งชื่อตัว Source ให้เรารู้ได้ง่ายว่านี่คืออะไร ในที่นี้ก็คือ Logo นั่นเอง ตั้งชื่อ Logo แล้วกดที่ OK

Logo แบบโปร่งใส

Browse ไปยังไฟล์ Logo ที่เราทำไว้ แล้วโหลดมันขึ้นมา กดที่ OK

Logo แบบโปร่งใส

Logo แบบโปร่งใสของเราจะปรากฏที่หน้าจอของ OBS Studio ตามตำแหน่งที่เราสร้างมาจาก Photoshop เป๊ะๆ เลย

Logo แบบโปร่งใส

การทำ Logo แบบโปร่งใสจากไฟล์วิดีโอ

ทีนี้สำหรับคนที่อยากทำ Logo แบบเคลื่อนไหว อาจจะเริ่มทำจาก Premiere Pro ก็ได้ (จริงๆ ควรทำจาก After Effect แต่คนที่ทำโปรแกรมนั้นเป็นแล้วคงรู้วิธีทำวิดีโอโปร่งใสอยู่แล้ว) ส่วนวิธีการทำ Animation ใน Premiere Pro ก็มีมากมายใน Youtube ฉะนั้น ผมจะมาบอกวิธี Export ให้ไฟล์มีความโปร่งใสอย่างเดียวละกัน

หลังจากที่เราทำ Animation ให้กัย Logo ของเราแล้ว อย่าลืมกำหนดตำแหน่งให้อยู่ตรงที่เราอยากให้ Logo ปรากฏจากในตัวคลิปไปเลย หากว่าเราไปทำการย่อขยาย หรือปรับเปลี่ยนขนาดภายหลังในตัว OBS Studio จะทำให้เวลา Live คอมเรากิน CPU มากขึ้น

Logo แบบโปร่งใส

เมื่อเสร็จแล้วให้เราไปที่ File > Export > Media ตามภาพ

Logo แบบโปร่งใส

ให้เราเลือก Format เป็น Quick Time ตามกรอบสีแดงด้านบน และเลือก Video Codec ในแทป Video เป็น Animation

Logo แบบโปร่งใส

ในแทป Video เลื่อนลงมาด้านล่างนิดหน่อย จะมีหัวข้อ Depth อยู่ ให้เลือกเป็น 8-bpc + Alpha การเก็บค่า Alpha ไว้จะช่วยให้พื้นหลังของเราโปร่งใสนั่นเอง เสร็จแล้วให้กดปุ่ม Export ได้เลย

Logo แบบโปร่งใส

พอจะใช้งานใน OBS Studio ให้เปิดโปรแกรมขึ้นมา จากนั้นเลือกไปที่ + ตรง Source และเลือกเป็น Media Source ตามภาพ

Logo แบบโปร่งใส

ตั้งชื่อ Source ให้รู้ว่าเป็นอะไรเช่นเดิม อันนี้ผมตั้งเป็น Logo-Video

Logo แบบโปร่งใส

Browse ไปที่ไฟล์ Video ที่เรา Export มาเมื่อครู่ เมื่อเลือกแล้ว หากต้องการให้ไฟล์ Logo นี้แสดงผลวนกลับมาเรื่อยๆ ให้ติ๊กที่ Loop ด้วย ไฟล์จะเริ่มต้นเล่นใหม่เสมอเมื่อเล่นจบ

Logo แบบโปร่งใส

พอกดปุ่ม OK ไฟล์ Logo แบบภาพเคลื่อนไหวของเราก็จะมาปรากฏอยู่ที่จอ OBS Studio เรียบร้อยแล้ว

จบครับ ส่วนวิธีการทำคลิปโลโก Animation ทั้งหลาย ลองเสิร์ชหาใน Youtube ดูเอานะ ส่วนใครอยากใช้งาน OBS Studio ตั้งแต่ต้นจนทำเป็น สามารถติดตามและดูเพิ่มเติมกันได้ที่ช่องทางด้านล่างนี้ครับ

เว็บไซต์ https://undervlog.blog
Facebook Page https://fb.com/undervlog
Youtube Channel https://www.youtube.com/undervlogdotblog

  • Facebook
Prev Article Next Article

About The Author

Esp Thitivesa
More from this Author

ถ้าภาพหนึ่งภาพมันแทนคำได้เป็นล้านคำ ภาพเคลื่อนไหวเพียงสั้นๆ อาจจะถ่ายทอดได้มากกว่านั้น

Related Posts

เบื้องหลังการ Setup อุปกรณ์ทำ Live ร่วมกับ Canon Thailand

เบื้องหลังการ Setup อุปกรณ์ทำ Live ร่วมกับ Canon Thailand

Esp Thitivesa 2021-10-28
Aris + OBS ขายของบน Facebook Live ด้วยภาพจาก OBS และให้ Chatbot รับออเดอร์แทนเรา

Aris + OBS ขายของบน Facebook Live ด้วยภาพจาก OBS และให้ Chatbot รับออเดอร์แทนเรา

Esp Thitivesa 2020-04-26
Vlog : Live แล้วภาพค้าง กับสาเหตุที่คาดไม่ถึง?

Vlog : Live แล้วภาพค้าง กับสาเหตุที่คาดไม่ถึง?

Esp Thitivesa 2021-03-19
OBS Studio ตอนที่ 29 : Import / Export Setting (แจก Profile Setting สำหรับ Live Facebook แนวตั้ง)

OBS Studio ตอนที่ 29 : Import / Export Setting (แจก Profile Setting สำหรับ Live Facebook แนวตั้ง)

Esp Thitivesa 2020-02-12
OBS Studio ตอนที่ 14 : ใช้ Power Point ร่วมกับ OBS

OBS Studio ตอนที่ 14 : ใช้ Power Point ร่วมกับ OBS

Esp Thitivesa 2018-07-31
OBS.Live EP03 :  แสดง Emoji จาก Comment ที่คนดูพิมพ์เข้ามาใน Live

OBS.Live EP03 : แสดง Emoji จาก Comment ที่คนดูพิมพ์เข้ามาใน Live

Esp Thitivesa 2020-06-25
Undervlog Copyright © 2025.
  • Home
  • About Me
  • Contact