หนังสือเรียนรายวิชา การสร้างแอนิเมชี่น ม.4

46 15. จากนน้ั ลากวงรีเล็กๆ มาไวด้ ้านในวงรรี ปู แรก จะไดท้ ่อนไม้ ดังรูป 16. Copy ทอ่ นไม้ใหไ้ ด้ 3 อัน บทที่ 3 การสร้างมฟู วีค่ ลิป

47 17. จัดแต่งรปู ทรงตามใจชอบ โดยใช้เครอื่ งมือ Free Transform Tool (Q) 1 2 18. จัดวางตาํ แหนง่ ให้สวยงาม จากนนั้ เลอื กทที่ ่อนไมท้ ่อนท่ี 3 ที่ยังไมว่ างรวมกบั กองไฟ บทที่ 3 การสร้างมูฟว่ีคลปิ

48 19. สรา้ ง Layer 3 เปลี่ยนชื่อเป็น Logs back 20. ตอนนี้อยูท่ ี่ Layer ชอ่ื Logs เลือกทอ่ นไม้ทอ่ นที่ 3 ดงั รปู จากน้นั เลอื กคาํ สั่ง Cut บทท่ี 3 การสรา้ งมูฟวีค่ ลิป

49 21. ไปท่ี Layer ชื่อ Logs back เลอื กคาํ ส่ัง Edit > Paste in Place 1 2 22. จากนนั้ เล่อื นท่อนไม้ไปไว้ด้านหลัง จะไดก้ องไฟทสี่ วยงาม ดังรปู บทที่ 3 การสร้างมูฟว่คี ลปิ

50 23. จากนนั้ คลิก Lock ที่ Layer ช่ือ Logs และ Logs back 1 2 24. จากน้ัน คลกิ ทเ่ี ฟรมที่ 25 ของ Layer ชอ่ื Logs กด f5 และ Layer ชอ่ื Logs back กด f5 ดังรูป บทที่ 3 การสรา้ งมูฟว่คี ลิป

51 25. คลกิ ที่เฟรมที่ 5 ของ Layer ชอ่ื Logs กด f6 26. จากนนั้ ไปท่ี Modify > Transform > Flip Horizontal เพอ่ื ปรับแต่งเปลวไฟ 1 3 2 บทที่ 3 การสรา้ งมูฟวีค่ ลิป

52 27. คลกิ ทเ่ี ฟรมท่ี 10 กด f6 ปรบั แต่งเปลวไฟให้แตกตา่ งกนั ออกไป 1 2 28. ทาํ แบบเดียวกัน ในเฟรมที่ 15 20 และ 25 ปรับแตง่ เปลวไฟใหแ้ ตกต่างกนั ออกไป บทท่ี 3 การสรา้ งมูฟวี่คลิป

53 29. คลิกกลบั มาที่ Scene 1 เข้าไปดูใน Library จะมชี ิน้ งาน 1 ช้ิน ชือ่ campfile ลองคลิกท่ี play มุมขวาบนของ Library จะแสดงภาพเคล่ือนไหวของกองไฟ 13 2 30. คลิกทช่ี นิ้ งาน campfile ใน Library แลว้ ลากมาวางในหนา้ กระดาษเพื่อทดสอบ 21 31. จากน้นั กด Ctrl+Enter จะไดภ้ าพกองไฟทเ่ี ปลวไฟเคลอ่ื นไหวได้ บทท่ี 3 การสรา้ งมฟู วี่คลปิ

54 บนั ทกึ ชว่ ยจาํ Aide Memoire ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ บทที่ 3 การสร้างมูฟวีค่ ลิป

บทที่ วิธีการวาดตวั ละคร วิธกี ารวาดตวั ละคร

56 Drawing วธิ กี ารวาดตวั ละคร การใช้เคร่อื งมอื วาดภาพ ในโปรแกรม Adobe Flash มหี ลายเครื่องมือเช่นเดยี ว กับโปรแกรมกราฟิกอืน่ ๆ เช่น Photoshop และ โปรแกรม Illustrator ซึ่งเครอื่ งมือสาํ คญั ได้แก่ Line Tool สําหรบั ใช้วาดเสน้ ตรง Pen Tool สําหรบั ใช้วาดเสน้ ตรง หรอื เส้นประกอบหลายเหลยี่ ม Oval Tool สาํ หรับวาดวงกลมหรือวงรี Pencil Tool สําหรบั ใชว้ าดลายเสน้ แบบอิสระ 1. เปิดโปรแกรม Adobe Flash ข้ึน เพ่ือสรา้ ง Project ใหม่ 2. เครื่องมือทใ่ี ชใ้ นการวาดภาพตัวละคร 3. คลิกเลือกสที ใ่ี ชใ้ นการวาดในทน่ี เ้ี ลือกสีดาํ 1 บทท่ี 4 วิธีการวาดตัวละคร

57 4. วาดใบหน้าตัวละครและผมใชเ้ คร่อื งมือ Pencil Tool 5. คลิกทเี่ ครอ่ื งมอื Eraser Tool เพือ่ ลบส่วนท่ไี ม่ต้องการ 6. คลกิ ท่เี ครือ่ งมือ Free Transform Tool และเลือกส่งิ ทตี่ ้องการจะตดั ออก คลิกเมาส์ขวา เลือก cut 7. จากน้นั เลือกที่ Fill Color ให้เป็นสขี าวและไปเลอื กเครื่องมือ Oval Tool เพ่ือวาดสว่ นที่เปน็ หูของตวั ละคร 2 1 บทที่ 4 วธิ กี ารวาดตัวละคร

58 3 8. คลกิ ทเ่ี ครือ่ งมือ Free Transform Tool เพื่อย้ายมาที่ใบหนา้ ของตวั ละคร และใชเ้ คร่อื งมอื Eraser Tool เพือ่ ลบสว่ นที่ไมต่ อ้ งการ 1 2 9. ใชเ้ คร่ืองมอื Pencil Tool วาดสว่ นประกอบใบหู ผม ตา จมูก เพิม่ เติม บทที่ 4 วิธีการวาดตัวละคร

59 10. จากน้ันเลือกเครอ่ื งมอื Brush Tool > Brush size > Brush shape เลือก แบบกลม เพ่ือวาดดวงตาและให้ fill color เป็นสดี ํา 1 3 2 11. จะไดภ้ าพนี้จากข้นั ตอนที่ 10 12. ท่ี Fill color เลือกใหเ้ ปน็ สเี ทา และ ไปทเี่ คร่อื งมอื Paint Bucket Tool > Gap Size เลอื ก Close Large Gaps 1 2 3 บทท่ี 4 วธิ ีการวาดตัวละคร

60 13. เลอื กสีตามต้องการและใสสใี ห้กับภาพหรือเลือกเครื่องมอื Free Transform เพื่อปรบั เส้นของภาพตามตอ้ งการ ดินสอ 1. สรา้ งไฟล์ Flash แลว้ กําหนดลักษณะ Stage ใหเ้ หมาะสมด้วยคาํ สัง่ Modify, Document 2. วาดส่เี หลี่ยมรปู ทรงแท่งยาวกาํ หนดลกั ษณะเสน้ ขอบตามความเหมาะสม 3. เติมสีให้กับดนิ สอ โดยการใช้ชุดสไี ลโ่ ทน “สม้ /ขาว” โดยเปิด Color Mixer Panel เลอื กรายการชดุ สีเป็น Linear กาํ หนด Color Maker 3 ตาํ แหนง่ โดยตาํ แหน่งท่ี 1 และตําแหนง่ ที่ 3 ให้กําหนดเป็นสีส้ม ตาํ แหน่งท่ี 2 กําหนดเป็นสขี าว 4. เลอื กเคร่ืองมือ Paint Bucket เติมสีลงในรูปสเี่ หล่ยี ม บทที่ 4 วธิ ีการวาดตัวละคร

61 5. ใช้เครอ่ื งมือวาดเส้น ตีเสน้ ตรงตัดรูปส่เี หลยี่ ม 2 ตําแหนง่ เพอ่ื แปลงสภาพ เปน็ ปลายดนิ สอ และยางลบ 6. เลอื กเครอื่ งมอื Selection ปรบั ปลายดา้ นหน่งึ สเ่ี หลี่ยมให้เป็นสามเหลยี่ ม ดงั รปู 7. ลบเสน้ ตรงส่วนท่ีคั่นปลาย ดนิ สอกบั ตัวดินสอออก โดยใชเ้ ครื่องมอื Selection คลกิ เลอื กแลว้ กดปมุ่ Del 8. ดัดแปลงปลายดินสออีกด้าน ให้เป็นยางลบ ดังตัวอย่าง 9. ใชเ้ ครื่องมือ Selection และ Free Transform ย้าย หรอื หมนุ ปรับเปลี่ยน รูปทรงของดินสอให้เหมาะสม บทที่ 4 วิธีการวาดตัวละคร

62 บนั ทกึ ชว่ ยจํา Aide Memoire ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ บทที่ 4 วธิ กี ารวาดตัวละคร

บทท่ี การสรา้ ง Animation ดว้ ยคาํ สง่ั Tween การสร้าง Animation ดว้ ยคาํ สัง่ Tween ทม่ี า http://learningame.inforef.be/images/flash/shape_tween.jpg

64 Animation - Tween การสร้าง Animation ด้วยคําสงั่ Tween Tween คือการสร้างภาพเคล่อื นไหวในโปรแกรม flash ชว่ ยสร้างการเคลอื่ นไหว ระหวา่ ง เฟรมเร่ิมต้นจนถึงเฟรมสนิ้ สดุ ทเ่ี ราได้ทาํ การสร้าง Tween ขึน้ มาใหโ้ ดยอตั โนมัติ Tween แบง่ ออกเปน็ 3 รปู แบบ คือ 1. Shape Tween 2. Classic Tween 3. Motion Tween 1. Shape Tween เปน็ Animation สําหรับการเปลี่ยนรูปทรงหน่งึ เป็นอีกรูปทรงหนงึ่ เชน่ วงกลม เปล่ยี นเปน็ รูปดาว รูปดาวกลายเปน็ สเี่ หลย่ี ม หรอื น้ํากล้งิ ไปกลงิ้ มา ฯลฯ โดยอาศยั หลกั การของ Tween ซง่ึ หลกั การคอื วาดรปู เริม่ ต้นไว้ท่ี Keyframe แรก และไปวาดรูป ปลายทางท่ี keyframe ตอ่ ไป แต่ Shape Tween นั้นจะทาํ ได้เพียงรปู ทรงพนื้ ฐานเทา่ น้ัน ในรูปทรงยาก ๆ ก็จะใหก้ ารเปลี่ยนแปลงที่ไม่สวย วาดรปู วงกลม เฟรมที่ 1 วาดรูปดาว เฟรมที่ 20 create Shape Tween ที่เฟรมที่ 10 ภาพจะคอ่ ยเปลี่ยนจากวงกลม เป็นรปู ดาว บทที่ 5 การสร้าง Animation ดว้ ยคาํ สง่ั Tween

65 2. Classic Tween คือ การสรา้ งแอนเิ มชันโดยใช้ออบเจ็กต์เพยี งชิ้นเดยี ว จากนนั้ จงึ สง่ั ให้มกี าร เคลือ่ นไหวออบเจก็ ตน์ น้ั Classic Tween สามารถใชใ้ นการเปล่ียนแปลงคณุ สมบัตขิ อง วัตถุ จากคา่ หน่ึงไปเปน็ อีกค่าหนงึ่ ไดโ้ ดยง่าย ตวั อยา่ งการใช้ Classic tween สําหรับปรบั ตาํ แหนง่ การใช้ Classic tween สาํ หรับหมนุ วัตถโุ ดยขนาดของวัตถุค่อย ๆ หมนุ ไป การใช้ Classic tween สาํ หรบั ขนาดวตั ถุ โดยขนาดของวัตถคุ อ่ ย ๆ เปลยี่ นไป บทที่ 5 การสรา้ ง Animation ดว้ ยคาํ ส่ัง Tween

66 การใช้ Classic tween สาํ หรับปรับความโปรง่ ใสของวัตถุสามารถปรับความ โปรง่ ใสของวัตถุได้โดยสามารถทาํ ให้วัตถสุ ามารถคอ่ ยๆ ปรากฏ หรอื ว่า คอ่ ยๆจางหายไป โดยจะแสดงตัวอย่างวตั ถคุ อ่ ยๆ จางหายไป การใช้ guide layer เพือ่ ควบคุมการเคล่ือนที่ ไปตามเสน้ ทก่ี ําหนดไว้ เนอ่ื งจาก การใช้ Tween ธรรมดานนั้ จะเปน็ การเคลื่อนท่ใี นแนวเสน้ ตรงเท่านั้น ซึ่งหากต้องการให้ วตั ถเุ คล่อื นที่ไปตามเส้นทางท่ตี ้องการ จงึ ต้องมี Layer อีกชนิดหนึง่ ซ่ึงเรียกวา่ guide layer และวตั ถุทีว่ าดลงไปบน guide layer นัน้ บทที่ 5 การสรา้ ง Animation ด้วยคําส่ัง Tween

67 3. Motion Tween เปน็ การสร้างภาพเคล่ือนไหว ชนดิ กําหนดจุดเร่ิมตน้ และจดุ สิน้ สดุ วตั ถุทนี่ ํามา สรา้ งจะเปน็ วัตถุประเภทใดกไ็ ด้ โปรแกรมจะสรา้ งการเปลยี่ นแปลงระหว่างเฟรมใหโ้ ดย อัตโนมัติ เหมาะสําหรบั การสร้างภาพเคล่อื นไหวแบบที่ต้องการความต่อเน่ืองสม่ําเสมอ การกาํ หนดคุณสมบตั ขิ อง Motion Tween การสร้างการเคล่ือนไหวแบบนี้ สามารถกาํ หนดคา่ ตา่ ง ๆ ใหก้ ับการเคลอื่ นไหวได้ เชน่ ปรบั ความเรว็ ในการเคล่ือนไหว กําหนดจาํ นวนแสดงซํา้ ทั้งหมดนี้ให้กาํ หนดคา่ ที่ พาเนล Properties การปรับแต่งคา่ การเคล่ือนทบี่ นพาธ บทท่ี 5 การสรา้ ง Animation ด้วยคาํ ส่งั Tween

68 Frame Label กาํ หนดช่อื เฟรม เมอ่ื กําหนดช่อื จะปรากฏธงสีแดง และชอื่ เฟรมทจ่ี อภาพ Timeline การกาํ หนดช่อื เฟรม ปรากฏธงแดงและชอ่ื เฟรม Tween กาํ หนดรปู แบบของภาพเคล่ือนไว - None ไม่เคลอื่ นไหว - Motion การเคล่อื นทแ่ี บบยา้ ยสถานที่ โดยไม่มกี ารเปลย่ี นแปลงรปู ร่างองวตั ถุ แตส่ ามารถเปลย่ี นขนาดวตั ถุได้ - Shape การเคลอ่ื นไหวแบบเปลย่ี นรปู รา่ ง เชน่ เปลีย่ นรปู ร่างสี่เหลี่ยมเปน็ รปู ดาว Erase กําหนดความช้าเร็วในการเคล่ือนที่ โดยมขี อ้ กาํ หนดดังน้ี - ถา้ กําหนดคา่ ตัวเลขมากกว่า 0 การเคลอ่ื นท่ีจะเริ่มจากเรว็ แลว้ คอ่ ย ๆ ชา้ ลง จนกระทั่งหยุดการเคลื่อนไหว - ถา้ กาํ หนดค่าตัวเลขนอ้ ยกว่า 0 การเคลือ่ นท่ีจะเรม่ิ จากชา้ แล้วคอ่ ย ๆ เร็วขึน้ จนกระท่ังหยดุ การเคลอื่ นไหว Rotate การกาํ หนดการตัง้ ค่าการหมนุ ของวัตถุ ดังนี้ - None ไม่มีการหมุนวตั ถุ - Auto หมุนวัตถุอัตโนมตั ิ - CW/CWW หมนุ วตั ถุตามเขม็ นาฬกิ า/ ทวนเข็มนาฬิกา บทท่ี 5 การสร้าง Animation ดว้ ยคําสั่ง Tween

69 กาํ หนด จาํ นวนครงั้ ลกั ษณะ ท่หี มุน การหมน Orient to path กําหนดใหว้ ตั ถุเคลอื่ นท่ีไปตามเสน้ พาธ Sync คือ Synchronize คือ การกําหนดใหว้ ัตถุเคล่อื นไหวใหส้ อดคล้องกบั ไทม์ไลนห์ ลัก Snap คอื การยึดภาพเคล่อื นไหวเข้าหาเส้น Motion path การทาํ Motion Tween 1. คลิก > file 2. คลิก > New 3. คลิก > ActionScript 3.0 หรอื 2.0 กไ็ ด้ 4. คลกิ > OK 12 บทที่ 5 การสร้าง Animation ด้วยคาํ ส่ัง Tween

70 3 4 5. คลกิ เคร่อื งมือ selection tool 6 6. คลกิ ทเ่ี ฟรมท่ี 1 7. คลกิ เลือก PolyStar tool 8. คลกิ property 9. Option > Tool Setting 9.1 คลกิ Style : star, 9.2 คลกิ Number of Sides : 5, 9.3 คลกิ Star point side : 0.50 9.4 คลิก ok 5 7 บทท่ี 5 การสรา้ ง Animation ด้วยคําสง่ั Tween

71 8 9 10. คลกิ เลอื กสีขาว เพราะจะใชส้ พี ้ืนหลังเปน็ สีดาํ เลอื กสเี สน้ ขอบตามชอบ 11. คลิก Modify > Document 11.1 ต้งั ค่า Dimension :550 x 440, 11.2 เลือก Background color สีดํา 11.3 คลกิ Ok 11 10 บทท่ี 5 การสร้าง Animation ดว้ ยคําสัง่ Tween

72 12. วาดรูป Star > 12.1 คลิกเครอื่ งมือ selection tool ครอบรูป Star 12.2 คลิก ALIGN จัดตาํ แหน่งให้อยูก่ ่งึ กลางทง้ั แนวนอนและแนวต้งั บทท่ี 5 การสร้าง Animation ด้วยคําสง่ั Tween

73 13.คลกิ Windows 13.1 Motion Presets 13.2 คลกิ MOTION PRESETS 13.3 คลกิ Pulse 13.4 คลกิ Apply 13.5 คลกิ OK บทท่ี 5 การสรา้ ง Animation ดว้ ยคําสั่ง Tween

74 14. กดปมุ่ Ctrl + Enter เพื่อดตู ัวอย่าง 15. คลกิ new layer 15.1คลกิ Insert 15.2 คลกิ Timeline 15.3 คลกิ Layer 15 บทท่ี 5 การสร้าง Animation ดว้ ยคําสัง่ Tween

75 16.คลกิ เลือกสที ีต่ อ้ งการ 16 17.คลกิ เลือก Rectangle Primitive Tool(R) 17 บทที่ 5 การสร้าง Animation ด้วยคําสง่ั Tween

18. คลกิ เลอื ก cap: Square, 76 19. คลกิ เลือก Join: Bevel 19 18 20. คลกิ เครือ่ งมอื selection tool 20.1 คลิกพื้นทีด่ า้ นนอกวาดรูป ปรับขนาดท่ี RECTANGLE OPTION ปรบั ขนาด ให้ได้ดังภาพ 20 บทท่ี 5 การสร้าง Animation ดว้ ยคาํ ส่งั Tween

77 21. จดั ตําแหน่งใหอ้ ยู่กึ่งกลางแนวต้งั 21 22. คลิกเครอ่ื งมอื selection tool 23. คลกิ พ้นื ทว่ี า่ งด้านนอก > คลกิ เลอื กรปู 24. คลกิ ท่เี ฟรมท่ี 1 22 24 23 บทที่ 5 การสรา้ ง Animation ด้วยคาํ สั่ง Tween

78 25. คลกิ Insert> 25.1 คลิก Motion Tween 25.2 คลิก ok 26.คลกิ ทีเ่ ฟรมสุดทา้ ย แลว้ ลากรปู ผา่ นรปู ดาว 26 บทที่ 5 การสร้าง Animation ดว้ ยคําสั่ง Tween

79 28 27. คลิกเครอ่ื งมอื selection tool 28. ลากเส้นตรงใหโ้ ค้งลงมา 27 29. กดปมุ่ Ctrl+ Enter Preview ตัวอย่าง บทท่ี 5 การสร้าง Animation ด้วยคําสง่ั Tween

80 การใช้ Shape tween กบั ขอ้ ความ การใช้ Shape tween กบั ขอ้ ความน้นั คือการทําให้รปู รา่ งตา่ งๆไม่ว่าจะเป็น สามเหลี่ยม สเ่ี หลย่ี ม วงกลม ฯลฯ เปลี่ยนมาเป็นข้อความอย่างสวยงาม ซงึ่ มตี ัวอย่าง วธิ กี ารทาํ ดังน้ี 1. เปดิ โปรแกรม Flash CS 6 ข้นึ มา โดยไปท่ี start > Adobe Flash Professional CS 2. ใหค้ ลกิ เลือก ActionScript 3.0 หรอื 2.0 3. คลิก OK 4. เลือกเครอื่ งมือ Rectangle Tool จากนั้นสร้างรูปส่เี หลี่ยมขึ้นมาตามรูป บทท่ี 5 การสร้าง Animation ด้วยคําสง่ั Tween

81 5. คลิกขวาที่เฟรมแลว้ เลือก Insert Keyframe 6. เลอื กทเ่ี ฟรมสดุ ทา้ ยแล้วกดปมุ่ Delete รูปสเ่ี หลย่ี มก็จะหายไป 7. เลอื กเคร่อื งมอื Text Tool พมิ พข์ ้อความลงไปในเฟรมสุดทา้ ย 13 2 บทที่ 5 การสรา้ ง Animation ดว้ ยคําสั่ง Tween

82 8. คลิกขวาที่ขอ้ ความ Hello แลว้ เลือก Break Apart จากนนั้ ก็คลกิ ขวาที่ขอ้ ความ แล้วเลอื ก Break Apart อีกครงั้ 9. คลิกขวาในเฟรมแล้วเลอื ก Create Shape Tween เรากจ็ ะไดร้ ปู สี่เหล่ยี มแปลงมาเป็น ข้อความเป็นอันเสร็จเรยี บรอ้ ย แสดงผลดังรปู บทท่ี 5 การสรา้ ง Animation ดว้ ยคาํ สัง่ Tween

บทท่ี การสร้างแอนิเมชนั ดว้ ยคําสง่ั Mask การสร้างแอนเิ มชนั ด้วยคําสัง่ Mask บทเรยี นนเ้ี ปน็ บทเรียนเปน็ โดยใช้คําสงั่ Mask เปน็ การโชว์ Animation การเขยี น ของตัวอกั ษร ซงึ่ จะค่อยๆ ปรากฏข้นึ ซ่ึงมวี ิธีการปฏิบัติและเขา้ ใจงา่ ย เทคนคิ การสรา้ ง Mask เปน็ เทคนิคทีถ่ กู นาํ มาใช้กนั มาก ท้งั นี้ขนึ้ อยู่กบั ไอเดีย ในการสร้าง Mask ของแตล่ ะคน เช่น เทคนคิ ในการทาํ สปอร์ตไลท์ การทําตวั อักษรแบบ เขยี นทีละตัว การทาํ Mask จะเปน็ เหมือนกบั การสร้างหนา้ กากขน้ึ มา โดยใช้การเจาะรเู ป็น รูปท่ตี อ้ งการแลว้ เอาภาพท่ีต้องการไปซอ้ นหลัง โดยรูปก็จะไมเ่ สียหายเราสามารถปรบั แต่ง หรอื สรา้ งการเคลื่อนไหวไดเ้ หมือนกนั วัตถุอืน่ ๆ ทวั่ ไป รวมถงึ การเคล่ือนที่ตามเสน้ ด้วย

84 Animation - Mask การสร้างแอนิเมชนั ด้วยคาํ สง่ั Mask 1. เปดิ โปรแกรม FlashCS66 ขน้ึ มา โดยไปที่ start > Adobe Flash Professional CS66 หรือ start > all Programs > Adobe Flash Professional CS 6 2. ให้คลกิ เลือก ActionScript 3.0 ในสว่ นของ Create New 1 3. จะปรากฏหนา้ ตา่ งการทํางาน ซึ่งในส่วนน้ีเรียกวา่ Stage ดงั รูป บทที่ 6 การสรา้ งแอนิเมชนั ด้วยคําสง่ั Mask

85 4. คลิกท่ีเครือ่ งมอื Text เพ่ือทจ่ี ะพมิ พ์ขอ้ ความ แลว้ จะปรากฏหน้าทีเ่ ป็น Character ขนึ้ มาทางด้านขวามือ เลือกในส่วนของแบบตัวอกั ษร เลอื กขนาดและเลอื กสี ของตัวอักษรท่ตี อ้ งการ 12 3 4 5. ลากกรอบลงบน Stage เพื่อพมิ พต์ ัวอกั ษรที่ต้องการลงไป บทที่ 6 การสรา้ งแอนิเมชนั ด้วยคําส่งั Mask

86 6. ปรับขนาด Stage ให้พอดีกับตวั อักษรได้โดยการ คลกิ เลือกท่ี edit จะปรากฏ หนา้ ต่าง Document Setting ใหเ้ ปลยี่ นความสงู ตามทีต่ ้องการ 2 1 7. จะได้ Stage ทม่ี ีขนาดตามทตี่ ้องการ บทท่ี 6 การสรา้ งแอนิเมชนั ด้วยคําสง่ั Mask

87 8. ไปท่ี Timeline ท่ี Layer 1 ตรง frame ท่ี 150 คลกิ ขวาเพอื่ Insert Key frame 1 2 9. สรา้ ง Layer ใหม่ อกี 1 Layer โดยไปท่ี Timeline ตรงมมุ ล่างซา้ ยจะมี เครอื่ งมือทช่ี ื่อว่า New Layer แล้วคลกิ เลอื ก 1 2 บทที่ 6 การสรา้ งแอนเิ มชันด้วยคําสง่ั Mask

88 10. จะได้ Layer ใหม่ ชื่อ Layer 2 ดงั รูป 11. ต่อไปจะทํางานท่ี Layer 2 ให้ Lock Layer 1 ไว้ โดยคลกิ ให้เป็น รูป แมก่ ญุ แจ 12. คลกิ ทเี่ ครอื่ งมอื Brush Tool ซ่ึงจะเป็นรูปพู่กนั จากนน้ั คลกิ เลือก Brush Shape ให้เปน็ แบบวงกลม และเลือก Brush Size เพื่อเลือกขนาดของพู่กนั ใหเ้ หมาะสมกับ ขนาดของตวั อักษร 1 2 3 บทท่ี 6 การสรา้ งแอนเิ มชนั ด้วยคาํ สง่ั Mask

89 13. เลือกสขี อง Brush โดยไปที่ Fill and Stroke คลิกทถี่ งั สี และเลือกสีที่ตอ้ งการ 14. คลิกท่ี Layer 2 เพอ่ื ทาํ งาน 15. คลิกที่ Frame ท่ี 150 และลากจนไปถงึ Frame ท่ี 1 ดงั รปู จากนัน้ กด Shift บทท่ี 6 การสร้างแอนิเมชันด้วยคําส่งั Mask

90 ให้เอาแปรงไปวาดตามตัวอกั ษรทลี ะนดิ และคลกิ ขวาที่ Frame แลว้ เลือก Insert Keyframe หรอื จะ คลกิ ท่ี Frame แล้วกด F6 กจ็ ะเปน็ การเพ่มิ Keyframe 2 1 16. ทาํ ตามขอ้ 15 ทําไปเรือ่ ยๆๆ จนครบทกุ ตัวอกั ษร บทที่ 6 การสรา้ งแอนิเมชนั ด้วยคําส่ัง Mask

91 17. เมื่อทําครบทกุ ตวั อักษร ก็จะเหลอื Blank Frame ( เฟรมว่าง ) 18. ข้ันตอ่ ไปให้ เปล่ียนชอื่ Layer โดย Double Click ตรงคําว่า Layer โดยท่ี Layer 1 เปลย่ี นเปน็ Text และ Layer 2 เปล่ียนเป็น Mask บทที่ 6 การสรา้ งแอนเิ มชนั ด้วยคําสั่ง Mask

92 19. Click ขวาที่ Layer จากนั้นเลือกคาํ สัง่ Mask 20. กด Ctrl+Enter เพือ่ ทดสอบการทาํ งานของ Animation บทที่ 6 การสรา้ งแอนเิ มชนั ด้วยคาํ สงั่ Mask

93 21. เมื่อทดสอบแลว้ ถา้ เคลอ่ื นไหวเรว็ หรือช้าไป สามารถปรบั ความเรว็ ได้ ( fps = Frame per Second ความเร็วของเฟรมตอ่ วินาท,ี s = Second วินาที ) 22. กด Ctrl+Enter เพอื่ ทดสอบการทํางานของ Animation อกี คร้งั บทท่ี 6 การสรา้ งแอนเิ มชนั ด้วยคําส่ัง Mask

94 บันทึกชว่ ยจาํ Aide Memoire ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ ................................................................................................................................................ บทที่ 6 การสรา้ งแอนเิ มชันด้วยคําส่งั Mask

บทที่ การใช้งานเสียง การใช้งานเสยี ง Sound Effect คือ เสียงต่างๆ ทเี่ กิดขนึ้ รอบตัวละคร ช่วยให้ผู้ชมสมั ผสั ไดถ้ งึ บรรยากาศหรือเหตุการณท์ เ่ี กิดในเรือ่ งได้ชัดเจน เช่น เสยี งบรรยากาศ เสียงการเคลอื่ นไหว ของตวั ละครหรือสิง่ ของ หรอื เสยี งท่ชี ว่ ยเน้นอารมณข์ องตวั ละคร Sound Effect มี 3 ประเภท เสียงเนน้ อารมณ์ของตัวละคร คือ เสยี งทชี่ ่วยเนน้ อารมณข์ องตวั ละครให้ชดั เจน ย่ิงขน้ึ เชน่ เพง้ ! (เสยี งกระจกแตก) ใชเ้ ม่อื ตัวละครหนา้ แตก ผ่าง! ใชเ้ มอื่ ตวั ละครตกใจ หรอื แตว๋ ! ใชเ้ มอื่ ตัวละครทาํ อะไรเปิ่นๆ เป็นตน้ เสยี งการเคลอ่ื นไหว คอื เสยี งทีเ่ กดิ จากการเคลือ่ นไหวของตวั ละคร หรอื เสยี ง ของวัตถุท่ีมกี ารเคลือ่ นไหวใน Shot น้นั ๆ เช่น เสียงกา้ วเทา้ เดนิ , เสยี งพมิ พ์ดดี , เสยี งของ กระแทกเมื่อตวั ละครลม้ , เสยี งกระแทกเมอ่ื ตวั ละครกําลงั ชกต่อยหรือต่อสู้กัน เปน็ ตน้ เสียงบรรยากาศ คือ เสยี งทชี่ ว่ ยแสดงบรรยากาศของฉาก เช่น เสียงคลืน่ ทะเล, เสยี งไฟในฉากไฟไหม้, เสียงจกั จนั่ , เสียงฝนตก เป็นต้น