Important Announcement
PubHTML5 Scheduled Server Maintenance on (GMT) Sunday, June 26th, 2:00 am - 8:00 am.
PubHTML5 site will be inoperative during the times indicated!

Home Explore เอกสารประกอบการเรียนวิชาการสร้างภาพเคลื่ีอนไหว1

เอกสารประกอบการเรียนวิชาการสร้างภาพเคลื่ีอนไหว1

Published by wut L.K.B, 2019-06-29 14:01:40

Description: เอกสารประกอบการเรียนวิชาการสร้างภาพเคลื่ีอนไหว1

Search

Read the Text Version

การใชโ้ ปรแกรม Adobe Flash Professional CS6 1.รูจ้ กั กับส่วนประกอบของโปรแกรม Flash CS6 เมื่อเปิดโปรแกรม Adobe Flash Professional CS6 แล้ว จะปรากฏหน้าจอดังภาพ

สว่ นประกอบของโปรแกรม Adobe Flash Professional CS6 ประกอบดว้ ย 1. Menu Bar (เมนูบาร์) เป็นสว่ นสาหรบั แสดงรายการคาสง่ั ตา่ งๆ ของโปรแกรม 2. Stage (สเตจ) เปน็ สว่ นที่เรากาหนดขอบเขตขนาดของการทางาน เปน็ พ้นื ทสี่ ่วนท่ใี ชใ้ นการวางวัตถตุ ่างๆ หรอื อาจจะเรยี กว่า \"เวท\"ี เมอ่ื มกี ารนาเสนอผลงานจะแสดงเฉพาะวตั ถุบน Stage นี้เทา่ นน้ั 3. Properties (พรอ็ พเพอร์ต้ี) เปน็ สว่ นกาหนดคุณสมบัติใหก้ บั วัตถุต่างๆ ที่เราใชง้ าน ทัง้ การกาหนดค่าต่างๆ หรอื การปรับปรงุ เปล่ยี นแปลงแกไ้ ขวัตถไุ หนก็นาเมาสไ์ ปคลกิ ที่วัตถุนั้นกอ่ น 4.Timeline (ไทมไ์ ลน)์ มไี ว้สาหรับควบคมุ การทางานและกาหนดการนาเสนอผลงาน ตลอดจนการเคลอื่ นไหวต่างๆ 5. Toolbox (ทลู บ๊อกซ์) เป็นกลมุ่ ของเครื่องมอื ในการสร้างงานและจัดการวัตถตุ า่ งๆ ซงึ่ ประกอบดว้ ยปมุ่ เครอ่ื งมอื ยอ่ ยต่างๆ ที่ใชใ้ นการสรา้ งงาน

สว่ นประกอบตา่ งๆ ทป่ี รากฏบน Timeline

การสรา้ งวัตถุ (Object) ดว้ ยเคร่อื งมอื Line Tool Line Tool คอื เครอ่ื งมือสาหรับวาดเส้นตรง โดยเราสามารถกาหนดสี ความหนา และลวดลาย ต่างๆโดยกาหนดได้ท่ี หน้าต่าง properties ขน้ั ตอนการสรา้ ง ดังน้ี ข้นั ท่ี 1 คลิกเลอื กเครอื่ งมือที่ Tool Box ดังภาพ ขนั้ ที่ 2 กาหนดลักษณะของเสน้ ทีห่ นา้ ต่าง Properties กรณีหน้าตา่ งถูกปดิ เปิดได้โดยคลกิ Window > Properties > Properties ดงั ภาพ กาหนดลักษณะของเสน้ ตามตอ้ งการ (ตาแหน่งดา้ นล่างจอภาพ) ข้นั ท่ี 3 ใช้เมาส์ลากเส้น ปรบั ขนาด เปล่ียนสี ตามต้องการ

ตัวอยา่ งการประยุกตใ์ ช้งาน 1. ลากเส้นตามต้องการ 2. คลกิ ลกู ศรสีดา (Selection Tool) 3. คลกิ เส้นทไ่ี ม่ตอ้ งการแล้วลบทง้ิ โดยกด ปุ่ม Delete ที่ Keyboard 4. เลอื กภาพวตั ถุ โดยดบั เบิลคลกิ หรือลากคลุม ภาพวัตถุ 5. ตกแต่งเสน้ โดยกาหนดที่ หนา้ ต่าง Properties ตวั อย่างงานทสี่ ร้างจาก Line Tool

แบบฝกึ สรา้ งวตั ถดุ ว้ ย Line Tool



การสรา้ งวัตถดุ ว้ ย Pen Tool Pen Tool เปน็ เครอื่ งมอื ทใี่ ช้สาหรับวาดเสน้ ตรง และเสน้ โค้งแบบเที่ยงตรง หรอื ทเ่ี รียกกันว่า พาธ (path) ซ่งึ หากลากครบรอบจะมกี ารใส่ Fill ให้อัตโนมัติ นอกจากนย้ี งั เพ่ิมหรอื ลบจดุ บนเสน้ โคง้ ได้อีกดว้ ย Tips : การกด <Shift> ชว่ ยใหล้ ากเส้นมมุ 45 องศางา่ ยขนึ้ ขนั้ ตอนการใช้เครือ่ งมือ ข้นั ท่ี 1 คลิกเลือกเครอื่ งมือท่ี Tool Box ขน้ั ที่ 2 กาหนดสเี ส้น และสพี น้ื ดังภาพ ขั้นท่ี 3 คลิกเมาสท์ ่ี stage พร้อมทงั้ ดึง หรอื ดดั แฮนเดลิ จนกว่าเส้นจะบรรจบทจ่ี ุดเริ่มต้น หมายเหตุ : เม่อื ลากเสน้ บรรจบเสน้ เริม่ ต้น โปรแกรมจะเทสเี สน้ และสพี ืน้ ใหอ้ ตั โนมัติ

ตวั อย่างงานที่สร้างจาก Pen Tool แบบฝกึ สรา้ งวัตถุดว้ ย Pen Tool



การสรา้ งวตั ถุด้วย Oval Tool การวาดรปู ด้วย Oval Tool (เครือ่ งมือวาดวงกลม-วงร)ี มขี ้ันตอนดงั นี้ 1. เลอื ก Oval Tool จากทูลบอ็ กซ์ 2. กาหนดคุณสมบตั ขิ อง stroke และ fill บน property inspector ตามต้องการ 3. คลกิ ลากเมาส์บนสเตจในแนวทะแยงตาม ขนาดท่ตี อ้ งการ ถา้ ตอ้ งการวงกลมใหก้ ดคยี ์ Shift คา้ งไว้ ขณะท่ลี ากเมาส์ ขัน้ ท่ี 1 คลิกเลอื กเครือ่ งมอื ที่ Tool Box ขนั้ ที่ 2 กำหนดคณุ สมบตั ขิ อง stroke และ fill บน Properties ตำมตอ้ งกำร ข้ันท่ี 3 คลิกลำกเมำส์บนสเตจในแนวทะแยง ตำมขนำดทตี่ อ้ งกำร ถ้ำตอ้ งกำรวงกลมให้กดคยี ์ Shift คำ้ งไวใ้ น ขณะทลี่ ำกเมำส์ ผลทไี่ ด้

ตัวอย่ำงงำนท่วี ำดด้วย Oval Tool แบบฝกึ สรา้ งวัตถดุ ว้ ย Oval Tool



การสร้างวัตถุดว้ ย Pencil Tool เครื่องมือ Pencil มีไวส้ าหรับลากเส้น Line โดยอาศัยเสน้ ทางท่ี เมาสผ์ ่าน เหมาะสาหรบั งานท่ี เป็น Freehand หรือมอี ุปกรณเ์ สรมิ Option (ตวั เลอื ก) - Straighten - ลายเสน้ ทอี่ อกมาจะถกู ดดั ใหต้ รง - Smooth - ลายเส้นทอี่ อกมาจะถกู ดัดใหเ้ ปน็ ส่วนโคง้ - Ink – ลายเส้นที่ออกมาจะถกู ดัดใหส้ ว่ นโค้งแตจ่ ะพยายามรกั ษาเสน้ เดมิ ให้ มากทส่ี ดุ ขน้ั ท่ี 1 คลกิ เลอื กเครื่องมอื ท่ี Tool Box ข้นั ท่ี 2 กาหนดลกั ษณะของเสน้ ทห่ี นา้ ตา่ ง Options ขั้นท่ี 3 ใชเ้ มาสล์ ากเส้น ตามต้องการ ตัวอยา่ งงานทีส่ ร้างดว้ ย Pencil Tool

แบบฝกึ สรา้ งวตั ถุดว้ ย Pencil Tool



การใชเ้ ครอ่ื งมอื ตบแตง่ ภาพ ขัน้ ตอนการปฏบิ ตั ิ 1. การเลือกและเคล่อื นย้ายวัตถุ (Object) ด้วยเคร่ืองมือ Selection Tool Selection Tool ใช้สาหรบั การทางาน 2 ลกั ษณะ คอื 1. ใช้คลกิ เลือกซมิ โบล (Symbol) หรอื วตั ถุ (Object) 2. ใช้เคล่ือนย้ายซมิ โบล (Symbol) หรอื วัตถุ (Object) การเลือกซมิ โบล (Symbol) หรอื วตั ถุ (Object) ขน้ั ท่ี 1 คลกิ เลอื กเครอ่ื งมอื Selection Tool ขั้นท่ี 2 ใช้คลิกเลอื กซิมโบล (Symbol) หรือวัตถุ (Object) การเคลอ่ื นยา้ ยซมิ โบล (Symbol) หรอื วัตถุ (Object) ขัน้ ที่ 1 คลิกเลอื กซมิ โบล (Symbol) หรือวัตถุ (Object) ขั้นที่ 2 กดเมาสท์ ซี่ มิ โบล (Symbol) หรอื วัตถุ (Object) ค้างไว้ แลว้ ลาก หรอื เลอื่ นเมาสไ์ ปวางในตาแหนง่ ทีต่ ้องการ

2. การเลอื กพ้นื ทบี่ างส่วนดว้ ยเคร่อื งมอื Subselection Tool Subselection Tool ใช้สาหรับคลกิ เลือกส่วนของออบเจ็กตเ์ พอ่ื ทาการเคลือ่ นย้าย ปรบั เปลย่ี น ออบเจก็ ตใ์ ห้มรี ปู ร่างต่างๆ ตามต้องการ ขัน้ ที่ 1 คลกิ เลือกเคร่ืองมือ Subselection Tool ขั้นที่ 2 ใชเ้ มาส์คลกิ ทเ่ี สน้ ของวตั ถุ (Object) ขน้ั ท่ี 2 ใชเ้ มาสจ์ บั ทจ่ี ุดท่ตี ้องการ แล้วดึงหรอื ยา้ ยไปในทิศทาง หรอื ตาแหน่งทตี่ ้องการ และสามารถคลกิ ท่จี ุดของแฮนเดลิ แดรกเมาสล์ ากปรบั เปลยี่ นรปู ร่างตามตอ้ งการ

การเลอื กพนื้ ที่อสิ ระด้วยเครอ่ื งมือ Lasso Tool เครอื่ งมอื Lasso Tool ใชส้ าหรบั เลือกออ็ บเจก็ ต์ โดยการวาดเสน้ แบบอสิ ระรอบออ็ บเจก็ ต์ ตัวอยา่ งการใช้งาน ขนั้ ที่ 1 Import ภาพกราฟกิ เข้ามาในโปรแกรม โดยคลิก File > Import > Import to Stage แล้วเลือกภาพตาม ตอ้ งการ ขนั้ ที่ 2 คลกิ ทภ่ี าพ แลว้ คลกิ เมนู Modify > Break Apart เพื่อทาใหภ้ าพ Bitmap กลายเปน็ ภาพเวคเตอร์ เพื่อจะไดแ้ ก้ไขได้ ข้นั ที่ 3 คลิกเลอื กเครอ่ื งมือ Lasso Tool

ข้นั ท่ี 4 คลกิ เมาสท์ ี่ภาพ 1 ครงั้ แลว้ แดรกเมาสล์ ากบรเิ วณทตี่ ้องการเลอื กในภาพ ขั้นตอนท่ี 5 ใช้เมาสจ์ บั ภาพบรเิ วณท่ีเลอื ก ย้ายตาแหน่งตามตอ้ งการ การเลอื กพน้ื ท่ีเปน็ รปู ทรงต่างๆ การเลอื กพน้ื ที่เป็นรปู ทรงต่างๆ ด้วยเครือ่ งมอื Polygon Mode ตัวอย่าง การใชง้ าน ขน้ั ท่ี 1 Import ภาพกราฟกิ เข้ามาในโปรแกรม โดยคลกิ File > Import > Import to Stage แลว้ เลอื กภาพตาม ตอ้ งการ ภาพท่ี 1

ข้ันท่ี 2 คลกิ ทภ่ี าพ แลว้ คลิกเมนู Modify > Break Apart เพ่ือทาให้ภาพ Bitmap กลายเป็นภาพเวคเตอร์ เพื่อจะได้แกไ้ ขได้ ขั้นที่ 3 คลกิ เลือกเครอื่ งมอื Lasso Tool ขั้นท่ี 4 คลิกเลือก Polygon Mode ขน้ั ที่ 5 แล้วใชเ้ มาส์คลิกจุดเรมิ่ ต้นในภาพ 1 คร้ัง แลว้ เลอื่ นเมาสไ์ ปตาแหน่งที่ 2 แลว้ คลิก 1 คร้งั และเล่ือนไปตาแหนง่ ถดั ไป และคลิก ตอ้ งการกจี่ ุดก็ได้ จนกว่าจะวนรอบบรรจบทจ่ี ุดเร่ิมต้น

ขน้ั ที่ 6 ใชเ้ มาสจ์ บั ภาพบรเิ วณทเ่ี ลอื ก ย้ายตาแหน่งตามต้องการ การหมนุ และปรบั เปล่ียนวตั ถุ (Object) ดว้ ยเครอื่ งมือ Free Transform Tool เครื่องมอื Free Transform Tool มีหนา้ ท่ีคอื การหมนุ วตั ถุ หรือปรบั เปล่ยี นขนาด กลบั ทศิ ทางวัตถุ ตวั อย่าง การใชง้ าน ขัน้ ท่ี 1 เคร่อื งมอื Free Transform Tool ขนั้ ท่ี 2 คลกิ เลือกวัตถุทต่ี อ้ งการ

ขนั้ ที่ 3 การหมุน การย่อ-ขยาย

การปรับเปลีย่ นทิศทางของวตั ถุ การดัด บิดวตั ถุ

การนารปู ภาพมาใชง้ านในโปรแกรม Flash โปรแกรม Flash สามารถรองรบั การทางานเกย่ี วกบั รปู ภาพทง้ั แบบบิตแมพ (Bitmap) และ ภาพ เวคเตอร์ (vector) รูปแบบภาพบติ แมพ (Bitmap) เช่น JPG, GIF, BMP, PNG, TIFF, PCT, PSD,PIC รปู แบบภาพเวคเตอร์ (vector) เชน่ WMF, EMF, AI, EPS, DX F, SGI, PNTG, QTIF รูปแบบการนาเขา้ แบบท่ี 1 Import to Stage เป็นการวางภาพไว้บน stage หรอื Scene ทก่ี าลงั เปดิ อยู่ ขั้นที่ 1 คลกิ เมนู File -> Import > Import to Stage... ข้นั ท่ี 2 คลิกเลอื กไฟลภ์ าพท่ตี ้องการ จากแหล่งภาพ แล้วคลิก Open

ขั้นท่ี 3 ภาพจะถูกนาเข้า และวางบน stage หรอื Scene ท่กี าลังเปิดอยู่ แบบที่ 2 Import to Library เปน็ การนาภาพเขา้ มาเกบ็ ไว้ใน Library ในรูปแบบซมิ โบล เม่ือต้องการนามาใช้จงึ หยิบจากLibrary มาวางท่ี Stage ข้นั ที่ 1 คลกิ เมนู File -> Import > Import to Library... ขั้นที่ 2 คลกิ เลือกไฟล์ภาพทีต่ ้องการ จากแหล่งภาพ แล้วคลิก Open

ข้นั ที่ 3 ภาพจะถูกนาเข้า และเกบ็ ไวใ้ น Library ขน้ั ท่ี 7 หยิบซิมโบล จาก Library มาวางท่ี stage

การปรบั แตง่ ภาพบิตแมพ (bitmap)ภาพบติ แมพ (bitmap) ที่นาเข้ามาในโปรแกรมนน้ั สามารถปรบั แตง่ คุณสมบัตขิ องภาพใหม้ ีคุณภาพ เชน่ การปรบั ภาพใหน้ มุ่ เพื่อลดรอยหยกั การกาหนดระดับการบีบอัดขอ้ มลู ข้นั ตอนการปรับแตง่ ขั้นที่ 1 ที่หนา้ ต่าง Library (เปิดไดโ้ ดย กด F11 หรอื คลิกเมนู Window > Library) คลิกช่ือภาพที่ตอ้ งการปรับแตง่ และคลกิ สญั ลกั ษณ์ Properties ข้ันท่ี 2 ปรบั แตง่ คา่ ต่างๆ ทห่ี น้าต่าง Bitmap Properties

รายละเอยี ดการ ปรบั แตง่ se3 คือชื่อของไฟลภ์ าพ สามารถแก้ไขเปล่ยี นช่ือได้ ถ้าคลิกเลอื ก Allow smoothing จะทาให้ภาพมคี วามนมุ่ ขนึ้ ลดรอยหยกั บรเิ วณรอยตอ่ ของสี ถ้าไมเ่ ลอื ก Use document default quality จะทาให้สามารถกาหนดคุณภาพของภาพได้ โดยเตมิ ตัวเลข 1-100 ซ่งึ สงู สุดคือ 100 หมายถึงคุณภาพเหมือนตน้ ฉบับ คอื ไม่บบี อัดเลย (คา่ ตวั เลขน้อย ภาพจะไมค่ มชัด แตข่ นาดไฟลจ์ ะเลก็ ) การแปลงภาพบิตแมพ (bitmap) เปน็ ภาพเวคเตอร์ (vector) การแปลงภาพบิตแมพ (bitmap) เปน็ ภาพเวคเตอร์ (vector) จะช่วยใหส้ ามารถแก้ไข ดัดแปลง ภาพทเ่ี ป็นเวคเตอร์ ทาไดง้ ่าย และทาใหข้ นาดของไฟลม์ ีขนาดเล็กและสามารถลบภาพต้นฉบบั ออกจาก Library ได้ โดยไมม่ ผี ลกบั ภาพเวคเตอรท์ ีแ่ ปลงแลว้ ขน้ั ตอนการแปลง ข้ันท่ี 1 คลกิ เลอื กภาพบิตแมปบน stage ขน้ั ที่ 2 คลกิ เมนู Modify > Bitmap > Trace Bitmap...

ขั้นท่ี 2 คลกิ เมนู Modify > Bitmap > Trace Bitmap... กรณีปรบั ค่าตามตัวอยา่ ง ภาพท่ี 3 จะไดด้ งั ภาพ หากต้องการภาพทม่ี ีความละเอียด ทีใ่ กลเ้ คยี งกบั ต้นฉบบั ค่าตวั เลขจะต้องปรับใหน้ อ้ ยทส่ี ดุ ดงั ภาพ และจะ ได้ผล ดงั ภาพขวามอื พร้อมจะนาไปใชง้ านต่อไป

การสรา้ งภาพเคลอื่ นไหวแบบตา่ งๆ การสร้างภาพเคลือ่ นไหวแบบเฟรมตอ่ เฟรม (Frame-by-Frame) การสร้างภาพเคลื่อนไหวแบบน้ี เปน็ การสรา้ งคยี ์เฟรม หลายๆ คีย์เฟรมต่อเรยี งกนั แต่ละเฟรมจะเปน็ อสิ ระ ตอ่ กนั การแก้ไขเฟรมใดเฟรมหนงึ่ ไมส่ ่งผลตอ่ เฟรมอ่ืนๆ ซึ่งหลกั ๆ มอี ยู่ 3 รปู แบบคอื 1. การสรา้ งข้อความเคล่ือนไหว 2. การสร้างภาพเคล่อื นไหวแบบย้ายตาแหน่งวตั ถุ 3. การสรา้ งภาพเคล่อื นไหวแบบย่อ-ขยายวัตถุ รูปแบบที่ 1 การสร้างขอ้ ความเคลื่อนไหว ข้ันท่ี 1 พมิ พ์ข้อความลงบน Stage โดยเร่ิมท่ีคียเ์ ฟรมใดคียเ์ ฟรมหนึง่

ข้นั ที่ 2 เพ่ิมคยี เ์ ฟรมที่ 2 โดย กด F6 หรอื คลิกขวาทคี่ ยี เ์ ฟรมท่ี 1 แล้วคลิก Insert Keyframe ข้นั ที่ 3 คลิกทีค่ ียเ์ ฟรมท่ี 2 พมิ พต์ วั อกั ษรตวั ที่ 2 หรอื ขอ้ ความท่ีต้องการ

ข้นั ที่ 4 ทาขน้ั ตอนท่ี 2 ตอ่ ด้วยขน้ั ตอนที่ 3 วนอย่างนี้ จนกว่าจะครบข้อความท่ตี ้องการ ขนั้ ที่ 5 ทาจนครบขอ้ ความทต่ี อ้ งการดงั ภาพ

ขน้ั ที่ 6 ทดสอบ Movie โดยกดCtrl+ Enter หรือ คลกิ เมนู Control > Test Movie จะได้ไฟล์ Movie เป็น .swf รปู แบบท่ี 2. การสรา้ งภาพเคลอ่ื นไหวแบบย้ายตาแหนง่ วัตถุ ข้นั ที่ 1 สรา้ งวตั ถุขึ้นมา 1 ชิน้ จะวาดเปน็ ภาพธรรมดาหรือ ทาเป็น ซมิ โบลกไ็ ด้ บนเฟรมท่ี 1

ข้นั ท่ี 2 คลิกขวาทเ่ี ฟรมท่ี 2 หรอื กด ปุม่ F6 เพื่อเพมิ่ คีย์เฟรม (Keyframe) ข้นั ท่ี 3 ใช้ลูกศรสดี า (Selection Tool) คลกิ แล้วยา้ ยตาแหนง่ วตั ถุขยับจากตาแหนง่ เดิมเลก็ นอ้ ย

ขั้นท่ี 4 ทาซา้ ข้ันท่ี 2 คือ คลกิ ขวาท่ีเฟรมถดั ไปคือเฟรมที่ 3 หรือ กดป่มุ F6 เพ่ือเพ่มิ คียเ์ ฟรม จากน้นั ใชล้ กู ศรสี ดา (Selection Tool) คลิกแลว้ ยา้ ยตาแหนง่ วตั ถอุ ีกเลก็ นอ้ ย ข้ันท่ี 5 เพ่มิ คียเ์ ฟรมต่อไปเร่อื ยๆ และ ขยบั วตั ถุ ไปเรื่อยจนกระทงั่ ไดภ้ าพเคล่ือนไหวตามตอ้ งการ จากน้นั ตรวจสอบการเคลอื่ นไหวโดยการคลิกทหี่ ัวอา่ น(Play Head) แลว้ ลากเม้าสซ์ า้ ย-ขวา

ข้ันที่ 6 กด Ctrl + Enter หรือ คลกิ ทีเ่ มนู Control > Test Movie เพ่ือชมตวั อย่าง รูปแบบที่ 3. การสรา้ งภาพเคลอ่ื นไหวแบบยอ่ -ขยายวัตถุ การเปล่ยี นขนาดวัตถใุ หใ้ หญข่ ึ้นหรอื เล็กลงเป็นอกี รปู แบบหนึ่งของการสร้างภาพเคลอ่ื นไหวตัวอย่างเช่นการ ทาใหว้ ัตถุเคลื่อนทจ่ี ากตาแหนง่ ทอี่ ยู่ไกลมาใกลเ้ ปน็ ตน้ ข้ันที่ 1 วาดวตั ถขุ ้ึนมา 1 ช้นิ ดงั รปู ข้นั ท่ี 2 ใชล้ ูกศรสดี า (Selection Tool) ลาก ครอบวัตถทุ งั้ หมด ขน้ั ที่ 3 กดป่มุ Ctrl ค้างไวแ้ ลว้ กด ตวั G เพ่ือสรา้ งกลุ่มของ ขนั้ ท่ี 4 คลกิ เลอื กเคร่อื งมอื Free Transform วตั ถุ (Group) จะปรากฏขอบสฟี ้า Control จะมกี รอบสดี าขึ้นรอบวัตถุ ขนึ้

ขัน้ ที่ 5 นาเมา้ สม์ าชีท้ ี่กรอบสเี่ หลย่ี มสีดาเลก็ ๆ ขั้นท่ี 6 คลิกขวาทีเ่ ฟรมท่ี 2 เลือก Insert ท่ีมมุ ของวตั ถแุ ล้วย่อยให้เป็นภาพขนาดเลก็ Keyframe หรือ กดปมุ่ F6 เพมิ่ คีย์เฟรม แล้วขยายภาพ ใหใ้ หญ่ขึ้น เล็กนอ้ ย ขน้ั ท่ี 7 กดปุ่ม F6 เพมิ่ คีย์เฟรมแลว้ ขยายภาพข้นึ อีก ขน้ั ท่ี 8 ทาซ้าขัน้ ตอนท่ี 7 จนไดข้ นาดภาพทต่ี ้องการ เลก็ นอ้ ย อาจจะตอ้ งเพม่ิ หลายๆคยี เ์ ฟรมก็ได้

ข้นั ที่ 9 กด Ctrl+ Enter เพ่ือชมผลงาน หากต้องการทาให้ภาพใหญ่เปน็ เลก็ ตอ้ งทาให้ภาพในตาแหนง่ เฟรมท่ี 1 เปน็ ภาพขนาดใหญ่ เฟรมถดั ไปค่อยๆปรบั ให้เล็กลงเรื่อยๆทลี ะเฟรม

การสรา้ งภาพเคลอื่ นไหวแบบ Shape Tween Shape Tween คือการสร้างภาพเคลือ่ นไหวให้วัตถเุ ปลย่ี นรปู ร่างจากรปู หน่ึงเปน็ อกี รปู หนงึ่ เช่น จากรูป สเ่ี หล่ยี มเปน็ รปู วงกลม หรอื จากรูปเปน็ ข้อความ เป็นตน้ ข้นั ที่ 1 คลกิ ทเ่ี ฟรมที่ 1 แลว้ วาดรปู วัตถขุ น้ึ มาหนึ่งรูป ข้นั ท่ี 2 คลกิ ทเ่ี ฟรมท่ี 1 (สาคญั มากเพราะถ้าไม่คลกิ ตวั เลอื กจะไม่แสดงขน้ึ ในหน้าต่าง Properties) เลือกคาส่ัง Shape ในชอ่ ง Tween

ขนั้ ท่ี 3 คลิกขวาท่เี ฟรมท่ี 20 แล้วเลือกคาสงั่ Insert Keyframe ขั้นท่ี 4 คลกิ เฟรมที่ 20 แลว้ กดปุ่ม Delete ลบวตั ถเุ ดมิ ออกตอนนี้บนไทมไ์ ลนจ์ ะมแี ถบเสน้ ประสเี ขียว ขน้ั ที่ 5 วาดรปู ท่ตี ้องการให้เปล่ยี นลงไปในเฟรมท่ี 20

ข้นั ที่ 6 กดปุ่ม Ctrl+Enter เพ่อื ทดสอบการเปลี่ยนแปลงจะเห็นภาพค่อยๆเปลี่ยนจากรปู หนง่ึ เป็นอกี รปู หนง่ึ

การสร้างภาพเคลอื่ นไหวแบบ Motion Tween การสรา้ งภาพเคล่ือนไหวแบบนี้ เปน็ การเคล่อื นทีข่ องเน้อื หาจากจดุ หนง่ึ ไปยังอีกจดุ หน่งึ หรอื เปลี่ยนคณุ สมบัติ จากแบบหนง่ึ ไปเปน็ อีกแบบหนงึ่ เหมาะสาหรับการทาภาพเคล่อื นไหว แบบตอ่ เนอ่ื งสมา่ เสมอ เช่น เมฆลอย พัดลม กาลังหมนุ ยานบนิ รถกาลงั แล่น เปน็ ต้น 1. การสร้างภาพเคลือ่ นไหวแบบลอยในแนวเส้นตรง ขั้นที่ 1 คลิกเลือกคียเ์ ฟรมจุดเรมิ่ ตน้ ขน้ั ที่ 2 สร้างวตั ถุ หรอื เนอื้ หาตามตอ้ งการ

ขนั้ ที่ 3 คลกิ ขวาทีค่ ียเ์ ฟรม คลิกเลอื กเมนู Create Motion Tween ขั้นที่ 4 กาหนดระยะห่างจากจดุ แรกตามต้องการ เช่น ข้นั ท่ี 5 จบั วตั ถุที่ stage แลว้ ปรบั เปลย่ี น หา่ ง 15 เฟรม คลกิ ทเี่ ฟรมท่ี 15 แลว้ เพมิ่ คียเ์ ฟรม โดย คุณลักษณะ เชน่ ยา้ ยตาแหนง่ ยอ่ -ขยาย เปลี่ยนสี กด F6 หรือคลิกเมนู Insert > Timeline > หรอื อ่นื ๆ Keyframe ตามต้องการ ข้นั ท่ี 6 ทดสอบ Movie โดยกด Ctrl+ Enter หรือ จะไดไ้ ฟล์ Movie เปน็ .swf คลิกเมนู Control > Test Movie



ภาพเคลอื่ นไหวแบบยอ่ -ขยาย ขั้นตอนท่ี 1 คลกิ ทเี่ ฟรมท่ี 1 แลว้ วาดรปู ท่ีตอ้ งการลงไป ขั้นที่ 2 คลิกขวาทเ่ี ฟรมท่ี 1 แลว้ เลือกคาสง่ั Create Motion Tween

ขน้ั ท่ี 3 คลิกขวาเฟรมที่ 20 เลอื กคาสัง่ Insert Keyframe แล้วขยายรูปให้ใหญข่ ึ้นด้วย Free Transform Tool ข้นั ที่ 4 กดปมุ่ Ctrl+Enter เพื่อดตู ัวอย่างภาพเคลอ่ื นไหว จะเห็นภาพค่อยใหญ่ขนึ้

สร้างการเคลอื่ นไหวแบบปรบั ใหค้ อ่ ยชัดหรือจางลง (Alpha) Alpha เป็นการปรบั คา่ ความโปร่งของวตั ถุถ้าค่า alpha (อลั ฟา่ ) มาก เราจะมองวตั ถนุ ั้นชดั เจน ถ้าคา่ alpha นอ้ ยลงเราจะมองเห็นภาพวตั ถนุ ้ันเลือนๆ ขนั้ ตอนที่ 1 คลกิ ทเี่ ฟรมที่ 1 แลว้ วาดรปู ทต่ี อ้ งการลงไป ขน้ั ที่ 2 คลกิ ขวาท่ีเฟรมท่ี 1 แลว้ เลือกคาสงั่ Create Motion Tween

ข้ันท่ี 3 คลิกขวาเฟรมท่ี 20 เลอื กคาสงั่ Insert Keyframe แล้วขยายรปู ให้ใหญข่ ้ึนดว้ ย Free Transform Tool (ไม่ขยายก็ได้) ขั้นที่ 4 คลกิ ที่วัตถุเพอ่ื ใหต้ วั เลือกปรากฏขึ้นที่ Properties จากน้ันเลือก Alpha แล้วปรับคา่ Alpha เปน็ ค่าท่ี น้อยลง จะไดภ้ าพทีจ่ างลงมองทะลพุ น้ื หลังได้

ข้ันที่ 5 กดปุม่ Ctrl+Enter เพื่อดูตวั อยา่ งภาพเคลอื่ นไหว จะเหน็ ภาพค่อยใหญข่ ึ้นและจางหายไปแต่ตาแหน่งไม่ เปล่ยี นเนือ่ งจากเราไมไ่ ด้ยา้ ยตาแหนง่ ของวัตถุ นักเรยี นสามารถเปล่ียนใหว้ งกลมใหญเ่ ป็นเลก็ ได้ หรือ จากจางไปเข้มไดเ้ พยี งปรบั เปล่ียนคา่ คณุ สมบตั ขิ องวัตถตุ าม คยี เ์ ฟรมเรมิ่ ตน้ และคยี เ์ ฟรมปลายทาง


Like this book? You can publish your book online for free in a few minutes!
Create your own flipbook