SlideShare a Scribd company logo
การทำภาพ  Animation ( ตอนที่  1)
[object Object]
[object Object]
 
[object Object]
 
[object Object]
 
[object Object]
เอาละค่ะ ... ทีนี้ก็มาถึงขั้นตอนสุดท้ายกันแล้วละค่ะ นั้นก็คือการบันทึกภาพ  Animation  ซึ่งทำได้โดยการใช้คำสั่ง  File --> Save Optimized As...  จากนั้นเมื่อมีไดอะล็อกบ็อกปรากฏขึ้น ก็ให้เราตั้งชื่อไฟล์ค่ะ และที่สำคัญสั่งเกตที่  Save as type  ให้เซฟเป็นสกุล  . gif  เท่านั้นค่ะ ภาพที่เราเซฟไปจึงจะแสดงผลการเล่นภาพเป็นแบบ  Animation
การทำภาพ  Animation ( ตอนที่  2)
[object Object]
 
[object Object]
[object Object]
[object Object]
 
[object Object]
การทำภาพแบบนี้ถ้าหากต้องการให้สมูทสมจริง ก็ต้องใช้จำนวนเฟรมให้เยอะขึ้นค่ะ โดยในขั้นตอนการทำ  Tween  ก็อาจจะเพิ่มเฟรมจากเดิม   5  เป็นจำนวนที่เยอะขึ้นค่ะ การแสดงภาพก็จะช้าลงและดูสมูทมากยิ่งขึ้นค่ะ แต่ก็ไม่ควรจะมีจำนวนเฟรมเยอะเกินไป เพราะเมื่อขนาดเฟรมเพิ่มขึ้น ขนาดของไฟล์ก็จะเพิ่มมากขึ้นเช่นกันค่ะ ในที่นี้กำหนด  Tween  ให้เพิ่มเฟรมเป็น  5  เพื่อให้สังเกตจำนวนเฟรมในพาเล็ต  Animation  ได้ง่ายขึ้นค่ะ   ... ลองทดลองปรับเปลี่ยนดูเองนะค่ะ  ... ขั้นตอนสุดท้ายหากต้องการนำเฟรมไปใช้ ก็ให้บันทึกภาพ  Animation  ซึ่งทำได้โดยการใช้คำสั่ง  File --> Save Optimized As...  จากนั้นเมื่อมีไดอะล็อกบ็อกปรากฏขึ้น ก็ให้เราตั้งชื่อไฟล์ค่ะ และที่สำคัญสั่งเกตที่  Save as type  ให้เซฟเป็นสกุล  . gif  เท่านั้นค่ะ ภาพที่เราเซฟไปจึงจะแสดงผลการเล่นภาพเป็นแบบ  Animation
การทำภาพ  Animation ( ตอนที่  3)   บทความนี้เป็นการทำภาพ  Animation  อีกรูปแบบหนึ่ง ที่ใช้หลักการในการเลื่อนภาพ  ( Move)  จากตำแหน่งหนึ่งไปยังอีกตำแหน่งหนึ่ง แล้วก็ทำได้ไม่ยากค่ะ
[object Object]
ขั้นตอนที่  1  อย่างแรกเลยก็คือ การเตรียมภาพ ในแต่ละ  Layer  โดยตามภาพที่  1  ที่มีการเตรียมไว้ก็คือ - Layer  ของภาพ กระทง - Layer  ของภาพพื้นหลังเป็น ท้องยามค่ำคืนและดวงจันทร์ - Layer  ของภาพ น้ำ  ( ที่ดูไม่เหมือนน้ำเท่าไหร่ หัวไม่ศิลปต้องขอโทษด้วยค่ะ ) - Layer  ของภาพ เอฟเฟคภาพแสงไฟ ระยิบระยับ มีประกาย   ( อันนี้ก็ทำออกมาไม่ค่อยได้เรื่องเท่าไหร่ ถือซะว่าเป็นไอเดียก็แล้วกันนะค่ะ ) เมื่อเตรียมภาพได้หมดแล้ว ก็ส่งภาพไปยังโปรแกรม โดยคลิกที่ด้านล่างของ  Tool box  ที่เป็นรูปของ  ImageReady
ขั้นตอนต่อมาให้เราสร้างเฟรม  2  เฟรมในพาเล็ต   Animation  สร้างเฟรมเพิ่มโดยการกดที่ตำแหน่ง  1  จากนั้นกำหนดให้เฟรมแรกภาพกระทงอยู่ขวามือ และเฟรมที่  2  ให้เลื่อน  Layer  กระทงให้กระทรงอยู่ซ้ายมือ  ( ดังภาพที่  2) จากนั้นให้คลิกที่เฟรมที่  2  และกดที่ตำแหน่งหมายเลข  2  เพื่อเปิดไดอะล็อก  Tween  และกำหนดค่าต่าง ๆ ตามภาพด้านล่าง จากนั้นคลิก   OK มาถึงขั้นนี้หากไม่มีอะไรผิดพลาดเมื่อคลิกที่ปุ่ม  Play  ก็จะแสดงภาพกระทงเลื่อนจากทางขวามาทางด้านซ้าย ซึ่งนั้นหมายความว่าเพื่อได้ทำเทคนิคนี้สำเร็จแล้วค่ะ และเพื่อความสมจริง ๆ จริง ๆ แล้วเราควรเลื่อนภาพทีละนิดแล้วใส่  Tween  ทีละช็อต ๆ เพื่อน ๆ ลองประบดูนะค่ะ ซึ่งจะทำให้ดูเลื่อนสมจริงขึ้น
 
ภาพสุดท้าย  Webmaster  ปรับให้มันค่อยเลื่อนที่ละนิด จากนั้นเมื่อเราทำครบทุกช็อตแล้ว เราก็มาปิด  -  เปิด  Layer  ที่เป็นแสงไฟเพื่อให้มันดูเหมือนมีการกระพริบแสงไฟค่ะ

More Related Content

What's hot

Flash8
Flash8Flash8
Gif Animation with Macromedia Fireworks
Gif Animation with Macromedia FireworksGif Animation with Macromedia Fireworks
Gif Animation with Macromedia Fireworks
Boonlert Aroonpiboon
 
งานนำเสนอ3
งานนำเสนอ3งานนำเสนอ3
งานนำเสนอ3monpooh
 
การแทรกภาพยนตร์ (หรือวิดีโอ)
การแทรกภาพยนตร์ (หรือวิดีโอ)การแทรกภาพยนตร์ (หรือวิดีโอ)
การแทรกภาพยนตร์ (หรือวิดีโอ)namfon140536
 
การสร้าง Animation จาก image ready
การสร้าง Animation จาก image readyการสร้าง Animation จาก image ready
การสร้าง Animation จาก image ready
myitimiizyin
 
การทำ Flash popup menu
การทำ Flash popup menuการทำ Flash popup menu
การทำ Flash popup menuAugusts Programmer
 
เปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscape
เปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscapeเปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscape
เปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscape
aucharapon theemcle
 
การทำ Flash popup menu v.2
การทำ Flash popup menu v.2การทำ Flash popup menu v.2
การทำ Flash popup menu v.2Augusts Programmer
 
การทำ Animation ต่างๆ
การทำ Animation ต่างๆการทำ Animation ต่างๆ
การทำ Animation ต่างๆAugusts Programmer
 

What's hot (17)

Lesson8
Lesson8Lesson8
Lesson8
 
การทำภาพAnimation
การทำภาพAnimationการทำภาพAnimation
การทำภาพAnimation
 
Lesson6
Lesson6Lesson6
Lesson6
 
Lesson8
Lesson8Lesson8
Lesson8
 
Flash8
Flash8Flash8
Flash8
 
Gif Animation with Macromedia Fireworks
Gif Animation with Macromedia FireworksGif Animation with Macromedia Fireworks
Gif Animation with Macromedia Fireworks
 
Lesson7
Lesson7Lesson7
Lesson7
 
งานนำเสนอ3
งานนำเสนอ3งานนำเสนอ3
งานนำเสนอ3
 
Lesson5
Lesson5Lesson5
Lesson5
 
การแทรกภาพยนตร์ (หรือวิดีโอ)
การแทรกภาพยนตร์ (หรือวิดีโอ)การแทรกภาพยนตร์ (หรือวิดีโอ)
การแทรกภาพยนตร์ (หรือวิดีโอ)
 
การสร้าง Animation จาก image ready
การสร้าง Animation จาก image readyการสร้าง Animation จาก image ready
การสร้าง Animation จาก image ready
 
การทำ Flash popup menu
การทำ Flash popup menuการทำ Flash popup menu
การทำ Flash popup menu
 
Logo web
Logo webLogo web
Logo web
 
เปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscape
เปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscapeเปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscape
เปลี่ยน พื้นหลังให้รูปภาพด้วยโปรแกรมฟรีแวร์ Photoscape
 
การทำ Flash popup menu v.2
การทำ Flash popup menu v.2การทำ Flash popup menu v.2
การทำ Flash popup menu v.2
 
การแต่งภาพด้วยPhoto scape
การแต่งภาพด้วยPhoto scapeการแต่งภาพด้วยPhoto scape
การแต่งภาพด้วยPhoto scape
 
การทำ Animation ต่างๆ
การทำ Animation ต่างๆการทำ Animation ต่างๆ
การทำ Animation ต่างๆ
 

Viewers also liked

Recognition2010.01
Recognition2010.01Recognition2010.01
Recognition2010.01
chinafiedacan
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
แนะนำตัวค่ะ
แนะนำตัวค่ะแนะนำตัวค่ะ
แนะนำตัวค่ะwannasirial
 
Irsko
IrskoIrsko
Irsko
deathkiter
 
Danzas
DanzasDanzas
Danzas
LASTER20
 
Sixth Street Community Center Reporters Book
Sixth Street Community Center Reporters BookSixth Street Community Center Reporters Book
Sixth Street Community Center Reporters Book
sixthstreetcenter
 
Go Blog Yourself
Go Blog YourselfGo Blog Yourself
Go Blog Yourself
guesta55293
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์wannasirial
 
Documentos Corporativos en USA
Documentos Corporativos en USADocumentos Corporativos en USA
Documentos Corporativos en USA
RODRIGO AZPURUA
 
งานคู่
งานคู่งานคู่
งานคู่
wannasirial
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
การใช้Photoshop
การใช้Photoshopการใช้Photoshop
การใช้Photoshopwannasirial
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
La sierra fauna, flora, costumbres
La sierra fauna, flora, costumbresLa sierra fauna, flora, costumbres
La sierra fauna, flora, costumbres
LASTER20
 
Aplicación para Ciencias con RA, Chile
Aplicación para Ciencias con RA, ChileAplicación para Ciencias con RA, Chile
Aplicación para Ciencias con RA, Chile
soniacostadigital
 

Viewers also liked (18)

Recognition2010.01
Recognition2010.01Recognition2010.01
Recognition2010.01
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
แนะนำตัวค่ะ
แนะนำตัวค่ะแนะนำตัวค่ะ
แนะนำตัวค่ะ
 
Irsko
IrskoIrsko
Irsko
 
Danzas
DanzasDanzas
Danzas
 
Sixth Street Community Center Reporters Book
Sixth Street Community Center Reporters BookSixth Street Community Center Reporters Book
Sixth Street Community Center Reporters Book
 
11
1111
11
 
Go Blog Yourself
Go Blog YourselfGo Blog Yourself
Go Blog Yourself
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์
 
Documentos Corporativos en USA
Documentos Corporativos en USADocumentos Corporativos en USA
Documentos Corporativos en USA
 
123
123123
123
 
งานคู่
งานคู่งานคู่
งานคู่
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
การใช้Photoshop
การใช้Photoshopการใช้Photoshop
การใช้Photoshop
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
La sierra fauna, flora, costumbres
La sierra fauna, flora, costumbresLa sierra fauna, flora, costumbres
La sierra fauna, flora, costumbres
 
Aplicación para Ciencias con RA, Chile
Aplicación para Ciencias con RA, ChileAplicación para Ciencias con RA, Chile
Aplicación para Ciencias con RA, Chile
 

Similar to การทำภาพ Animation

คู่มือ Sony Vegus 7.0
คู่มือ Sony Vegus 7.0คู่มือ Sony Vegus 7.0
คู่มือ Sony Vegus 7.0
usanee31
 
คู่มือการใช้ Sony vegas 7
คู่มือการใช้  Sony vegas 7คู่มือการใช้  Sony vegas 7
คู่มือการใช้ Sony vegas 7
Vinz Primo
 
ใบงานที่ 28 การทำ wallpaper แนวสีสัน
ใบงานที่ 28 การทำ wallpaper แนวสีสันใบงานที่ 28 การทำ wallpaper แนวสีสัน
ใบงานที่ 28 การทำ wallpaper แนวสีสัน
Suda Sangtong
 
animation-gif-by-firework
animation-gif-by-fireworkanimation-gif-by-firework
animation-gif-by-firework
Boonlert Aroonpiboon
 
ใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอ
ใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอ
ใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอNimanong Nim
 
Vegas7 110907211826-phpapp01
Vegas7 110907211826-phpapp01Vegas7 110907211826-phpapp01
Vegas7 110907211826-phpapp01Aekapoj Poosathan
 
Namo webeditor 6
Namo webeditor 6Namo webeditor 6
ม้วนขอบภาพให้โค้งงอ
ม้วนขอบภาพให้โค้งงอม้วนขอบภาพให้โค้งงอ
ม้วนขอบภาพให้โค้งงอIvIy Alice
 
ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้
ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้
ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้
Suda Sangtong
 
Lesson6
Lesson6Lesson6
Lesson6
krunueng1
 
Lesson6
Lesson6Lesson6
Lesson6
krunueng1
 
Lesson8
Lesson8Lesson8
Lesson8
krunueng1
 
เครื่องมือและคำสั่งพื้นฐาน
เครื่องมือและคำสั่งพื้นฐานเครื่องมือและคำสั่งพื้นฐาน
เครื่องมือและคำสั่งพื้นฐานกชพร มณีพงษ์
 
สอนใช้ Lightroom เบื้องต้น
สอนใช้ Lightroom เบื้องต้นสอนใช้ Lightroom เบื้องต้น
สอนใช้ Lightroom เบื้องต้น
Natthapon Inhom
 
Manual Swish max3
Manual Swish max3Manual Swish max3
Manual Swish max3
Surapong Jakang
 
การทำ Photoshop cs3
การทำ Photoshop  cs3การทำ Photoshop  cs3
การทำ Photoshop cs3Suthida Srikiat
 
การทำ Photoshop cs3
การทำ Photoshop  cs3การทำ Photoshop  cs3
การทำ Photoshop cs3Suthida Srikiat
 

Similar to การทำภาพ Animation (20)

คู่มือ Sony Vegus 7.0
คู่มือ Sony Vegus 7.0คู่มือ Sony Vegus 7.0
คู่มือ Sony Vegus 7.0
 
คู่มือการใช้ Sony vegas 7
คู่มือการใช้  Sony vegas 7คู่มือการใช้  Sony vegas 7
คู่มือการใช้ Sony vegas 7
 
ใบงานที่ 28 การทำ wallpaper แนวสีสัน
ใบงานที่ 28 การทำ wallpaper แนวสีสันใบงานที่ 28 การทำ wallpaper แนวสีสัน
ใบงานที่ 28 การทำ wallpaper แนวสีสัน
 
คู่มือFlash
คู่มือFlashคู่มือFlash
คู่มือFlash
 
animation-gif-by-firework
animation-gif-by-fireworkanimation-gif-by-firework
animation-gif-by-firework
 
ใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอ
ใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอ
ใบความรู้ที่ 13 ม้วนขอบภาพให้โค้งงอ
 
Vegas7 110907211826-phpapp01
Vegas7 110907211826-phpapp01Vegas7 110907211826-phpapp01
Vegas7 110907211826-phpapp01
 
Namo webeditor 6
Namo webeditor 6Namo webeditor 6
Namo webeditor 6
 
ม้วนขอบภาพให้โค้งงอ
ม้วนขอบภาพให้โค้งงอม้วนขอบภาพให้โค้งงอ
ม้วนขอบภาพให้โค้งงอ
 
ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้
ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้
ใบงานที่ 27 การนำเอารูปร่างและรูปทรงของภาพมาออกแบบโลโก้
 
Lesson6
Lesson6Lesson6
Lesson6
 
Lesson6
Lesson6Lesson6
Lesson6
 
Lesson8
Lesson8Lesson8
Lesson8
 
เครื่องมือและคำสั่งพื้นฐาน
เครื่องมือและคำสั่งพื้นฐานเครื่องมือและคำสั่งพื้นฐาน
เครื่องมือและคำสั่งพื้นฐาน
 
สอนใช้ Lightroom เบื้องต้น
สอนใช้ Lightroom เบื้องต้นสอนใช้ Lightroom เบื้องต้น
สอนใช้ Lightroom เบื้องต้น
 
Flash7
Flash7Flash7
Flash7
 
swishmax2
swishmax2swishmax2
swishmax2
 
Manual Swish max3
Manual Swish max3Manual Swish max3
Manual Swish max3
 
การทำ Photoshop cs3
การทำ Photoshop  cs3การทำ Photoshop  cs3
การทำ Photoshop cs3
 
การทำ Photoshop cs3
การทำ Photoshop  cs3การทำ Photoshop  cs3
การทำ Photoshop cs3
 

More from wannasirial

การทำPhotoshop
การทำPhotoshopการทำPhotoshop
การทำPhotoshopwannasirial
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
งานประวัติส่วนตัว
งานประวัติส่วนตัวงานประวัติส่วนตัว
งานประวัติส่วนตัวwannasirial
 
การใช้photoshop
การใช้photoshopการใช้photoshop
การใช้photoshopwannasirial
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
การใช้ Action button
การใช้ Action buttonการใช้ Action button
การใช้ Action buttonwannasirial
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1wannasirial
 
แนะนำตัวน.ส.วรรณสิริ
แนะนำตัวน.ส.วรรณสิริแนะนำตัวน.ส.วรรณสิริ
แนะนำตัวน.ส.วรรณสิริwannasirial
 
งานคู่
งานคู่งานคู่
งานคู่wannasirial
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์wannasirial
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์wannasirial
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์wannasirial
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์wannasirial
 

More from wannasirial (16)

My resume
My resumeMy resume
My resume
 
Resume
ResumeResume
Resume
 
การทำPhotoshop
การทำPhotoshopการทำPhotoshop
การทำPhotoshop
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
My resume
My resumeMy resume
My resume
 
งานประวัติส่วนตัว
งานประวัติส่วนตัวงานประวัติส่วนตัว
งานประวัติส่วนตัว
 
การใช้photoshop
การใช้photoshopการใช้photoshop
การใช้photoshop
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
การใช้ Action button
การใช้ Action buttonการใช้ Action button
การใช้ Action button
 
งานนำเสนอ1
งานนำเสนอ1งานนำเสนอ1
งานนำเสนอ1
 
แนะนำตัวน.ส.วรรณสิริ
แนะนำตัวน.ส.วรรณสิริแนะนำตัวน.ส.วรรณสิริ
แนะนำตัวน.ส.วรรณสิริ
 
งานคู่
งานคู่งานคู่
งานคู่
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์
 
การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์การใช้เทคนิคกับแผ่นสไลด์
การใช้เทคนิคกับแผ่นสไลด์
 

Recently uploaded

โรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.ppt
โรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.pptโรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.ppt
โรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.ppt
pakpoomounhalekjit
 
Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...
Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...
Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...
NuttavutThongjor1
 
โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...
โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...
โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...
SweetdelMelon
 
bio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกัน
bio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกันbio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกัน
bio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกัน
CholapruekSangkamane1
 
กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”
กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”
กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”
Postharvest Technology Innovation Center
 
Recap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdf
Recap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdfRecap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdf
Recap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdf
NuttavutThongjor1
 

Recently uploaded (6)

โรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.ppt
โรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.pptโรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.ppt
โรคทางพันธุกรรมมมมมมมมมมมมมมมมมมมมมม.ppt
 
Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...
Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...
Fullstack Nest.js and Next.js.pdfFullstack Nest.js and Next.js.pdfFullstack N...
 
โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...
โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...
โครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิตโครงงานคณิต...
 
bio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกัน
bio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกันbio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกัน
bio62สอวน.ชีววิทยา-ชีววิทยาปี62-ข้อสอบแข่งกัน
 
กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”
กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”
กำหนดการ “การประชุมวิชาการวิทยาการหลังการเก็บเกี่ยวแห่งชาติ ครั้งที่ 21”
 
Recap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdf
Recap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdfRecap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdf
Recap JavaScript and TypeScript.pdf Recap JavaScript and TypeScript.pdf
 

การทำภาพ Animation

  • 1. การทำภาพ Animation ( ตอนที่ 1)
  • 2.
  • 3.
  • 4.  
  • 5.
  • 6.  
  • 7.
  • 8.  
  • 9.
  • 10. เอาละค่ะ ... ทีนี้ก็มาถึงขั้นตอนสุดท้ายกันแล้วละค่ะ นั้นก็คือการบันทึกภาพ Animation ซึ่งทำได้โดยการใช้คำสั่ง File --> Save Optimized As... จากนั้นเมื่อมีไดอะล็อกบ็อกปรากฏขึ้น ก็ให้เราตั้งชื่อไฟล์ค่ะ และที่สำคัญสั่งเกตที่ Save as type ให้เซฟเป็นสกุล . gif เท่านั้นค่ะ ภาพที่เราเซฟไปจึงจะแสดงผลการเล่นภาพเป็นแบบ Animation
  • 11. การทำภาพ Animation ( ตอนที่ 2)
  • 12.
  • 13.  
  • 14.
  • 15.
  • 16.
  • 17.  
  • 18.
  • 19. การทำภาพแบบนี้ถ้าหากต้องการให้สมูทสมจริง ก็ต้องใช้จำนวนเฟรมให้เยอะขึ้นค่ะ โดยในขั้นตอนการทำ Tween ก็อาจจะเพิ่มเฟรมจากเดิม 5 เป็นจำนวนที่เยอะขึ้นค่ะ การแสดงภาพก็จะช้าลงและดูสมูทมากยิ่งขึ้นค่ะ แต่ก็ไม่ควรจะมีจำนวนเฟรมเยอะเกินไป เพราะเมื่อขนาดเฟรมเพิ่มขึ้น ขนาดของไฟล์ก็จะเพิ่มมากขึ้นเช่นกันค่ะ ในที่นี้กำหนด Tween ให้เพิ่มเฟรมเป็น 5 เพื่อให้สังเกตจำนวนเฟรมในพาเล็ต Animation ได้ง่ายขึ้นค่ะ ... ลองทดลองปรับเปลี่ยนดูเองนะค่ะ ... ขั้นตอนสุดท้ายหากต้องการนำเฟรมไปใช้ ก็ให้บันทึกภาพ Animation ซึ่งทำได้โดยการใช้คำสั่ง File --> Save Optimized As... จากนั้นเมื่อมีไดอะล็อกบ็อกปรากฏขึ้น ก็ให้เราตั้งชื่อไฟล์ค่ะ และที่สำคัญสั่งเกตที่ Save as type ให้เซฟเป็นสกุล . gif เท่านั้นค่ะ ภาพที่เราเซฟไปจึงจะแสดงผลการเล่นภาพเป็นแบบ Animation
  • 20. การทำภาพ Animation ( ตอนที่ 3) บทความนี้เป็นการทำภาพ Animation อีกรูปแบบหนึ่ง ที่ใช้หลักการในการเลื่อนภาพ ( Move) จากตำแหน่งหนึ่งไปยังอีกตำแหน่งหนึ่ง แล้วก็ทำได้ไม่ยากค่ะ
  • 21.
  • 22. ขั้นตอนที่ 1 อย่างแรกเลยก็คือ การเตรียมภาพ ในแต่ละ Layer โดยตามภาพที่ 1 ที่มีการเตรียมไว้ก็คือ - Layer ของภาพ กระทง - Layer ของภาพพื้นหลังเป็น ท้องยามค่ำคืนและดวงจันทร์ - Layer ของภาพ น้ำ ( ที่ดูไม่เหมือนน้ำเท่าไหร่ หัวไม่ศิลปต้องขอโทษด้วยค่ะ ) - Layer ของภาพ เอฟเฟคภาพแสงไฟ ระยิบระยับ มีประกาย ( อันนี้ก็ทำออกมาไม่ค่อยได้เรื่องเท่าไหร่ ถือซะว่าเป็นไอเดียก็แล้วกันนะค่ะ ) เมื่อเตรียมภาพได้หมดแล้ว ก็ส่งภาพไปยังโปรแกรม โดยคลิกที่ด้านล่างของ Tool box ที่เป็นรูปของ ImageReady
  • 23. ขั้นตอนต่อมาให้เราสร้างเฟรม 2 เฟรมในพาเล็ต Animation สร้างเฟรมเพิ่มโดยการกดที่ตำแหน่ง 1 จากนั้นกำหนดให้เฟรมแรกภาพกระทงอยู่ขวามือ และเฟรมที่ 2 ให้เลื่อน Layer กระทงให้กระทรงอยู่ซ้ายมือ ( ดังภาพที่ 2) จากนั้นให้คลิกที่เฟรมที่ 2 และกดที่ตำแหน่งหมายเลข 2 เพื่อเปิดไดอะล็อก Tween และกำหนดค่าต่าง ๆ ตามภาพด้านล่าง จากนั้นคลิก OK มาถึงขั้นนี้หากไม่มีอะไรผิดพลาดเมื่อคลิกที่ปุ่ม Play ก็จะแสดงภาพกระทงเลื่อนจากทางขวามาทางด้านซ้าย ซึ่งนั้นหมายความว่าเพื่อได้ทำเทคนิคนี้สำเร็จแล้วค่ะ และเพื่อความสมจริง ๆ จริง ๆ แล้วเราควรเลื่อนภาพทีละนิดแล้วใส่ Tween ทีละช็อต ๆ เพื่อน ๆ ลองประบดูนะค่ะ ซึ่งจะทำให้ดูเลื่อนสมจริงขึ้น
  • 24.  
  • 25. ภาพสุดท้าย Webmaster ปรับให้มันค่อยเลื่อนที่ละนิด จากนั้นเมื่อเราทำครบทุกช็อตแล้ว เราก็มาปิด - เปิด Layer ที่เป็นแสงไฟเพื่อให้มันดูเหมือนมีการกระพริบแสงไฟค่ะ