44
LOGO การสร้าง Animation ด้วยโปรแกรม Flash

Animation flash

  • Upload
    -

  • View
    521

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Animation flash

LOGO

การสราง Animation ดวยโปรแกรม Flash

Page 2: Animation flash

เทคโนโลยของโปรแกรม Flash

Flash เปนโปรแกรมทมประสทธภาพสงส าหรบงานสรางภาพกราฟก ภาพเคลอนไหว ตลอดจนมลตมเดยส าหรบเวบ โดยเราสามารถการสรางเนอหาลกษณะตางๆ ซงพรอมจะน าเสนอบนอนเทอรเนตไดทนท ไมวาจะเปน Logo ทเคลอนไหวได

Navigation ซงเปนเมนส าหรบน าผชมเขาไปยงหนาตางๆ ในเวบ

Multimedia ทประกอบดวยภาพเคลอนไหวอยางสมจรงของตวอกษร และกราฟก พรอมเสยงประกอบเชน แบนเนอรโฆษณา

Web Application ซงตองมการรบขอมล และการกระท าของผชม เพอน าไปประมวลและแสดงผลออกมาตามเงอนไขทก าหนดไว รวมไปถงเกมสตางๆ

Page 3: Animation flash

รปแบบของภาพในโปรแกรม Flash

Bitmap or Raster เปนภาพทเกดจากชนสวนเลกๆ ของภาพมาเรยงตอกน มการก าหนดขนาดในหนวย Pixel มสสนสมจรงเหมอนธรรมชาต แตหากขยายใหใหญขนจะเหนรอยหยกภายในภาพ

Vector เปนภาพทเกดจากการค านวณทางคณตศาสตร ซงหากขยายใหใหญขนจะไมมรอยหยกในภาพ และมขนาดเลก นยมใชในงานบนอนเทอรเนต

Page 4: Animation flash

ประเภทของไฟล Flash

ไฟลเอกสาร (Flash document) มสวนตอทายเปน .fla ไฟลนเปนไฟลทเราบนทกในขนตอนการสรางชนงาน โดยจะจดเกบขอมลตางๆ ซงไดจากกระบวนการออกแบบ และพฒนาทงหมดไวตามสภาพเดม และเราสามารถเปดกลบขนมาแกไขชนงานได

ไฟลมฟว (Flash movie) มสวนตอทายเปน .swf ไฟลนเปนผลลพธสดทายซงไดจากการ Publish ไฟลเอกสารขางตน เพอน าไปเผยแพรและแสดงดวย Flash player โดยขอมลตนฉบบจะถกบบอด ปรบลดคณสมบต เพอใหมขนาดเลก ดงนนจงไมสามารถเปดกลบขนมาแกไขชนงาน และในการเผยแพรไฟลนเราจงไมตองกลววาขอมลตนฉบบในไฟลเอกสารจะถกผอนกอปปไปใชได

Page 5: Animation flash

ความตองการของระบบ

CPU Pentium III 800 MHz ขนไป

OS Windows XP ขนไป

RAM 256 MB ขนไป

Harddisk 700 MB ขนไป

Monitor 16 bit, 1024x768 Pixels ขนไป

Software Flash Player Plug-in

Page 6: Animation flash

สวนประกอบหนาจอ

แถบเมน (Menu Bar)

สเตจ (Stage) กลองเครองมอ (Toolbox)

แถบชอ (Title Bar)

ไทมไลน (Timeline)

พาเนล (Panel)

คอนโทรลเลอร (Controller) คณสมบต (Properties)

Page 7: Animation flash

รปทรง เสน และพนรป (Shape, Stroke และ Fill)

เมอเราวาดรปดวยเครองมอตางๆ ของโปรแกรม Flash สงทเกดขนเรยกวา รปทรง (Shape) ซงมองคประกอบ 2 สวน คอ เสน (stroke) และพนรป (fill) ทสามารถแยกเปนอสระออกจากกนได เสน (stroke) หมายถง สวนทเปนลายเสนรปทรงทเปนลายเสน จะประกอบดวย

เสนเพยงอยางเดยว

พนรป (fill) หมายถง สวนทเปนพนทภายในของรปทรง 2 มต หรอพนททลอมดวยเสน

Page 8: Animation flash

การสรางชนงาน

Line Tool เปนเครองมอทใชในการวาดเสนตรง โดยเราสามารถก าหนดส ความหนา และลวดลายเสนไดใน property inspector 1. คลกเลอก Line Tool

จากทลบอกซ

2. ก าหนดคณ สมบตของเสนบน

property inspector

ตามตองการ

3. คลกลากเมาสบนสเตจ

ตามระยะและทศทางทตองการ

Page 9: Animation flash

การสรางชนงาน

วธใชเครองมอเลอกสในทลบอกซ และ property inspector คอ Stroke Color และ Fill Color Stroke Color ใชส าหรบก าหนดสเสน สวน Fill Color ใชก าหนดสพนของรปทรง

นอกจากสแลว เสนยงมคณสมบตอนทเราก าหนดไดคอ ความหนา และลวดลาย ซงตวเลอกจะปรากฎบน Property inspector เมอเราเลอกเครองมอวาดรปทเกยวกบเสน หรอเมอเราเลอกรปทวาดไวแลว

Page 10: Animation flash

การสรางชนงาน

Pencil Tool เปนเครองมอทใชวาดลายเสน และรปทรงแบบอสระเหมอนกบทเราใชดนสอวาด รปลงบนกระดาษ ขนตอนมดงน 1. คลกเลอก Pencil Tool จากทลบอกซ

2. ก าหนดคณ สมบตของเสนบน

property inspector ตามตองการ

3. หากตองการปรบแตงคณสมบตกคลกป ม

Pencil Mode แลวเลอก option ทตองการ

4. คลกลากเมาสไปเรอยๆ ใหเปนลวดลายทตองการ

เมอปลอยเมาสกถอวาเปนอนสนสดการวาด

Page 11: Animation flash

การเปลยนขนาดและการหมนชนงาน

เราสามารถแปลงชนงานทอยในรปของกราฟก ขอความ group หรอ Instance ไดดวยเครองมอแปลงรป ทอยในทลบอกซ หรอเลอกค าสง Modify > Transform จากเมนบาร จะปรากฏเสนกรอบขอบเขต และจดควบคมการเปลยนแปลง ทมมและดานทงส ซงจะใชเปนเครองมอในการแปลงรปตอไปน โดยอาจท าไดทงการแปลงรปอยางอสระ หมน ปด เอยง ยอ และขยาย

Page 12: Animation flash

การรวมกลมและแยกชนงาน

วธการรวมกลมชนงานท าไดโดยเลอกชนงาน จากนนเลอกค าสง Modify > Group หรอกดคย Ctrl+G ลกษณะการไฮไลทจะเปลยนเปนกรอบสฟา และเมอตองการแยกกลมกท าไดโดยค าสง Modify > Ungroup หรอกดคย Ctrl+Shift+G

Page 13: Animation flash

การรวมกลมและแยกชนงาน

วธแกไขชนงานภายในกลม ท าไดโดยคลกเลอก group แลว สง Edit > Edit Selected หรอดบเบลคลกท group ดวย Arrow tool สงอนๆ ทไมไดอยในกลมจะมสจางลง แสดงวาไมสามารถแกไขได

การวางซอนชนงาน (Stacking) ในแตละเลเยอร ชนงานจะมการเรยงซอนกนตามล าดบ โดยชนงานทเกดขนหลงสดจะอยเหนอชนงานทเกดขนกอน หากตองการเปลยนต าแหนงสามารถท าไดดงน Modify > Arrange >Bring to Front เพอเลอนชนงานขนมาชนบนสด

Modify > Arrange > Bring Forward เพอเลอนชนงานขนมา 1 ชน

Modify > Arrange > Bring Backward เพอเลอนชนงานลงไปอก 1 ชน

Modify > Arrange > Send to Back เพอเลอนชนงานลงไปชนลางสด

Page 14: Animation flash

การเลอกและตกแตงชนงาน

การเลอกชนงานดวย Arrow Tool 1. คลกบรเวณของเสน สพน หรอขอความทตองการเลอก ถาตองการเลอกบรเวณอน

เพมเตมใหกดคย Shift ขณะเลอกสวนของอนตอไป

2. ดบเบลคลกทเสน เพอเลอกเสนทงหมดทเชอมตอกน

3. ดบเบลคลกทสพน เพอเลอกทงเสนขอบ และส

4. ลากเมาสลอมรอบบรเวณทตองการเลอก ถากรอบทลากนนไมครอบคลมทกสวน เสนขอบและสพนบางสวนจะถกเลอก

Page 15: Animation flash

การเลอกและตกแตงชนงาน

การเลอกชนงานดวย Lasso Tool 1. เลอก Lasso Tool หรอ Polygon Mode

2. คลกลากเมาสไปรอบๆ เมอปลอยเมาสพนทดานในจะถกเลอก โดยถาจดทปลอยอยหางจากจดเรมตนโปรแกรมจะปดพนใหเองดวยเสนตรงจากจดสดทายไปยงจดเรมตน

Page 16: Animation flash

การเตมสชนงาน

เครองมอเลอกสในทลบอกซ ประกอบดวย

Stroke Color เปนเครองมอส าหรบ

เลอกสเพอใชกบเสนและ Fill Color เปนเครองมอส าหรบเลอกสพน

ในตารางสนมส 2 ประเภท คอ สเรยบ (soid) หมายถง สทเปนเนอเดยวกนโดยตลอด

สเกรเดยนท (gradient) หมายถง สทมการไลระดบ มน าหนกออนแก หรอมความเปลยนแปลงของส เชน

แบบเสนตรง (linear) เปนแนวเสนตรง

แบบวงกลม (radial) หมายถง สไลระดบ

จากจดศนยกลางออกไปเปนรศมของวงกลม

Page 17: Animation flash

การเตมสชนงาน

วธเลอกสอนอยนอกตาราง

สทเหนทงหมดในตารางตามปกตเราเลอกใชไดทนท แตหากตองการสอนเพอเพมเตมนอกเหนอจากน กคลกปม Color Picker เพอเปดไดอะลอกบอกซ Color ซงเปนมาตรฐานส าหรบใชในการเลอกสของระบบ Windows ขนมา

Page 18: Animation flash

การสรางและปรบแตงตวอกษร

ขอความในโปรแกรม Flash แบงออกเปน 3 ประเภท ไดแก

1. ขอความคงท (Static Text) หมายถงขอความแบบปกต ทไมมการเปลยนแปลง

2. ขอความไดนามก (Dynamic Text)

คอขอความทมการเปลยนแปลงเกดขนเรอยๆ

ตามขอมลทรบมากจากเซรฟเวอร

3. ขอความอนพท (Input Text) คอ ฟลด

ขอความทใชรบขอมลผานแบบฟอรม

Page 19: Animation flash

การสรางและปรบแตงตวอกษร

ก าหนดคาตางๆ ของตวอกษร เมอขอความถกเลอกอยคณสามารถใชกรอบ

Properties ในการเปลยนแปลงคณสมบตของตวอกษรได เชน เลอกชอตวอกษรจากรายการ

คลกทป มสามเหลยมทางขวาของชองขนาดตวอกษร แลวเลอนคาขนาดตวอกษร

คลกเลอกตวหนาทป ม Bold หรอตวเอยงทป ม Italic

เปลยนสขอความดวยการเลอกส

คลกเลอนคาระยะหางระหวางตวอกษรจากชอง Character Spacing

Page 20: Animation flash

การสรางและปรบแตงตวอกษร

การแยกสวนขอความ (Breaking text apart)

คณสามารถแยกสวนขอความเพอแยกอกษรแตละตวในกรอบเฉพาะหลงจากนน กอาจแยกตวอกษรแตละตวไวในแตละเลเยอร เพอทจะดดแปลงตวอกษรแตละตวไดอยางอสระตอไป ซงมขนตอนดงน 1. คลกเลอก Arrow Tool แลวคลกทกรอบขอความ

2. เลอกค าสง Modify > Break Apart เพอแยกตวอกษรแตละตวใหอยในแตละกรอบขอความ โดยตวอกษรนนยงคงอยในต าแหนงเดม

3. เลอกค า สง Modify > Break Apart อกครงหนงเพอเปลยนตวอกษรใหเปนรปทรง บนสเตจ จากนนกจะสามารถแกไขตวอกษรในลกษณะเดยวกนกบรปทรง

Page 21: Animation flash

Symbol และ Instance

ซมโบล (Symbol) คอ กราฟก ปม หรอมฟวคลปทเราสรางขนมาเปน ตนแบบ ในครงแรก จากนนกจะสามารถน าไปใชไดอยางไมจ ากดตลอดในมฟวเดยวกน และมฟวอนๆ ซมโบลหนงๆ อาจรวมถงอารตเวรคทน า เขามาจากโปรแกรมอน ทกซมโบลทสรางขนจะเปนสวนหนงในไลบรารของไฟลปจจบน

อนสแตนซ (Instance) คอ ส าเนาของซมโบลทมอยบนสเตจหรอซอนอยภายในซมโบลอน อนสแตนซอาจมส ขนาดและหนาท แตกตางจากซมโบลทเปนตนฉบบไดการแกไขซมโบลจะมผลใหเกดความเปลยนแปลงกบอนสแตนซทงหมดทส าเนาไปจากซมโบล

Page 22: Animation flash

การสราง Symbol

การสรางซมโบลสามารถท าได 2 วธ คอการแปลงจากสวนประกอบทเลอกไว หรอสรางซมโบลเปลาขนมาใหม แลวใสเนอหาเขาไป

วธแปลงสวนประกอบทเลอกไวใหเปนซมโบล 1. เลอกสวนประกอบ ทอยบนสเตจ อาจเปนสงเดยว หรอหลายสงกได

2. ท าตามวธการใดวธการหนงตอไปน

เลอกค าสง Insert > Convert to Symbol หรอกดคย F8

ลากสงทเลอกไวเขาไปในพาเนลไลบราร

คลกขวา แลวเลอก Convert to

Symbol จากเมนทปรากฏขน

Page 23: Animation flash

การสราง Symbol

วธสรางซมโบลขนมาใหม 1. เลอกท าตามวธการใดวธการหนงตอไปน

เลอกค าสง Insert > New Symbol

คลกป ม New Symbol

เลอก New Symbol จากออฟชนเมนทมมขวาบนของพาเนลไลบราร

2. ในกรอบ Create New Symbol ใหใสชอ และเลอกพฤตกรรมในชอง Behavior

3. คลกป ม OK ในขนน โปรแกรมจะเพมซมโบลเขาไปในไลบราร พรอมกบเปลยนเขาสการท างานในโหมดแกไขซมโบล ซงสงเกตไดจากชอของซมโบล

Page 24: Animation flash

การสราง Symbol

ไลบราร (Library) คอ สวนทโปรแกรมใชจดเกบซมโบลทเราสรางขนภายในมฟวหรอน าเขามาจากมฟว รวมทงใชเกบรปภาพบทแมพ ไฟลเสยง และไฟลวดโอ ทเราน าเขามาจากภายนอก

การสรางอนสแตนซ 1. เปดพาเนลไลบราร

2. เลอกซมโบลทตองการใช

3. ลากซมโบลไปวางบนสเตจ โดยอาจ

คลกทภาพตวอยางหรอทชอของซมโบลกได

Page 25: Animation flash

Timeline, Layer และ Frame

ไทมไลน (Timeline) เปนเครองมอทใชในการสรางภาพเคลอนไหว โดยประกอบดวย 2 สวนหลกคอ เลเยอร (Layer) และเฟรม (Frame) เลเยอรนนเปรยบเสมอนเปนแผนใส ทเราใชจดวางวตถยงคงมความเปนอสระตอกน สวนเฟรมเปนการแบงภาพเคลอนไหวออกเปนขนตอนยอยๆ เหมอนกบเปนภาพนงหรอฟลมภาพยนตรแตละภาพ ซงเมอน าหลายๆ เฟรมมาแสดงอยางตอเนอง จะท าใหเหนเปนภาพเคลอนไหวทสมบรณ

Page 26: Animation flash

Timeline, Layer และ Frame

เลเยอร (Layer) เปรยบเสมอนแผนใสทเรยงซอนๆ กนอยเมอเราวาดรปหรอวางออบเจคตกไปบนแผนใสแตละแผนหากรปอยตรงต าแหนงเดยวกนเราจะมองเหนเฉพาะรปทซอนอยดานบน ยกเวนบรเวณทแผนใสดานบนไมมรปจงจะสามารถมองผานลงไปเหนรปทอยขางลางได

ทกครงทเปดไฟลมฟวใหม Flash จะสรางเลเยอร

แรกมาใหในชอวา Layer 1 ซงเราสามารถเปลยน

แปลงชอนไดภายหลง นอกจากนนเรายงสามารถ

เพม ลบ เปลยนซอน ลอคไมใหถกแกไขได เพอ

ชวยในการวาด และปรบแตงรปทรง และสรางเลเยอรหนากาก เพอชวยสรางเอฟเฟคพเศษได

Page 27: Animation flash

Timeline, Layer และ Frame

คยเฟรม (keyframe) คอ เฟรมทเราใชก าหนดการเปลยนแปลงเนอหาของมฟว แตละขนตอน ในการสรางภาพเคลอนไหวแบบเฟรมตอเฟรม ทกๆ เฟรมจะเปนคยเฟรม ซงเราตองก าหนดรายละเอยดการเคลอนไหวของตวละครทกๆ จงหวะลงไป แตในการสรางภาพเคลอนไหวแบบทวน เราจะสรางคยเฟรมเฉพาะจงหวะทเปนจดส าคญและใสเนอหาลงไป สวนเฟรมระหวางกลางซงแสดงการเคลอนไหวในขนตอนยอยๆ โปรแกรม Flash จะสรางใหโดยอตโนมต

Page 28: Animation flash

Timeline, Layer และ Frame

ชองเฟรมแตละชองบนไทมไลนจะมลกษณะแตกตางกน เพอบอกถงประเภทหรอเนอหาของเฟรมนน

Motion Tween แสดงดวยจดด าทคยเฟรมสวนเฟรมระหวางนนจะแสดง ลกศรสด าบนพนสมวง

Shape Tween แสดงดวยจดด าทคยเฟรมสวนเฟรมระหวางนนจะแสดง ลกศรสด าบนพนสเขยว

เสนประ แสดงถงภาพเคลอนไหวทไมสมบรณ

คยเฟรมเดยว แสดงดวยจดสด า เฟรมสเทาออนหลงจากคยเฟรมประกอบดวยเนอหาทไมเปลยนแปลง กรอบสเหลยมใสแสดงต าแหนงสดทายของ เฟรม

ตวอกษร a ขนาดเลก แสดงถงเฟรมทมการก าหนดแอคชนไวในพาแนล Action

Page 29: Animation flash

การจดการภาพเคลอนไหวดวย Movie และ Scene

คณสามารถสรางภาพเคลอนไหวใน Flash ดวยการเปลยนเนอหาในเฟรมทตอเนองกน คณสามารถท าใหออบเจคเคลอนทผานสเตจ เพมหรอลดขนาด หมน เปลยนสคอยๆ ปรากฏขน หรอเปลยนแปลงรปราง การเปลยนแปลงทเกดขนเอง อาจเปนไปอยางอสระ หรอเกดขนพรอมๆ กน การเปลยนแปลงอนกได

ใน Flash มวธการสรางภาพเคลอนไหวได 2 แบบไดแก แบบทวน (tween animation) และแบบเฟรมตอเฟรม (frame-by-frame animation) ในการเคลอนไหวแบบทวนนนคณเพยงแตสรางเฟรมเรมตน และเฟรมสดทายแลวใหโปรแกรมจดการสรางเฟรมระหวางกลางขนเองพรอมกบความสามารถในการเปลยนแปลงลกษณะตางๆของออบเจคอยางคอยเปนคอยไป จากเฟรมแรกจนถงเฟรมสดทาย เพอใหเกดลกษณะการเคลอนไหว

Page 30: Animation flash

การสรางภาพเคลอนไหวแบบ Frame by Frame

1. คลกท ชอเลเยอร เพอเลอกเลเยอรทตองการพรอมกบเลอกเฟรมทจะใหเปนจดเรมตนของการเคลอนไหว

2. ถาเฟรมนนไมใชคยเฟรม ใหเลอกค าสง Insert > Keyframe กอน

3. สรางชนงานส าหรบเฟรมแรก โดยคณสามารถใชเครองมอวาด Paste กราฟกจาก Clipboard หรออมพอรทไฟลเขามา

4. คลกเฟรมถดไปทางดานขวา แลวเลอก ค าสง Insert > Keyframe เพอสรางคยเฟรมใหมทมเนอหาเหมอนกบคยเฟรมทผานมา

5. ดดแปลงเนอหาภายในเฟรมบนสเตจ เพอสรางเนอหาทแตกตางไปเลกนอยในการเคลอนไหว

6. ท าซ าขนตอนท 4 และ 5 เพอสรางการเคลอนไหวจนครบ

Page 31: Animation flash

การสรางภาพเคลอนไหวแบบ Frame by Frame

7. ทดสอบการเคลอนไหวโดยกดคย Enter หรอเลอก Control > Play แลวคลกปม Play บน Controller

Page 32: Animation flash

การสรางภาพเคลอนไหวแบบ Motion Tween

1. คลกท ชอเลเยอร เพอเลอกเลเยอรทตองการพรอมกบเลอกคยเฟรมเปลาในต าแหนงทจะใหเปนจดเรมตนของการเคลอนไหว ถาเปนการเปดไฟลขนมาใหมโปรแกรมจะสรางเลเยอร พรอมกบคยเฟรมเปลาทเฟรมแรกใหอยแลว

2. สรางเนอหาในเฟรมแรกดวยการ สรางกราฟกออบเจคดวยเครองมอ Pen,Oval,Pencil หรอ Brush แลวแปลงใหเปน

ซมโบล

สรางอนสแตนซ กรป หรอขอความบนสเตจ

ลากอนสแตนซของซมโบลจากพาเนล Library

Page 33: Animation flash

การสรางภาพเคลอนไหวแบบ Motion Tween

3. สรางคยเฟรมท 2 ในต าแหนงทตองการใหการเคลอนไหวจบ

4. เปลยนแปลงคณสมบตของอนสแตนซ กรปและขอความในคยเฟรมท 2 ดวยการ ยายต าแหนง

เปลยนขนาด หมน หรอบด

เปลยนส (เฉพาะกบอนสแตนซและขอความ)

Page 34: Animation flash

การสรางภาพเคลอนไหวแบบ Motion Tween

5. คลกทเฟรมใดๆ ระหวางคยเฟรมทงสอง

6. ในกรอบ Properties เลอกการ Tween แบบMotion ถามการเปลยนแปลงขนาดใหเลอกออปชน Scale ดวย

7. ทดสอบการเคลอนไหวโดยกดคย Enter หรอเลอก Control > Play แลวคลกปม Play บน Controller

Page 35: Animation flash

การสราง Mask Layer

1. เลอกหรอสรางเลเยอรทประกอบดวยออบเจคซงจะปรากฏภายใตสงปดบง

2. ขณะทเลอกเลเยอรอยใหสง Insert > Layer เพอสรางเลเยอรใหมเหนอเลเยอรทผานมา

3. วางรปทรงทมสพน ขอความ หรออนสแตนซของกราฟกซมโบล บน mask layer ในชน mask layer โปรแกรมจะไมสนใจภาพ ส ความโปรงใส ส หรอสไตลของเสน บรเวณทเปนสพนจะเปลยนเปนโปรงใส ขณะทบรเวณทไมมสจะเปลยนเปนทบ

4. คลกขวาท ชอของ mask layer บนไทมไลนแลวเลอก Mask จากเมนทปรากฏเลเยอรนจะถกแปลงเปน mask layer ซงแสดงดวยไอคอนส า รบ mask layer เลเยอรทอยใตลงมา 1 ชนจะถกลงคกบเลเยอรน

Page 36: Animation flash

การสราง Mask Layer

การเพมชนเลเยอรของเนอหาภายใตชน mask layer ใหเลอกท าดงน ลากเลเยอรนนไปไวใตชน mask layer

สรางเลเยอรใหมภายใตชน mask layer

เลอก Modify > Layer แลวเลอก Masked ในกรอบ Layer Properties

สวนการยกเลกการลงคของเลเยอรจาก mask layer กท าไดโดยลาก

เลเยอรนนไปอยเหนอชน mask layer หรอเลอก Normal ในกรอบ Layer Properties

Page 37: Animation flash

การสราง Mask Layer

Page 38: Animation flash

การสราง Guide Layer

1. สรางภาพเคลอนไหวแบบ motion tween ตามขนตอนทผานมา ถามการเลอก Orient to path เพอยดเสนฐานขององคประกอบเขากบ motion path และถาเลอกSnap จด registration ของออบเจคจะยดตดกบเสนทางดวย

2. เลอกเลเยอรทประกอบดวยภาพเคลอนไหวแลวเลอก Insert > Motion Guide หรอคลกทปม Add Motion Guide ทดานลางของกรอบไทมไลนโปรแกรมจะสรางเลเยอรใหมอยเหนอเลเยอรทเลอกไว

Page 39: Animation flash

การสราง Guide Layer

3. ใชเครองมอ Pen, Pencil Circle, Rectangle หรอ Brush tool วาดเสนทางตามตองการ

4. คลกทเฟรม 1 ของเลเยอร 1 แลวลากจดศนยกลางของรปไปวางตรงจดเรมตนของเสนจากนนคลกทเฟรม 10 แลวลากจดศนยกลางของรปไปวางตรงจดสนสดของเสน

Page 40: Animation flash

การสราง Guide Layer

5. ถาตองการซอนเสนการเคลอนไหวไมใหมองเหน ใหคลกทคอลมนรปดวงตาบนเลเยอร motion guide

Page 41: Animation flash

การควบคมการท างานดวย Action Script

ActionScript เปนภาษาทใชในการเขยนโปรแกรมท Flash ไดน ามาใชเพมความสามารถของมฟวในการโตตอบกบผชมภาษานลกษณะเปน Object-oriented เชนเดยวกบ JavaScript ทผสรางเวบใชเพอเพมคณสมบตอนเตอรแอคทฟใหกบเวบเพจ

วธสรางและแกไขค าสง ActionScript จะท าโดยใชพาเนล Actions

ซงเราสามารถเปดขนมาไดโดย

เลอกค าสง Window >

Actions จะปรากฏพาเนล

ซงมสวนประกอบดงภาพ

Page 42: Animation flash

การน าเสนอผลงานบนเวบ

การ Publish เอกสาร Flash

Flash movie ทแสดงผลใน Flash Player

กราฟกประเภท GIF,JPEG,PNG

QuickTime ซงสามารถแสดงไดโดยไมตองใช Flash Player

เอกสาร Html ทชวยในการแสดงผลมฟวหรอกราฟกในบราวเซอร

ไฟล Projector ส า หรบระบบ Windows และ Macintosh รวมถง QuickTime วดโอจาก Flash Movie

อนๆ

Page 43: Animation flash

การน าเสนอผลงานบนเวบ

การ Export มฟวออกมาใชงานในรปแบบตางๆ สามารถท าไดดงน

1. เลอกค าสง File > Export Movie

2. จะปรากฏหนาจอดงรปขางลาง

3. เลอกทอยทตองการ Save ขอมล

ลงในเครองเพอใชงาน

4. ในชอง Save as type ใหเลอก

Type ทตองการ ซงโดยปกตตอง

เลอก .swf หรอตามความ

เหมาะสม จากนนคลกทปม Save

Page 44: Animation flash

Thank You