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

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

ฝึกทาบเส้นจากตัวการ์ตูน Illustrator

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

272

กระทู้

272

โพสต์

979

เครดิต

ผู้ดูแลระบบ

Rank: 9Rank: 9Rank: 9

เครดิต
979
Cartoon_doramon18.jpg
ฝึกทาบเส้นจากตัวการ์ตูน Illustrator
ก่อนที่จะดราฟเส้นสร้างวัตถุชิ้นต่างๆในโปรแกรม Illustrator ให้เก่งได้ ก้าวแรกคือ.. จะต้องฝึกหัดดราฟเส้นและลงสีจากตัวการ์ตูนง่ายๆให้ชำนาญก่อน

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

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


ก่อนที่เราจะเริ่มลงมือดราฟเส้นจากตัวการ์ตูนกัน

อย่างแรกข้าพเจ้าอยากให้เข้าไปศึกษา  2 บทความนี้มาก่อนค่ะ
1.
มารู้จักกับเส้น Path
2. การใช้กลุ่มเครื่องมือ Pen Tool

เมื่อเราพอรู้จักกับเส้น Path และ Pen Tool แล้ว คราวนี้ก็มาถึงขั้นลงมือทำจริงกันค่ะ  

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

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

ปกติในขั้นตอนของการทาบ ข้าพเจ้าจะใช้ Pen Tool ทาบตามแบบไร้พื้นไร้ขอบ เพราะไม่ชอบให้เส้น Storke มาบังเส้น Pathของเรา ดังภาพข้างล่าง (ศึกษาเพิ่มเติมได้ที่บทความนี้ค่ะ
วิธีวาดเส้นไร้พื้น และวิธีวาดพื้นไร้เส้น)

Cartoon_doramon7.jpg
พอทาบจนจบวัตถุหนึ่งชิ้นแล้ว ข้าพเจ้าถึงจะเปลี่ยนให้มันมีเส้นทีหลังค่ะ
Cartoon_doramon3.jpg

อ่ะ...ได้เวลาลงมือปฏิบัติกันซะที....  

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

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

Cartoon_doramon19.jpg

3. จากนั้นก็ให้เอาเม้าส์จิ้มที่ตำแหน่งเลข 3 ต่อเลยค่ะ อย่าเพิ่งยกเม้าส์ขึ้นนะค่ะ ให้กดค้างไว้และยืดแขนมันให้ได้ทิศทางดังภาพข้างล่างก่อน จึงค่อยปล่อย
Cartoon_doramon20.jpg

4. และมาจิ้มที่ตำแหน่งเลข 4
Cartoon_doramon21.jpg

จบด้วยตำแหน่งที่เลข 5  (อย่าลืมดัดเส้น Path ให้โค้งก่อนแล้วจึงค่อยปล่อยมือนะค่ะ)

ในตำแหน่งที่เลข 5 ก็คือการเอาไปจิ้มที่จุดแองเคอร์จุดแรกเพื่อสิ้นสุดการวาดต่อนั่นเอง (เป็นการเดินเส้น Path แบบปิด)
Cartoon_doramon22.jpg

ลองสังเกตดูในตำแหน่งจุดแองเคอร์ที่ 2 นะค่ะ เส้น Path มันเกินออกมา ให้ใช้อุปกรณ์ Convert Anchor Point Tool (หรือกด Shift+C) คลิกที่จุด Direction ขวาค้างไว้และ ดัดลงมาให้แนบกับเส้นขอบของหัวโดราเอมอน ดังภาพ
Cartoon_doramon23.jpg

พอดัดแขน Direction แล้ว เราจะเห็นว่ามันยังดูเหลี่ยมๆ ไม่โค้งกลม ให้ขยับจุดแองเคอร์ลงมาอีกหน่อยค่ะ

Cartoon_doramon24.jpg

ต่อไปก็ทาบเส้นส่วนที่เป็นหน้าสีขาว ทำเหมือนเดิมกับเส้น Path อันแรกค่ะ จะเดินเส้นและดัดไปด้วยเลยก็ได้ หรือเดินเส้นไปคร่าวๆก่อนแล้วค่อยดัดให้เข้าที่ทีหลัง ก็ได้เช่นกัน
Cartoon_doramon5.jpg

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

Cartoon_doramon6.jpg

ในส่วนที่เป็นวงกลม เช่น จมูกสีแดง กับ ลูกตา ข้าพเจ้าจะใช้อุปกรณ์ Ellipse Tool (หรือกด L) วาดวงกลมให้ดวงตาข้างนึงก่อน จากนั้นก็เอาเม้าส์ไปคลิกบนพื้นที่ตำแหน่งใดก็ได้ 1 ครั้ง มันจะเด้งหน้าจอขึ้นมา ให้เรากดตกลงเลย แล้วมันจะสร้างวงกลมอีกวงที่เหมือนกับวงกลมอันแรกมาให้ค่ะ
Cartoon_doramon8.jpg

ดราฟตัวโดราเอมอนเสร็จแล้ว...
Cartoon_doramon9.jpg

ข้าพเจ้าจงใจ เดินเส้น Path บางส่วนให้เกินออกมา  หากสังเกตให้ดี เส้น Path ส่วนที่ข้าพเจ้าวาดเกินมานี้ มันจะถูกทับไปหมดเมื่อถูกลงสี

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

(เส้นหลักในที่นี้... จะหมายถึงเส้นที่จะใช้เป็นเส้นตัดระหว่างสีของตัวการ์ตูนค่ะ)

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

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


Cartoon_doramon10.jpg

เมื่อลงสีแล้ว เส้นหลักก็จะออกมาสวยเช้ง...
(ส่วนเส้น Path ข้างใต้ที่ถูกบังทับ ก็ยังเละอยู่ข้างใต้เหมือนเดิมต่อไป  อ๊า... นี่แหละ เทคนิคผักชีโรยหน้า! )

Cartoon_doramon11.jpg
(เอ่อ ยังไงก็จัดเส้น Path ข้างใต้ ให้ดูเป็นระเบียบหน่อยก็ได้นะค่ะ เวลา View>Outline มาแล้วจะได้ไม่น่าเกลียดนัก )

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

(แบบลงสี 2 ขั้น กับแบบให้เหมือนภาพ 3D ก็มีค่ะ แต่ยังไม่ได้ทำเป็นบทความ -*- ยังขี้เกียจอยู่เพราะรู้ว่าคงยาว)

ในบทความนี้จะใช้การลงสีแบบง่ายๆค่ะ นั่นก็คือการใส่สีให้พื้นดังภาพข้างล่าง วิธีทำก็ให้คลิกที่เส้น Path ที่เราจะทำการใส่สี จากนั้นก็มาดับเบิ้ลคลิกที่ Fill (Fill คือช่องที่เป็นสีน้ำเงินในรูปข้างล่าง) มันจะเด้งหน้า Color มาให้เราเลือกสี แค่นี้ก็เสร็จแล้วค่ะ

*** ถ้าเราต้องลงสีเดิมซ้ำกันในจุดอื่น เช่น สีน้ำเงิน ก็ให้คลิกเลือกวัตถุที่ยังไม่ได้ใส่สีก่อน จากนั้นก็ใช้อุปกรณ์ Eyedropper Tool (หรือกด I)  ดูดสีจากวัตถุที่ลงสีพื้นเป็นสีน้ำเงินเรียบร้อยแล้วมา แค่นี้วัตถุที่เราเลือก ก็จะถูกเปลี่ยนสีพื้นให้กลายเป็นสีน้ำเงินตามแล้ว

Cartoon_doramon12.jpg

ดราฟเส้น โนบิตะ.....
Cartoon_doramon13.jpg

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

ลงสีให้โนบิตะซะ....

Cartoon_doramon15.jpg

ในส่วนของพื้นเครื่องไทม์แมชชีนข้าพเจ้าใช้การลงสีแบบ Gradient Tool  2 เฉดค่ะ สำหรับคนที่ยังลงสีแบบ Gradient ไม่เป็นให้เข้ามาศึกษาที่บทความนี้ก่อนค่ะการใช้เครื่องมือ Gradient Tool เบื้องต้น> Advance

Cartoon_doramon16.jpg

แล้วก็ทำพื้นวงกลมข้างหลัง แค่นี้ก็เสร็จแล้วค่ะ

วิธีการทำวงกลมแบบหลายวงซ้อนกัน ให้เข้ามาศึกษาที่บทความนี้ค่ะ
การเจาะรู การตัด และการรวมภาพ ด้วยพาเลท Pathfinder
Cartoon_doramon17.jpg

Cartoon_doramon25.jpg

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


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

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

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

GMT+7, 2024-5-3 09:54 , Processed in 0.105015 second(s), 21 queries .

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

© 2001-2017 Comsenz Inc.

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