adobe flash cs6 · 2017-08-21 · เนื อหาหลักสูตร การท...

ADOBE FLASH CS6

วทยากรผสอน : อรณย รอดสวสด (แหมม)

วทยากรผชวย : อรอนงค จนทร (น า)

วทยากรผชวย : ธารณ นรนดร (ออบ)

วทยากรผชวย : กรวร ลกาเนดไทย (แพรว)

เน อหาหลกสตร

เรมตนรจกกบ Adobe Flash

การใชงานโปรแกรมเบองตน

การวาดรปและการลงส

ซมโบล (Symbol) และอนสแตนซ (Instance)

การน าเขารปภาพและวดโอ

การสรางภาพเคลอนไหว (Animation)

อรณย รอดสวสด

เน อหาหลกสตร

การท างานกบเลเยอร

การสรางมฟวคลป (Movie Clip)

การสรางปม (Button)

การเลนเสยงในมฟว

การเสนอผลงานบนเวบเพจ (Publishing)

รจกกบภาษาโปรแกรม Action Script และการประยกตในโปรแกรมทพฒนาขน


ADOBE FLASH CS6

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


ลกษณะเดนของ ADOBE FLASH CS6

สามารถสรางภาพเคลอนไหว

สรางงานในรปแบบ Multimedia

ใสลกเลนตางๆ

สรางการโตตอบ



Adobe Flash เปนโปรแกรมส าหรบสรางภาพกราฟก ภาพเคลอนไหว และมลตมเดยบนเวบ เรยกไฟลภาพเคลอนไหว และมลตมเดยทสรางจาก Flash วา “มฟว (movie)”ทเราสามารถน า Flash มาใชสรางงานไดหลากหลายรปแบบ อาท

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

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

เราอาจใช Flash สรางเวบไซตทงเวบเลยกได



แฟลชมเครองมออ านวยความสะดวกในการสรางภาพเคลอนไหวและงานมลตมเดยไดเปนอยางด และมภาษาโปรแกรมส าหรบใชควบคมการท างานของชนงาน นอกจากนงานทสรางโดย Flash จะไดไฟลชนงานทมขนาดเลกท าใหสามารถน ามาเผยแพรบนอนเทอรเนต เพราะโหลดมาแสดงผลไดอยางรวดเรว แฟลช จงเปนอกทางเลอกส าหรบการน าเสนอขอมลบนเวบทไดมการน าภาพเคลอนไหวและมลตมเดยมาใชอยางแพรหลายเพอดงดดความสนใจของผชมซงในอดตการท าเชนนตองอาศยเทคนคการเขยนโปรแกรมบนเวบทยงยากและซบซอนแถมไฟลผลงานทสรางยงมขนาดใหญอกดวย ท าใหหนาเวบนนโหลดชามากจนผใชอาจไมสามารถทนรอได


งานทได ADOBE FLASH CS6

File มขนาดเลก

ภาพทไดไมแตก


ความแตกตางระหวาง FILE .FLA และ .SWF

File .Fla (Flash document) File .swf (Flash movie)

สามารถแกไขขอมลหรอวตถภายหลงได ไมสามารถแกไขขอมลหรอวตถภายหลงได

แสดงผลบน Browser ชา แสดงผลบน Browser เรว

ผลงานทไดมขนาดใหญ ผลงานทไดมขนาดเลก

Icon ทไดมสแดง Icon ทไดมสขาว


ชนดของภาพกราฟก

ภาพกราฟกออกเปน 2 ชนด คอ

1. ภาพกราฟกชนดบตแมป (Bitmap )

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

ขอด ภาพชนดนสามารถแสดงรายละเอยดไดใกลเคยงภาพจรง เชน ภาพถายทมรายละเอยดสง เพราะเปนการใชพกเซลจ านวนมากมาประกอบกน

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


ภาพกราฟกชนดบตแมป (BITMAP )


ชนดของภาพกราฟก

ภาพกราฟกออกเปน 2 ชนด คอ2. ภาพกราฟกชนดเวกเตอร (Vector )

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

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

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


ภาพกราฟกชนดเวกเตอร (VECTOR )


WELCOME SCREENสรางไฟลใหมแบบตางๆ

สรางไฟลจาก Template

เปดไฟลเกามาใชงาน


สวนประกอบของ ADOBE FLASH CS61

6

4

3

5

2

Menu Bar

Toolbox

Stage

Timeline

Panel

Properties



เมนบาร แถบทรวมค าสงในการใชงานทงหมดเกยวกบการสรางชนงานและการตงคาในโปรแกรม

ทลบอกซ กลองทรวบรวมเครองมอทใชในการสรางและปรบแตงออบเจกต


เครองมอทใชในการสรางงานSelection : เลอกออบเจค

Subselection : ปรบแตงรปทรงออบเจค

Free Transform :ปรบรปทรงออบเจค

Gradient Transform : ปรบแนวสเกรเดยนท

3D Rotation : ปรบแตงรปทรงออบเจคแบบ 3 มต

3D Translation : เคลอนยายออบเจคแบบ 3 มต อรณย รอดสวสด

เครองมอทใชในการสรางงาน

Add Anchor Point : เพมจดแองเคอร

Delete Anchor Point : ลบจดแองเคอร

Convert Anchor Point : ปรบจดแองเคอร

Lasso : เลอกออบเจคหรอพนทบางสวนจองออบเจค

Pen : วาดรปทรง เสนตรง เสนโคง


เครองมอทใชในการสรางงานText : พมพขอความ

Line : วาดเสนตรง

Rectangle : วาดสเหลยม

Oval : วาดวงกลมหรอวงร

Rectangle Primitive : วาดสเหลยมทปรบแตงมมไดภายหลง

Oval Primitive : วาดวงกลมหรอวงรทปรบแตงรปแบบไดภายหลง

PolyStar : วาดรปหลายเหลยมและรปดาวอรณย รอดสวสด

เครองมอทใชในการสรางงานPencil : วาดรปทรง เสนตรง เสนโคง

Brush : ระบายสภาพ

Spray Brush : พนสภาพแบบสเปรย

Deco : เตมลวดลายใหกบออบเจค


เครองมอทใชในการสรางงานBone : สรางขอตอการเคลอนไหวใหกบออบเจค

Bind : ปรบแตงการเคลอนไหวใหกบออบเจค

Paint Bucket : เตมสพนใหกบออบเจค

Ink Bottle : เตมสเสนใหกบออบเจค


เครองมอทใชในการสรางงานEyedropper : กอปปสจากออบเจคอน

Eraser : ลบเสนหรอสพนของออบเจค

Hand : เลอนดสวนตางๆของภาพ

Zoom : ยอ / ขยายมมมองภาพบนสเตจ


เครองมอทใชในการสรางงาน

Stroke Color : เลอกสเสน

Fill Color : เลอกสพน

Black and White : เลอกเสนเปนสด า และพนสขาว

Swap colors : สลบสเสนกบสพน


เครองมอเสรม

เครองมอ Selection



เครองมอ Free Transform



เครองมอ Brush


การจดการกบ TOOLBOX

Click เมน Window

Click Tools

หรอ

กดปม Ctrl+F2



Stage พนทสขาวตรงกลางหนาจอทใชจดวางออบเจกตตาง ๆทตองการแสดงใหเหนในชนงาน เปนพนททใชในการวาดภาพ สรางงานตางๆ


การจดการกบ STAGE

Click ทปม Hand Tool สามารถยาย Stage ได

Click Zoom ยอ-ขยาย Stage ได

Show Frameแสดง Stage ใหพอดกบหนาจอ

Show Allแสดงงานทงหมดทท าในหนาจอถงแมงานจะเกน Stage


การกาหนดคาของ STAGE

Click ท Stage

Click ท Panel ดานขวา บรรทด Properties

ก าหนด Size และ สพนตามตองการ



Timeline เปนเครองมอส าคญทใชในการสรางภาพเคลอนไหว โดยประกอบดวย 2 สวนหลก คอ เลเยอร (Layer) และเฟรม (Frame)

Layer นนเปรยบเสมอนแผนใสทใชจดวาง Object หลายๆชนใหเรยงซอนกนได

Frame เปนการแบงภาพเคลอนไหวออกเปนจงหวะยอยๆ เหมอนกบภาพนงหรอฟลมภาพยนตรแตละภาพ ซงเมอน าหลายๆเฟรมมาแสดงอยางตอเนองจะท าใหเหนภาพเคลอนไหวอยางสมบรณ ต าแหนงของแตละเฟรมจะแสดงหมายเลขเฟรม โดยม Playhead เปนตวควบคมการแสดงภาพบน Stage และจะบอกต าแหนงเฟรมปจจบน


TIMELINE


STATUS BAR ของ TIMELINE

Current Frameบอกใหรวาขณะน Play Head แสดงอยทชองใด

Frame Rateบอกใหรวาขณะน Play Head วงดวยความเรวก Frame ตอวนาท

Elapsed Timeบอกใหรวาขณะน Play Head วงมาถง Frame น ใชเวลากวนาท


การจดการกบ TIMELINE

Click Menu Window

Click Timeline

หรอ

กดปม Ctrl+Alt+T



พาเนล หนาตางทรวบรวมเครองมอตาง ๆ ส าหรบใชในการปรบแตงออบเจกต


การจดการกบ PANEL ตางๆ

Click Menu Window

Click เลอก Panel ตามตองการ

กด F4 ซอน/แสดงเครองมอ



Properties เปนพาเนลทใชแสดงคณสมบตตาง ๆ ของออบเจกตทเราคลกเลอกและแสดงคณสมบตของสเตจขณะทเราท างานอย


การจดการกบ PROPERTIES

Click Menu Window

Click Properties

หรอ

กดปม Ctrl+F3


การจดการกบ RULER

Click Menu View / Rulers

หรอ Ctrl + Alt + Shift + R


การจดการกบเสน GUIDE

Click Menu View

Click Guide, Show Guide

หรอ

กด Mouse คางทบนไมบรรทดลากลงมาบรเวณ State


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


• เสนขอบ( Stroke ) หรอลายเสน (Outline) เปนโครงรางของรป

• สวนทเปนพนรป (Fill) พนทภายในเสนขอบ

เสนขอบ( Stroke )

การก าหนดรายละเอยดของรปทรงทวาด


เมอเราคลกเลอกเครองมอใดเพอวาดรปทรง ใหสงเกตใน Property Inspector ของเครองมอนน จะปรากฏคณสมบตของเสนและสพนใหเราก าหนดเพมเตมได ดงน

ใน PROPERTIES INSPECTOR มรายละเอยดทเราก าหนดไดกอนวาดภาพดงน


ใน PROPERTIES INSPECTOR มรายละเอยดทเราก าหนดไดกอนวาดภาพดงน

จากจานสทเราเลอกใชงานขางตนเปนสมาตรฐานทโปรแกรมก าหนดมา แตหากเราตองการผสมสดวยตวเองกท าไดเชนกนโดยวธการดงน


การวาดรปทรงเรขาคณต

ประกอบไปดวยรปสเหลยม รปวงกลม วงร และรปหลายเหลยม ดงรป ขอแบงออกเปนกลมๆตามรายการท Tools ดงน


การวาดรปสเหลยมดวย RECTANGLE TOOL และ RECTANGLE PRIMITIVE TOOL

การวาดรปสเหลยมดวย Rectangle Tool และ Rectangle Primitive Tool



เครองมอ Rectangle Tool และ Rectangle Primitive Tool ใชส าหรบวาดรปส เหลยม หรอส เหลยมมมโคง แตกตางกนตรงท รปท ไดจาก Rectangle Primitive Tool จะสามารถกลบมาเปลยนลกษณะความโคงของมมท Property Inspectorไดอกคร ง

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




Rectangle Tool Rectangle Primitive Tool

การวาดวงกลมหรอวงรดวย OVAL TOOL และ OVAL PRIMITIVE TOOL

การวาดรปสเหลยมดวย Rectangle Tool และ Rectangle Primitive Tool



เครองมอ Oval Tool และ Oval Primitive Tool จะใชวาด รปวงกลมหรอวงร แต Oval Primitive Tool สามารถกลบมเปลยนแปลงรปทรงหรอรศมภายในวงกลม ใน Property Inspector ไดอกครง

ทงสองเครองมอ สามารถวาดรปไดโดยการคลกคางทเครองมอ Rectangle Toolททลบอกซจะปรากฏเมนยอยแสดงเครองมอ Oval Tool และ Oval Primitive Tool (หรอกดคยลด Oซ าๆ จะสลบไปมาของเครองมอทงสองตว) ตวชเมาสจะเปลยนเปนรป จากนนปรบแตงคาตางๆใหกบเสนทเราจะสราง ซงสามารถก าหนดความโคงของมมของรปสเหลยมไดใน Property Inspector แลวลากเมาสวาดวงรหรอวาดรปวงกลมโดยกดคย<Shift>คางไว




Oval Tool Oval Primitive Tool

การวาดรปหลายเหลยมดวย POLYSTAR TOOL

เครองมอ PolyStar Tool จะอยในกลมเดยวกนกบเครองมอ Rectangle Tool ใชส าหรบสรางรปหลายเหลยม โดยใหคลกคางทเครองมอ Rectangle Tool ททลบอกซจะปรากฏเมนยอยแสดงเครองมอ PolyStar Tool ตวชเมาสจะเปลยนเปน จากนนปรบแตงคาตางๆใหกบรปหลายเหลยมทเราจะสรางใน Property Inspector แลวลากเมาสวาดรปหลายเหลยมไดตามตองการ


การวาดรปหลายเหลยมดวย POLYSTAR TOOL


Polygon Star

การวาดลายเสนอสระดวย PENCIL TOOL

Pencil Tool เปนเครองมอส าหรบใชวาดลายเสนอสระ เหมอนกบการใชดนสอวาดรปบนกระดาษ โดยการคลก ในทลบอกซ (หรอกดคยลด Y)ตวชเมาสจะเปลยนเปนรป จากนนใหลากเมาสวาดเสนไดตามตองการ


การวาดลายเสนอสระดวย PENCIL TOOL


การวาดเสน LINE TOOL

Line Tool เปนเครองมอส าหรบใชวาดเสนตรง ใชเครอง Selection Tool ดงใหกลายเปนเสนโคงได หรอใชเครองมอ Subselection Tool


Selection Tool

Subselection Tool

การวาดรปทรงซอนกนใน FLASH

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

o หากเราวาดรปทรงทมแตสพนซอนทบอกรปทรงหนงทมสพนเดยวกน จะท าใหพนรปของทงสองถกรวมเขาดวยกน



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

o หากเราวาดรปทรงทมแตสพนซอนทบอกรปทรงหนงทมสพนตางกน เมอแยกรปทรงออกจากกนจะท าใหบรเวณสเดมทถกอกรปทรงทบหายไป



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



หากวาดเสนตดผานรปทรงหนง หรอน ารปทรงมาซอนทบเสนจะท าใหรปทรงนนถกแบงออกเปนสวนยอยๆตามแนวทถกตดเสน



หากเราวาดเสนตดกน หรอน าเสนหนงมาซอนทบอกเสนหนง เสนทง 2 จะถกตดออกเปนสวนยอยๆตรงจดทเสนทงสองตดกน (ไมวาทงสองเสนจะเปนสเดยวกนหรอคนละสกตาม)


การวาดเสนตรงและเสนโคงเชอมตอกนโดยใช PEN TOOL

Pen Tool เปนเครองมอทใชวาดเสนตรงและเสนโคง โดยเสนทวาดจะเชอมตอกนเปนจดตอจด เราจะเรยกจดนวา “ จดแองเคอร ” ( anchor point )ภายในกลมของ Pen Tool จะมเครองมอตางๆส าหรบปรบแตงเสนพาธใหเปนรปทรงตางๆไดตามทตองการ ดงน


Pen Tool ใชวาดเสนดวยปากา Add Anchor Point Tool ใชเพมจดในแนวเสนพาธ Delete Anchor Point Tool ใชลบจดในแนวเสนพาธ Convert Point Tool ใชเปลยนแขนของเสนพาธใหเปนเสนโคงหรอเสนตรง

การวาดเสนตรงและเสนโคงเชอมตอกนโดยใช PEN TOOL


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

การสรางขอความ TEXT TOOL


T

การสรางขอความ TEXT TOOL


FRAME

มลกษณะเปนชองเลกทเรยงกนเปนแถวยาว ท าหนาทบรรจภาพและเสยงทจดวางบน State


การจดการกบ FRAME

การเพม Frame Click เมน Insert, Timeline, Frame (F5)

Click Mouse ขวาเลอก Insert Frame

การลบ Frame Click เลอก Frame ทตองการลบ

Click Mouse ปมขวาเลอก Remove Frame


KEY FRAME

Keyframe คอ Frame ทมวตถหรอมการเปลยนแปลง (F6)

Blank Keyframe คอ Frame วางทมไวส าหรบการเกบวตถใหมหรอมการเปลยนแปลงใหม


การจดการกบ KEY FRAME

การเพม Key Frame

Click Menu Insert, Timeline, Key Frame (F6)

Click Mouse ขวาเลอก Insert Key Frame


KEY ลดบน TIMELINE

1. คยลดบน Timeline

KEY ลดเกยวกบ SYMBOL และ SHAPE

KEY ลดเกยวกบ PANEL

KEY ลดอนๆ

การบนทกงานเปน FILE FLASH

Click Menu File, Save


การบนทกงานเปน FILE ทเปดโดยไมตองมโปรแกรม FLASH กเปดได

Click Menu File, Export Movie…

ท Save as Type เลอกนามสกลตามตองการ

หรอ

Click Menu File, Export Image…

ท Save as Type เลอกนามสกลตามตองการอรณย รอดสวสด

การนา FILE ทไดไปเปน FILE นามสกลตางๆ

Click Menu File, Publish Settings

Click เครองหมายถกทนามสกลทตองการ

Click ปม Publish เลย

Click OK

หรอ

Click Menu File, Publish (Shift+F12) จะท าการสงงานไปเปนนามสกลทไดก าหนดไวตามตองการ


การนา FILE ภาพเขามาใชใน FLASH

Click Menu File, Import to Stage…

Click เลอกภาพทตองการ

Click OK

หรอ

Click Menu File, Import to Library…

Click เลอกภาพทตองการ

Click OK อรณย รอดสวสด

ประเภทของแอนเมชนใน FLASH

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

2.Tween ค าวา Tween มาจากค าวา “in between” เปนการสรางภาพเคลอนไหวจากเฟรมตนและเฟรมสดทาย ซงโปรแกรมจะสรางการเปลยนแปลงระหวางเฟรมใหโดยอตโนมต จงมจะมการสรางเฟรมเพยง 2 เฟรม ซงแบงออกเปน 3 รปแบบ

3.Inverse Kinematic (IK) เปนการใสกระดก เพอเชอมโยงกบรปทรงทสราง หรอวตถหลายๆ ชน ใหสมพนธกนดวยโครงกระดก โดยสามารถขยบกระดกเหลานเพอใหเกดการเคลอนไหว เชน การสรางการเคลอนไหวเลยนแบบการเดนของคน


TWEEN

Shape Tween เปนการสรางภาพเคลอนไหว โดยแปลงจากรปทรงหนงไปอกรปทรงหนง เชน รปสเหลยมคอยๆ เปลยนเปนรปวงกลม

Classic Tween เปนการท าแอนเมชนเพอโดยเปลยนคณสมบตของวตถ ส ความสวางของส หรอขนาดรปราง เชน ภาพทคอยๆ สวางขน หรอตวหนงสอคอยๆ จางหายไป

Motion Tween เปนการสรางภาพเคลอนไหวทมการเปลยนต าแหนง ขนาด หรอหมนวตถตามตองการ เปนการสรางภาพเคลอนไหว ทมการเคลอนก าหนดการเคลอนท หมน ยอ หรอขยายใหกบวตถ


การสรางภาพตอเนอง

Frame by Frame การเคลอนไหวชนดภาพตอภาพ

Tweening

Shape Tween การเปลยนรปราง

Motion Tween การเปลยนสถานท

Motion Guide


วตถทไมสามารถทา TWEEN SHAPE ได

Text *

Grouped Object

Raster File (รปภาพ)


การแยกกลมวตถโดยใช BREAK APART

Break Apart เปนการแยกวตถทถก Group ไว นอกจากนนยงสามารถแยกองคประกอบของวตถประเภท Symbol, Test Block และภาพBitmap เพอท าการตกแตงหรอเปลยนแปลงวตถ


วธการทา BREAK APART

Click เลอกวตถทตองการท า Break Apart

Click Menu Modify, Break Apart (Ctrl+B)


การเปลยน TEXT ใหสามารถทา TWEEN ได

Click Text Tool (T)

พมพขอความทตองการ

Click Menu Modify, Break Apart (Ctrl + B) 2 ครง


LAYER

ชนของวตถทสรางงาน

Layer ใดสรางกอนจะอยดานลาง


การเพม LAYER

Click Menu Insert / Timeline / Layer

หรอ Click ทปม New Layer


การเปลยนชอ LAYER

น า Mouse Double Click ท Layer นนๆ

พมพชอใหกบ Layer ตามตองการ

กดปม Enter


การลบ LAYER น า Mouse Click ท Layer ทตองการลบ

Click Mouse ปมขวาเลอก Delete Layer

หรอ กด Mouse เลอกท Layer ทตองการลบ

กดไปทรปถงขยะชอ Delete


การยาย LAYER

กด Mouse คางท Layer ทตองการยาย

ลากไปวางยงต าแหนงทตองการ


SYMBOL

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


บทบาททแตกตางกนของSYMBOL และ INSTANCE

ซมบอลเปนตนแบบแตอนสแตนซเปนเพยงส าเนา


ชนดของ SYMBOL

Graphic Symbolเปนการสรางภาพนงเชน รปตนไม วงกลม สเหลยม เปนการสราง Object ทเคลอนไหว

Button Symbolเปนการสรางปมทมการตอบสนองกบผใชงานรวมถงสามารถรบรการเคลอนทและการกระท าของMouse ได

Movie Clip Symbolเปนการสราง Object ทเคลอนไหวไดสามารถควบคมและก าหนดคณสมบตไดจาก Action Script


รจกกบ SCENE และ MOVIE

Sceneเปรยบเสมอนเรองราวฉากละครแตละฉาก ภายใน Scene ประกอบดวย Object ตางๆมากมายทสรางขนมา

Movieเปรยบเสมอนเรองราวโดยรวมทงหมดของละคร ซง Movie เกดจากการน า Scene ของฉากทงหมดมาท าการประกอบเชอมโยงเขาดวยกนเปนเนอเรอง


การสราง SYMBOL แบบ GRAPHIC Click Menu Insert

Click New Symbol Name ตงชอใหกบ Symbol

Behavior เลอกชนดของ Symbol เปน Graphic

Click OK

จะพาไปทสวนของชอ Symbol นนๆ

สรางงานเปนภาพตางๆตามตองการ

Click ท Scene จะกลบมาท State


ตวอยางการสราง SYMBOL แบบ GRAPHIC

Click Menu Insert Click New Symbol Name ตงชอใหกบ Symbol

Behavior เลอกชนดของ Symbol เปน Graphic

Click OK

จะพาไปทสวนของชอ Symbol นนๆ Click Text Tool Font เปน Wingding พมพ

Shift+” จะไดใยแมงมม

Click ท Scene จะกลบมาท State


การเรยกใช SYMBOL ทสรางไว Click Menu Window

Click Library หรอ กดปม F11

Click เลอก Symbol ทตองการ

กด Mouse คางลากออกมาวางไวท State


การแกไข SYMBOL ทสรางไวแลว

Double Click ท Symbol ทอยใน Library

แกไขภาพตามตองการ

เสรจแลว Click ไปท Scene


การแปลง OBJECT ใหเปน SYMBOL

วาด Object หรอพมพขอความ

Click Mouse ปมขวามอเลอก Convert to Symbol

Name ตงชอใหกบ Symbol

Type เลอกชนดของ Symbol

Click OK


การสราง SYMBOL แบบ MOVIE CLIP Click Menu Insert

Click New Symbol Name ตงชอใหกบ Symbol

Type เลอกชนดของ Symbol เปน Movie Clip

Click OK


สรางงานพรอมทงก าหนดแบบ Frame by Frame

Click ท Scene จะกลบมาท Stageอรณย รอดสวสด

ตวอยางการสราง SYMBOL แบบ MOVIE CLIP

Click Menu Insert Click New Symbol


Behavior เลอกชนดของ Symbol เปน Movie Clip

Click OK


Click Menu File, Import, Import to Library Click เลอกภาพทตองการ

เปด Library ขนมาอรณย รอดสวสด

การสรางปมกด

ปมกด (Button) เปนซมบอลประเภทหนงทท าใหผใชสามารถตอบโตกบชนงานทสรางได


การสรางปมกดจะประกอบดวย 4 สถานะ

เฟรม Up เปนสถานะปกตของปมกด คอเปนสถานะเรมตนของปม เมอผใชยงไมไดท าการโตตอบใดๆ

เฟรม Over เปนสถานะเมอผใชเลอนตวชเมาสมาวางเหนอปมกด

เฟรม Down เปนสถานะเมอผใชคลกบนปมกด

เฟรม Hit ผใชจะไมเหนสถานะนของปมกด แตใชส าหรบก าหนดขอบเขตการท างานของปม


การสราง SYMBOL แบบ BUTTON SYMBOL

Click Menu Insert

Click New Symbol


Type เลอกชนดของ Symbol เปน Button

Click OK


INSTANT

Symbol ทดงมาใชเรยกวา Instant


การสรางขอความ LINK ไปยง WEBSITE อน

Click ทปม Text Tool

พมพขอความทตองการ

ท Properties URL พมพชอ Website ทตองการ Link

เชน http://www.sanook.com


การ EXPORT FILE ไปเปน ANIMATED GIF

Click Menu File, Export, Export Movie



ตงชอ File และเลอกนามสกลปน Animate Gif

Click Save



Click เครองหมายถกท

Interlace ใหโหลดภาพจากบนลงลาง

Transparent ใหแสดงพนดานหลงโปรง

Smooth ใหขอบดราบเรยบ

Dither Solid Colors ใหมความคมชดของภาพเหมอนทสรางไว

Click OK


ตดตอ

[email protected]


adobe flash cs6 · 2017-08-21 · เนื อหาหลักสูตร การท...

Documents