Thaigraph

 

   

ค้นหา
Thaigraph หน้าฟอรั่ม Flash การทำภาพเคลื่อนไหวแบบ Motion Tw ...
Maple Avatar ห้องแต่งตัวใหม่วิธีการเขียน Blog ส่วนตัววิธีโพสคลิปจาก Youtubeตารางข้อมูล เครดิต + Moneyวิธีการโพสกระทู้แบบรวดเร็ว
ดู: 11078|ตอบ: 2
go

การทำภาพเคลื่อนไหวแบบ Motion Tween

Rank: 7Rank: 7Rank: 7

โพสต์เมื่อ 22-8-2012 12:00 |แสดงโพสต์ทั้งหมด


การทำภาพเคลื่อนไหวแบบ Motion Tween  
Motion Tween พัฒนาขึ้นมาจากรูปแบบการเคลื่อนที่ของ Classic Tween + เส้น Path  ซึ่งจะช่วยลดจำนวนเลเยอร์ และขั้นตอนการทำงานให้สั้นลงค่ะ


มาดูวิธีทำกันเลยค่ะ
ไฟล์แนบ: คุณจำเป็นต้องเข้าสู่ระบบก่อนจึงจะสามารถดูและดาวน์โหลดไฟล์แนบได้ หากยังไม่มีแอคเคานต์หรือยังไม่ได้เป็นสมาชิก กรุณาสมัครสมาชิก
บางบทความคุณจำเป็นต้องสมัครสมาชิกแบบ VIP และ SUPERVIP ถึงจะเข้าอ่านบทความได้

Rank: 7Rank: 7Rank: 7

โพสต์เมื่อ 22-8-2012 18:49 |แสดงโพสต์ทั้งหมด

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


รวมทั้งหมดก็จะเป็น 4 เลเยอร์แบบง่ายๆ ไม่ซับซ้อน
*ทุกชิ้นส่วนข้าพเจ้าแปลงให้เป็น Symbol เรียบร้อยแล้ว



ขั้นตอนที่ 1.
เราจะมากำหนดการเคลื่อนไหวแบบ "Motion Tween" ให้กับส่วนของตัวการ์ตูนกันก่อนค่ะ เพื่อดูทิศทางการเคลื่อนไหวของวัตถุหลัก โดยให้คลิกขวาที่เฟรมว่าง เฟรมใดก็ได้ในเลเยอร์นั้น (ข้าพเจ้าคลิกที่เฟรม 25) และให้เลือกคำสั่ง "Insert Frame"

(โปรแกรมจะสร้างเฟรมสำหรับใช้งานเป็นสีเทาขึ้นมาให้เราไปสุดที่เฟรม 25)

ขั้นตอนที่ 2
ให้คลิกขวาที่เฟรมใดก็ได้ที่เป็นสีเทา และเลือกคำสั่ง "Create Motion Tween"


ขั้นตอนที่ 3
ให้คลิกที่เฟรมสุดท้าย (เพื่อให้หัวอ่านย้ายไปอยู่ที่เฟรมสุดท้าย)


(ตรงนี้เป็นทริค เพื่อทำให้การหมุนภาพง่ายขึ้นนะค่ะ จะทำตามหรือไม่ก็ได้ค่ะ ข้าพเจ้าจะย้ายจุดแกนมุมของมัน(ปกติจะอยู่ตรงกลางภาพ)ไปไว้ที่มุมซ้ายบน (การย้ายจุดแกนหมุนนี้จะมีผลกับการหันทิศทางภาพในพาแนล  Properties ด้วย)


จากนั้นให้จับ Symbol ย้ายไปที่ตำแหน่งใหม่


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


- ให้ใช้เครื่องมือ "Selection Tool" ปรับแต่งความโค้ของเส้น Path ตามที่เราชอบ


*นอกจากจะใช้เครื่องมือ "Selection Tool" แล้วปรับแต่ง เรายังสามารถใช้เครื่องมืออย่าง "Pen Tool"  หรือ "Subselection Tool" ในการปรับความโค้งของเส้น Path ได้ด้วยค่ะ



ขั้นตอนที่ 5
ข้าพเจ้าต้องการสร้างทิศทางของตัวการ์ตูนให้เคลื่อนที่แบบเหวี่ยงไป และเหวี่ยงกลับ เมื่อครู่ข้าพเจ้าทำให้มันเหวี่ยงไปข้างหน้าแล้ว คราวนี้จะต้องทำให้เหวี่ยงกลับมาอยู่ที่เดิม

- ให้คลิกขวาที่เฟรมว่างอีกครั้ง (ข้าพเจ้าคลิกที่เฟรม50 เพราะต้องการให้การเหวี่ยงกลับมีระยะทางเท่ากับการช่วงแรก 1- 25 และ 25-50) และให้เลือกคำสั่ง "Insert Frame" เหมือนตอนแรกอีกครั้งค่ะ


เสร็จแล้วให้คลิกที่เฟรมสุดท้าย และจับภาพ Symbol ย้ายกลับไปว่างที่ตำแหน่งเดิม (จุดเริ่มต้นแรกของเส้น Path)


(*ในขั้นตอนนี้ หากต้องการให้ symbol วางทับที่เดิมอย่างสมบูรณ์แบบ ควรใช้พาแนล Properties (Window > Properties ) มาใส่ค่าพิกัดที่แน่นอนให้กับตำแหน่งของภาพ  Symbol ที่แกน X ,Y )


จากนั้นก็ให้ปรับความโค้งของเส้น Path


ขั้นตอนที่ 6
ใช้เครื่องมือ "Free Transform Tool" หมุนภาพเล็กน้อย เพื่อให้การเคลื่อนที่ของภาพดูแนบเนียนมากขึ้น (เหมือนตัวการ์ตูนกำลังลอยเหวี่ยงไปมา) (ให้สังเกตว่าภาพจะหมุนโดยยึดจุดศูนย์กลาง ซึ่งก็คือมุมซ้ายบนที่เราย้ายไว้ตอนแรก )


ขั้นตอนที่ 7
กำหนดทิศทางการเคลื่อนที่แบบ "Motion Tween" ให้กับเส้นผมแกะทั้ง 2 ข้างที่เหลือ ด้วยวิธีการแบบเดิม


เสร็จแล้วให้กดปุ่ม "Ctrl+Enter" เพื่อดูผลลัพธ์ที่ได้ค่ะ



การปรับแต่งรูปแบบของ "Motion Tween" เพิ่มเติมในพาแนล Properties
เราสามารถปรับแต่งรูปแบบของ "Motion Tween" เพิ่มเติมในพาแนล Properties ( Window > Properties ) ตรงส่วนของกลุ่มคำสั่ง "Rotate" ได้ดังนี้ค่ะ


สำหรับความหมายของคำสั่งต่างๆนะค่ะ
*Ease = ใช้กำหนดความเร็วในการแสดงผลแต่ละช่วงของเฟรม สามารถกำหนดได้ตั้งแต่ -100 ถึง 100
-- ถ้ากำหนดเป็น 0 ความเร็วจะคงที่
-- ถ้ากำหนดเป็นเลขติดลบ(-) (Easing In) ความเร็วจะค่อยๆเร่งขึ้น (ต้นเฟรมเคลื่อนที่ช้า แต่ปลายเฟรมจะเคลื่อนที่เร็ว การกำหนดค่าจะมีผลเฉพาะในช่วงกลุ่มคำสั่ง Tween นั้นๆ)
-- ถ้ากำหนดเป็นเลขบวก(+) (Easing Out) ความเร็วในการเคลื่อนที่จะค่อยๆลดลง (ตรงข้ามกับ Easing In)


*Rotate = ใช้กำหนดการหมุนในแต่ละช่วงของเฟรม

*Direction = ลักษณะการหมุนของแต่ละช่วงเฟรม
--
None
= ไม่ให้ทำการหมุน
-- CW (Clockwise) = กำหนดให้หมุนตามเข็มนาฬิกา
--
CCW (Counter Clockwise) = กำหนดให้หมุนทวนเข็มนาฬิกา


*Orient to path = กำหนดให้วัตถุหันทิศทางตามเส้น Path

ขอให้สนุกกับทุกชิ้นงานนะค่ะ

บทความโดย NOOKFUFU2
(ขอสงวนสิทธิ์ให้เผยแพร่เฉพาะในเว็บไทยกราฟเท่านั้น!!!)



ไฟล์แนบ: คุณจำเป็นต้องเข้าสู่ระบบก่อนจึงจะสามารถดูและดาวน์โหลดไฟล์แนบได้ หากยังไม่มีแอคเคานต์หรือยังไม่ได้เป็นสมาชิก กรุณาสมัครสมาชิก
บางบทความคุณจำเป็นต้องสมัครสมาชิกแบบ VIP และ SUPERVIP ถึงจะเข้าอ่านบทความได้

Rank: 10Rank: 10Rank: 10

โพสต์เมื่อ 26-9-2012 10:16 |แสดงโพสต์ทั้งหมด
ขอบคุณครับ

Thaigraph

GMT+7, 23-9-2019 09:56 , Processed in 0.164943 second(s), 21 queries .

Powered by Discuz! X1.5

© 2001-2010 Comsenz Inc. Thai Language by DiscuzThai! Team.

Top 10 Best Sellers in Clothing for 2017 Top 10 Best Sellers in Clothing Best Sellers in Clothing
Top 10 Best Sellers in Books reviewer 2017 Top 10 Best Sellers in Books Best Sellers in Books