Page 1

m j a Learning Object p b f i l Animate Design o e h k n q c7 u 1 9 rt w z d 4 s 6 v 5 y 3 10 8 2 m db j 5 p f i l e o c hkn 1 7 u rt w z 9 g

Monnisa Rungpatchim

g

g

Funny English With Frank

g


a

m j p i l f e c h k n oq 7 r u z9 1 w d 4 s tv 3 6 10 5 y 8 2 m db j 5 p f i l e o c hkn 1 7 u rt w z 9 b

g

g

g

g


Learning Object Animate Design Monnisa Rungpatchim


About

Name Monnisa LastName Rungpatchim Nicename Gof Born 10 June 1988 Study Chandrakasem Rajabhat University Humanities and Social Sciences Art Visual Communication Design ID 5221304792 Email : Monnisa522@gmail.com Blog : http://monnisa-arti3322.blogspot.com

Chandrakasem Rajabhat University 39/1 Ratchadaphisek Road, Khwaeng Chantharakasem, Chatuchak District, Bangkok 10900. Tel. 0-2942-6900-99 Website : http://www.chandra.ac.th/th /index.php

สงวนสิทธิ์ ผลงานของ มนนิสา รุง ปจฉิม Copyrights by Monnisa Rungpatchim


frank


n

tio introduc 1 ion

uct pre-prod 2-9

on

contents

producti 10-11

ion

duct o r p t s o p 12-13

softwere 14-15 n

o conclusi

hy

p Bibliogra


introduction หนังสือเลมนี้สรางขึ้นเพื่อเปนคูมือประกอบการสรางงาน Animation 2D ใน Project Learning Object Animate Design เปน Animatiom 2D ที่สรางขึ้น เพื่อใหความรูเด็กชั้นประถมศึกษาปที่ 1 เกี่ยวกับภาษาอังกฤษ สามารถนำไปใช เปนสื่อการสอนบนสืออิเล็กทรอนิกสเชน Computer Tap Learning Object Animate Design เปนสวนหนึ่งของวิชา ARTI 3322 Animation Design เปนหนวยการเรียน ทีอ่ ยูใ นคณะมนุษยศาสตร สาขาศิลปกรรม แขนงออกแบบนิเทศศิลป โดยมีทานอาจารย ผศ.ประชิด ทิณบุตร เปนผูสอน และผูใหคำปรึกษา หนังสือเลมนี้อาจมีประโยชนไมมากก็นอยกับผูที่สนใจงาน Animation 2D ถาหากมีขอผิดพลาดหรือมีเนื้อหาที่ไมเหมาะสม ผูจัดทำตองขออภัยมานะที่นี้ ดวยคะ Monnisa Rungpatchim

1

LEARNING OBJ ECT ANIMATE DESIGN


m j ab d f i l p o e h k n q c g

pre-production ConcePt

ในสังคมโลกปจจุบัน การเรียนรูภาษาตางประเทศมีความสำคัญและจำเปน อยางยิง่ ในชีวติ ประจำวัน เนือ่ งจากเปนเครือ่ งมือสำคัญในการติดตอสือ่ สาร การ ศึกษา การแสวงหาความรู และใชภาษาตางประเทศเพือ่ การสือ่ สารได รวมทัง้ เขา ถึงองคความรูต า งๆ ไดงา ยและกวางขึน ้ ภาษาตางประเทศทีเ่ ปนสาระการเรียนรูพ  น ้ื ฐาน กำหนดใหเรียนตลอดหลักสูตรแกนกลางการศึกษาขัน ้ พืน ้ ฐาน คือ ภาษาอังกฤษ ซึง่ เด็กอายุ 6-7 ป อยูใ นระดับชัน ้ ประถมปท่ี 1 เปนวัยทีส่ ามารถแยกเสียง พยัญชนะ สระ วรรณยุกต คำวรรคตอน เปนตน ฝกใหมมี ารยาทในการฟง สามารถตอบคำถาม ไดถกู ตอง ปฏิบตั ติ ามคำสัง่ และคำ แนะนำไดถกู ตอง มีสมาธิและเขาใจในการฟงคำ อธิบายตาง ๆ รวมทัง้ ฟงเรือ่ งราว หรือนิทานและติดตามเนือ้ เรือ่ งตามลำดับ จึงเปนวัย ที่เหมาะกับการเรียนรูทักษะภาษาอังกฤษ ผูจัดทำจึงไดทำสื่อการสอนในดาน ความรูพื้นฐานที่เด็กตองรู ออกมาในรูปแบบการตูน Animatiom 2D เพื่อดึงดูด ความสนใจของเด็กใหรูสึกอยากรูอยากเห็น เพราะการตูนจะมีสีสันที่เด็กชอบ

2

LEARNING OBJ ECT ANIMATE DESIGN


1 4 2

r tu w z s y 3 6 5 10 v q 7

g 8

9

PLAN วัตถุประสงคทส่ี รางงาน Animation 2D นีข้ น ้ึ มาเพือ่ เปนสือ่ การเรียนการสอน บนคอมพิวเตอรพกพา (Taplet) ใหกับเด็กชั้นประถมศึกษาปที่ 1 เปาหมายเพือ่ ใหเด็กชัน ้ ประถมศึกษาปท่ี 1 ไดศกึ ษาการสะกดและทองจำตัว เลขเปนภาษาอังกฤตั้งแต 1-10 ได ขั้นตอนการทำงาน เนื่องดวย Animation นี้เปนสื่อการเรียนการสอนใหกับเด็ก จึงไดสรางเนื้อ เรื่องในลักษณะครูสอนนักเรียน ครูใน Animation นี้ จะมี Charactor เปนลิง สวนในเรื่องของฉาก จะเปนฉากที่อยูในโรงเรียน บริเวณหองเรียนและมีเพลง ประกอบการสอน เพื่อความสนุกสนานและไมนาเบื่อ 1.สรางเนื่อเรื่องและเขียนบท 2.Sketch Character และสรางดวย Sofe Were (Adobe Illustrator) 3.Sketch ฉาก และสรางดวย Sofe Were (Adobe Illustrator) 4.สราง StoryBoard 5.บันทึกเสียงพาษย หา Sound, Sound Effact 6.นำ Character และฉากไปทำ Animation 2D ดวย Sofe Were (Adobe Flash) โดยแบงเปน Scene 7.ตัดตอ Sound และ Vocal ดวย Sofe Were (WavePad Sound Editor) 8.นำ Animation Sound และ Vocal ที่ได ไปตัตอ ดวย Sofe Were (Camtasia Studio 7) FUNNY ENGLISH WITH FRANK

3


StorY ณ โรงเรียนแหงหนึ่งที่อยูทามกลางธรรมชาติ ซึ้งภายในโรงเรียน นั้นมีลิงอยูตัวหนึ่ง เปนลิงสอนวิชาภาษาอังกฤษและลองตัวนั้นก็มีชื่อ วา Mr.Frank เปนครูสอนภาษาอังกฤษใหกบ ั เด็กชัน ้ ประถมศึกษาปท่ี 1 วันนี้ก็เปนอีกวันหนึ่งที่ Mr.Frank ตองเดินไปสอนเด็กๆที่หองประถม ศึกษาปท่ี 1 เมือ่ เดินไปถึงหอง Mr.Frank ก็ไดกลาวทักทายกับเด็กๆและ เริ่มเรียนการสะกดตัวเลขเปนภาษาอังกฤษ หลังจากนั้น Mr.Frank กลัวเด็กๆจะเบือ่ ในการเรียนจึงชวยกันรองเพลง ดวยจังหวะสนุกสนาน เมื่อจบเพลง Mr.Frank ก็บอกลาเด็กๆ Port Mr.Frank จะสอนสะกดตัวเลขเปนภาษาอังกฤษอยางไร และชวน เด็กๆรองเพลงอะไร

ScriPt TITLE : ขนาดภาพ Medium Shot ลิงใสเสื้อสีฟา กางเกงสีดำ เดินลากตัวอักษรภาษาอังกฤษที่ เปนคำวา “MONNISA” เมื่อลากตัวอักษรไปหยุดที่กลางภาพแลว ลิงก็วิ่งกลับไปที่ชองวางในคำ ซึ่งเปนที่ของตัวไอแลวหันตัวอักษรไอ ใหเขาที่ แลวภาพก็คอยๆหายไป กลายเปนกระดานสีเขียว ที่มีตัว ชอลกคอยๆเขียนเปนคำวา “Funny English With Frank” SCENE 1 : ขนาดภาพ Long Shot Mr.Frank เดินมาตามทางเดินของโรงเรียน เพื่อไปที่หองเรียน ชั้นประถมศึกษาปที่ 1 มีเสียงเดินและเสียงเพลงทำนองการตูนสนุกๆ ดังไปพรอมๆกันการเดินของMr.Frank เขาเดินไปเรื่อยๆจนถึงหนา หองชั้นประถมศึกษาปที่ 1

4

LEARNING OBJ ECT ANIMATE DESIGN


SCENE 2 : ขนาดภาพ Long Shot Mr.Frank เดินเขาหองเรียนจากทางดานขวาของภาพ เพื่อเอา หนังสือ How to Spell English ไปวาที่ โต็ะของเขา มีเสียงเดินและ เสียงเพลงทำนองการตน ู สนุกๆดังไปพรอมๆกันการเดินของ Mr.Frank

5

SCENE 3 : ขนาดภาพ Long Shot Mr.Frank ยืนอยูห  นากระดานกลางหองเรียน พูดทักทาย แลว เริม่ สอนการสะกดตัวเลข โดย Mr.Frank ถือกระดาษสีขาวและมีตวั อักษรปรากฎขึ้นตามเสียงที่ Mr.Frank สะกด ไลไปจนครบจำนวน 1-10เมื่อครบ Mr.Frank ก็ชวนรองเพลงสนุกๆ SCENE 4 : ขนาดภาพ Medium Shot Mr.Frank รองเพลง นับตัวเลข 1-10 และยกนิ้วขึ้นมานัยตาม จังหวะเพลง The End : ขนาดภาพ Medium Shot เปนภาพกระดานสีเขียว มีรอ งรอยของการใชงาน แลวคอยๆขึน ้ Cradit ใหกับผูที่เกี่ยวของ ใชเพลงการตูแนวสนุกสนานประกอบ

FUNNY ENGLISH WITH FRANK

5


Character เลือก Character เปนลิงแสมเพราะ ลิงเแสมเปนลิงที่มีลักษณะ คลายมนุษยมคี วามเฉลียวฉลาด มีขนตามลำตัวสีนำ้ ตาล หางยาวกวา ความยาวของลำตัว ขนตรงกลางหัวมีลักษณะตั้งแหลมชี้ขึ้นมีขนตาม ลำตัวสีนำ้ ตาล หางยาวกวาความยาวของลำตัว (ในทีน ่ ส้ี ราง Character เปนลิงที่ไมมีหาง) ขนตรงกลางหัวมีลักษณะตั้งแหลมชี้ขึ้น

ลักษณะและบุคลิก Mr.Frank Mr.Frank เปนลิงทีม่ ห ี นาตาเปนมิตรกับเด็กๆ ใสแวน มีหนวด เพราะ เปนลิงทีม่ ปี ระสบการณในการทำงาน ใสเสือ้ แขนยาวสีขาว ผูกไทดสดี ำ และใสกางเกงขายาวสีดำเพื่อความนาเชื่อถือเปนลิงไทยที่ชอบภาษา อังกฤษ และมีนิสัยที่ชอบเลนกันเด็ก จึงไดมาเปนคุณครูสอนภาษา อังกฤษใหกับเด็กชั้นประถม

6

LEARNING OBJ ECT ANIMATE DESIGN


FUNNY ENGLISH WITH FRANK

7


StorYBoard

8

LEARNING OBJ ECT ANIMATE DESIGN


Scene

Sofe Were (Adobe Illustrator)

FUNNY ENGLISH WITH FRANK

9


m j ab d f i l p o e h k n q c g

production Animatiom 2D

ในการสราง Animation 2D ใน Project นี้ ขาพเจาไดใช Soft Wereที่มี ชือ่ วา Adobe Flash เปนโปรแกรมทีไ่ ดรบ ั ความนิยมมากในหมูน  กั สราง งานมัลติมเี ดีย เพราะสามารถสรางภาพเคลือ่ นไหวทีส่ มบูรณแบบทัง้ ภาพ และเสียง ไฟลงานที่ไดมีขนาดเล็ก เหมาะสำหรับนำไปเผยแพรผลงาน ผานเว็บบราวเซอรตางๆ ขั้นตอนการสรางงาน Animation 2D จากโปรแกรม Flash 1.กำหนดเลเยอร Background เปนเฟรมภาพนิ่ง 2.กำหนดเลเยอรของ Character ใหไปอยู LIBRARY ที่ละสวน 3.กำหนดคียเฟรมหลักที่ใชในการเคลื่อนที่ของ Character 5.ทดสอบผลที่ได 6.Export ไฟลเปน MOV

10

LEARNING OBJ ECT ANIMATE DESIGN


1 4 2

r tu w z s y 3 6 5 10 v q g 8

7

9

Sound & Vocal 1. คลื่นเสียงใน Soft Were WavePad เปนคลื่นเสียงประเภท Vocal หรือเสียงพากย

2. คลื่นเสียงใน Soft Were WavePad เปนคลื่นเสียงประเภท Sound Effect

3. คลื่นเสียงใน Soft Were WavePad เปนคลื่นเสียงประเภท Sound

FUNNY ENGLISH WITH FRANK

11


m j ab d f i l p o e h k n q c g

post-production

นำไฟลวดิ โี อ ซาวดและเสียงพาษกทไ่ี ด ไปทำการตัดตอ โดยใช Soft Were ทีม่ ชี อ่ื วา Camtasia Studio 7 Camtasia Studio 7 เปนโปรแกรมสรางสือ่ มัลติมเี ดียทีใ่ ชตดั ตอไดทง้ั ภาพ เสียง สามารถใส Effect ได และยังสามารถบันทึกการทำงานบนหนาจอคอมพิวเตอร ของเราไดดวย ขั้นตอนการตัดตอ 1.เปดโปรแกรมนำไฟลที่เตรียมไปใสไวใน Clip Bin 2.นำไฟลจาก Clip Bin ลากไปใสใน Timeline 3.ตัดตอตามตองการ 4.ทดสอบผลที่ได 5.Produce and Share

Clip Bin Timeline 12

LEARNING OBJ ECT ANIMATE DESIGN


1 4 2

r tu w z s y 3 6 5 10 v q 7

g 8

9

สามารถ Export และ Share ไดหลายแบบ

FUNNY ENGLISH WITH FRANK

13


m j ab d f i l p o e h k n q c g

Softwere

โปรแกรม Illustrator เปนโปรแกรมสำหรับสรางภาพ ลายเสนที่มีความคมชัดสูง งานภาพประกอบและงาน กราฟกแบบ 2 มิติตางๆ

โปรแกรม Photoshop เปนโปรแกรมสรางหรือตกแตงภาพ ใชงานงาย มีเอฟเฟคตาง ๆ ใหเลือกใชงานมากมาย

โปรแกรม Flash เปนโปรแกรมที่ใชในการสรางอนิเมชั่นตางๆ หรือใชเปดไฟลวิดีโอ เปดเพลง ผานเว็บไซต โปรแกรม WavePad เปนโปรแกรมที่ใชในการตัดแตงเพลง ไฟลนามสกุล MP3ระบบจะแปลงเพลงนั้นออกมาเปนแบบ คลื่น wave เพื่อใหเราเลือกชวงของเพลงแลวตัดเอาเฉพาะ สวนใดสวนหนึ่งของเพลงออกมาเพื่อนำไปใช โปรแกรม Camtasia Studio 7 เปนโปรแกรมสรางสื่อมัลติมี เดียที่ใชตัดตอไดทั้งภาพเสียง สามารถใส Effact ได และยัง สามารถบันทึกการทำงานบนหนาจอคอมพิวเตอรของเราได ดวย 14

LEARNING OBJ ECT ANIMATE DESIGN


1 4 2

r tu w z s y 3 6 5 10 v q 7

FUNNY ENGLISH WITH FRANK

g 8

9

15


conclusion Cartoon Animation 2D ทีเ่ ราเห็นในปจจุบน ั นี้ ไมวา จะทาง Internat โทรทัศน หรือสือ่ ตางๆ ก็ลว นแลวมาจากความคิกสรางสรรค ความรูแ ละทักษะของผูส ราง จากการทีข่ า พเจาไดทำ Project นี้ ทำใหรวู า การสรางงาน Animaioom 2D นัน ้ ไมใชเรื่องงาย ตองมีกระบวนการคิดอยางเปนขั้นตอนเปนลำดับ ตองละเอียด และพิถพ ี ถิ น ั ในทุกๆขัน ้ ตอน เพือ่ งานทีด่ ี และเมือ่ พบปญหาหรือตองการการแกไข ตรงไหน ถาทำงานอยางเปนระบบ ก็จะทำใหการแกไขนั้นเปนเรื่องงายๆ

16

LEARNING OBJ ECT ANIMATE DESIGN


Bibliography พันจันทร ธนวัฒนเสถียน. (2554). Flash cs5.5. (พิมพครั้งที่1). กรุงเทพฯ : สำนักพิมพ ซิมพลิฟาย Harry Hamernik , H.H. (2010). Cartoon 360 . (1St ed.) Cincinnati F+M Media Computer Graphic. (2551). โปรแกรม Illustrator คืออะไร. 31มีนาคม2555 จาก Computer Graphic เว็บไซด : http://jomthongprint.blogspot.com/2008 /07/illustrator.html Computer Graphic. (2551). โปรแกรม Photoshop คืออะไร. 31มีนาคม2555 จาก Computer Graphic เว็บไซด : http://jomthongprint.blogspot.com/2008 /07/photoshop.html Computer Graphic. (2551). โปรแกรม Flash คืออะไร. 31มีนาคม2555 จาก Computer Graphic เว็บไซด : http://jomthongprint.blogspot.com/2008/07/ flash.html Youtube. (2009) เพลงนับเลข. 9พฤษภาคม2555, จาก Moey White เว็บไซด : http://www.youtube.com/watch?v=audeRLR7juM&feature=g-like Youtube. (2011) CHOICE วาดวยการตนู Flash. 9พฤษภาคม2555, จาก CHOICE Studio เว็บไซด : http://www.youtube.com/watch?v=5nbnYQ5WHO4&list=PL9269 F648480D6597&feature=plcp SoundCloud. (2012) croco_goes_porto. 3พฤษภาคม2555, จาก deadlydrunker เว็บไซด : http://soundcloud.com/search?q%5Bfulltext%5D=croco_goes_porto

FUNNY ENGLISH WITH FRANK

17


a

m j p i l f e c h k n oq 7 r u z9 1 w d 4 s tv 3 6 10 5 y 8 2 m db j 5 p f i l e o c hkn 1 7 u rt w z 9 b

g

g

g

g

สงวนสิทธิ์ ผลงานของ มนนิสา รุง ปจฉิม Copyrights by Monnisa Rungpatchim : Chandrakasem Rajabhat University

Funny English With Frank  

หนังสือเล่มนี้นี้เป็นส่วนประกอบหนึ่งใน Learning Object Animate Design ซึ่งเป็นส่วนหนึ่งของวิชา ARTI3322 Animation Design สาขาวิชาศิลปกรรม มห...

Read more
Read more
Similar to
Popular now
Just for you