เทคนิคการสอนเอฟเฟ็กต์ Mask ใน Macromedia Flash (ตอนที่ 2)

จัดการภาพดังกล่าวให้เกิดการเคลื่อนไหวขึ้น โดยเลื่อนภาพไปมา ในระหว่า ง Frame ใดๆ ที่เราต้องการให้เกิดการเคลื่อนไหว ในที่นี้ผมเลือกกระทำที่ Frame ที่ 15, 30 ,45 และ 60 ตามลำดับ (เราจะเลื่อนภาพไปมาได้โดยให้กดเมาส์ ณ ตำแหน่ง Frame ที่เราต้องการ จะให้ภาพนั้นเกิดการเคลื่อนไหว จากนั้นทำการเลื่อนภาพได้ตามต้องการ แต่อย่าเกินขอบ Movie นะครับ ซึ่งในตัวอย่างจะต้องมีการกระทำไปจนทั้งหมด 4 Frame ด้วยกันคือ Frame ที่ 15, 30, 45 และ 60 หากต้องการให้เกิดการทำงาน
ณ จุดไหนก็กดคลิ้ก F6 เพื่อทำการเลือกเป็น Keyframe นั่นเอง) จะได้ภาพเคลื่อนไหว ณ ตำแหน่ง Keyframe ต่าง ๆ ดังรูปที่ 8



เราจะได้ลักษณะของภาพเคลื่อนไหวแล้วครับ แต่ยังไม่ใช่จุดประสงค์หลักของเราในวันนี้ซึ่งต้องอาศัยเทคนิคการ Mask หรือทำหน้ากากภาพเหล่านี้ให้กลายเป็นภาพเลียนแบบการโฆษณาบนจอยักษ์นี้ได้ ซึ่งสามารถทำตามขั้นตอนต่อไปได้คือ กดคลิ้กเลือกไปที่ไอคอนรูปสัญลักษณ์เครื่องหมาย บวก เพื่อทำการ Insert Layer จะปรากฎรายการ Layer 2 เกิดขึ้นเหนือ Layer 1 ที่เราได้สร้างการทำงานไว้แล้ว ดังรูปที่ 9



ณ ตำแหน่ง Layer ที่ 2 นี้เราจะมาทำการใส่ Mask ให้กับภาพด้านล่างแล้วครับ ให้สร้างสี่เหลี่ยมหัวมุมโค้งมนโดยเลือกไปที่รูปแบบ Tools ตรงที่เป็นรูป สี่เหลี่ยมหรือ Rectangle Tools ดังรูปที่ 10 ครับ



จากนั้นให้ทำการเลือกบริเวณ Options ของ Rectangle Tools นี้โดยคลิ้กเลือกที่ปุ่มการปรับเลือกการโค้งมนดังรูปที่ 11



เพื่อทำการปรับความโค้งมนของรูป Rectangle ดังกล่าวให้มีขนาดประมาณ 15 point ดังปรากฎรูปแบบวินโดวส์ แสดงการจัดการเซต ค่าความโค้งมนของ Rectangle ดังรูปที่ 12



ในการทำงานขั้นตอนนี้ ให้ย้ายการทำงานไปอยู่ในตำแหน่งของ Layer ที่ 2 จากนั้นทำการวาดลักษณะของรูป Rentangle ดังกล่าวประมาณ 9 รูปเรียงต่อกันดังรูปที่ 13



ทำการคลิ้กขวาโดยไปเลือกการทำงานบริเวณส่วนที่แสดง Layer ดังรูปที่ 14 เพื่อเลือกรายการ Mask ณ Layer ที่ 2



จะปรากฎรายการดังรูปที่ 15 โดยสังเกตจะเห็นได้ว่ามีรูปกุญแจเกิดขึ้น ทั้ง 2 บริเวณคือ Layer 2 และ Layer 1 พร้อมทั้งรูปภาพที่เกิดขึ้นในบริเวณการทำงานดังกล่าวก็เกิดขึ้นเฉพาะรูปที่เราทำการ Mask รูปภาพต่าง ๆ นั้นไว้แล้วนั่นเอง



จะสังเกตเห็นว่าพื้นที่ของบริเวณที่เราทำการ Mask นั้นมีขนาดน้อยกว่าพื้นหลังหรือ Movie ในโปรแกรม Macromedia Flash มากดังนั้นเพื่อให้การแสดงผลเวลาเอาไปแสดงประกอบร่วมกับภาษา HTML ให้มีขนาดพอดีเราจึงจำเป็นต้องปรับให้มีขนาดของ Flash Movies นี้ให้พอดีด้วยโดยสามารถเข้าไปปรับที่เมนู Modify --> Movie ดังรูปที่ 16



จะปรากฎรายการ Movie Properties Window ให้เราทำการระบุขนาดของ Movie ให้เหมาะสมซึ่งเป็นดังรูปที่ 17



เลือกทำการ Export ไฟล์ดังกล่าวให้สามารถออกไปใช้งานเพื่อประกอบการตกแต่งกับเว็บไซต์ของเราได้โดยไปที่เมนู File --> Export Movie ดังรูปที่ 18



ทำการเลือกบันทึกพร้อมทั้งเก็บไฟล์ *.swf เหล่านี้เพื่อนำไปใช้งานได้ต่อไปร่วมกับโปรแกรมตกแต่งเว็บไซต์อื่น ๆ เช่น Macromedia Dreamweaver ได้ดังรูปที่ 19 ลองเอาไปประยุกต์ใช้กันนะครับ



ข้อมูลจาก : http://www.arip.co.th
โดย วิโรจน์ ชัยมูลี