-- LET IT GIF -- เทคนิคสร้าง GIF เก๋ๆ...Update : ขยับหัว ด๊อกแด๊ก [Ps]
nicoooki
#1
12-10-2017 - 22:20:01

#1 nicoooki  [ 12-10-2017 - 22:20:01 ]





-- LET IT GIF --



*UPDATE 7/11/2017.............




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

ต้องบอกไว้ก่อนว่า ผมรู้เรื่อง Photoshop น้อยมาก และเทคนิคหลายๆอย่างก็เกิดจากการลองมั่วๆเอา อาจจะใช้คำศัพท์แปลกไปบ้างนะครับ
แต่ผมจะพยายามอธิบายตามความเข้าใจของตัวเอง และใช้คำพูดให้เข้าใจง่ายต่อการทำ GIF นะครับ

ถ้าเกิดมีคนสนใจ วันหลังจะมาแชร์เทคนิคการทำภาพเคลื่อนไหวในส่วนอื่นๆอีก
หวังว่าสักวันจะได้เห็นละครซิมที่ภาพขยับได้นะครับ




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



-------------------------------------------------------------------------




กระพริบตา ปิ้งๆ เรปที่ #1
*อัปเดตเรื่องขนตา
*อัปเดตเรื่องการเซฟ



ผมพริ้ว ปลิวตามลม เรปที่ #10



Moving Your Head เรปที่ #19




-------------------------------------------------------------------------




เทพ 3 ฤดู เลยทีเดียว 5555












จำนวนของเฟรม กับการเคลื่อนไหว


การเคลื่อนไหวในแต่ละ GIF จะมีจำนวนเฟรมที่แตกต่างกันไปขึ้นอยู่กับว่าเราต้องการให้ GIF นั่นเคลื่อนไหวมากน้อยขนาดไหน
ซึ่งปกติผมตั้งค่าความเร็วเฟรมเป็น 0.1 นั่นก็คือ 10 เฟรมจะเท่ากับเวลา 1 วินาที

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

การเคลื่อนไหวอื่นๆที่วนลูป จึงเป็นส่วนสำคัญที่ทำให้ GIF ของเราดูต่อเนื่อง

จำนวนเลเยอร์คือ เลเยอร์ที่เราทำการวาดให้ส่วนนั้นๆมันเคลื่อนไหว
อย่างเช่นหลับตา มีทั้งหมด 3 เลเยอร์ คือเลเยอร์ตั้งต้น และที่เราวาดเพิ่มให้ขยับอีก2 เลเยอร์

สมมุติว่า เฟรมของ GIF เรา มีทั้งหมด 8 เฟรม แล้วเราต้องการให้การเคลื่อนไหวในรูป วนไปเรื่อยๆไม่สะดุด
เลเยอร์ของคุณ ต่อ 1 การเคลื่อนไหว ต้องมีจำนวน 2 3 หรือ 5 เลเยอร์เท่านั้น และเลเยอร์แรกกับเลเยอร์สุดท้ายต้องต่อกันพอดี
ค่าตายตัวของจำนวนเลเยอร์ที่สามารถวนลูปจะต่างกันไปตามจำนวนเฟรมนะครับ


เช่น









อันนี้เป็นสัดส่วนคร้าวๆ ที่สามารถทำให้ GIF ของคุณเล่นไปเรื่อยๆไม่มีสะดุด
จากที่ผมใช้ทำ GIF มานะครับ ลองเอาไปปรับใช้กันดู

GIF 8 เฟรม จำนวนเลเยอร์ต้องเป็น 2 3 5
GIF 10 เฟรม จำนวนเลเยอร์ต้องเป็น 2 4 6
GIF 12 เฟรม จำนวนเลเยอร์ต้องเป็น 2 3 4 7
GIF 14 เฟรม จำนวนเลเยอร์ต้องเป็น 2 8












----------------------------------------------------------------------------------




กระพริบตา ปิ้งๆ




----------------------------------------------------------------------------------






เทคนิคการทำ GIF กระพริบตาของผมคือการวาดขึ้นมาใหม่ซึ่งไม่ยากอย่างที่คิด
ส่วนขนตา สำหรับคนที่ขี้เกียจวาดสามารถหาโหลด Brush ขนตาได้ตามเว็บเลยครับ
(เรื่องขนตาผมจะมาอัพเดตเพิ่มให้ทีหลังนะครับ)













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






.
.
.
.
.
หลังจากแต่งรูปน้องซิมเสร็จตามที่เราต้องการแล้ว เราจะมาเริ่มวาดตา

1. ให้เราสร้างเลเยอร์ใหม่ขึ้นมา เป็นเลเยอร์เปล่าๆ
2. จากนั้นใช้ Eyedropper Tool เลือกเฉดสีในบริเวณตาที่เราจะทำการวาด
3. เลือกหัวพู่กันปรับขนาดให้เหมาะสมกับการวาด







เพื่อความเนียน ในการหลับตา 1 ครั้ง ผมจะใช้การเคลื่อนไหว 2 เฟรม ถ้าอยากให้ตากระพริบช้าลงก็ทำเป็น 3 หรือ 4 เฟรมได้ครับ
โดยเฟรมแรก ให้เราทำการวาดให้ตาหลับลงไปครึ่งนึงในเลเยอร์เปล่าที่เราสร้างขึ้นมาก่อน

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








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








เมื่อเก็บรายละเอียดของตาจนพอใจแล้ว
เราจะมาเริ่มในส่วนของการทำ GIF กันนะครับ
โดยคลิกเลือก Window > Timeline
แล้วคลิก Create Video Timeline









ถ้าขึ้นเป็น video timeline แบบนี้ ให้เราคลิกเปลี่ยนเป็น frame animation










จะได้หน้าต่างแบบนี้ขึ้นมาจากนั้นเพื่อความสมูทให้ตั้งค่าความเร็วเป็น 0.1 seconds นะครับ
(นั่นก็หมายถึง 10 เฟรมจะเท่ากับ 1 วินาที)
แล้วเลือกให้เป็น Foever เพื่อให้ภาพวนลูป

จากนั้นกดซ่อนเลเยอร์ตา 2 เลเยอร์ที่เราวาดไว้
แล้วคลิกก๊อปปี้เฟรม โดยครั้งนี้ผมจะใช้ทั้งหมด 8 เฟรม ก็คือ
หลับตา 2 เฟรม
ลืมตา 2 เฟรม
ส่วนที่เหลือ 4 เฟรมผมจะเว้นไว้ให้ซิมซ์ลืมตา น้องซิมซ์จะได้ไม่กระพริบตารัวจนเกินไป และเว้นไว้เพื่อใส่การเคลื่อนไหวของส่วนอื่นๆด้วย

เฟรมแรกให้ซ่อนเลเยอร์ที่เราวาดเปลือตาทั้งหมด ให้เป็นภาพลืมตาปกติ
เฟรมที่ 2 กดเปิดเลเยอร์ที่เราวาดไว้ครึ่งตา
เฟรมที่ 3 กดเปิดเลเยอร์ที่เราวาดไว้ครึ่งตา และตอนหลับตา
เฟรมที่ 4 กดเปิดเลเยอร์ที่เราวาดไว้ครึ่งตา เป็นการรีเวิสกลับเพื่อที่จะทำให้ เป็นการลืมตา
เฟรมที่ 5-8 ผมเว้นไว้ให้เป็นภาพลืมตาเพื่อที่จะได้เว้นช่วงนิดนึง

ลองกดปุ่ม Play เช็คดูว่าการเคลื่อนไหวสมูทดีรึเปล่า





ต่อไปทำการเซฟเป็น GIF โดยการคลิกที่ File > Save for web...
จะได้หน้าต่างแบบนี้ขึ้นมา ให้เลือกเซฟเป็นไฟล์ GIF นะครับ

ปรับ ขนาดภาพ และค่าสีตามความต้องการเลย ยิ่งค่าของสีเยอะ ภาพก็จะยิ่งสวย แต่นั้นก็จะทำให้ไฟล์ใหญ่ตามไปด้วย
ถ้าต้องการโพสในบอร์ด thaithesims4 พยายามเซฟภาพไม่ให้น้ำหนักเกิน 1.50 MB นะครับเพราะถ้าเกินจะอัพขึ้นเว็บไม่ได้
ในกรณีที่เราใส่เอฟเฟคเยอะมากจนขนาดไฟล์ใหญ่เกินไป ให้เราลดค่าสี และปรับขนาดของภาพลง จะช่วยให้ไฟล์ภาพของเราเล็กลงครับ
เมื่อปรับค่าได้ตามที่เราต้องการแล้วก็ กด save เลย เราก็จะได้ภาพหนุ่มน้อยกระพริบตาปิ้งๆมา



.
.
.
.
.
.
.
.
.
.
.
.
.









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















---------------------------------------------------------------------------------------------------------------------








*อัปเดตเรื่อง ขนตา



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

ถ้าใครถนัดวาดก็โชว์ฝีมือเต็มที่เลยใคร แต่สำหรับวิธีลัดง่ายๆก็คือให้ ไปโหลด Brush ขนตามา
ผมแนะนำว่าให้หาบรัชที่มีขนตาตอนหลับตาด้วยจะง่ายต่อการทำครับ

โดยวันนี้ผมใช้ตัวนี้ครับ

http://www.mediafire.com/file/7v70zo593f39gz4/Pinceles+-+Pesta%C3%B1as+Postizas.rar


.


คลิปตอนทำครับ ดูประกอบไปกับคำอธิบายนะครับ




.


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

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









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









เฟรมสุดท้ายให้เลือกขนตาตอนหลับตาแล้ววาดลงไป
ความยาวและความหนา ต้องดูสอดคล้องกับตอนลืมตาด้วยนะครับ







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









---------------------------------------------------------------------------------------------------------------------






* Save GIF ให้ได้ภาพที่สีสวยตรงกับใน Photoshop



ปกติแล้วเวลาเรากด save for web... มันจะขึ้นมาเป็นโหมด optimized

ซึ่งคือโหมดที่ลดค่าสี ค่าความละเอียดในส่วนต่างๆลงให้เหมาะสมกับการเซฟเป็น GIF
นั่นจึ่งทำให้ไฟล์ GIF ของเราไม่ใหญ่จนเกินไป และเรายังสามารถปรับลดค่าสี และ เปอร์เซ็นของ dither ลงได้อีกด้วย
(ในโหมด Original ไม่สามารถลดตรงนี้ได้)

แต่ในบางครั้งสีของ GIF ที่ออกมาก็จะเพี้ยนเกินกว่าที่ตัวเราจะรับได้
ถ้าหากต้องการภาพ GIF ที่สี และความชัดตรงตามใน Photoshop
ให้คุณกดเลือกที่โหมด Original แล้วทำการเซฟ ซึ่งนั่นจะทำให้ขนาดของไฟล์ GIF ใหญ่มาก ถึงแม้จะลดขนาดภาพให้เล็กลงแล้วก็ตาม

โดยส่วนตัวแล้ว ผมคิดว่า optimized ก็พอแล้ว


ภาพด้านล่างคือ ความแตกต่างของ Original และ Optimized ที่มีค่าสีแตกต่างกันไป










*ข้อแนะนำนะครับ ถ้าภาพของคุณสีสว่างจ้าและมีเม็ดสีเยอะจนเกินไป ภาพจะสีแตกได้นะครับ GIF รับเม็ดสีได้แค่ 256
วิธีแก้คือ ลองปรับค่าสีให้ค่อยๆลดลงมาเรื่อยๆ จนกว่าภาพจะออกมาสวยนะครับ หรือ ตั้งขนาดภาพให้เล็กลงจะช่วยหลอกตาเรื่องเม็ดสีได้ครับ






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







แก้ไขล่าสุดเมื่อ 2017-11-07 08:37:40
porpar2541
-oyooy- black
Paoz Melody
aivyailada
Thanaphat Simer
leena 6014
baifern20150
shirukusm
queenhaha
mytomm
otsuchio
Siriwannaya
lucius22
deviluchi
verine
porpar2541
-oyooy- black
Paoz Melody
aivyailada
Thanaphat Simer
leena 6014
baifern20150
shirukusm
queenhaha
mytomm
otsuchio
Siriwannaya
lucius22
deviluchi
verine
DOBYUL


เห็นดาวตกนั่นไหม อธิษฐานเร็วเข้า...
porpar2541
#2
12-10-2017 - 22:30:54

#2 porpar2541  [ 12-10-2017 - 22:30:54 ]






ขอบคุณที่เอาเทคนิคดีๆมาแชร์น๊าาาาา ชอบรูปสุดท้ายผมพี่แกปลิวไสวมาก ใช้แชมพูอะไรคะ-----แค่กๆ

nicoooki
nicoooki


『S.R.101』
-oyooy- black
#3
12-10-2017 - 22:55:26

#3 -oyooy- black  [ 12-10-2017 - 22:55:26 ]





เป็นประโยชน์มากเลยค่ะ ดันๆ

nicoooki

Paoz Melody
#4
12-10-2017 - 23:01:43

#4 Paoz Melody  [ 12-10-2017 - 23:01:43 ]





ทริคนี้ดีมากเลยพี่นิคกี้ ขอบคุณที่แบ่งปันทริคนะฮะ ไว้ว่างๆจะลองฝึกทำบ้าง ><


nicoooki
nicoooki


22พฤศจิสมัครแกทแพทนะอย่าลืมม
ploy_piglet
#5
12-10-2017 - 23:30:31

#5 ploy_piglet  [ 12-10-2017 - 23:30:31 ]




ชอบบบบบบบบบบบ

nicoooki


ศึกษาการทำละครอย่างจริงจัง
aivyailada
#6
12-10-2017 - 23:46:26

#6 aivyailada  [ 12-10-2017 - 23:46:26 ]






ขอบคุณสำหรับเทคนิคดีๆค่าา แต่น่าจะใช้เวลาทำนานน่าดูเลยนะเนี่ย //ปาดเหงื่อ

นับถือความอดทนจขกท.เลยค่ะ ถ้าเป็นเราคงท้อตั้งแต่ทำตากระพริบแล้ว5555

nicoooki
nicoooki


อยากลงกิจง่ะ ;-;
Thanaphat Simer
#7
13-10-2017 - 06:18:59

#7 Thanaphat Simer  [ 13-10-2017 - 06:18:59 ]





กระทู้ไม่นกเเล้ว
รอวิธีทำฉากหลังอยู่ครับ
ทำให้หมดไปเลยก็ได้ครับ

ลองทำเเล้ว
เป็นยังไงบ้างครับ




แก้ไขล่าสุดเมื่อ 2017-10-13 06:53:06
nicoooki
nicoooki


อัพซิมส์ทุกวันเสาร์ ใช้ Psได้อยู่ (ดาวใกล้หมด T T)
leena 6014
#8
13-10-2017 - 10:39:49

#8 leena 6014  [ 13-10-2017 - 10:39:49 ]







ขอบคุณค่าสำหรับเทคนิคดีๆแบบนี้ รีบเก็บกระทู้เลย

nicoooki
nicoooki


เคลียกิจหมด เซบาย//ไม่ว่างยาวๆ-.,-
baifern20150
#9
13-10-2017 - 15:44:33

#9 baifern20150  [ 13-10-2017 - 15:44:33 ]






ดีงาม ขอบคุณที่มาแชร์น้า
อยากทำอยู่เหมือนกันได้แนวทางแล้วว



edit
นี่ค่า ลองเอาเทคนิคไปใช้ลงกิจ ขอบคุณค้าบบ




แก้ไขล่าสุดเมื่อ 2017-11-02 00:40:11
nicoooki
nicoooki


เทอมสุดท้าย.
nicoooki
#10
14-10-2017 - 01:04:04

#10 nicoooki  [ 14-10-2017 - 01:04:04 ]





ผมพริ้วปลิวตามลม



เนื่องจากถ้าแชร์แต่วิธีการทำตากระพริบ GIF ซิมซ์ของเราคงจะดูธรรมดาเกินไป
นี่เป็นเทคนิคที่ตัวผมใช้เพ้นท์เส้นผม + การทำให้เส้นผมขยับโดยใช้การ Skew

เดือนนี้ว่างเป็นพิเศษก็เลยสามารถมาอัพเดตถี่ๆได้ ถ้ายังมีคนสนใจอยู่ผมก็จะมาอัพเดตทริค เทคนิคต่างๆเรื่อยๆครับ






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










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

http://laceratedwristsstock.deviantart.com/art/Hair-Strands-Brushes-112306520

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

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












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

เลือกใช้แปรงอันที่เหมาะกับการเคลื่อนไหว และ เหมาะกับทรงผมของซิมซ์นะครับ
จากนั้นก็ปรับขนาด หมุนองศาให้ได้ตามที่เราต้องการ

ใช้ eyedropper เลือกสีผมที่เข้ากับบริเวณที่เราจะทำการเพ้นท์ลงไปนะครับ
สำหรับเวลาผมวาดเส้นผมจะใช้ประมาณ 2 - 4 สี แล้วแต่สีผมของตัวซิมเลยครับ เพื่อที่จะทำให้ผมดีมีมิติ
(เวลาแต่งรูปปกติก็ลงเงาลงแสงเพิ่มบ้างบนช่อผม แต่เวลาทำ GIF อย่าพยายามลงเงาบนเลเยอร์เส้นผมนะครับ มันอาจทำให้ไม่เนียนได้)

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








จากนั้นให้เราทำการคลิกขวาที่เลเยอร์แรกที่เราวาดผมไว้ แล้วเลือก Duplicate layer
นั่นก็คือ การก๊อปปี้เลเยอร์ให้กลายเป็นเลเยอร์ใหม่นั่นเองครับ เราก็จะได้เลเยอร์ที่ 2 มา
ซึ่งเราจะเริ่มขยับมันที่เลเยอร์ที่ 2 นี้










เราจะมาเริ่มทำให้มันขยับโดยใช้การ Skew

ให้เราคลิกเลือกไปที่เลเยอร์ที่เราต้องการให้มันขยับนะครับ แล้วคลิกที่ Edit > Transform > Skew
มันคือเครื่องมือที่ใช้ปรับความลาดเอียงของภาพนั่นเองครับ

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

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











หลังจากนั้นให้เราทำเหมือนขั้นตอนด้านบนครับ คือ Duplicate layer เลเยอร์ที่ 2 ของเราที่พึ่งทำการ Skew ไป
ก็จะกลายเป็นเลเยอร์ที่ 3 ให้เราทำการ skew ต่อในเลเยอร์ที่ 3 พยายามให้เคลื่อนที่ด้วยองศาเดิมนะครับ

(อธิบายง่ายๆ คือเลเยอร์ที่ 1 เป็นเลเยอร์เริ่มต้น เลเยอร์ที่ 2 เริ่มขยับ ให้เรา Duplicate layer หรือก๊อปเลเยอร์ที่ 2 มา เป็นเลเยอร์ที่ 3 แล้วทำการขยับต่อไปเรื่อยๆ ทำแบบเดียวกันกับเลเยอร์ถัดไป)

ทำแบบนี้ไปเรื่อยๆ จนเราได้เลเยอร์เท่าจำนวนเฟรมที่เราต้องการ โดยครั้งนี้ผมใช้ 4 เลเยอร์เพราะ เฟรมทั้งหมดมี 12 เฟรม......
งงมั้ย?? เรื่องจำนวนเฟรม ผมจะเขียนอธิบายไว้ให้ที่ เรปที่ #1 นะครับ







พอได้เลเยอร์เท่าจำนวนเฟรมที่เราต้องการแล้ว จากนั้นก็ทำให้มันเป็น GIF ตามวิธีทำตากระพริบในเรปที่ #1 เลยครับ

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



*จัดเลเยอร์ของเส้นผมดีๆนะครับว่าอะไรควรอยู่หน้าอยู่หลัง เพื่อความสวยงามของภาพ GIF








นอกจากเส้นผม
การ Skew ยังสามารถใช้กับการเคลื่อนไหวอื่นๆ ในฉาก พร๊อบ และหลายๆอย่างได้อีกด้วยครับ
ขึ้นอยู่กับการปรับใช้และการครีเอทของเราครับ

และนอกจากการ Skew ยังมีวิธีอื่นๆอีกที่ทำให้ผมขยับ ซึ่งเอาไว้ถ้ามีคนสนใจจะมาแชร์ทริคเพิ่มเติมเรื่อยๆนะครับ


อาจจะอธิบายงงๆไปบ้างเพราะผมก็ไม่ค่อยรู้เรื่อง Photoshop และตอนเขียนเรปนี้ผมก็ง่วงๆด้วย 5555
ยังไงก็ดูคลิปประกอบๆกันไปกับคำอธิบายนะครับ

มีข้อสงสัยอะไรเพิ่มเติมถามมาได้เลยครับยินดีตอบทุกคำถาม













แก้ไขล่าสุดเมื่อ 2017-10-14 18:35:24
baifern20150
queenhaha
aivyailada
Thanaphat Simer
shirukusm
Paoz Melody
mytomm
baifern20150
queenhaha
aivyailada
Thanaphat Simer
shirukusm
Paoz Melody
mytomm


เห็นดาวตกนั่นไหม อธิษฐานเร็วเข้า...
queenhaha
#11
14-10-2017 - 02:40:38

#11 queenhaha  [ 14-10-2017 - 02:40:38 ]






ขอบคุณสำหรับเทคนิคดีๆนะคะ

nicoooki


Thanaphat Simer
#12
14-10-2017 - 11:06:48

#12 Thanaphat Simer  [ 14-10-2017 - 11:06:48 ]





ผมทำได้เเล้วครับ



แก้ไขล่าสุดเมื่อ 2017-10-14 11:12:13
nicoooki
nicoooki


อัพซิมส์ทุกวันเสาร์ ใช้ Psได้อยู่ (ดาวใกล้หมด T T)
Thanaphat Simer
#13
14-10-2017 - 11:11:07

#13 Thanaphat Simer  [ 14-10-2017 - 11:11:07 ]





ขอโทษครับ เผลอขึ้นเม้นท้ใหม่


แก้ไขล่าสุดเมื่อ 2017-10-14 11:13:32
nicoooki


อัพซิมส์ทุกวันเสาร์ ใช้ Psได้อยู่ (ดาวใกล้หมด T T)
nicoooki
#14
14-10-2017 - 16:47:46

#14 nicoooki  [ 14-10-2017 - 16:47:46 ]





quote : thanaphat simer

ผมทำได้เเล้วครับ





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



เห็นดาวตกนั่นไหม อธิษฐานเร็วเข้า...
otsuchio
#15
14-10-2017 - 17:25:00

#15 otsuchio  [ 14-10-2017 - 17:25:00 ]






โอ้ เป็นประโยชน์สุดๆ เคยพยายามงมทำเองแล้วเละมาก 55555555

ขอบคุณที่แชร์เทคนิดีๆนะคะ

nicoooki


ตะไมส่งงานกันเร็วจุง....
mytomm
#16
14-10-2017 - 19:49:25

#16 mytomm  [ 14-10-2017 - 19:49:25 ]







ขอบคุณที่มาแชร์เทคนิคดีๆนะคะ

nicoooki


ซิมส์1เล่นเพลินดีอะ
deviluchi
#17
04-11-2017 - 07:10:59

#17 deviluchi  [ 04-11-2017 - 07:10:59 ]




มีประโยชน์มาก ๆ ประยุกต์ได้ด้วย ขอบคุณนะค้าบบบบ

nicoooki


Call Me ' พี่หมอเฟ ' xD
nicoooki
#18
04-11-2017 - 18:03:42

#18 nicoooki  [ 04-11-2017 - 18:03:42 ]





quote : baifern20150

ดีงาม ขอบคุณที่มาแชร์น้า
อยากทำอยู่เหมือนกันได้แนวทางแล้วว



edit
นี่ค่า ลองเอาเทคนิคไปใช้ลงกิจ ขอบคุณค้าบบ








ดีงามมากกกก ภาพว่าสวยแล้ว พอน้ำตาไหลอีก ...ปริ่ม

baifern20150
baifern20150


เห็นดาวตกนั่นไหม อธิษฐานเร็วเข้า...
nicoooki
#19
07-11-2017 - 08:16:11

#19 nicoooki  [ 07-11-2017 - 08:16:11 ]





Moving Your Head





วันนี้พอมีเวลานิดหน่อยเลยแวะเอาเทคนิคอีกอย่างมาฝากครับ
อาจจะสั้นไปนิด และภาพซิมที่ใช้ประกอบไม่ได้แต่งอะไรเลยเพราะผมขี้เกียจ 5555
แนะนำว่าให้ดูคลิปประกอบไปด้วยนะครับเนื่องจากภาพอธิบายครั้งนี้ไม่ละเอียดเท่าไหร่
แต่ถ้าทำในส่วนของการ Skew เส้นผมแล้ว ก็คงจะเข้าใจได้ง่ายครับ


สำหรับครั้งนี้เราจะมาทำให้ซิมขยับหัวโดยใช้เครื่องมือ Rotate กันครับ

*เทคนิคนี้สามารถปรับใช้กับส่วนอื่นๆได้ ไม่ว่าจะเป็นฉาก เส้นผม อวัยวะ หรือส่วนประกอบอื่นๆใน GIF








.
.
.
.
.
.


นี่เป็นคลิปตอนทำครับ ดูประกอบไปกับคำอธิบายนะครับ
.
.
.



.
.
.
.
.






ขั้นแรกเมื่อเราแต่งภาพ ตัดพื้นหลังจนเราพอใจแล้ว ให้เราทำการก๊อปปี้เลเยอร์หรือ Duplicate layer ออกมาเป็น 2 ส่วน













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













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













เมื่อเราได้แยกส่วนตัวและส่วนหัวในข้างต้นแล้ว ให้เราทำการก๊อปปี้เลเยอร์หรือ Duplicate layer ในส่วนหัว โดยให้เลเยอร์นี้เป็นเฟรมที่เราจะเริ่มขยับกัน

ให้เราคลิกเลือกเลเยอร์ที่เราก๊อปปี้มา จากนั้นไปที่ Edit > Transform > Rotate จะได้กรอบมาแบบในภาพด้านล่าง









ข้อสำคัญของการทำให้หัวขยับไม่มีสะดุดคือ แกนกลางของการหมุดในแต่ละเฟรมจะต้องเป็นจุดๆเดียวกัน
ให้เราทำการลากจุดมาร์ค ไปไว้ในตำแหน่งที่เหมาะสม นั่นก็คือส่วนข้อต่อ (เช่นถ้าเป็นแขนเราก็จะลากจุดนี้ไปที่ข้อสอก)
เมื่อเราได้ตำแหน่งที่ต้องการ เพื่อให้ง่ายต่อการกำหนดจุดมาร์คในครั้งต่อๆไป ให้เราทำการลากเส้นไกด์มาที่จุดมารค์ของเรา










พอได้มารค์ที่เราต้องการแล้ว ให้เราหมุนหัวไปในทิศทางที่เราต้องการเลยครับ ค่อยๆขยับไปทีละนิด เพื่อความสมูท
เมื่อได้มุมที่เราต้องการแล้วก็กด Enter
จากนั้นให้เราทำการก๊อปปี้เลเยอร์หรือ Duplicate layer ต่อจากเลเยอร์หัวที่เราพึ่งทำเสร็จ
แล้วทำแบบเดียวกันกับเลเยอร์ก่อนหน้า คือ Edit > Transform > Rotate ลากจุดมาร์คไปที่จุดเดิมที่เราไกด์ไว้ แล้วค่อยๆขยับหัว

ทำไปเรื่อยๆ จนได้เลเยอร์ตามจำนวนเฟรมที่เราต้องการแล้ว (ซึ่งใน GIF ที่ผมนำมาสาธิตในวันนี้มีหัวทั้งหมด 6 เลเยอร์ด้วยกัน)
จากนั้นก็ทำการสร้าง frame animation เรียงเลเยอร์ และเซฟตามขั้นตอนในเรปแรกๆเลยครับ



สำหรับคนที่อ่านข้ามมาแนะนำให้ เริ่มอ่านตั้งแต่วิธีทำตากระพริบนะครับ ซึ่งวิธีทำมันก็จะวนๆเวียนๆอยู่ประมาณนี้แหละ

*ความเร็วความช้าขึ้นอยู่กับจำนวนนะครับ ยิ่งจำนวนเฟรมมาก GIF ก็จะดูขยับช้าลงไปอีก ซึ่งเราปรับใช้ได้ตามความเหมาะสมเลยครับ








--------------------------------------------------------------------------------------------------------------------------------------








ภาพด้านล่างนี้ใช้เทคนิคเดียวกันในการขยับหัวครับ







เทคนิคอื่นๆยังมีอีกเยอะครับ ขึ้นอยู่กับว่าเราจะใช้เครื่องมืออะไรมาปรับใช้ยังไง



ขออภัยถ้าเรปนี้พิมพ์งงๆ และไม่ละเอียดเท่าที่ควร แต่ถ้าใครที่อ่านมาแต่เรปแรกจะเข้าใจได้ง่ายครับ
แนะนำว่าควรเปิดคลิปดูควบคู่กันไป จะง่ายกว่ามานั่งงมอ่านเฉยๆ เพราะผมพิมพ์ไปมึนไป 55555

ถ้ายังมีคนติดตามและสนใจอยู่ ว่างๆจะมาอัพเดตเทคนิคอื่นอีกเรื่อยๆนะครับไม่ว่าจะเป็นเรื่องแสง เอฟเฟคต่างๆ หรือ ฉาก


ขอบคุณที่อ่านมาจนถึงตรงนี้ครับ




------------------------------------------------------------


แก้ไขล่าสุดเมื่อ 2017-11-08 00:47:11
pattaeaporn game
pattaeaporn game


เห็นดาวตกนั่นไหม อธิษฐานเร็วเข้า...
Hu Yinn
#20
07-11-2017 - 13:30:37

#20 Hu Yinn  [ 07-11-2017 - 13:30:37 ]




หูยยย สาระเต็มๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆๆ


  • 1

ลงข้อความได้เฉพาะสมาชิก
ต้องสมัครเป็นสมาชิกและ login เข้าสู่ระบบก่อนถึงจะสามารถลงความเห็นได้
เข้าสู่ระบบสมัครสมาชิก