ขั้นตอนการทำภาพด๊อกแด๊กๆค่า


          สวัสดีค่ะ บันทึกนี้สืบเนื่องมาจาก พี่ครูอรวรรณคนน่ารัก ค่ะ อิอิ

          เริ่มต้นมาจาก หนึ่งนำไฟล์ gif. หัวด๊อกแด๊กๆ มาลง พี่ครูอรวรรณชอบใจ หนึ่งสัญญาว่าจะสอนวิธีทำไฟล์ gif. ให้ค่ะ เลยมาเขียนบันทึกนึ้ขึ้น

          จริงๆหนึ่งไม่ใช่ผู้เชี่ยวชาญในการใช้ photoshop เท่าไหร่ค่ะ คงเล่าให้ฟังเท่าที่หนึ่งเข้าใจและทำรูปหัวด๊อกแด๊กๆ นี้ละกันนะคะ ^__^ หากใครมีข้อแนะนำ แลกเปลี่ยนกันได้เลยนะคะ

          ขอบคุณตี๋น้อย (น้องโสตฯศูนย์มะเร็งอุดรฯ)ด้วยนะคะที่สอน และแนะนำการใช้ photoshop อย่างอดทน อิอิ

เริ่มเลยนะคะ

ขั้นตอนแรก

          เลือกรูปที่เราต้องการจะนำมาทำเป็นไฟล์ gif. ค่ะ เทคนิคการเลือกรูปคือเลือรูปที่เห็นหน้าชัดๆ ตัวอาจเต็มหรือครึ่งตัวก็ได้ค่ะ ในที่นี้หนึ่งเลือกรูปมา 2 รูป รูปแรกคือเห็นเต็มๆหน้า ชัดๆ เพื่อจะตัดเฉพาะส่วนหัวค่ะ แล้วเลือกอีกรูปที่เห็นเต็มตัว เพื่อจะตัดเฉพาะส่วนตัว (แล้วแต่เราจะเลือกท่าทางตามชอบใจเลยค่ะ ไม่ต้องคิดมากเพราะเราจะทำเป็นตัวการ์ตูน หัวโตๆ ตัวเล็กๆ อิอิ อาจใช้รูปเดียวเลยก็ได้ค่ะ หรือใช้สองรูปแบบหนึ่งก็ได้) เมื่อได้รูปที่ต้องการแล้ว เปิด photoshop ขึ้นมาเลยค่ะ ลากรูปที่เราเลือกมาลง

ขั้นตอนที่ 2

          เปิดเอกสารใหม่ขึ้นมาอีก 1 หน้าค่ะ แล้วแต่ความชอบเลยนะคะว่าต้องการให้พื้นหลังของภาพใหม่เราเป็นสีขาว หรือสีอะไร หรือจะเอาเป็นภาพวาดที่เราชอบ หรืออะไรก็ได้ค่ะในที่นี้หนึ่งเลือก BG เป็นพื้นสีน้ำเงินค่ะ

ขั้นตอนที่ 3

          เมื่อได้เอกสาร BG แล้ว เตรียมลงมือตัดรูปที่เลือกไว้ได้เลยค่ะ โดยคลิกที่รูปที่เราจะตัดให้ขึ้นมาอยู่บนสุด สังเกตตรงด้านขวามือนะคะ จะมีรูปที่เราจะใช้อยู่ในนั้น เราจะได้ไม่หลงว่าเรากำลังจัดการกับเอกสารไหนอยู่ค่ะ

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

          เมื่อตัดรูป (ลากรูปจนมาบรรจบกันแล้ว)ให้เราเลือก move ตามรูปเลยค่ะ (เทคนิคการตัดรูปส่วนตัวนะคะ ให้ตัดส่วนคอให้ยาวขึ้นไปซักนิดค่ะ เพราะเวลาเราตัดส่วนหัวมาต่อแล้วจะได้เนียนๆ อิอิ ไม่งั้นจะเห็นช่องว่างได้ค่ะ)

          จากนั้นใช้เมาส์ลากส่วนตัวที่เราตัดไว้มาลงในเอกสาร BG ที่เราเตรียมเปิดไว้แล้วได้เลยค่ะ จะได้ดังรูป

ขั้นตอนที่ 4

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

          เรียบร้อยก็ลากมาลงในเอกสาร BG ที่เตรียมไว้ค่ะ เมื่อลงในเอกสารเรียบร้อย ให้ปรับขนาดของตัวให้เล็ก ปรับส่วนหัวให้โตตามชอบใจได้เลยค่ะ แล้วลากมาต่อกัน

          เมื่อเราต่อส่วนหัวและตัวได้มุมที่เราต้องการแล้ว ให้เซฟค่ะ เลือก file => save as =>ตั้งชื่อไฟล์ เก็บเอาไว้ก่อนในรูปแรกอาจปรับให้มุมองศาของส่วนหัวเราตรงๆธรรมดาก็ได้ค่ะ เสณ้จแล้วเราก็มาคลิกตรงส่วนหัวอีกครั้ง แล้วปรับเอียงไปด้านซ้าย องศาที่เราต้องการค่ะ ปรับตำแหน่งให้เหมาะสม แล้วเซฟอีกครั้ง ตั้งชื่อให้ต่างจากรูปแรกนะคะ แล้วรูปที่ 3 ก็เช่นกัน เอียงคอไปซ้ายแล้วก็ต้องขวาด้วยนะคะ ตามใจชอบได้เลยค่ะ แล้วเซฟไว้

ขั้นตอนที่ 5

           เมื่อเราได้ภาพที่พอใจทุกองศาแล้ว (ในที่นี้หนึ่งเซฟไว้สามรูปค่ะ คือหัวตรง เอียงคอซ้าย เอียงคอขวา) ก็เปิดกล่องที่เราเซฟรูปไว้เมื่อกี้นะคะ แล้วลากมาลงใน photoshop ทั้ง 3 รูปเลยค่ะ

 

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

แล้วจัดให้ขอบซ้อนกันพอดีค่ะ ให้สังเกตตรงด้านขวามือ จะเห็นว่ารูปที่เราลากมาลงมี 2 รูปซ้อนกันอยู่ที่รูปหลักนะคะ

ลากรูปที่สามมาลงต่อได้เลยค่ะ แล้วจัดขอบให้ซ้อนกันพอดี

ขั้นตอนที่ 6

          เมื่อเราได้รูปหลักที่มี 3 รูปซ้อนกันแล้ว ให้เลือกที่ jump ตามรูปเลยค่ะ แล้วจะเปิดมาอีกหน้านึง

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

ต่อไปกำหนดเวลาค่ะ ว่าจะให้เห็นรูปนี้กี่วินาที

ตามชอบเลยค่ะ

แง้วๆๆๆ... เที่ยงคืนแล้ว ไม่คิดว่าบันทึกจะยาวขนาดนี้

ใกล้สำเร็จเป็นไฟล์ gif. หัวด๊อกแด๊กๆแล้วนะคะ เดี๋ยวพรุ่งนี้จะมาเล่าต่อให้จบค่ะ

 

มาต่อกันเลยดีกว่าค่ะ ^___^

เมื่อคืนหนึ่งเล่าถึงขั้นตอนการทำให้ภาพเคลื่อนไหวได้แล้วใข่ป่าวคะ เริ่มกำหนดเวลาของแต่ลบะภาพได้เลยค่ะ เลือกตรงตำแหน่งตามรูปได้เลยนะคะ ในที่นี้หนึ่งกำหนดให้แต่ละรูปใช้เวลา 5 วินาทีค่ะ

เมื่อเลือกกำหนดความเร็วของรูปแรกแล้วให้เราเปิดรูปต่อไปโดยเลือกตรงปุ่ม new frame ตามรูปเลยนะคะ รูปนี้จะเป็นรูปที่ 2 ที่เราจะเห็นเวลาเคลื่อนไหวค่ะ เมื่อเปิด new frame มาใหม่ จะเห็นว่ารูปที่เปิดมาใหม่กับความเร็วที่ตั้งไว้นั้น เป็น copy มาจากรูปแรกเลยค่ะ เราก็จัดการเปลี่ยนรูปให้เป็นรูปที่ 2 ได้เลยค่ะ

โดยคลิกตรงรูปดวงตาตามรูปเลยนะคะ ให้ดวงตาหน้ารูแปรกหายไป และสังเกตตรง frame ที่ 2 ตรงกล่อง animation ด้วยค่ะ ว่ารูปเปลี่ยนไปหรือยัง ถ้าเปลี่ยนเรียบร้อย ให้เปิด new frame ที่ 3 ได้เลยค่ะ และคลิกที่ดวงตาหน้ารูปที่ 2 ออกเพื่อให้โชว์เป็นหน้ารูปที่ 3

เมื่อได้ครบ 3 รูปใน frame animation แล้ว ให้ลองกด play ดูนะคะ

ทีนี้เราจะพบว่า จังหวะของรูปมันยังกระโดดอยู่ ให้เพิ่ม frame ที่ 4 อีกหนึ่ง frame ค่ะ และเลือกให้เป็นรูปหน้าตรงค่ะ (จะเห็นว่า รูปที่ 1 เอียงคอไปทางซ้าย รูปที่ 2 หน้าตรง รูปที่ 3 เอียงคอไปทางขวา และเติมรูปที่ 4 ให้เป็นหน้าตรง จะกำลังพอดีค่ะ ^___^) แล้วลองกด play ดูอีกครั้ง เมื่อ OK แล้ว ทำการเซฟค่ะ

ขั้นตอนสุดท้าย ทำการเซฟให้เป็นไฟล์ gif.

ขั้นตอนการเซฟสำคัญมากค่ะ ถ้าเรา save as รูปที่เราอุตส่าห์ทำมาแสนลำบากนี้ก็จะได้เป็นแค่ภาพนิ่งธรรมด๊าธรรมดา ค่ะ เราต้องเลือก save optimized as.. ค่ะแล้วตั้งชื่อไฟล์ได้เลยค่ะ

เรียบร้อยให้เราตามเข้าไปเช็คดูอีกทีค่ะว่าไฟล์ที่เราเซฟไว้นั้น เป็นภาพเคลื่อนไหวหรือไม่

สำเร็จเรียบร้อย ปิดหน้า photoshop ได้ค่ะ อิอิ ถ้ายังไม่เป็นภาพเคลื่อนไหวให้เราย้อนกลับไปดูตรงขั้นตอนการเซฟอีกครั้งนะคะ แล้วเซฟใหม่ค่ะ อย่าเพิ่งรีบปิด photoshop เดี๋ยวจะเศร้าใจเหมือนหนึ่ง เพราะตอนหนึ่งหัดทำใหม่ๆ ชอบหลงลืมเซฟเป็น save as ธรรมดาทุกทีค่ะ อิอิ

ลองทำดูนะคะ สนุกดี ได้รูปออกมาเป็นตัวการ์ตูน ด๊อกแด๊กๆๆ แล้วแต่เราจะออกแบบเลยค่า

          ครั้งหน้าหนึ่งจะมาเล่าวิธีการทำไฟล์ gif. กรณีเรามีรูปเพียงรูปเดียว นะคะ (รูปเดียวก็เคลื่อนไหวได้ค่ะ ประมาณ ขยิบตา จูจุ๊บ อะไรแบบนี้อ่ะค่าอิอิ) ข้างล่างนี้คือรูปตัวอย่าง อิอิ ทำไว้ใส่เป็นภาพ contact ของเพื่อนๆ เวลาโทรเข้ามือถือเราก็ได้นะคะ แต่คงต้องทำไฟล์เล็กๆหน่อยค่ะ

ขอให้สนุกกะการทำ ไฟล์ gif. นะคะ ^____^

หมายเลขบันทึก: 303762เขียนเมื่อ 7 ตุลาคม 2009 00:06 น. ()แก้ไขเมื่อ 6 กันยายน 2013 21:40 น. ()สัญญาอนุญาต: ครีเอทีฟคอมมอนส์แบบ แสดงที่มา-ไม่ใช้เพื่อการค้า-อนุญาตแบบเดียวกันจำนวนที่อ่านจำนวนที่อ่าน:


ความเห็น (16)

น้องหนึ่งคะ

พี่ครูต้อยมาเรียนรู้ด้วยคนค่ะ

จะหาเวลาว่างทำเล่นสักรูป คงตลกดี

หากทำสำเร็จเมื่อไหร่จะเอามาฝากค่ะ

ขอบคุณค่ะ

มาเรียนรู้ด้วยครับ ขอบคุณครับ

สวัสดีค่ะพี่ครูต้อย

ลองทำเล่นดูนะคะ น่ารักๆๆดีค่า อิอิ

รอดูผลงานชิ้นแรกของพี่ครูต้อยนะค้า ^___^

สวัสดีค่ะอาจารย์ JJ

อาจารย์เปลี่ยนรูป หนึ่งเกือบจำไม่ได้ค่ะ อิอิ

ขอบคุณที่แวะมาทักทายค่า ^__^

   ขอบคุณมากค่ะ..ภาพนี้ยืมมาแสดงค่ะ

สวัสดีค่ะพี่นงนาท สนธิสุวรรณ

ขอบคุณที่แวะมาทักทายค่า ^__^

ปล.ภาพไม่โชว์ค่ะ

สวัสดีค่ะ น้องหนึ่ง

เพิ่งกลับมาจากตรัง-นครศรีธรรมราชค่ะ

ปลื้มมากๆ  ที่น้องหนึ่งไปเยี่ยม Goto Laos3 แล้วม่ภาพไปแจม

และยิ่งปลื้มมากๆ  ที่น้องหนึ่งลงทุน (จนถึงเที่ยงคืน) เปิดบันทึก หัวด๊อกแด๊ก ๆๆๆ ให้

น่ารักมากๆๆ  แต่ติดเอาไว้แล้วจะเข้ามาศึกษานะคะ

แบบว่าหัวช้าค่ะ  อิอิ

สวัสดีค่ะพี่ครูอรวรรณ

ว้าวๆๆๆ ไปใต้มาเหรอคะ ทางใต้เป็นไงบ้างคะ ทริปนี้สนุกป่าวคะ

อย่างนี้ต้องมีบันทึกตรัง-นครศรีธรรมราชแน่ๆ รออ่านๆๆค่า ^____^

ปล.รอดูผลงานภาพด๊อกแด๊กๆๆของพี่ครูอรวรรณด้วยนะค้า

โอ้โห! น้องหนึ่ง บันทึกนี้แจ่มมากๆ สงสัยมานานแล้วว่าทำยังไง ;-)

พี่นำการบ้านข้อใหม่มาฝากครับ ผีเสื้อปีกโค้ง

                    

       ดาวน์โหลดไฟลนี้ไปได้เลย : แบบพับผีเสื้อ (ปีกโค้ง) พี่ถ่ายภาพเองนะเนี่ย ;-)

ถ้าสนใจก็ลองได้เลยคร้าบ!

สวัสดีค่ะพี่ชิว

ขอบคุณค่า ^___^ ลองทำไฟล์ gif. ก็สนุกดีนะคะ อิอิ

ปล.การบ้านผีเสื้อปีกโค้งเหรอคะ

จะรีบทำส่งทันทีค่า อิอิ

ดูอย่างเดียวครับ..

ไม่ทำตามหรอก..55

สวัสดีค่ะคุณ pisitssru

อิอิ ขอบคุณที่แวะมาทักทายค่า

ว่าแต่จะไม่ลองทำดูเหรอคะ

ถ้าลองทำแล้วได้ผลเป็นไงส่งข่าวด้วยนะค้า

รอชมผลงานด้วยค่า อิอิ ^___^

สวัสดีคะพี่สาว

พอลล่าไม่มี photoshop ค่ะ ทำไงดีคะ อิอิ

สวัสดีค่ะน้องพอลล่าที่น่ารัก

กรณีไม่มี photoshop ก็คงต้องดาวโหลดมาลงก่อนนะค้า อิอิ

ม่ายงั้น คงทำไม่ได้ตั้งแต่ขั้นตอนแรกเลยค่า ^____^

ประทับใจ บันทึกนี้จัง

..

ไม่ใช่บอกเล่าเก้าสิบ แล้วครับ

บอกเล่ากันร้อย สองร้อยแล้ว

บอกวิธีทำและแสดงให้เห็น แบบนี้แหละ รู้แจ้ง เห็นจริง

..

อ่านแล้วทำเอง ง่ายมาก

แต่คนนำเสนอซิ เก่งสุด ทั้งทำไปด้วย copy ภาพด้วย พิมพ์ขั้นตอน ใส่ภาพ/จุดที่เน้น

สุดยอด

..

เสนอ ครับ

แนะนำวันละ คำสั่ง/เทคนิค

สิ้นปี รวมเล่มขาย

..ทำดี มีรวย ครับ

สวัสดีค่ะคุณตาหยู

แหมๆๆๆ ขอบพระคุณมากๆๆค่า

หนึ่งตัวลอยไปชนเพดานแล้วอ่ะค่า อิอิ

ว่าแต่คุณตาหยูลองทำแล้วอย่าลืมนำผลงานภาพด๊อกแด๊กๆมาให้ชื่นชมด้วยนะค้า ^___^

ปล.งั้นบันทึกต่อไปจะรีบปั่นเร็วๆนี้เลยค่า ขอบคุณค่า ^____^

พบปัญหาการใช้งานกรุณาแจ้ง LINE ID @gotoknow
ClassStart
ระบบจัดการการเรียนการสอนผ่านอินเทอร์เน็ต
ทั้งเว็บทั้งแอปใช้งานฟรี
ClassStart Books
โครงการหนังสือจากคลาสสตาร์ท