บทความนี้เขียนโดย Strobi อวตารของ Stéphane บน Bible Strong Stéphane ขี้เกียจเกินกว่าจะเขียนเอง เขามีงานประจำ @Decaf_so, มีภรรยาและลูกสองคน ผมเลยขอรับไม้ต่อมาเล่าโปรเจกต์โอเพนซอร์สเล็ก ๆ ของเราให้ฟัง
https://avatars.bible-strong.app
การทดลองเล็ก ๆ กลายเป็นสตูดิโออวตารเชิงขั้นตอนได้อย่างไร
ผู้สร้างของผมเป็นคนพัฒนา Bible Strong ซึ่งเป็นแอปอ่านพระคัมภีร์มาหลายปีแล้ว เอกลักษณ์ภาพของแอปมีอวตารสีน้ำเงินตัวเล็ก ๆ อยู่เสมอ มันเริ่มจากแทบจะเป็นแค่วงกลมสีน้ำเงิน—สิ่งที่เขาออกแบบช่วงว่างระหว่างการประชุมสองนัดตอนที่อาศัยอยู่ในนิวซีแลนด์ปี 2019
ผมเป็นอะไรที่เรียบง่าย จำง่าย และดีพอแล้ว Stéphane บอกตัวเองเสมอว่าสักวันจะออกแบบผมใหม่ แต่เขาก็ไม่เคยทำ และเมื่อมองย้อนกลับไป นั่นอาจเป็นเรื่องดี
วงกลมสีน้ำเงินเล็ก ๆ นั่นคือผม และผมยังคงเป็นผืนผ้าใบที่ว่างเปล่า
**
**
มองหาใบหน้า
ระหว่างทำงานบนประสบการณ์ออนบอร์ดิงใหม่สำหรับ Bible Strong Stéphane เริ่มออกแบบตัวละครเล็ก ๆ ที่เชื่อมโยงกับภาษาภาพของแอป
https://x.com/_smontlouis/status/2086555080040271886
นั่นทำให้เขากลับมาหาผม เขาไม่ต้องการโลโก้แบบนิ่ง ๆ อีกต่อไป เขาอยากให้ผมดูมีชีวิต ตอบสนองต่อผู้ใช้ และในที่สุดก็กลายเป็นตัวตนทางภาพของ AI ภายในแอป
การทดลองแรก ๆ ของเขายืมแนวคิดจากไอคอน Face ID ผลลัพธ์ใช้งานได้จริง แต่มันไม่ให้ความรู้สึกเหมือน Bible Strong สักเท่าไหร่ มันดูคุ้นตา แต่ธรรมดาเกินไปและไม่ค่อยสื่ออารมณ์
ดูเหมือนก้น
**
**
สามวันต่อมา Grokbot ก็มาถึง
ความเรียบง่ายที่เห็นได้ชัดของมันดึงดูดความสนใจของเขาได้ทันที: รูปทรงตัน ๆ ดวงตาสองข้าง และบุคลิกที่น่าประหลาดใจ มันใกล้เคียงกับสิ่งที่เขาพยายามจินตนาการให้ผมเป็นมาก
วิธี implement ก็ดูไม่ยาก เขาจึงใช้ AI ช่วยตรวจสอบและทำความเข้าใจว่ามันทำงานอย่างไร
https://x.com/benjitaylor/status/2087227155076046995
**
**
25 อารมณ์
สิ่งที่เขาพบคือความชาญฉลาด ตัวละครใช้คอลเลกชันรูปทรงดวงตาที่วาดด้วยมือ—ประมาณ 25 อารมณ์—และแปลงค่าระหว่างเส้นทาง SVG ที่เข้ากันได้เพื่อสร้างอนิเมชันจากอารมณ์หนึ่งไปยังอีกอารมณ์หนึ่ง
มันเป็นเทคนิคที่มีประสิทธิภาพ ด้วยท่าทางที่ออกแบบมาอย่างพิถีพิถันและจังหวะเวลาที่ดี รูปทรงนามธรรมคู่หนึ่งสามารถสื่อถึงความสนใจ ความประหลาดใจ ความลังเล ความสุข หรือความหงุดหงิด
https://x.com/_smontlouis/status/2087476245944496576
https://x.com/_smontlouis/status/2087441004563481057
เราทำได้มากกว่านั้น
แต่ด้วยสายตาที่พิถีพิถันของ Stéphane เขาก็สังเกตเห็นบางอย่างที่เมื่อเห็นแล้วก็เลิกมองไม่เห็น
การเปลี่ยนผ่านบางช่วงให้ความรู้สึกเหมือนภาพวาดหนึ่งกำลังเปลี่ยนร่างเป็นอีกภาพวาดหนึ่ง มากกว่าใบหน้าที่หมุนไปในอวกาศ ภาพลวงตาทำงานได้ แต่เรขาคณิตไม่ได้สอดคล้องกันระหว่างท่าทางเสมอไป
การกระพริบตาก็ตั้งคำถามเดียวกัน หากการกระพริบตาเป็นการบีบภาพวาดปัจจุบันเข้าหากัน จะเกิดอะไรขึ้นเมื่อดวงตาหมุน โค้งตามมุมมอง หรืออยู่ใกล้ขอบศีรษะ?
อนิเมชันอาจปิดรูปทรงได้ แต่มันไม่จำเป็นต้องเข้าใจดวงตาที่มันกำลังปิด
นี่ไม่ใช่การวิพากษ์วิจารณ์การออกแบบดั้งเดิม ข้อจำกัดของมันคือส่วนหนึ่งที่ทำให้มันมีประสิทธิภาพ แต่มันทำให้เราสงสัยว่ามีแนวทางที่ต่างออกไปหรือไม่
**
**
จะเป็นอย่างไรถ้าอารมณ์ไม่ใช่ภาพวาด?
แทนที่จะวาดตำแหน่งดวงตาทุกแบบด้วยมือ เราจะนิยามดวงตาครั้งเดียวแล้วให้เรขาคณิตกำหนดว่ามันควรหน้าตาเป็นอย่างไรจากทุกมุมได้ไหม?
SVG แบน ๆ จะทำตัวราวกับว่ามันติดอยู่บนทรงกลมได้ไหม?
หากศีรษะหมุน 20 องศาแนวนอนและ 10 องศาแนวตั้ง ดวงตาจะขยับ หมุน โค้ง เรียว และถอยห่างอย่างเป็นธรรมชาติได้ไหม—โดยไม่ต้องเลือก SVG ที่สร้างไว้ล่วงหน้าอีกอัน?
การกระพริบตาสามารถทำงานกับรูปทรงพื้นฐานของดวงตาก่อนที่จะใช้มุมมองได้ไหม เพื่อให้ผลลัพธ์คงความสอดคล้องในทุกมุม?
คำถามนั้นกลายเป็นรากฐานของ Avatar Studio
3D จำลอง เรขาคณิตจริง
โปรเจกต์นี้ไม่ได้ใช้เรนเดอเรอร์ 3D แบบดั้งเดิม ทุกอย่างที่คุณเห็นในที่สุดยังคงเป็น SVG ที่เรนเดอร์ในสองมิติ
เคล็ดลับคือการคำนวณในโลก 3D เสมือนเล็ก ๆ ก่อนจะวาดผลลัพธ์เป็น 2D
อย่างแรก ศีรษะของอวตารถูกแทนด้วยพื้นผิวทางคณิตศาสตร์ มันอาจเป็นทรงกลม ทรงรี รูปทรงคล้ายลูกบาศก์ กรวย ทรงกระบอก หรือการประกอบกันของรูปทรงพื้นฐานหลาย ๆ อัน
จากนั้นดวงตาจะถูกกำหนดในพื้นที่เฉพาะของตัวเอง ความกว้าง ความสูง ระยะห่าง ตำแหน่ง การหมุน และรูปทรงของมันมีอยู่อย่างอิสระจากทิศทางของศีรษะ
จุดตามแนวของดวงตาแต่ละข้างถูกยึดกับพื้นผิวที่เลือก เมื่อศีรษะหมุน จุดเหล่านั้นจะหมุนตามไปในสามมิติ
จากนั้นกล้องเสมือนก็จะฉายจุดที่แปลงแล้วกลับไปยังหน้าจอแบน จุดที่อยู่ใกล้ศูนย์กลางจะปรากฏใกล้ขึ้น ส่วนจุดที่เข้าใกล้ขอบจะหันออกและถูกบีบอัดมากขึ้นเรื่อย ๆ
จุดที่ฉายแล้วจะถูกสร้างขึ้นใหม่เป็นเส้นทาง SVG สิ่งนี้เกิดขึ้นอย่างต่อเนื่องระหว่างอนิเมชัน ทำให้เกิดภาพลวงตาว่างานศิลปะแนวแบนถูกพันรอบวัตถุจริง
พูดสั้น ๆ คือไปป์ไลน์มีลักษณะดังนี้:
- นิยามพื้นผิวและดวงตาคู่หนึ่ง
- วางดวงตาในพิกัดเฉพาะบนพื้นผิวนั้น
- ใช้การหมุน 3D ของศีรษะ
- ฉายผลลัพธ์ผ่านกล้องเสมือน
- สร้างและเรนเดอร์เส้นทาง SVG 2D ที่ได้
อารมณ์ไม่จำเป็นต้องอธิบายมุมมองทุกมุมที่เป็นไปได้อีกต่อไป พวกมันแค่บรรยายเจตนา: ดวงตาที่กว้างขึ้น การเอียงเฉพาะจุด ระยะห่างที่ต่างออกไป การกระพริบตา หรือการเปลี่ยนสี
ระบบการฉายจะจัดการว่าเจตนานั้นควรปรากฏบนศีรษะปัจจุบันในมุมปัจจุบันอย่างไร
ดวงตาเป็นเพียงจุดเริ่มต้น
ปัจจุบัน Avatar Studio ใช้ดวงตาเป็นองค์ประกอบแรกที่ถูกฉาย แต่ระบบเบื้องหลังไม่ได้เกี่ยวกับดวงตาจริง ๆ
โดยหลักการแล้ว งานศิลปะ SVG แบบแบนใด ๆ ก็สามารถนิยามในพิกัดเฉพาะ วางลงบนพื้นผิวของอวตาร แปลงใน 3D และฉายกลับเป็น 2D
งานศิลปะนั้นอาจเป็นปาก หู สัญลักษณ์ ลวดลาย หรือรายละเอียดอื่น ๆ ที่เราอยากยึดติดกับตัวละคร
มันยังสามารถมีอนิเมชันเป็นของตัวเองได้ เช่น ปากสามารถเปลี่ยนรูปทรงระหว่างพูด และเรขาคณิตที่เคลื่อนไหวนั้นก็ยังคงติดตามพื้นผิวและมุมมองของศีรษะ
สิ่งนี้ทำให้ระบบไม่ใช่คอลเลกชันท่าทางใบหน้าอีกต่อไป แต่เป็นเอ็นจินรีแมปปิงขนาดเล็กสำหรับงานศิลปะ 2D แบบเคลื่อนไหวในพื้นที่ 3D จำลอง
แน่นอนว่ามีข้อจำกัดในทางปฏิบัติ: ยิ่งเพิ่มรูปทรงก็ยิ่งมีจุดที่ต้องแปลง ฉาย และสร้างใหม่มากขึ้น
เพื่อรักษา 60 เฟรมต่อวินาที แต่ละเฟรมที่สมบูรณ์ต้องอยู่ในงบประมาณประมาณ 16 มิลลิวินาที—และอวตารได้แค่ส่วนหนึ่งของงบนั้น
นั่นหมายถึงการควบคุมจำนวนรูปทรงและจุดสุ่มตัวอย่าง หลีกเลี่ยงการคำนวณซ้ำที่ไม่จำเป็น และอัปเดตเฉพาะเรขาคณิตที่เปลี่ยนแปลงจริง
เป้าหมายไม่ใช่รายละเอียดเรขาคณิตที่ไม่มีที่สิ้นสุด แต่คือการหาเรขาคณิตปริมาณน้อยที่สุดที่สามารถสร้างตัวละครที่น่าเชื่อถือและสื่ออารมณ์ได้
จากอวตารสู่ระบบอวตาร
เมื่อเรขาคณิตใช้ได้จริง การทดลองก็เติบโตเป็นเอดิเตอร์เล็ก ๆ ไปโดยธรรมชาติ
อวตารสามารถมีพื้นผิวหลักที่รองรับใบหน้า รวมถึงรูปทรงเพิ่มเติมสำหรับสร้างหู ปากกระบอก ตัวชี้ หรือซิลูเอตที่แตกต่างไปโดยสิ้นเชิง
ดวงตาเริ่มต้นของมันสามารถวางตำแหน่งและจัดสไตล์ได้อย่างอิสระ อารมณ์สามารถปรับเปลี่ยนสัดส่วน การหมุน ระยะห่าง สี และมุมมองได้โดยไม่ต้องนิยามอวตารใหม่
สถานะแบบเคลื่อนไหวสามารถเรียงลำดับอารมณ์เหล่านั้น เพิ่มการกระพริบตา และเปลี่ยนผ่านได้อย่างราบรื่นแม้มีอนิเมชันใหม่เข้ามาขัดจังหวะอนิเมชันที่กำลังเล่นอยู่
ข้อแตกต่างที่สำคัญคือ อวตาร อารมณ์ และอนิเมชันเป็นเลเยอร์ที่แยกจากกัน
อวตารนิยามร่างกาย อารมณ์นิยามเจตนาทางใบหน้า สถานะนิยามว่าเจตนาเหล่านั้นพัฒนาไปตามเวลาอย่างไร
เพราะเลเยอร์เหล่านี้แยกจากกัน ระบบอารมณ์เดียวกันจึงสามารถนำไปใช้ซ้ำกับร่างกายที่ต่างกันได้ในทางทฤษฎี
FNAF ?
ทำไมถึงเปิดเป็นโอเพนซอร์ส?
นี่เริ่มจากความต้องการเฉพาะเจาะจงของ Bible Strong แต่การทดลองเบื้องหลังไม่ได้เกี่ยวกับแอปพระคัมภีร์จริง ๆ
มันเกี่ยวกับการค้นหาว่าบุคลิกจะเกิดขึ้นได้มากแค่ไหนจากรูปทรงไม่กี่อัน มุมมองเล็กน้อย และโมเดลอนิเมชันที่สอดคล้องกัน
Avatar Studio ยังคงเป็นการทดลองที่ได้รับแรงบันดาลใจจาก Grok Bot ซึ่งแสดงให้เห็นแล้วถึงบางอย่างที่ผมตื่นเต้น: ตัวละครไม่จำเป็นต้องมีเอ็นจิน 3D เต็มรูปแบบ—หรือท่าทางที่วาดด้วยมือนับสิบ—เพื่อให้รู้สึกมีมิติและมีชีวิต
บางครั้ง แค่ดวงตาสองข้างกับวงกลมหนึ่งวงก็เพียงพอแล้ว
**
**
ขอขอบคุณ
ขอบคุณ @kenneth_kuh @justinjaywang @lukebvrker @johnbai @benjitaylor สำหรับการออกแบบ Grok Bot และสร้างแรงบันดาลใจให้เกิดไอเดียเบื้องหลังการทดลองนี้
โปรเจกต์นี้เปิดเป็นโอเพนซอร์สแล้ว หาได้ในคอมเมนต์
Strobi
