![](img/grass.png) |
สร้างดอกซากุระ |
1. เปิดโปรแกรม Adobe Flash เลือกสร้างไฟล์งานใหม่เป็น ActionScript 2.0
![](workshop/workshop_114.png)
2. เลือกอุปกรณ์
Pencil Tool แล้วเลือกรูปแบบเส้นเป็นแบบ Smooth
![](workshop/workshop_115.png)
3. วาดกลีบดอกซากุระลงในงานตามความต้องการ
![](workshop/workshop_116.png)
4. ลงสีให้กับกลีบดอกซากุระที่เราวาดขึ้น
สามารถลงสีแบบไล่เฉดโทน เพื่อเพิ่มความสวยงามให้กับชิ้นงาน
คลิกดูการลงสีให้กับวัตถุ ที่นี่
![](workshop/workshop_117.png)
![](workshop/workshop_118.png)
5. ลบเส้นขอบของรูปภาพออก
![](workshop/workshop_119.png)
6. ทำการ Copy กลีบดอกซากุระ มาวางเพิ่มในงาน โดยสามารถหมุนกลีบดอกแล้วจัดวางได้ตามต้องการ จนเป็นดอกซากุระ
![](workshop/workshop_120.png)
![](workshop/workshop_121.png)
7. ย่อดอกซากุระที่ทำเสร็จแล้วให้มีขนาดเล็กลง เหมาะสมกับขนาดของงานที่สร้างไว้
![](workshop/workshop_122.png)
8. นำดอกซากุระที่สร้างเสร็จแล้วไปเก็บไว้ใน Library โดยให้ตั้งชื่อว่า "ดอกซากุระ" และเลือกรูปแบบวัตถุเป็นแบบ Movie Clip
![](workshop/workshop_123.png)
9. จะได้ดอกซากุระ ที่พร้อมจะนำไปทำแอนิเมชั่นในส่วนถัดไป
![](workshop/workshop_124.png)
![](img/grass.png) |
สร้างดอกซากุระตกน้ำ |
1. ปรับพื้นหลังของชิ้นงานให้มีสีดำสนิท
![](workshop/workshop_033.png)
![](workshop/workshop_034.png)
2. ใช้อุปกรณ์
Rectangle Tool เพื่อวาดรูปพื้นน้ำขนาดพอประมาณ แล้วลงสีให้สวยงาม
![](workshop/workshop_035.png)
3. ใช้อุปกรณ์
Oval Tool วาดรูปพระจันทร์
![](workshop/workshop_036.png)
4. ใช้อุปกรณ์
Polystar Tool วาดรูปดวงดาว
![](workshop/workshop_037.png)
![](workshop/workshop_038.png)
5. สร้างเลเยอร์ใหม่ แล้ววาดรูปกิ่งซากุระ โดยใช้อุปกรณ์
Line Tool
![](workshop/workshop_039.png)
6. นำดอกซากุระมาวางประดับบนกิ่งให้เต็มตามความต้องการ
เมื่อประดับจนพอใจแล้วให้ทำการ Lock เลเยอร์เอาไว้เพื่อป้องกันการขยับของชิ้นงาน
![](workshop/workshop_040.png)
![](workshop/workshop_041.png)
7. วางดอกซากุระอีก 1 ดอก ลงในเลเยอร์ใหม่ (กำหนดตำแหน่งตามความต้องการ)
แล้วกำหนดเวลาบน Timeline ที่ต้องการให้ซากุระดอกนั้นตกลงในน้ำ
![](workshop/workshop_042.png)
8. แทรกคีย์เฟรมกดปุ่ม F6 (Insert Keyframe) จะปรากฏดอกซากุระดอกเดียวในงาน ตามภาพ
![](workshop/workshop_043.png)
9. แทรกเฟรมโดยกดปุ่ม F5 (Insert Frame) ในเลเยอร์อื่นๆที่เหลือ เพื่อเพิ่มเฟรมให้เท่ากัน ซึ่งจะปรากฎวัตถุเดิมที่วาดเอาไว้
![](workshop/workshop_044.png)
![](workshop/workshop_045.png)
10. คลิกที่เฟรมสุดท้ายของงาน(ของเลเยอร์ดอกซากุระ) แล้วลากดอกซากุระลงมายังพื้นทะเลสาบด้านล่าง
![](workshop/workshop_046.png)
11. คลิกขวาที่ Timeline แล้วเลือกคำสั่ง Create Classic Tween จะปรากฎการเคลื่อนไหวของดอกซากุระตกลงมาที่ทะเลสาบ
![](workshop/workshop_047.png)
![](workshop/workshop_048.png)
12. เพิ่มการกำหนดทิศทางการเคลื่อนที่ของวัตถุ (Guide) โดยคลิกขวาที่เลเยอร์ดอกซากุระแล้วเลือกคำสั่ง Add Classic Motion Guide
![](workshop/workshop_049.png)
13. ใช้ดินสอวาดทิศทางการเคลื่อนที่ของดอกซากุระตามต้องการ
![](workshop/workshop_050.png)
14. กำหนดให้ดอกซากุระของเราวิ่งตามเส้นโดย
คลิกที่เฟรมแรก แล้วลากจุดกลางของดอกซากุระให้อยู่ที่ปลายของเส้นไกด์(ฝั่งกิ่งไม้)
![](workshop/workshop_051.png)
15. คลิกที่เฟรมสุดท้าย แล้วลากจุดกลางของดอกซากุระให้อยู่ที่ปลายของเส้นไกด์(ฝั่งทะเลสาบ)
![](workshop/workshop_052.png)
16. ทดสอบการเคลื่อนไหวของดอกซากุระ ว่าวิ่งตามเส้น Guide หรือไม่ โดยกดปุ่ม Enter
![](workshop/workshop_053.png)
17. ปรับให้ดอกซากุระมีการหมุนโดยเลือกที่คำสั่ง Rotate ในพาเล็ท Properties
![](workshop/workshop_054.png)
18. หากดอกซากุระมีการเคลื่อนที่เร็วเกินไป ให้กดปุ่ม F5 เพื่อเพิ่มเฟรม ทำให้วัตถุเคลื่อนที่ช้าลง
![](workshop/workshop_055.png)
19. กำหนดให้ดอกซากุระจมหายไปในน้ำ โดยเลือกเฟรมบน Timeline ที่ต้องการให้ซากุระจมหาย แล้วสร้างคีย์เฟรมโดยกดปุ่ม F6
![](workshop/workshop_056.png)
20. ดึงดอกซากุระให้ต่ำลงไปจากจุดเดิม (เหมือนกับจมไปจากจุดเดิม)
แล้วปรับความโปร่งใสในส่วนของ Alpha ในพาเล็ท Properties ให้มีค่าเป็น 0
![](workshop/workshop_057.png)
![](workshop/workshop_058.png)
21. คลิกขวาที่ Timeline แล้วเลือกคำสั่ง Create Classic Tween แล้วทดสอบผลลัพธ์
![](workshop/workshop_059.png)
22. สร้างระลอกวงน้ำ โดยไปที่เมนู Insert > New Symbol แล้วสร้างวงน้ำโดยกำหนดรูปแบบเป็น Movie Clip
![](workshop/workshop_060.png)
23. สร้างวงน้ำโดยใช้อุปกรณ์
Oval Tool วาดวงรีซ้อนกัน ดังภาพ
![](workshop/workshop_061.png)
24. ลบชั้นของวงน้ำออกแบบชั้นเว้นชั้น จะได้วงน้ำตามที่ต้องการ
![](workshop/workshop_062.png)
![](workshop/workshop_063.png)
25. สร้างเลเยอร์ใหม่เป็นเลเยอร์วงน้ำ แล้วกำหนดคีย์เฟรม (F6) ที่ตำแหน่งของดอกซากุระกระทบกับผิวน้ำ
![](workshop/workshop_064.png)
26. นำวงน้ำที่วาดไว้มาวาง แล้วปรับขนาดให้เหมาะสม
![](workshop/workshop_065.png)
![](workshop/workshop_066.png)
27. กำหนดจุดคีย์เฟรมอีกครั้ง (F6) ที่เฟรมสุดท้ายของงาน แล้วปรับขนาดของวงน้ำให้มีขนาดใหญ่ขึ้น
พร้อมทั้งทำให้มันจางหายไปด้วยคำสั่ง Alpha
![](workshop/workshop_067.png)
![](workshop/workshop_068.png)
28.
คลิกขวาที่ Timeline แล้วเลือกคำสั่ง Create Classic Tween แล้วทดสอบผลลัพธ์โดยการกดปุ่ม Ctrl+Enter
จะได้แอนิเมชั่น "ซากุระตกน้ำ" ตามต้องการ
![](workshop/workshop_069.png)
![](workshop/workshop_070.png)
![](img/grass.png) |
ผลลัพธ์ที่ได้ |
หากภาพเคลื่อนไหว Flash ไม่แสดงผลให้ "คลิก" เพื่อดูวิธีการแก้ไขได้ครับ
![](img/border.png)
ใบกิจกรรมที่ 5
การสร้างดอกซากุระตกน้ำ
ให้นักเรียนทำ Flash Animation การสร้าง ซากุระตกน้ำ ตามตัวอย่างขั้นตอนการสร้างงานด้านบน จากนั้นให้บันทึกไฟล์งาน
Save ชื่อไฟล์ดังนี้ ชื่อ
sakura_ชื่อนามสกุลนักเรียน.fla
ตัวอย่าง
sakura_inthanin_kampanthong.fla
ให้นักเรียนส่งไฟล์งานการสร้าง ซากุระตกน้ำ
มาที่ระบบส่งงานของเว็บไซต์