อนุบาลงานแฟลช

[มังกร]

จักรี นายเยี่ยมมาก 

เยี่ยมมาก ญาติเยอะเหรอ

นี่กระทู้จักรีนะอย่าลืมปล่อยมุข

[มังกร]

และต้องเป็นมุกแป้กเท่านั้น 

[มังกร]

  ดีจังครับ

อยากเปิดสอนงี้มั่งจัง

[มังกร]

ก็รอเอ็งสอนอยู่นี่แหละครับ ไม่สอนซักที

[มังกร]

ไว้ว่างๆน้า สอนเทคนิคกุ๊กๆกิ๊กๆ

[มังกร]

เอาแบบกุ๊กกิ๊กๆ ที่ทำแฟลชในชีซ่าน่ะ 

จู๋นี้หากเปรียบเป็นสุรา ย่ิอมเป็นสุราเลิศรส
หากเปรียบเป็นดรุณี ก็เป็นดรุณีแรกรุ่นที่มีโฉมสะคราญ
ย่อมเป็นจู๋ที่ประเสริฐ  ประเสริฐยิ่ง 


โฮ่... ขออนุญาต เพิ่มเติมเรื่อง motion tween ครับ
พอดีข้าพเจ้าเขียนเรื่อง masking แล้วพบว่าอาจจจะมีบางคนสงสัย
ว่าทำไม motion tween แล้วมันหมุนได้ด้วยเรอะ



ทำแบบนี้ได้ด้วยนะครับ
ใช้เจ้า Free transform tool (กด Q ก็ได้ เป็นคีย์ลัดครับ) ปรับขนาด และหมุนไปหมุนมาได้
<a href="http://img2.f0nt.com/flash/788b8c0912b67651727f0704874058b2.swf" target="_blank">http://img2.f0nt.com/flash/788b8c0912b67651727f0704874058b2.swf</a>

และ
หมุนๆๆๆ


ได้แบบนี้

<a href="http://img2.f0nt.com/flash/bced3b08af5668470f9caef2b385161a.swf" target="_blank">http://img2.f0nt.com/flash/bced3b08af5668470f9caef2b385161a.swf</a>

จู๋นี้หากเปรียบเป็นสุรา ย่ิอมเป็นสุราเลิศรส
หากเปรียบเป็นดรุณี ก็เป็นดรุณีแรกรุ่นที่มีโฉมสะคราญ
ย่อมเป็นจู๋ที่ประเสริฐ  ประเสริฐยิ่ง 

โกวเล้งมากเลย

[มังกร]

เจ้าเต่า กะัลังอ่าน โกวเล้งอยู่อ่ะ เฮียท๊อป 
วาจาเต่าเลยเปรียบดั่งกระบี่ที่พุ่งตรงเสียบเข้าจากข้างหลัง ทะลุถึงหัวใจ

[มังกร]

ขอบคุณครับ +


เรียกน้องโค้กมาดูเร็ว

[Motion Tween & Guide]

Motion Tween & Guide

วันนี้ ไปเก็บ flash output ที่ใช้  guide   มาเป็นแบบทดสอบสำหรับผู้ที่สนใจและแบบทบทวนสำหรับตัวผมด้วย
อันนี้ครับ


<a href="http://img2.f0nt.com/flash/6c3bf2f8d834d9eb75ed87bc3cb8fab2.swf" target="_blank">http://img2.f0nt.com/flash/6c3bf2f8d834d9eb75ed87bc3cb8fab2.swf</a>




วิธีทำแบบของผม มีดังนี้ครับ



ขั้นตอนก็ เริ่มตั้งแต่เปิดโปรแกรมเหมือนเดิม   คงยังจำกันได้นะครับ 
งั้น ข้ามมาเริ่มตรงเปิดโปรแกรมขึ้นมาเรียบร้อยแล้ว  นะครับ งานนี้ไม่ต้องเข้าไปเซตขนาดนะ
ผมจะใช้ ขนาดที่โปรแกรมมัน มาตรฐานมาให้เลยละกัน คือ 550x400 เวลา 12 เฟรมต่อวินาที เดิมๆนะครับ   
สรุปคือไม่ต้องไปเซตมัน เปิดขึ้นมาก็เริ่มกันเลยละกัน  ขั้นแรกก็ไปที่ tool box
เลือก ที่ เครื่องมือ รุปวงกลม (Oval Tool)  ลองสังเกตไปที่ส่านของ timeline
 ว่าตอนนี้มันจะทำงานอยู่ที่ เฟรม1 ของ เลเยอร์1 






เมื่อเลือกได้เครื่องมือ Oval tool มาแล้ว ก็ทำการวาดรูปวงกลม สีอะไรก็ได้ ในที่นี้ผมใช้สีชมพู เพราะดูมันเหมาะกับผมดี ^^ 
วาดไว้ที่มุมซ้ายของพื้นที่ทำงาน  เหมือนรูปนี้ครับ




ขั้นต่อไป  มารู้จัก กับเลเยอร์ และตัวเพิ่มเลเยอร์กัน  ไอ้เลเยอร์นี่ มันก็ใช้หลักการณ์เดียวกันกับ
การทำงานของโปรแกรม photoshop นั่นแหละครับ แต่ถ้าสงสัยก็ให้นึกภาพ เครื่องฉายสไลด์ นะครับ 
ที่แผ่นใสวางทับๆกัน แผ่นใหนอยู่บนก็แสดงรายละเอียดของแผ่นนั้น  หรือถ้าแผ่นบนไม่ได้เขียนอะไรไว้เราก็สามารถมองทะลุ
ไปเห็นรายละเอียดของแผ่นถัดลงมาได้  อะไรประมาณนั้น  แต่รู้สึกจะยิ่งอธิบายจะยิ่ง งง ใช่มั้ย   ฮ่าๆ 
งั้นมาดูรูปกันนะครับ จะเห็นได้ว่า มีอยู่สองส่วนที่ จะเข้ามาเกี่ยวข้องกับการทำชิ้นงานนี้ อันแรกคือ
ส่วนของเลเยอร์ที่กล่าวไปแล้ว  และส่วนของ ตัวเพิ่มเลเยอร์  คลิก หนึ่งครั้งมันก็จะเพิ่มเลเยอร์ให้หนึ่งเลเยอร์   



พอรู้จักกับตัวเพิ่มเลเยอร์แล้ว ขั้นต่อไปก็คือการคลิก ที่สัญลักษณ์เพิ่มเลเยอร์ 1ครั้ง
เพื่อเพิ่มเลเยอร์ 2 ครับ ดูจากรูปจะเห็นได้ว่า มีเลเยอร์2 เพิ่มขึ้นมาแล้ว โดยจะเพิ่มขึ้นโดยถัดจากเลเยอร์1ไปข้างบน


ขั้นต่อไป เรามารู้จักกับ tool อีกตัว ใน Tool Box   นั่นคือ Pencil Tool  เครื่องมือรูปดินสอนั่นเอง
จะสังเกตได้ว่า เมื่อคลิก ที่ Tool ต่างๆแล้ว รายละเอียดของ Tool นั้น จะปรากฏที่ Propreties ด้วย



เมื่อเลือก Pencil Tool แล้ว ให้เอาเมาส์ไปคลิก1ครั้ง ที่ เฟรม1 ของเลเยอร์2 



 จากนั้น ก็วาดเส้นลงบน area  เป็นเส้น ต่างๆ จะโค้งไปโค้งมา บิดไปบิดมาก แบบไหนก็แล้วแต่ชอบ ครับ 



และที่สำคัญ คือ จุดเริ่มต้นของเส้นที่เราวาด  ต้องพยายามกะให้อยู่ตรงจุดศูนย์กลางของรูปวงกลม ด้วยนะครับ


เดี๋ยวมาต่อ..................ครับ

มาขั้นตอนต่อไปเลยครับ พอวาดเส้นเสร็จแล้ว  ก็เอาเมาส์ไปคลิกขวาที่ เลเยอร์ 2  อย่าไปคลิกที่เฟรมนะครับ ให้คลิกตรงใกล้ๆ
กับคำว่า leyer2 เลย ดูในรูปข้างล่างนี้ ที่ผมทำกรอบสีส้มๆไว้นั่นแหละครับ   
ต่อไปนี้ ถ้าผมบอกว่า “ให้คลิกที่เลเยอร์ “ ก็ให้มาเอาเมาส์มาคลิกที่บริเวณนี้นะครับ  แต่จะเป็นเลเยอร์ไหน ก็ต้องดูอีกที 


พอรู้แล้ว ขั้นต่อไป ก็คลิกขวา ที่เลเยอร์2 แล้วเลือก  Guide ได้เลยครับ


จะเห็นได้ว่า พอ เลือกไกด์ที่เลเยอร์สองแล้ว หน้าคำว่า layer2  จะเปลี่ยนเป็นสัญลักษณ์แบบนี้

จากนั้น ก็ เอาเมาส์ไปคลิกที่ เลเยอร์1



เมื่อเลือกที่เลเยอร์1 ให้คลิกซ้ายค้างไว้แล้วลากเลเยอร์1ไปทับกับเลเยอร์2 พอมันทับกันแล้วก็ค่อยปล่อยเมาส์นะครับ


แล้วระวังว่ามันอาจจะเลยขึ้นไปด้วย  ให้สังเกตว่ามันทับกันจริงหรือเปล่า โดยให้ดูที่สัญลักษณ์ หน้า คำว่า layer2 
จากที่เป็น รูป ถ้าเปลี่ยนเป็นรูปสัญลักษณ์แบบนี้ แสดงว่า ทับกันจริงๆ แล้ว
 


ขออีกซํกโพสต์ละกัน.

ต่อเลยครับ จากนั้นไปที่เฟรมที่ 50 ของเลเยอร์ 2    คลิกขวา แล้วเลือก Insert Frame หรือ กด F5 ก็ได้


เมื่อเลือก Insert Frame แล้ว จะปรากฏผลดังนี้



ลำดับต่อไป   ไปที่เฟรม 1 ของเลเยอร์ 1 คลิกขวา เลือก Create Motion Tween  (อะอะ ยังจำกันได้ใช่มั้ย ^^)



หลังจากนั้นก็ไปที่เฟรม 50 ของเลเยอร์ 1  คลิกขวา เลือก Insert Keyframe หรือกด F6 ก็ได้



เมื่อ เลือกแล้ว ตอนนี้  ไอ้เส้นสีแดงๆ มันจะบอกว่าตอนนี้เราทำงานอยู่ที่ เฟรม 50  และจะสังเกตว่า ไอ้สีเหลี่ยมแบบนี้ หรือแบบนี้
จะเป็นตัวบอกว่า เราทำงานอยู่ เฟรมไหนเลเยอร์ไหน   ตอนนี้มันทำงานอยู่ที่  เฟรม ที่ 50 ของเลเยอร์ 1


ลำดับต่อไปไปที่ area  พื้นที่ทำงาน สีขาวนั่นน่ะ   แล้ว เอาเมาส์เลือกที่วงกลมคลิกซ้ายค้างไว้แล้วลาก มาที่จุดปลายอีกข้างนึง



พยายามให้จุดศูนย์กลางของวงกลมอยู่ปลายสุดของเส้นพอดี




สุดท้าย จะออกมาเป็นรูปร่างหน้าตาแบบนี้  ลอง กด Ctrl+Alt ดู ก่อน ก็ได้ครับ  หรือจะ export Movie เลยก็ได้ครับ 
ขั้นตอนก็อย่างที่เคยบอกไว้แล้ว ตั้งแต่ บทแรก.........



ขอบคุณ ทุกท่าน ที่เข้ามานับ 0 ไปพร้อมๆกันนะครับ ทั้งคนที่เคยนับมาแล้วและคนที่ยังไม่เคย
 ก็หวังว่าจะมีประโยชน์บ้างนะครับ  ถ้า ใครไม่เข้าใจตรงไหน หลังโรงลิเกได้เลยครับ

[มังกร]

  เยี่ยมอีกแล้วครับจักรี