คู่มือการสร้างAR

คำนำ

คู่มือการสร้าง AR : Augmented reality เล่มนี้จัดทาข้ึนเพื่อเป็นส่วนหน่ึงของ
รายวิชาเทคโนโลยีภาพเสมือนผสานความจริง เพ่ือให้ได้ศึกษาเรื่องของเทคโนโลยีในเร่ืองของ
ความเปน็ มา ความหมาย องค์ประกอบ
วิธกี ารสร้าง Augmented reality โดยแสดงขั้นตอนสร้าง Augmented reality จากโปรแกรม
Vidinoti และโปรแกรม Spark AR จะมีเน้ือหาในการสอนในการสร้างชิ้นงาน เพื่อง่ายต่อการ
ทาความเขา้ ใจและสามารถทาตามไดโ้ ดยงา่ ย

ผู้จัดทาหวังว่า คู่มือเล่มน้ีจะเป็นประโยชน์แก่ผู้อ่าน หากมีข้อเสนอแนะหรือ
ขอ้ ผดิ พลาดประการใด ผู้จดั ทาขอ้ น้อมรับไว้และขออภยั มา ณ ทีน่ ด้ี ว้ ย

จริ าภรณ์ สุวรรณาลัย
ผจู้ ัดทา

ก



สำรบญั หนา้

เรื่อง ก
ข
คานา 1
สารบญั 3
Augmented Reality (AR) 3
Virtual Reality (VR) 3
Mixed Reality (MR) 3
Cinematic Augmented Reality (CR) 3
Substitutional Reality (SR) 4
Extended Reality (XR) 17
ขน้ั ตอนการสรา้ ง Augmented reality ด้วยโปรแกรม Vidinoti ค
ขนั้ ตอนการสร้าง Augmented reality ดว้ ยโปรแกรม Spark AR
เอกสารอ้างองิ

ข

" AR คืออะไร? มาทาความรู้จักเทคโนโลยี AR
เมื่อโลกความจริงกับโลกเสมือนรวมร่างกัน "

ความเป็นมา Augmented reality
เทคโนโลยีนี้ได้ถูกพัฒนามาตั้งแต่ปี ค.ศ. 2004 จัดเป็นแขนงหนึ่งของงานวิจัย

ด้านวิทยาการคอมพิวเตอร์ ว่าด้วยการเพิ่มภาพเสมือนของโมเดลสามมิติที่สร้างจาก
คอมพิวเตอร์ลงไปในภาพที่ถ่ายมาจากกล้องวิดีโอ เว็บแคม หรือกล้องในโทรศัพท์มือถือ
แบบเฟรมต่อเฟรมด้วยเทคนิคทางด้านคอมพิวเตอร์กราฟิก แต่ด้วยข้อจากัดทาง
เทคโนโลยีจึงมีการใช้ไม่แพร่หลายเท่าไหร่ แต่ปัจจุบันเทคโนโลยีมือถือ และการส่ือสาร
ข้อมลู ไรส้ าย รวมท้งั การประมวลตา่ ง ๆ มีความรวดเร็วข้ึนและมีราคาถูก จึงทาให้อุปกรณ์
สมาร์ทโฟน และแทบเล็ต ทาให้เทคโนโลยีที่อยู่แต่ในห้องทดลองกลับกลายมาเป็นแอพที่
สามารถดาวน์โหลดมาใช้งานกันง่าย ๆ ไปแล้ว โดยในช่วง 2-3 ปีมานี้ AR เป็นเรื่องที่ถูก
กล่าวถึงอยู่เป็นระยะ และอนาคตยังไปได้อีกไกล ทั้ง VR และ AR สามารถนามา
ประยุกต์ใช้งานได้กว้างขวางหลากหลาย ทั้งด้าน อุตสาหกรรม การทหาร การแพทย์
การตลาด การบันเทิง การสือ่ สาร และ การศึกษา

1

Augmented Reality คอื อะไร?
Augmented Reality หรือ AR เป็นเทคโนโลยีใหม่ ที่ผสานเอาโลกแห่งความ

เป็นจริง (Real) เข้ากับโลกเสมือน (Virtual) โดยผ่านทางอุปกรณ์ Webcam กล้องมือถือ
Computer รวมกับการใช้ software ต่าง ๆ ทาให้สามารถมองเห็นภาพท่ีมีลักษณะเป็น
object เช่น คน สัตว์ สิ่งของ สัตว์ประหลาด ยานอวกาศ เป็นต้น แสดงผลในจอภาพ
กลายเป็นวัตถุ 3 มิติลอยอยู่เหนือพ้ืนผิวจริง และกาลังพลิกโฉมหน้าให้ส่ือโฆษณาบน
อินเทอร์เน็ต ก้าวไปสู่ความตื่นเต้นเร้าใจแบบใหม่ของการท่ีมีภาพสินค้าลอยออกมานอก
จอคอมพวิ เตอรว์ า่ กันว่า น่จี ะเปน็ การเปลย่ี นแปลงโฉมหนา้ ส่ือยุคใหม่ พอๆกับเม่ือครั้งเกิด
อินเทอร์เน็ตขึ้นในโลกก็ว่าได้ หากเปรียบสื่อต่าง ๆ เสมือน “กล่อง” แล้ว AR คือการเด้ง
ออกมาสู่โลกใหม่ภายนอกกล่องที่สร้างความต่ืนเต้นเร้าใจในรูปแบบ Interactive Media
โดยแท้จริง เพียงแค่ภาพสัญลักษณ์ท่ีตกแต่งเป็นรูปร่างอะไรก็ได้ แล้วนาไปทารหัส เม่ือ
ตีพิมพ์บนวัตถุต่าง ๆ แล้วไม่ว่าจะเป็นบนผ้า แก้วน้า กระดาษ หน้าหนังสือหรือแม้แต่บน
นามบัตร แล้วส่องไปยังกล้องเว็บแคมท่ีมี Reality Browser Layar เราอาจเห็นภาพ
โมเดลของอาคารขนาดใหญ่ หรือเห็นสัญลักษณ์ของร้านค้าต่าง ๆ รูปสินค้าต่าง ๆ รวมไป
ถงึ รูปคนเสมอื นจรงิ ปรากฏตวั และกาลังพูดผา่ นหนา้ จอคอมพวิ เตอร์

2

Virtual Reality (VR)

เป็นการจาลองสภาพแวดล้อมจริงและสภาพแวดลอ้ มจากจนิ ตนาการ เชน่ วดิ ิโอ
ภาพ เสียง ผา่ นระบบเทคโนโลยีคอมพวิ เตอร์ โดยต้องใชง้ านผ่านอปุ กรณ์นาเขา้ ตา่ ง ๆ เชน่
ถุงมือ เมาส์ แว่นตา เปน็ ตน้ เพือ่ รบั รู้ถงึ แรงปอ้ นกลับจากการสัมผสั สงิ่ ต่าง ๆ และทาให้เรา
สามารถตอบสนองกบั สิ่งทจ่ี าลองนนั้ ได้ โดยเราสามารถนาเทคโนโลยี VR มาประยุกตใ์ ชใ้ น
หลากหลายดา้ น เช่น ด้านการแพทย์ (การฝึกผ่าตดั แบบเสมือนจรงิ ) การทาเครื่อง VR เพ่ือ
ฝกึ บนิ เชิง simulation ทางการศึกษา ดา้ นการบนั เทงิ เกมส์ ทางด้านธุรกจิ เปน็ ต้น

Mixed Reality (MR)

เป็นโลกผสานจรงิ สร้างบางส่งิ ขน้ึ มาเชือ่ มโยงไปกบั โลกจริง โดยมสี งิ่ ของหรือ
สภาพแวดล้อมใหเ้ ห็น มีมิติ ไมล่ อยอยู่เฉพาะด้านบนแบบ AR และตอบสนองได้ราวกบั เปน็
สง่ิ ทม่ี ีอยูบ่ นโลกเราจรงิ ๆ

Cinematic Augmented Reality (CR)

เปน็ ภาพยนตร์เสมอื นจริงท่ีพัฒนามาจาก AR และ VR จะเปน็ ภาพวัตถุหรือ
บุคคลปรากฎซ้อนทบั ข้นึ บนโลกจรงิ แตม่ มี ิติและเสมอื นมตี ัวตนจรงิ อยู่บนโลก

Substitutional Reality (SR)

เป็นโลกทดแทนเสมือนจรงิ ชอื่ เรยี กน้ีมาจากทางญี่ปนุ่ ระบบจะนาวดี โี อภาพและ
เสียงทบี่ นั ทกึ ไวแ้ ละสง่ ภาพออกมาให้ชมในรปู แบบเสมือนจริงในมมุ มองรอบทศิ ทางแบบ VR
โดยจะเห็นภาพทง้ั ท่ีบันทกึ ไวแ้ ละภาพในจรงิ ปัจจุบันซ้อนทบั กนั เทคโนโลยนี ถี้ กู นามาใช้ใน
เวบ็ ไซต์โฆษณา

Extended Reality (XR)

เปน็ สงิ่ แวดลอ้ มเสมือนจริงท่ีผสมไปบนโลกจรงิ ผู้ใชส้ ามารถจะเชอื่ มต่อข้อมลู กับ
เครอื ขา่ ยและมีปฏสิ ัมพันธ์กับผ้ใู ชค้ นอน่ื ๆ ได้ ผสมผสานทง้ั ความสามารถของ AR+VR และ
MR เข้าด้วยกนั ขณะนี้ยงั อย่ใู นข้ันตอนพฒั นา โดยวางแผนจะนามาใช้ท้งั ในดา้ น
อุตสาหกรรม การศกึ ษา การทหาร สุขภาพ ทอ่ งเท่ียว และความบนั เทิง

3

สร้ำง AR ดว้ ย VIDINOTI

ขน้ั ตอนท่ี 1 https://www.vidinoti.com/home/ > Free Sign up เพ่อื สมคั รการใชง้ าน

ขนั้ ตอนที่ 2 กรอกข้อมลู ให้ครบ > กด Register เพอื่ ลงทะเบียน

4

ข้ันตอนท่ี 3 คลกิ ที่ Login เพอ่ื เข้าสรู่ ะบบการใชง้ าน
ข้นั ตอนที่ 4 กรอก Username และ Password ท่ลี งทะเบียนไว้

5

ขนั้ ตอนที่ 5 ให้บนั ทกึ ภาพ QR code เพือ่ นาไปใช้ในการสแกนช้ินงานทก่ี าลังจะทา
ขัน้ ตอนท่ี 6 จากหน้าแรก ให้คลกิ เลือก Create new content

6

ขั้นตอนท่ี 7 คลิก Image AR
ข้นั ตอนท่ี 8 คลกิ Click or drop your image / PDF here

7

ข้นั ตอนท่ี 9 คลกิ เลือกรปู Cactus > Open
ขนั้ ตอนท่ี 10 คลิก Continue

8

ขนั้ ตอนที่ 11 ใส่ชือ่ Content name และ คาอธิบาย(ใสไ่ มใ่ สก่ ไ็ ด้) > Continue
ขั้นตอนท่ี 12 คลกิ ที่ PixLive Editor เพ่ือเรมิ่ ทาชิน้ งาน

9

ขนั้ ตอนที่ 13 คลิก Image จะปรากฏหน้าต่างใหมข่ ้นึ > เลอื ก Dorp file here
ขัน้ ตอนที่ 14 คลิกเลอื กรปู > Open

10

ขัน้ ตอนที่ 15 จะได้รปู คาว่า Cactus > คลิก Image อกี รอบ
ขนั้ ตอนท่ี 16 คลิก Drop file here > คลกิ เลอื กรปู > คลิก Open

11

ขนั้ ตอนที่ 17 คลกิ Apply changes
ขน้ั ตอนท่ี 18 จะได้หนา้ ทางซ้ายมือ > คลกิ รปู แลว้ เลอื ก Image Button > จะเชื่อมหนา้ เพ่มิ

12

ขนั้ ตอนท่ี 19 คลิก Open web page
ขน้ั ตอนท่ี 20 copy ลิงค์ท่ีจะเชอ่ื มขอ้ มูล > Apply changes

13

ข้นั ตอนท่ี 21 จะได้รูปภาพทเ่ี ชอื่ มต่อไป Web ทใ่ี ห้ข้อมลู
ขั้นตอนท่ี 22 ทาแบบน้ที ั้ง 3 หัวข้อ

14

ขัน้ ตอนท่ี 23 คลิก Save and quit
ขน้ั ตอนท่ี 24 เสรจ็ แลว้ พรอ้ มเผยแพร่

15

ขัน้ ตอนท่ี 25 คลิก My Contents เพื่อดูผลงานของเรา
ตัวอย่าง

16

สรำ้ ง AR ดว้ ย SPARK AR

ข้ันตอนท่ี 1 https://sparkar.facebook.com/ar-studio/ คลกิ ท่ี Download

ขั้นตอนท่ี 2 คลกิ ที่ Download

17

ข้นั ตอนที่ 3 เมือ่ Download เสรจ็ ใหไ้ ปท่ไี ฟล์ คลิกขวาตวั โปรแกรม เลอื ก Install เพ่อื ติดต้ัง
ขั้นตอนที่ 4 คลกิ Next

18

ขัน้ ตอนที่ 5 คลิกยอมรับ I accept the terms in the License Agreement > คลกิ Next
ข้นั ตอนท่ี 6 คลิก Change เพ่ือเลือกโฟลเดอร์ตดิ ตั้งโปรแกรม > คลกิ Next

19

ข้นั ตอนท่ี 7 คลกิ Install เพ่อื ทาการติดต้ังโปรแกรม
ขั้นตอนท่ี 8 เม่อื ติดตงั้ เสรจ็ โปรแกรมจะปรากฏอย่หู นา้ Desktop

20

ขัน้ ตอนที่ 9 คลิก New Project
ขนั้ ตอนท่ี 10 คลิก Blank Project

21

ขนั้ ตอนท่ี 11 ตัวอย่างหนา้ โปรแกรมทไ่ี ด้
ขน้ั ตอนท่ี 12 คลิก Add Object > Face Tracker > Insert

22

ข้ันตอนท่ี 13 คลิก Face Tracker0 > Add > Plane
ขน้ั ตอนท่ี 14 ปรับ Position แกน Y เป็น 0.1 > กด + Materials 1 ครงั้

23

ขนั้ ตอนท่ี 15 จะได้ Material 1 อนั ทางซ้ายมอื
ขัน้ ตอนที่ 16 คลิก Add Asset > Import from computer > เลอื กรูป เหลินขูน > Open

24

ขั้นตอนท่ี 17 คลิก Materials0 > Texture เลือกชอื่ ไฟล์ เหลินขนู

ขนั้ ตอนท่ี 18 คลกิ Test to device > Sent to app > Instagram Camera หรอื Facebook
Camera เลอื กแลว้ จะมีลงิ คใ์ ห้ Test

25

ขนั้ ตอนท่ี 19 Unload and Export > Publish a new effect > Upload

ข้ันตอนท่ี 20 เมือ่ Upload เสร็จแล้วจะมีลงิ คพ์ าไปเวบ็ Spark AR Hub หลงั จากนัน้ ใหก้ รอก
ขอ้ มลู ชื่อ ไฟล์ แพลตฟอร์ม รายละเอียดต่าง ๆ เมอื่ เรียบรอ้ ยแล้ว กดสง่ ไดเ้ ลย

26



เอกสำรอำ้ งอิง

จริ าภรณ์ ปกรณ.์ 26 กุมภาพนั ธ์ 2561. AR (Augmented Reality) เทคโนโลยีโลกเสมือน
ผสานโลกแห่งความจริง. [ออนไลน์]. แหลง่ ท่ีมา : https://www.scimath.org/article-
technology/item/7755-ar-augmented-reality
อัจฉราพรรณ โพธ์ทิ อง. 26 ตุลาคา 2561. VR เทคโนโลยเี สมอื นจรงิ . [ออนไลน์]. แหล่งทีม่ า :
https://il.mahidol.ac.th/th/i-Learning-Clinic/general-articles/vr-เทคโนโลยโี ลกเสมอื นจร/ิ
admin_techno(นามแฝง). 8 มิถุนายน 2561. สือ่ การเรียนยรู้ AR. [ออนไลน์]. แหล่งท่ีมา :
http://www.techno.lru.ac.th/techno/สอื่ การเรยี นรู้-ar/

ค