ความรู้พื้นฐานเกี่ยวกับโปรแกรม Adobe ...
Click here to load reader
Transcript of ความรู้พื้นฐานเกี่ยวกับโปรแกรม Adobe ...
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 1
Flash คออะไร โปรแกรม Flash เปนโปรแกรมททางานในดานมลตมเดยในดานแอนนเมชนตางๆ ทงเวบแอนนเมชน การตนแอนนเมชน งานแบนเนอรภาพเคลอนไหวหรองานมลตมเดยแบบอนเตอรแอคทฟทโตตอบกบผใชงาน งาน Flash นนแบงเปน 2 ประเภทใหญ คอ งาน Online และงาน Offline ซงมงานประเภทตางๆ ดงตอไปน
Flash แบบ Online 1. Web Banner งานปายโฆษณาบนเวบไซตพฒนามาจาก Gif Animation ทโหลดชา และคณภาพตาในสมยกอน มาเปน Animation ของ Flash ทเคลอนไหวตอเนองมขนาดเลกและยงม Graphic ทสวยงาม 2. Web Animation สวนประกอบของเวบไซตทเคยใชเปนภาพนง สามารถสอสาร และดงดดความสนใจไดมากขนดวย Flash 3. Web Introduction ถา 1 ภาพแทนคาพด 1000 คา ภาพเคลอนไหวยอมพดไดมากขนอกหลายเทาตว การใชภาพเคลอนไหวอธบายบคลก ตวตนของเวบไซตเปนอกอยางท Flash ทาไดดและไดรบความนยมอยางสง 4. Flash Website ถาไมใชเวบไซตจะไมเพยงแคตกแตงประดบประดาดวย Flash เทานน มนสามารถใชทาเวบไซตทงกระบวนการไดดวย ไมจากดแคเพยง Animation และเนอหาอยางเดยว หากยงการเชอมโยงกบฐานขอมล และการสราง Application ทมรปแบบเฉพาะตวอกดวย
Flash แบบ Offline 1. Product Introduction งานเปดตวสนคา งาน Event งานคอนเสรต งานแตงงาน ทจะตองมการนาเสนอความนาสนใจของสนคา หรอกจกรรมตางๆ การท า Animation อธบายวธการใช หรอแนะนากจกรรมลกคาดวยโปรแกรม Flash กเปนทางเลอกใหมทกาลงมาแรง ดวยวธการทสะดวก และประหยดคาใชจายกวางานดาน VDO
ใบความรท 1 เรอง ความรพนฐานเกยวกบโปรแกรม Adobe Flash CS5
วชาการสรางภาพเคลอนไหว ชน ม.6 เวลา 2 ชวโมง ครผสอน ครจรฐชญา ปาแปง
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 2
2. Presentation, CD Interactive เมองาน Flash สามารถตอบโตกบผใชงานได การสรางงานแบบ Presentation กไมเปนปญหาสาหรบ flash อกทงยงมประโยชนในเรองความยดหยนของการเขยนโปรแกรม จงเปดโอกาสใหสรางงาน Interactive แบบจนตนาการกวางไกล โดยไมยดตดอยในโครงรางตายตวเหมอนกบ PowerPoint อกตอไป 3. Application ในขนสง การเขยนโปรแกรมชวยใหสามารถสราง Application เฉพาะทางขนเอง เอาไวใชสวนตว หรอใชกนเองในบรษท
Flash ทาอะไรไดบาง โปรแกรม Flash เปนโปรแกรมยอดนยมสาหรบการสรางผลงานไดหลายประเภท ไมวาจะเปนการตนแอนเมชน, เกม, สอโฆษณาบนเวบไซต หรออนเตอรเฟสแผนซดทมการตอบโตกบผใช โดยในหวขอนเราจะมาทาความรจกกบความสามารถของโปรแกรม Flash ไวเปนแนวทางเพอนาไปพฒนาชนงานตอไป 1. ความสามารถในการสรางชนงาน Interactive ชนงาน Interactive คอ ชนงานทม
การตอบสนองกบผใช เชน ผใชสามารถคลกเลอกเมนตางๆ ได ซงสวนใหญงานประเภท Interactive
ทสรางดวยโปรแกรม Flash นนจะนาไปใชเปนสอการสอน (E-Learning) หรอหนาจอควบคมการ
ทางานของแผน CD เปนตน
2. ความสามารถในการสรางชนงาน Animation การสราง Animation หรอภาพ
การตนเคลอนไหวนน ถอเปนหวใจหลกของการทางานในโปรแกรม Flash เนองจากมเครองอานวย
ความสะดวกมากมาย จงทาใหโปรแกรม Flash สรางผลงาน Animation ไดงายกวาโปรแกรมอน
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 3
ซงเราสามารถพบเหนงานแอนเมชนไดทวไป ไมวาจะเปนสอโฆษณา (Banner) บนเวบไซต
หรอการตนแอนเมชนตางๆ
3. ความสามารถในการสรางเวบไซต (Website)
งานประเภทเวบไซตกเปนการสรางชนงานอกรปแบบหนงทใชโปรแกรม Flash สรางผลงาน
เนองจากโปรแกรม Flash สามารถสรางเวบไซตไดสวยงาม และสรางลกเลนตางๆ ไดงายกวาการใช
โปรแกรมอน แตมขอเสยคอ เวบไซตทสรางดวยโปรแกรม Flash แกไขขอมลไดยาก และขนาดของ
ไฟลเวบไซตจะมขนาดคอนขางใหญ ดงนน หากตองการสรางเวบไซตควรพจารณาถงรปแบบของ
เวบไซตกอนวาเหมาระสมทจะสรางดวยโปรแกรม Flash หรอไม
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 4
4. ความสามารถในการสรางเกม (Game) ปจจบนไดมเกมทสรางจากโปรแกรม Flash
ออกมาอยางแพรหลายตามเวบไซตตางๆ เนองจากโปรแกรม Flash มเครองมอชวยสราง
องคประกอบตางๆ ของเกมใหสวยงาม, มเครองมอสาหรบใสคาสงควบคมการเลนเกม อกทงไฟลเกม
ทสรางออกมามขนาดเลก ทาใหอพโหลดขนสเวบไซตไดอยางรวดเรว
เตรยมตวอยางไรสาหรบการสรางแอนเมชน
สาหรบการเตรยมตวในการทางานโปรแกรม Flash CS5 นน จะตองเรมจากวางโครงราง
เรองราวแอนเมชน หลงจากนนกจะสรางตวละครใหเหมาะสมกบเรองราว สรางฉากแลวนา
ทกอยางมาประกอบกนใหเปนชนงาน
วางโครงรางสาหรบสรางงานแอนเมชน (Storyboard)
การวางโครงราง (Storyboard) คอการคดเนอเรองขนมา และวาดออกมาเปนภาพตงแตตน
จนจบอยางคราวๆ ซงกเหมอนกบการวางแผนการท างานในเบองตน เพอใหผลงานทออกมาเปน
ระบบและรวดเรว
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 5
สรางตวละครสาหรบงานแอนเมชน
เมอเราสรางผลงานแอนเมชนขนมาสกชนหนง สงทจาเปนจะตองทากคอ การสรางตวละคร
เพอเปนตวดาเนนเรองราว โดยตองคดเนอเรองขนมากอน วาเราตองการทจะสรางเรองราวอะไร
ขนมา และคนหาเอกลกษณของตวละครนนๆ เพอใหตวละครมความโดดเดนและนาสนใจ แตสาหรบ
ผทไมมทกษะทางดานการวาดรปอาจขอใหเพอน หรอคนรจกวาดรปใหนามาสแกน แลวปรบแตงเพอ
ใชงานในโปรแกรม Flash กได
1. วาดโครงรางของตวละครดวยดนสอ จากนนนาไปสแกน
2. ใชเครองมอทมในโปรแกรม Flash ปรบตางภาพตวละคร
3. ลงส และเกบรายละเอยดใหกบตวละคร
Flash CS5 มอะไรใหม
ในโปรแกรม Flash CS5 แตกตางจากโปรแกรม Flash เวอรชนกอนหนาหลายสวนตงแต
หนาจอโปรแกรม และเครองมอใหมๆ ทเพมขนมา ซงจะมอะไรบางนนเราจะไดเรยนรกนในสวนน
หนาตาของโปรแกรมทเปลยนไป (User Interface)
สาหรบโปรแกรม Flash CS5 เวอรชนลาสด หนาตาของโปรแกรมไดเปลยนไปจากเดม
เปลยนตาแหนงการวางแถบเครองมอตางๆ ทง Timline, Scene และ Panel ตางๆ ทาใหผทใชงาน
นนสามารถทางานไดสะดวกสบายยงขน
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 6
เครองมอใหมทเพมขนมา
เมอเปดโปรแกรม Flash CS5 เราจะเหนวาเครองมอใหมๆ เพมขนมาหลายชน โดยแบง
ออกเปน 5 หมวดหลกๆ ดงตอไปน
เครองมอสาหรบปรบแตงภาพ 3 มต
เครองมอ (3D Rotation Tool) และเครองมอ (3D Translation Tool)
เปนเครองมอทสามารถปรบตางภาพ หมน บด ใหออกมาเปนรปแบบ 3 มต ซงเปนความสามารถททา
ใหเราสรางงานแอนเมชนทดเปนมตมากยงขน
เครองมอสาหรบสรางหวแปรงทาส
เครองมอ (Deco Tool) เปนเครองมอส าหรบสรางวตถทมลกษณะคลายๆ กบ
เครองมอแปรงทาส (Brush) แตเราสามารถสรางหวแปรงใหม โดยเปลยน Symbol ใหกลายเปนหว
แปรงได
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 7
เครองมอสาหรบสรางโครงกระดก เครองมอสาหรบสรางโครงกระดก (Bone Tool) และเครองมอ (Bind Tool) เปนเครองมอทสามารถเชอมตอโครงกระดกเพอใสเขาไปบนการตน ทาใหการตนมการเคลอนไหวทเปนอสระมากยงขน โดยขนตอนการใชงานของเครองมอ (Bone Tool)
พาแนล Motion Editor
พาแนล Motion Editor เปนลกเลนใหมของ Flash CS5 เพราะจะทาใหเราสามารถ
ปรบแตงรายละเอยดของการเคลอนไหวไดละเอยดขน
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 8
คาสง Motion Tween รปแบบใหม
สาหรบคาสง Motion Tween ในโปรแกรม Flash เปนเวอรชนลาสดนจะตางออกไปจาก
เดม ไมวาจะเปนการใชงานในลกษณะทตางกนแลว เราจะพบวามลกเลนใหมๆ ทเสรมขนมาอก
มากมาย
สรางงานมลตมเดยดวยกราฟก
รปแบบของไฟลรปภาพกราฟกทใชในการตกแตงนนมหลากหลายรปแบบแลวแตจะใชเกณฑ
ไหนมาแบง ในทนจะแบงรปภาพตามระบบของโปรแกรมกราฟก โดยเฉพาะในโปรแกรม Flash นน
แบงออกเปน 2 อยาง เมอพจารณาจากรปเดยวกนแตรปแบบตางกนเมอขยายภาพจะมรายละเอยด
ดงน
ภาพบตแมป หรอราสเตอร (Bitmap or Raster)
เปนภาพทเกดจากชนสวนเลกๆ ของภาพมาเรยงตอกน ซงความละเอยดของชนสวนเหลาน
จะเลกขนาดไหน มการกาหนดคาความละเอยดของหนาจอ ภาพแบบนจะเปนภาพทมความละเอยด
ของสสนมาก แตเมอขยายภาพใหใหญขนกจะเหนรอยตอของภาพคลายขนบนไดเหมอนกบรปถายท
เราไปขยายจากขนาด 4x6 นว ไปเปน 8x10 นว กจะเหนแกนของรปภาพขยายขนอยางชดเจน
รปแบบทพบอยบอยๆ คอ ไฟลทมนามสกล *.BMP นนเอง
ภาพเวคเตอร (Vector Picture)
จะเปนภาพทเกดจากลายเสน แทนทจะเปนชนสวนภาพ ดงนนเมอทาการขยายภาพใหใหญ
ขนโอกาสทแกนของภาพจะหยาบมนอย ทาใหขอบของรปภาพแทบจะไมเหนเปนขนบนไดเลย จง
เหมาะสาหรบการสรางงานกราฟกทตองการความสวยงามมากๆหรอการสรางตวอกษร หรอ
ภาพเคลอนไหวในเวบไซตอยางทเหนกนทวไป สาหรบโปรแกรม Flash แลวสวนใหญจะทางานกบ
ภาพแบบเวคเตอรเปนสวนใหญโดยเรยกชอวา ซมโบล (Symbol)
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 9
การเปดโปรแกรม Adobe Flash CS5 ขนมาใช
1. คลกเมาสทปม Start บนแถบงานจะเกดปอปอพเมนของโปรแกรม
2. นาเมาสเลอกคาสง All Programs เลอนเมาสไปท Adobe Master Collection CS5>
Adobe Flash CS5 Professional
3. คลก 1 ครงท Adobe Flash CS5 กจะทาการเปดหนาตางโปรแกรมขนมาจะปรากฏหนาจอดงรป
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 10
รปแบบการทางาน
ในขนตอนน การเรยนใชงานโปรแกรม จะพบหนาจอ Welcome Screen สาหรบเลอก
รปแบบเรมตนการทางานดงน
Open a Recent Item เปนการเปดไฟลเกาทสรางไวแลว โดยคลกเลอกรายชอทแสดง
(เรยงจากการบนทกไฟลครงหลงสดเปนตนไป สงสด 8 ไฟล) หรอคลก Open เพอเปดไฟลอน
วชาการสรางภาพเคลอนไหว ง30245 โรงเรยนแนงมดวทยา หนา 11
Create New สรางไฟลใหม โดยคลกเลอกรปแบบของไฟลทตองการสราง เชน เลอก
Flash File (Action Script 3.0) เพอสรางไฟลมฟวใหมทมโหมดการเขยน Action Script
เปนเวอรชน 3 เปนตน สาหรบเนอหาในวชานจะแนะนาใหใช Action Script 2.0 เปนหลก
Create From Template สรางไฟลใหมจากรปแบบเทมดเพลตทโปรแกรมมใหโดย
คลกเลอกหมวดของเทมเพลตทตองการกอนแลวคลกเลอกไฟลอกทหนง
ใหคลกเลอกหวขอ Flash File (Action Script 2.0) จะพบกบหนาจอดงรป