การทำ Flash เขียนหนังสือ

การทำ Flash เขียนหนังสือ

เข้าไปเจอเรื่องนี้เข้า ชอบมากๆ มาลองทำดูนะคะ

บทความนี้เหมาะำสำหรับ ผู้ที่จะทำ E-learning หรือ สอนการวาดรูป
1. วาดภาพดินสอหรือปากกาเตรียมไว้ก่อนเลยครับ (หรือไม่ต้องการก็ไม่ต้องทำก็ได้นะครับ)

2. เปิดเอกสาร Flash เตรียมภาพขึ้นมา แนะนำให้ Frame rate ให้เป็น 25 ขึ้นไปนะครับ เพื่อความไหลลื่นของภาพ แต่มากไปก็ไม่ดีนะครับเพราะภาพจะเร็วเกินไป ผมใช้ 27 ครับ

3. พิมพ์อักษรหรือวาดภาพลงบนเอกสาร ผมใช้การพิมพ์ตัวอักษรนะครับ

3.1 สำหรับคนที่พิมพ์ตัวอักษรโดยเฉพาะครับให้ทำการ Break Apart โดยการไปที่ Modify > Break Apart หรือ กด Ctrl+B ก่อน สังเกตุว่าเมื่อทำการ Break Apart เสร็จแล้ว กรอบ สี่เหลี่ยมรอบตัวอักษรจะหายไปนะครับ
>>>
4. Insert Layer ขึ้น มาแล้ว ไปเลือกสี ที่ Colors ไม่ต้องสนใจว่าจะเป็นสีอะไรนะครับเพราะมันไม่เห็นแน่ๆ อยู่แล้ว แต่ควรเลือกสีที่ทำให้มองง่าย ในขั้นตอนการทำไม่ควรใช้สีเดียวกันกับ ตัวกอักษรหรือภาพ เพราะจะทำให้ งง เอง นะครับ
>>>
5. เตรียมเครื่องมือ Brush Tool (B) แล้ว ไปที่ Layer 1 Insert Frames ให้มันไกลๆ ไปก่อน ลองกะดู ว่ามันจะอยู่ใกล้ไกล แค่ไหนนะครับ จากนั้นไปที่ Layer 2 Insert Frames ให้มันไกลๆเท่ากับ Layer 1 กลับกลับมาที่ Frames 1 กด Insert Key Frames 1 ครับแต้ม จุด Brush Tool 1 ครั้ง ทำแบบนี้ซ้ำๆกันไปเรื่อยๆ กับ อักษรหรือรูปภาพของคุณ
>>>
>>>
>>>
>>>
>>>
** สำหรับการ Insert Key Frames กด F6 เอาก็ได้ ครับ ไม่ต้องไปคลิกขวาที่ Frames เสมอไป

เมือถึงขั้นตอนนี้ สมมุติว่า Insert Key Frames และแต้มจุดกันเสร็จแล้วนะครับถ้า Frames ที่ Layer 2 ยาวไม่ถึงที่ Layer 1 มี ก็ ลบ Frames 1 ส่วนที่เกินทิ้งนะครับ(แบบรายการทำอาหารใน TV อ่ะครับ "สมมุติว่า ครับ 1 ชม. แล้วนะครับ" อะไรประมาณนะ) จะได้ภาพแบบนี้ครับ

6. ขั้นตอนต่อไปก็ไม่ยากครับไปที่ Layer ที่ 2 คลิกขวา กด Mask

7. จำดินสอแท่งที่ทำไว้เมื่อตอนแรกได้มั้ยครับ เอามาใส่ในเอกสารนี้ได้เลยครับ ไว้ใน Layer ที่ 3 วิธีทำแทบไม่ต่างจากเมื่อ ครู่นี้เลยครับ แค่เปลี่ยนจากการแต้มจุดเป็นเลื่อนดินสอเท่านั้นเองครับ ขั้นตอนนี้ไม่ต้อง Mask นะครับ

>>>
>>>
ทำเช่นนี้ไปเรื่อยๆ จนสุดจุดที่เราแต้ม เมื่อครบแล้ว กด Ctrl+Enter จะได้ผลลัพธ์ ดังนี้ครับ
ตัวอย่าง
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','400','height','300','src','file_flash/flash62/Drowing','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','file_flash/flash62/Drowing' ); //end AC code



Shortcut : http://www.webthaidd.com/flash

การใส่เพลงลงในBar slide ให้สามารถปรับ volume ได้

วันนี้เรียนวิชา เทคโนโลยีและสารสนเทศเพื่อการศึกษา อ.รุจโรจน์ สอนการทำ แฟลช ต่อจากครั้งก่อนๆ คือการใส่เพลง ลงในปุ่ม กลับมาบ้าน seachไปเรื่อยๆ เจอวิธีการปรับระดับเสียงได้ด้วย เลยนำมาฝากกัน ค่ะ แต่ถ้าไม่เข้าใจ ตามไปดูที่ลิงค์ข้างล่างนะคะ จะมีรูปประกอบ ถ้าได้หรือไม่ได้ยังไง บอกด้วยค่ะ
1. สร้าง slide บาร์ขึ้นมา โดยไปที่บทความ slide bar จะได้ดังรูป
2. สร้างปุ่มขึ้นมา หรือไปที่เมนู Window > Common Libraries > Buttons เพื่อนำปุ่มสำเร็จรูปมาใช้
3. เลือกปุ่ม play มาวางไว้บน Stage
4. คลิกขวาที่ปุ่ม play แล้วเลือก actions
5. ใส่ actionscript ลงไปดังนี้
on (release) {if (_root.mySlider.complete == 1) {_root.mySlider.mySound.start(0, 99);}}
6. หลังจากนั้นคลิกขวาที่ slider ซึ่งเป็น movieclip แล้วเลือก actions
7. ใส่ actionscript ลงไปดังนี้
onClipEvent (load) {mySound = new Sound();mySound.loadSound("music.mp3",false);}onClipEvent (enterFrame) {downloaded = mySound.getBytesLoaded();total = mySound.getBytesTotal();if (downloaded != total) {_root.dl = "downloading song...";} else {complete = 1;_root.dl = "";}mySound.setVolume(_root.volume*2);}
8. ขั้นตอนต่อไป ดับเบิ้ลคลิก ที่ slider ซึ่งเป็น movieclip แล้วคลิกขวาที่เฟรมแรกเลือก action
9. จะเห็น actionscript ที่เราเคยใส่ไว้ ดังรูป
10. ให้เพิ่ม actionscript แทรกลงไปในบรรทัดที่ 6 ดังนี้ (ดูตัวอย่างจากรูป)
_root.volume = ratio;
11. นำไฟล์เพลงนามสกุล .mp3 มาวางไว้ที่เดียวกันกับไฟล์ flash ที่เราสร้างขึ้น และตั้งชื่อว่า music ดังรูป
12. กด Ctrl + Enter เพื่อทดสอบ (ทดสอบโดยการคลิกที่ปุ่ม play แล้วลองเลื่อน slider bar เพื่อปรับระดับความดังของเสียง)
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','200','height','150','src','volume','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','volume' ); //end AC code


Shortcut : http://www.webthaidd.com/flash

เมาส์คอมพิวเตอร์แบบใหม่

เมาส์คอมพิวเตอร์แบบใหม่เป็นทรงกลม
เมาส์คอมพิวเตอร์ที่ถูกออกแบบมาล่าสุดโดยบริษัทที่จำหน่ายเกี่ยวกับเทคโนโลยีใหม่ของประเทศออกเตรเลียมีชื่อเรียกอย่างเป็นทางการว่า ไซเบอร์สปอร์ต หรือ Cyber Sport โดยในส่วนการออกแบบนั้นได้แนวคิดมาจากระบบควบคุมต่างๆ ในหอบังคับการ หรือเครื่องจักรอื่นๆ ที่ต้องมีการระบุตำแหน่งในการทำงานและสามารถเคลื่อนที่ได้รอบทิศทาง

Cyber Sport เป็นเมาส์ที่เป็นอุปกรณ์ที่มีไว้ใช้งานได้ทั้งคอมพิวเตอร์แบบตั้งโต๊ะหรือแบบพกพา ใช้ได้ทั้งคอมพิวเตอร์ทั่วไปและของ Mac โดยมีการทำงานเป็นแบบไร้สาย และเรียกได้ว่าเป็นเมาส์ที่สามารถทำงานได้ทุกทิศทาง คือ 360 องศา ซึ่งต่างจากเม้าส์ที่ใช้อยู่กันปกติ โดยทางบริษัทได้ทำการออกแบบเม้าส์ Cyber Sport มาให้มีความสามารถในการใช้งานที่มากกว่าเม้าส์แบบดั้งเดิม ไม่ว่าจะเป็นลักษณะการทำงาน และรูปแบบของเมาส์ที่มีประสิทธิภาพสูงกว่าในหลายๆด้าน ซึ่งลักษณะการทำงานหลักๆของเม้าส์ Cyber Sport จะใช้นิ้วเพียงนิ้วเดียวเป็นตัวบังคับการทำงาน

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

มากไปกว่านั้น เม้าส์ Cyber Sport ค่อนข้างไวต่อการเคลื่อนที่ ดังนั้นจึงสามารถทำงานได้เร็วและช้าตามที่ผู้ใช้ต้องการได้อย่างมีประสิทธิภาพ

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

จากภาพข้างบน แสดงให้เห็นว่า เมื่อเปรียบเทียบการทำงานของเม้าส์ที่ใช้อยู่ปัจจุบัน การกดปุ่มซ้ายมีการทำงานเทียบเท่ากับการกดปุ่มกลางของเม้าส์ cyber sport และ การกดปุ่มขวามีการทำงานเทียบเท่ากับการกดตำแหน่งใดรอบเม้าส์ cyber sportนอกจากนี้เมาส์ Cyber Sport ยังปุ่มอีกปุ่มนึงที่ทำหน้าที่เป็นเหมือน ปุ่มที่อยู่ตรงกลางที่มีไว้สำหรับเลื่อนหน้าจอขึ้นลงโดยใช้นิ้วบังคับของเม้าส์ปกติ และปุ่มนี้ของเม้าส์ Cyber Sport ยังสามารถใช้เป็นปุ่มเพื่อเปลี่ยนให้ทิศทางการเคลื่อนที่จากซ้ายขวา ไปเป็นบนล่าง หรือเปลี่ยนไปมา หากต้องการเลื่อนหน้าจอโดยใช้ปุ่มนี้เป็นตัวบังคับเพียงปุ่มเดียว ซึ่งก็ทำได้โดยการกดปุ่มหนึ่งครั้งเพื่อเป็นการเปลี่ยนการทำงาน

ซึ่งราคาของเม้าส์ Cyber Sport อยู่ที่ 98.50 ดอลล่าร์สหรัฐ และจะวางจำหน่ายในเดือนมกราคม ปี 2009

สำหรับข้อมูลเพิ่มเติมสามารถเข้าไปดูได้ที่ http://www.cyberesport.com/

การทำแบนเนอร์ด้วยphotoshop

เทคนิค Photoshop สร้างแบนเนอร์ แบบง่ายๆ
Submitted by admin on วันจันทร์, 20 ตุลาคม 2008No Comment


เทคนิค Photoshop cs
วิธีทำง่ายมากๆคับ มีเพียง 5 ขั้นตอน มาทำเลยดีกว่าคับ
1 สร้างเอกสารใหม่ใน photoshop ขึ้นมา ขนาด 480 * 180 px และเทสีดำลงไป

2. ไปที่ Filter >> Texture>> Grain และเลือก Texturizer …..

3. สร้างเลเยอร์ใหม่ วาดสี่เหลี่ยมตรงด้านล่างโดยใช้เครื่องมือ Rectangle tool (U) แล้วเทสีขาวลงไป แล้วกำหนดค่า Opacity 50% ในส่วน layers


4.นำโลโก้ที่ต้องการหรือรูปที่ต้องการมาไว้ส่วนขวาบน แล้วคลิกขวาที่เลเยอร์ โลโก้แล้วเลือก Blending Option.. แล้วคลิกหน้าช่อง Outer Glowเพื่อใส่เอฟเฟคลงไปแล้วกด OK

5.สร้างเลเยอร์ใหม่ แล้วพิมพ์ข้อความสีขาว ที่ต้องการลงไป แล้วใส่เอฟเฟคโดยทำเหมือน ข้อที่ 4
เป็นอันเสร็จตกแต่เพิ่มเติมตามต้องการ

การทำตัวอักษรจางลงแล้วขยายด้วยโปรแกรมFlash

การทำ Expaning_text
1. หลังจาก เขียนข้อความที่ต้องการทำ Expaning_text แล้วให้คุณ กด F8 เพื่อ Convert to Symbol โดย เลือก Type เป็น Graphic
>>>
2. จากนั้น คลิ๊กขวาที่ Frame 1 ใน Layer 1 เลือก Copy Frames
3. กดเพิ่ม Layer ขึ้นมา จากนั้น คลิ๊กขวาที่ Frameที่ 1 ของ Layer 2 กด Paste Frames
>>>
4. จากนั้น คลิ๊กขวาที่ Frame ที่ 30 ของ Layer 2 เลือก Insert Keyframe
>>>
5. จากนั้นคลิกเลือก Frame 30 ของ Layer 2 แล้วมาเลือก Free Tansform Tool แล้วมาขยาย ตัวอักษรให้ใหญ่ขึ้น เฉพาะ ใน Frame 30 ของ Layer 2 เท่านั้นนะครับ
6. จากนั้น ลงมา ที่ Properties เลือก Color เป็น Alpha เลือก 0% ใน Frame 30 ของ Layer 2
7. จากนั้นคลิ๊กที่ Layer 2 แล้วลงมาที่ Properties เลือก Tween เป็น Motion
>>>
>>>
8. จากนั้นกลับมาที่ Layer 1 คลิ๊กขวา ที่ Frame ที่ 30 เลือก Insert Frame
>>>
9. กด Ctrl + Enter เำพื่อทำการแสดงผล
ดูตัวอย่าที่นี่ครับ
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','350','height','200','src','file_flash/flash69/Expaning_text','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','file_flash/flash69/Expaning_text' ); //end AC code



http://www.webthaidd.com/flash/webthaidd_article_772_1.html

การทำแอนนิเมชั่นด้วยโปรแกรม flash

การทำ animation ต่างๆ ในการทำ animation ต่างๆ เช่น การ์ตูน แน่นอนว่าจะต้องแบ่งเป็นตอนๆ หรือ ฉาก ใน flash ก็เช่นกัน เมื่อ animation ของเรามีความยาว หรือซับซ้อนมาก ก็แบ่งออกเป็นฉากๆได้ โดยใ้ช้ Scene เพราะว่าใน flash player นั้นจะทำการเล่นเมื่อมีเฟรมไม่เกิน 16,000 เฟรม ถ้ามากกว่านี้ก็จะไม่เล่น และถ้า animation ของเรามีความยาวมากกว่า 16,000 เฟรมล่ะ จะทำยังไง Scene เป็นตัวเลือกหนึ่งในนั้น บทความนี้จะทดสอบเกี่ยวกับการใช้ Scene ครับ
1. สร้างเอกสารใหม่ขึ้นมา ขนาดใดก็ได้ (ในรูปขนาด 400x300)
2. ใช้เครื่องมือ text tool พิมลงไปใน stage ว่า Scene 1 ดังรูป
3. สร้าง layer ใหม่ขึ้นมาอีก 1 เลเยอร์ โดยคลิกที่ แล้วใช้เครื่องมือ Oval Tool วาดรูปวงกลมลงไปทางด้านซ้ายของ stage ดังรูป
4. คลิกขวาที่ keyframe ที่เฟรมแรก ของ layer 2 แล้วเลือก creation motion tween ดังรูป
5. คลิกขวาที่เฟรมที่ 20 แล้วเลือก Insert Keyframe ดังรูป
6. ลากวงกลมไปไว้ทางขวาดังรูป
7. คลิกขวาที่เฟรมที่ 20 ของ layer 1 แล้วเลือก Insert Frame ดังรูป
8. ตอนนี้เราก็จะได้ animation อย่างง่าย อยู่ที่ Scene แรกแล้วนะครับ สังเกตุได้จากตัวอย่างในรูปครับ
9. ไปที่เมนู Insert > Scene เพื่อสร้าง Scene ใหม่ขึ้นมา จะพบกับ stage ที่ว่างเปล่า นั่นก็คือ Scene 2 นั่นเอง
10. ใน Scene 2 นั้นให้สร้าง animation ขึ้นมาใหม่ ตั้งแต่ข้อ 2 - 7 โดยเปลี่ยนจาก คำว่า Scene 1 เป็น Scene 2 และเปลี่ยนสีของวงกลมจากสีฟ้าเป็นสีอื่นครับ ดังรูป
11. กด Ctrl + Enter เพื่อทดสอบดูครับ
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','400','height','300','src','scene','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','scene' ); //end AC code





12. จะเห็นว่า เมื่อ animation ของ Scene 1 จบ จะต่อด้วย Scene 2 ทันที
13. เราสามารถสลับเปลี่ยน Scene ที่ต้องการแก้ไขได้โดยดูจากตัวอย่างครับ
14. เราสามารถเรียกหน้าต่าง Scene มาใช้งาน เพื่อความสะดวกในการสับเปลี่ยน Scene โดยไปที่ Window > Other Panels > Scene หรือกด Shift+F2

ถ้าอ่านไม่เข้าใจตามไปดูที่นี่นะคะ http://www.webthaidd.com/flash/webthaidd_article_940_1.html

การทำภาพสีให้เป็นภาพขาวดำด้วยโปรแกรม Photoshop

โรงเรียนหยุดหลายวันเลยไปเปิดบันทึกเรื่องเรียนพบเวปไซต์ที่อาจารย์รุจโรจน์แนะนำเมื่อตอนเรียนเกี่ยวกับโฟโต้ชอป ลองฝึกทำดูนะคะ

http://www.pantip.com/cafe/gallery/topic/G1961373/G1961373.html