วิธีนำ animation จาก Spine ไปใส่ใน vdo (Adobe Premier) by

29
Jan
0

แม้ว่าการทำ Animation ในโปรแกรม Spine จะมี default background เป็น transparent เมื่อนำไปใช้ใน unity ก็ไม่จำเป็นต้องทำอะไรเป็นพิเศษเพื่อให้พื้นหลังเป็น transparent

แต่ว่าถ้าต้องการนำไปใส่ใน vdo แล้วจะทำไม่ได้ เพราะเมื่อ export จาก spine เป็น vdo แล้ว พื้นหลังจะไม่เป็น transparent ทันที ดังนั้นให้เราเลือกสี bg ตอนที่จะ export เป็นสีอะไรก็ได้ที่ไม่ชนกับสีของตัว animation เอง เช่น สีเขียวสดๆ สีชมพูสดๆ (ในรูปตัวอย่างใช้สีเขียว #00FF00)

เมื่อเรานำ vdo ที่ export มาแล้วไปใส่ใน vdo editor เช่น adobe premier จะได้ลักษณะดังรูป

ใช้ effect Keying > Ultra Key

ตั้งค่า Ultra key ตรง Key color เป็นสีเดียวกับ bg ที่ export มาจาก spine ขั้นตอนนี้จะใช้ตัวดูดสีก็ได้

เท่านี้ก็เสร็จเรียบร้อย

เทคนิคทำ Animation Frame by Frame ใน SPINE ให้สะดวกขึ้น by

10
Dec
0

1.เลือกรูปทั้งหมด แล้วลากไปใส่ Slot ทีเดียว

ตอนที่เรา SETUP เพื่อจะทำ animation แบบ frame by frame เราจะสร้าง slot ไว้แค่อันเดียว แล้วนำรูปทั้งหมดไปใส่ที่ slot นั้น ถ้าต้องมานั่งลากทีละรูปๆ ก็จะช้า เราสามารถ select รูปทั้งหมด แล้วลากไปใส่ slot ทีเดียว

2.ใช้ Hot Key “R” เพื่อเลื่อน frame

ถ้าเราทำงานโดยใช้เม้าส์อย่างเดียว เราต้องเลื่อนเม้าส์ไปมาระหว่างจุดที่1-2 เราต้องเลื่อน frame ถัดไปที่จุดที่ 1 แล้วมาเลือกรูปใน slot ที่จุดที่2

แต่ถ้าเราใช้ Hot Key “R” เพื่อเลื่อน frame เราก็ไม่ต้องลากเม้าส์ไปๆมาๆ ใช้เม้าส์กดเลือกรูปที่จุดที่ 1 ได้เลย

ปล.วิธีนี้ต้องไปset frame สุดท้าย (เส้นสีส้ม) ไว้ที่ frame ที่ต้องการก่อน ไม่งั้นเรากด R ตอนที่อยู่ frame สุดท้ายแล้วมันจะเด้งกลับมาที่ frame รองสุดท้าย

วิธีใส่แสงประกอบฉากให้กับตัว Spine (Unity) by

31
Jul
0

Spine  นั้นจะรับแต่ Point Light เท่านั้น ดังนั้นต้องเลือกให้ถูกนะ ขั้นตอนการใส่แสง Ambient ก็มีดังนี้

รูปก่อนการใส่แสง Ambient

  • เลือกส่วนประกอบของ Spine ของเรา ที่มี Skeleton Parts Renderer

  • ที่สคริปท์ Skeleton Parts Renderer เปลี่ยน Shader เป็น Spine/Skeleton Lit

  • จากนั้น Spine ที่เราเลือกจะดำมืดไป ไม่ต้องตกใจเพราะเรายังไม่ได้ใส่แสงให้มันนั่นเอง

  • วิธีการใส่แสง ก็ไปที่เมนู GameObject -> Light -> Point Light

  • สร้างเสร็จก็จัดตำแหน่งให้เรียบร้อย และปรับค่าของแสงได้ที่สคริปท์ Light
    Type – ให้ใช้เป็น Point ไว้ แบบอิ่นจะไม่มีผลกับ Spine
    Range – ระยะของแสงของเราที่จะให้มีผล
    Color – ปรับสีของแสง Ambient
    Intensity – ปรับความเข้มของแสง เวลามีหลายๆแสงชนกัน Intensity สูงจะแสดงผลชัดกว่า

  • หลังจากตั้งค่าเสร็จก็จะได้รูปดังนี้ ชมพูชวิ้งแว้บ เท่านี้ก็เรียบร้อย

  • อันนี้เป็นตัวอย่างหลังจากใส่จุดกำเนิดแสงเพิ่ม

การสร้างสเตท Skill (ท่าไม้ตาย) ของฮีโร่ด้วย Unity Animator by

13
Jul
0

 

 

 

1.หลังจากอนิเมทท่าทางตัวละครใส่สเตท skill ด้วย Spine เรียบร้อยแล้ว export นำเข้าสู่ Unity

 

2.คลิกขวาที่ SkeletonData เลือก Spine > Instantiate (Mecanim)

sample28a

 

3.เราจะได้ Controller หน้าเหลี่ยมๆอย่างนี้มา พร้อมๆกับก้อน Spine Mecanim GameObject ซัมติงที่คืออะไรต้องไปถามโปรแกรมเมอร์

sample28b

 
4.กาง Controller ออกมาเลือกที่สเตท skill

sample28c

 

5.เปิดแท็บ Animator ลากสเตท skill เข้าไป เราจะได้ สเตท skill เข้าไปอยู่ใน Unity Animator

sample28d

 

 

 

6.สร้าง panel ที่  sorting layer skill depth 50 ตั้งชื่อว่า skill

sample28e

 

7.ลาก Spine Mecanim GameObject ไปไว้ใน panel นั้น เปลี่ยนชื่อมันเป็น Hero

 

8.เลือกที่ Hero แล้วไปที่แท็บ Animation เราจะสามารถจัดการอนิเมทบนไทม์ไลน์ของ Unity Animator ได้ต่อไป

sample28f

การผูก bone กับภาพเข้าด้วยกันใน Spine by

28
Jun
0

 

หลังจากเราได้รู้วิธีสร้าง skeleton กันไปแล้ว ต่อมาเราจะเรียนรู้วิธีผูก skeleton กับภาพเข้าด้วยกัน

1 เตรียมภาพคาแรคเตอร์ที่เราต้องการทำอนิเมท

sample27a

2 แบ่งชิ้นส่วนตัวละครออกเป็นส่วนตามส่วนที่เคลื่อนไหวได้ โดยวาดส่วนที่ถูกชิ้นอื่นบังให้เต็มด้วย ดังเช่นนี้ เซฟทั้งหมดเข้าโฟลเดอร์เดียวกัน

sample27b

3 เปิด Spine ขึ้นมา ที่เมนู Image นี่เป็นตัวที่จะชี้ไปยังโฟลเดอร์ภาพต้นทาง โดยเราจะเลือกโฟลเดอร์ที่ Browse

sample27c

4 เมื่อเลือกโฟลเดอร์ต้นทางแล้ว รายชื่อภาพในโฟลเดอร์จะแสดงขึ้นมา ไอคอนสีแดงคือภาพที่ยังไม่ถูกใช้ในโปรเจค ส่วนภาพที่ถูกใช้แล้วจะแสดงด้วยสีเขียว

sample27d

5 ลากไฟล์ลงมาบน work space เรียงลำดับบนล่างที่ Draw Order

sample27e

Tip : เราสามารถใช้สคริปของโฟโตชอปหรืออิลลัสที่ทาง Spine แถมมา สร้างไฟล์ json ที่ระบุตำแหน่งและลำดับเลเยอร์ของภาพชิ้นส่วนแต่ละชิ้น และ import data เข้ามาได้ โดยกดที่นี่ โดยภาพที่ถูกอิพอร์ตเข้ามาจะเรียงลำดับบนล่างแบบเดียวกับในไฟล์โฟโตชอปหรืออิลลัสต้นฉบับ

sample27f

6 สร้าง bone ตามชิ้นส่วนของตัวละครโดยคำนึงตามวิธีดังนี้ http://goo.gl/VyMiY9

sample27g

7 เมื่อทำแล้ว ชิ้น bone และชิ้นของภาพจะถูกแสดงไว้ที่นี่

sample27h

8 เราสามารถคลิกเมาส์ลากชื่อไฟล์ภาพแต่ละชิ้นเข้าไปในชิ้น bone

sample27i

9 เมื่อเราขยับ/ หมุน/ ย่อ/ ขยาย bone แต่ละชิ้น ภาพที่ผูกอยู่ก็จะขยับตามไปด้วย

sample27j

 เราชนะรอบ 4 | ยืมเงิน 3000 ด่วน | แอพกู้เงิน | แอพเงินด่วน | สินเชื่อออนไลน์อนุมัติทันที | Site Map | กู้เงินก้อน | กระเป๋าตัง | thisshop และ ยืมเงินฉุกเฉิน 5000 ด่วน