บทความสอนกราฟิก

 ลืมรหัสผ่าน
 ลงทะเบียน
ค้นหา
ดู: 2136|ตอบกลับ: 0

ขั้นตอนการลงสีผิวหน้า ด้วย Mesh Tool

[คัดลอกลิงก์]

272

กระทู้

272

โพสต์

979

เครดิต

ผู้ดูแลระบบ

Rank: 9Rank: 9Rank: 9

เครดิต
979
nook_patummawadee_Illustrator_cs34.jpg
ขั้นตอนการลงสีผิวหน้า ด้วย Mesh Tool

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

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

ในความคิดของข้าพเจ้า เครื่องมือและคำสั่ง Mesh เป็นเครื่องมือตัวเดียวที่จะทำให้ภาพสีผิว Vector คมชัดทุกสเกล โดยไม่สนว่าจะขยายขนาดใหญ่แค่ไหน

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

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

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



-------------------------------------------------------------------------
เวลาออกแบบตัวละคร ถ้าไม่วาดสดในโปรแกรม Photoshop(ใช้ปากกาเม้าส์) ข้าพเจ้าก็จะวาดภาพดินสอลงกระดาษก่อน แล้วค่อยเอาเข้าเครื่องคอมมาดราฟเส้นอีกทีในโปรแกรม Illustrator

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

nook_paint_mouse1.jpg nook_paint_mouse1_1.jpg

ภาพสำเร็จหลังจากดราฟเส้นในโปรแกรม Illustrator เสร็จแล้ว (วาดท่าถือดอกบัวใหม่)
nook_patummawadee_Illustrator_cs0.gif

ดราฟเส้นก่อน แล้วก็จัดลำดับหน้าหลังของภาพ เพื่อความเป็นระเบียบเวลาลงสี 1 คืออยู่หลังสุด 8 คือลำดับที่อยู่บนสุด
nook_patummawadee_Illustrator_cs2.gif

แยกเลเยอร์ออกเป็นส่วนต่างๆไว้ ส่วนไหนยังไม่ใช้ก็ล๊อคแม่กุญแจไว้ก่อนค่ะ

nook_patummawadee_Illustrator_cs3.gif

ในส่วนของสีผิวนะค่ะ ถ้าเราไม่รู้ว่าจะใช้ค่าสีอะไร ก็สามารถเลือกใช้สีจาก พาเนล Swatches ก็ได้ค่ะ โดยไปที่  Window> Swatches

เมื่อพาเนล Swatches ปรากฏขึ้นมาแล้วให้กดปุ่มไอคอนเล็กๆที่มุมล่างซ้าย เพื่อเลือกกลุ่มสีแต่ละประเภทค่ะ
nook_patummawadee_Illustrator_cs5.jpg

ข้าพเจ้ายกตัวอย่างเลือกกลุ่มสี Skintones ขึ้นมาให้ดูค่ะ  
nook_patummawadee_Illustrator_cs6.jpg

แต่ถ้าชอบผสมสีเองก็ได้เช่นกัน ให้กำหนดสีจาง - กลาง - เข้ม ขึ้นมา 5 เฉด ค่ะ


nook_patummawadee_Illustrator_cs6_3.jpg

เพื่อความแน่ใจว่าสีที่เราเซ็ตขึ้นมีความต่อเนื่องกัน ก็ให้วาดวงกลมขึ้นมา และทำการลงสีไล่เฉด แบบ Gradient - Radial ตามค่าสีที่เราเลือกไว้ ทั้ง 5 เฉด

nook_patummawadee_Illustrator_cs6_1.jpg


เมื่อได้ค่าสีผิวเนื้อทั้ง 5 เฉดมาแล้วก็มาเริ่มกันเลยนะค่ะ

ทำจมูก
จากเส้นจมูกที่เราวาดไว้ ให้ใช้ Pen Tool วาดเป็นเส้นปิดค่ะ และให้ลงสี No. 4 ไม่เอาเส้นขอบ (อ้างอิงตามเบอร์สีทั้ง 5 สีข้างบนเลยนะค่ะ)

nook_patummawadee_Illustrator_cs7.jpg

จากนั้นให้ไปที่คำสั่ง Object> Create Gradient Mesh...

nook_patummawadee_Illustrator_cs8.jpg

ตั้งค่า Rows = 4 , Columns = 6 กดปุ่ม OK
nook_patummawadee_Illustrator_cs9.jpg

และทำตามขั้นตอนการลงสี ทีละเสต็ปตามภาพเลยค่ะ
nook_patummawadee_Illustrator_cs10.jpg

nook_patummawadee_Illustrator_cs11.jpg

ต่อไปก็ทำตุ่มจมูกอีกข้าง
nook_patummawadee_Illustrator_cs12.jpg

และพอนำมาวางซ้อนกันก็จะได้ดังภาพข้างล่างค่ะ

nook_patummawadee_Illustrator_cs13.jpg

ทำสีผิวใบหน้า
ทำคล้ายกับขั้นตอนทำจมูกค่ะ คือใช้เครื่องมือ Pen  Tool วาดให้เป็นเส้นปิดก่อน จากนั้นจึงลงสีพื้น No.4
nook_patummawadee_Illustrator_cs14.gif

จากนั้นให้ไปที่คำสั่ง Object> Create Gradient Mesh...

ตั้งค่า Rows = 6 , Columns = 5 กดปุ่ม OK
nook_patummawadee_Illustrator_cs15.gif

ลงสี No.3 และ No.2 ตามภาพค่ะ
nook_patummawadee_Illustrator_cs16.gif

และลงสี  No.1 ซึ่งถือเป็นสีไฮไล้ท์ (สีที่กระท้อนกับแสง) มี 4 จุดด้วยกันคือ เนินแก้ม 2 ข้าง หน้าผาก และคาง (ไม่รวมปลายจมูก เพราะแยกชิ้นทำต่างหาก)
nook_patummawadee_Illustrator_cs17.jpg

ตอนนี้ เราจะได้เค้าโครงของสีผิว จุดอ่อนเข้มแบบคร่าวๆ มาแล้วนะค่ะ

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

============================================

Note:
นอกจากจะเติมสี โดยใช้เครื่องมือ Eyedropper Tool ดูดสีจากสีเบอร์ที่เราเซ็ตไว้ทั้ง 5 โทนสีแล้ว เรายังสามารถใช้เครื่องมือ Eyedropper Tool ดูดสีจากส่วนเข้ม - จางบริเวณบนส่วนต่างๆของสีผิวใบหน้าโดยตรงได้อีกด้วยค่ะ วิธีนี้จะเหมาะสำหรับการลงสีผิว ที่ต้องการให้สีเข้ม ไปหา สีจาง ดูต่อเนื่องกลมกลืนกัน โทนสีไม่โดด ทั้งยังใช้เส้นตาข่ายคั่นกลางระหว่างโทนสีทั้งสองเพียงแค่เส้นเดียว (เข้ม - กลาง - จาง)

และการลงสีด้วยวิธีนี้ ยังช่วยให้เส้นตาข่ายไม่เยอะจนรกด้วยค่ะ (ถ้าเส้นตาข่ายยิ่งเยอะ จะยิ่งคำนวณสีและไล่เฉดสีผิวยาก)
============================================

(ในภาพแองเคอร์ที่ข้าพเจ้าได้เติมสี No.1 เพิ่มลงไปในจุดแองเคอร์ที่วงกลมสีดำไว้ )

nook_patummawadee_Illustrator_cs19.jpg


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

(ในภาพข้าพเจ้าใช้เครื่องมือ Direc Selection Tool ย้ายจุดแองเคอร์เลื่อนขึ้น เพื่อให้จุดที่แสงตกกระทบ ไปกระจุกรวมกันที่ส่วนของกลางหน้าผาก เพื่อทำให้ความนูนสว่างที่กระจายอยู่ตรงส่วนหน้าผาก แคบลง)

nook_patummawadee_Illustrator_cs20.jpg

ส่วนของเนินแก้ม ควรเพิ่มความสดใสอีกนิด โดยใช้สี No.1 เติมลงไปและทำการย้ายจุดแองเคอร์ไปยังตำแหน่งที่เหมาะสม

nook_patummawadee_Illustrator_cs21.jpg

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

nook_patummawadee_Illustrator_cs22.jpg

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


การเชื่อมต่อสี ให้ดูมีความต่อเนื่อง

ในภาพจะเห็นได้ชัดว่า ชิ้นส่วนจมูก และผิวหน้า เป็นคนละส่วนเลย

nook_patummawadee_Illustrator_cs23.jpg

ในขั้นตอนนี้ เราจะไม่ยุ่งกับจุดสีของส่วนใบหน้าแล้วนะค่ะ ให้จัดการล๊อคแม่กุญแจสีผิวหน้าเอาไว้ก่อน

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

nook_patummawadee_Illustrator_cs25.jpg

ดึงออกมาแล้วก็คลิกเลือกจุดแองเคอร์รอบนอกก่อน และทำการดูด "สีผิวของใบหน้า" บริเวณที่อยู่ติดกัน (เพื่อหลอกตาให้ดูเป็นสีเดียวกันน่ะค่ะundefined)

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

nook_patummawadee_Illustrator_cs24.jpg

ในส่วนของรูจมูก จะลงสีแบบ Gradient  สี No. 3 และ No. 5 ค่ะ

nook_patummawadee_Illustrator_cs27.jpg

สัญลักษณ์กลางหน้าผาก็ลงสีแบบ Gradient เช่นกัน

nook_patummawadee_Illustrator_cs28.jpg

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

nook_patummawadee_Illustrator_cs28_1.jpg

NOOKFUFU2_ThaiGraph1.jpg

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

====================================================
Note:
ถ้าขี้เกียจเปลี่ยนสีใหม่ทีละจุดแองเคอร์ ก็ให้ไปที่คำสั่ง Edit>  Edits Colors> Adjust Color Balance.. เพื่อปรับโทนสีใหม่ทีเดียวทั้งหมดก็ได้เช่นกันค่ะ
====================================================

หลังจากเปลี่ยนสีเป็นโทนใหม่แล้ว ภาพสีผิวก็ยังดูจางๆundefined เพราะมีส่วนของสีเข้มน้อยเกินไป

nook_patummawadee_Illustrator_cs28_2.jpg

ต่อไปเราจะเติมสี No.5 ลงไปที่จุดขอบ และเพิ่มโทนสี No.6 (สีเนื้อแกมส้ม) เข้ามาด้วยเพื่อเพิ่มความหลายหลากของโทน ทำให้สีผิวมีความสมจริงมากขึ้น

nook_patummawadee_Illustrator_cs28_3.jpg

คิ้วจะใช้การวาดทีละเส้นหรือใช้  Mesh Tool ก็ได้ค่ะ แล้วแต่ความชอบ
ในภาพข้างล่าง ข้าพเจ้าทำคิ้วด้วยคำสั่ง Object> Create Gradient Mesh...
กำหนดให้ Row=4, Column = 5
nook_patummawadee_Illustrator_cs30.jpg

ทำปาก
nook_patummawadee_Illustrator_cs31.jpg

เก็บรายละเอียดบริเวณปากค่ะ ขั้นตอนการทำแต่ละส่วนจะคล้ายๆกันหมดค่ะ  (มีไฟล์ Source ให้โหลดไปดู)

nook_patummawadee_Illustrator_cs32.jpg

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

nook_patummawadee_Illustrator_cs35.jpg

หากยังไม่พอใจกับเฉดสีอีก ก็ให้เลือกทั้งหมด และไปที่คำสั่ง  Edit>  Edits Colors> Adjust Color Balance.. ปรับเฉดสีใหม่อีกครั้งตามใจชอบค่ะ

nook_patummawadee_Illustrat.jpg

หลังจากปรับเฉดสีใหม่...

NOOKFUFU2_ThaiGraph2.jpg


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

*********************
บทความโดย นุ้ก
ขอจบบทความแค่เพียงเท่านี้ แล้วพบกันใหม่บทความหน้าค่ะ ^^
(ขอสงวนสิทธิ์อนุญาตให้เผยแพร่เฉพาะในเว็บ www.graphicfufu.comเท่านั้น)




NOOKFUFU2_ThaiGraph2.jpg
ขออภัย! คุณไม่ได้รับสิทธิ์ในการดำเนินการในส่วนนี้ กรุณาเลือกอย่างใดอย่างหนึ่ง ลงชื่อเข้าใช้ | ลงทะเบียน

รายละเอียดเครดิต

ข้อความล้วน|อุปกรณ์พกพา|ประวัติการแบน|GraphicFUFU

GMT+7, 2024-3-28 17:23 , Processed in 0.143435 second(s), 21 queries .

Powered by Discuz! X3.4 R20180101, Rev.59

© 2001-2017 Comsenz Inc.

ตอบกระทู้ ขึ้นไปด้านบน ไปที่หน้ารายการกระทู้