ครูต้นหญ้าออนไลน์

:: การสร้างซากุระตกน้ำ

สร้างดอกซากุระ

1. เปิดโปรแกรม Adobe Flash เลือกสร้างไฟล์งานใหม่เป็น ActionScript 2.0

2. เลือกอุปกรณ์

Pencil Tool แล้วเลือกรูปแบบเส้นเป็นแบบ Smooth

3. วาดกลีบดอกซากุระลงในงานตามความต้องการ

4. ลงสีให้กับกลีบดอกซากุระที่เราวาดขึ้น
สามารถลงสีแบบไล่เฉดโทน เพื่อเพิ่มความสวยงามให้กับชิ้นงาน

คลิกดูการลงสีให้กับวัตถุ ที่นี่

5. ลบเส้นขอบของรูปภาพออก

6. ทำการ Copy กลีบดอกซากุระ มาวางเพิ่มในงาน โดยสามารถหมุนกลีบดอกแล้วจัดวางได้ตามต้องการ จนเป็นดอกซากุระ

7. ย่อดอกซากุระที่ทำเสร็จแล้วให้มีขนาดเล็กลง เหมาะสมกับขนาดของงานที่สร้างไว้

8. นำดอกซากุระที่สร้างเสร็จแล้วไปเก็บไว้ใน Library โดยให้ตั้งชื่อว่า "ดอกซากุระ" และเลือกรูปแบบวัตถุเป็นแบบ Movie Clip

9. จะได้ดอกซากุระ ที่พร้อมจะนำไปทำแอนิเมชั่นในส่วนถัดไป

สร้างดอกซากุระตกน้ำ

1. ปรับพื้นหลังของชิ้นงานให้มีสีดำสนิท

2. ใช้อุปกรณ์ Rectangle Tool เพื่อวาดรูปพื้นน้ำขนาดพอประมาณ แล้วลงสีให้สวยงาม

3. ใช้อุปกรณ์ Oval Tool วาดรูปพระจันทร์

4. ใช้อุปกรณ์ Polystar Tool วาดรูปดวงดาว

5. สร้างเลเยอร์ใหม่ แล้ววาดรูปกิ่งซากุระ โดยใช้อุปกรณ์ Line Tool

6. นำดอกซากุระมาวางประดับบนกิ่งให้เต็มตามความต้องการ
เมื่อประดับจนพอใจแล้วให้ทำการ Lock เลเยอร์เอาไว้เพื่อป้องกันการขยับของชิ้นงาน

7. วางดอกซากุระอีก 1 ดอก ลงในเลเยอร์ใหม่ (กำหนดตำแหน่งตามความต้องการ)
แล้วกำหนดเวลาบน Timeline ที่ต้องการให้ซากุระดอกนั้นตกลงในน้ำ

8. แทรกคีย์เฟรมกดปุ่ม F6 (Insert Keyframe) จะปรากฏดอกซากุระดอกเดียวในงาน ตามภาพ

9. แทรกเฟรมโดยกดปุ่ม F5 (Insert Frame) ในเลเยอร์อื่นๆที่เหลือ เพื่อเพิ่มเฟรมให้เท่ากัน ซึ่งจะปรากฎวัตถุเดิมที่วาดเอาไว้

10. คลิกที่เฟรมสุดท้ายของงาน(ของเลเยอร์ดอกซากุระ) แล้วลากดอกซากุระลงมายังพื้นทะเลสาบด้านล่าง

11. คลิกขวาที่ Timeline แล้วเลือกคำสั่ง Create Classic Tween จะปรากฎการเคลื่อนไหวของดอกซากุระตกลงมาที่ทะเลสาบ

12. เพิ่มการกำหนดทิศทางการเคลื่อนที่ของวัตถุ (Guide) โดยคลิกขวาที่เลเยอร์ดอกซากุระแล้วเลือกคำสั่ง Add Classic Motion Guide

13. ใช้ดินสอวาดทิศทางการเคลื่อนที่ของดอกซากุระตามต้องการ

14. กำหนดให้ดอกซากุระของเราวิ่งตามเส้นโดย
คลิกที่เฟรมแรก แล้วลากจุดกลางของดอกซากุระให้อยู่ที่ปลายของเส้นไกด์(ฝั่งกิ่งไม้)

15. คลิกที่เฟรมสุดท้าย แล้วลากจุดกลางของดอกซากุระให้อยู่ที่ปลายของเส้นไกด์(ฝั่งทะเลสาบ)

16. ทดสอบการเคลื่อนไหวของดอกซากุระ ว่าวิ่งตามเส้น Guide หรือไม่ โดยกดปุ่ม Enter

17. ปรับให้ดอกซากุระมีการหมุนโดยเลือกที่คำสั่ง Rotate ในพาเล็ท Properties

18. หากดอกซากุระมีการเคลื่อนที่เร็วเกินไป ให้กดปุ่ม F5 เพื่อเพิ่มเฟรม ทำให้วัตถุเคลื่อนที่ช้าลง

19. กำหนดให้ดอกซากุระจมหายไปในน้ำ โดยเลือกเฟรมบน Timeline ที่ต้องการให้ซากุระจมหาย แล้วสร้างคีย์เฟรมโดยกดปุ่ม F6

20. ดึงดอกซากุระให้ต่ำลงไปจากจุดเดิม (เหมือนกับจมไปจากจุดเดิม)
แล้วปรับความโปร่งใสในส่วนของ Alpha ในพาเล็ท Properties ให้มีค่าเป็น 0

21. คลิกขวาที่ Timeline แล้วเลือกคำสั่ง Create Classic Tween แล้วทดสอบผลลัพธ์

22. สร้างระลอกวงน้ำ โดยไปที่เมนู Insert > New Symbol แล้วสร้างวงน้ำโดยกำหนดรูปแบบเป็น Movie Clip

23. สร้างวงน้ำโดยใช้อุปกรณ์

Oval Tool วาดวงรีซ้อนกัน ดังภาพ

24. ลบชั้นของวงน้ำออกแบบชั้นเว้นชั้น จะได้วงน้ำตามที่ต้องการ

25. สร้างเลเยอร์ใหม่เป็นเลเยอร์วงน้ำ แล้วกำหนดคีย์เฟรม (F6) ที่ตำแหน่งของดอกซากุระกระทบกับผิวน้ำ

26. นำวงน้ำที่วาดไว้มาวาง แล้วปรับขนาดให้เหมาะสม

27. กำหนดจุดคีย์เฟรมอีกครั้ง (F6) ที่เฟรมสุดท้ายของงาน แล้วปรับขนาดของวงน้ำให้มีขนาดใหญ่ขึ้น
พร้อมทั้งทำให้มันจางหายไปด้วยคำสั่ง Alpha

28. คลิกขวาที่ Timeline แล้วเลือกคำสั่ง Create Classic Tween แล้วทดสอบผลลัพธ์โดยการกดปุ่ม Ctrl+Enter
จะได้แอนิเมชั่น "ซากุระตกน้ำ" ตามต้องการ

ผลลัพธ์ที่ได้

หากภาพเคลื่อนไหว Flash ไม่แสดงผลให้ "คลิก" เพื่อดูวิธีการแก้ไขได้ครับ

ใบกิจกรรมที่ 5
การสร้างดอกซากุระตกน้ำ

ให้นักเรียนทำ Flash Animation การสร้าง ซากุระตกน้ำ ตามตัวอย่างขั้นตอนการสร้างงานด้านบน จากนั้นให้บันทึกไฟล์งาน

Save ชื่อไฟล์ดังนี้ ชื่อ sakura_ชื่อนามสกุลนักเรียน.fla
ตัวอย่าง sakura_inthanin_kampanthong.fla

ให้นักเรียนส่งไฟล์งานการสร้าง ซากุระตกน้ำ มาที่ระบบส่งงานของเว็บไซต์

Content on this page requires a newer version of Adobe Flash Player.