chugary {♥} sweet

อ่านฉัน,

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

ยังไม่ตายค่ะ!

ยังค่ะ ยัง ใครที่แช่งอยู่เสียใจด้วยนะคะ 555 TvT แต่ดูจากงานแล้ว คิดว่าคงจะตายในอาทิตย์สองอาทิตย์ล่ะค่ะ ฮือ

สาม ข้ออ้าง สาเหตุที่ไม่ได้อัพบล็อกมาสามชาติ :  1. ขนาดงานยังไม่ทำ 2. ส่วนที่ทำงานอยู่ก็ไม่ควรจะเอามาอัพ และ 3 ชีวิตประจำวันโคตรไร้สาระเลย (ถ้าไม่รวมเรื่องทำงาน)

เป็นวงจรอุบาทว์มาก แต่หนีไม่พ้น...

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

รู้จัก พิกเซลอาร์ต กันมั้ยคะ? ถ้าเซิร์จ ๆ ฝั่งญี่ปุ่นจะเรียกว่าดอต...ดอตซัมธิง ดอต-เอ (ドット絵) อ่านคันจิไม่ออก TvT; ขอบคุณคุณ Kutan~> (คห. 16) ที่บอกนะคะ ใจดีจังเลย :D

ถ้ายังนึกไม่ออก พิกเซลอาร์ตงานจะประมาณนี้:

(โอย อาย งานเก่ามาก ปี 2007 แหนะ มาสคอตเรา (ตัวขวา) ยังผมสั้นกับมีหางอยู่เลย!!)

(ที่สำคัญ สมัยก่อนงานละเอียดชิบบบ...)

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

ส่วนขยับไม่ได้ก็แบ่งย่อยได้อีกสองประเภท คือแบบ Isometric (ทำมุม 30 องศา) กับ Non-Isometric (ตรงข้ามกับอันแรก) แต่ถึงรู้ไปก็ไม่มีประโยชน์กับเราอยู่ดี เพราะเราทำงานแบบ "จะทำแบบนี้อ้ะ" 5555 เด็กดีไม่ควรเอาเยี่ยงอย่างนะคะ

พิกเซลอาร์ตส่วนใหญ่เราจะเห็นตามเกม อย่างสมัยก่อน ๆ ฟามิคอม fr202 (รู้หมดว่าแก่) หรือเกมใน nintendo DS บางเกมนั่นก็พิกเซลอาร์ตนะ เราว่างานแบบนี้มันมีเสน่ห์มากเลย ต้องอาศัยความถึกอย่างมาก ยิ่งถึกยิ่งสวย

เกริ่นมาพอล่ะ วันนี้เราจะมาทำงานแบบนี้กัน : )

งานนี้รีเควส (+ กึ่ง ๆ เอาตามความชอบของคนทำนิดนึง) มาว่า

• ขอมีต้นไม้ใหญ่ ๆ
• ขอโทนสีสบาย ๆ เห็นแล้วอบอุ่น (แปลว่าไรวะ...)
• เห็นทางรถไฟก็ดี

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

(อย่าแปลกใจ...คือคนจ้างก็คนใกล้ตัวนี่แหละ ไม่งั้นก็ไม่กล้าขอนู่นนี่ขนาดนี้ 5555)

พอได้คอนเซปท์คร่าว ๆ มาแล้วก็ไปรวบรวมไอเดียเก็บ ๆ ไว้ หานานมากกก... เพราะไม่ลงตัวซะที มัวแต่กัดกันอยู่ กร๊ากก

จนมาสรุปที่ ได้ไอเดียยกฉากมาทั้งดุ้นจากงานของ emlan กับ きなこもち ส่วนสีจะใช้โทนขนม ๆ หน่อยแบบงานของ しょさ กับ 비비

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

** ถึงตรงนี้ เราใช้ SAI ในการทำงานทั้งหมดนะคะ ใครใคร่ใช้โปรแกรมอะไรก็แล้วแต่ถนัดค่ะ :) แต่จะพยายามเขียนให้เข้าใจกันหมดนะคะ

เป็นรูปเป็นร่างแล้วก็จัดการตัดเส้นลงสีโลด~

เวลาตัดเส้น, ใน SAI ใช้ Binary 1px ส่วน Photoshop ใช้ Pencil 1px นะคะ

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

เทคนิคนิดหน่อยเวลาทำงาน คล้าย ๆ กับลง CG นั่นแหละค่ะ

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

Photoshop ก็ทำได้นะ ให้ขึ้นเลเยอร์ใหม่แล้วกด Ctrl+Shift+G ได้เหมือนกัน

** เพิ่มเติมนิดนึง ๆ

Tutorial อันนี้ เราทำไว้เมื่อสองปีที่แล้วค่ะ การทำงานก็เหมือน ๆ กัน แต่อันนี้จะลงลึกกว่าเอนทรี่นี้หน่อย ใช้อ่านคู่กันได้น่อ >v<

/ เพิ่งได้กลับไปอ่านที่เคยเขียนไว้

โห...สมัยก่อนเราสำนวนเข้าขั้นวิกฤตเลยนะเนี่ย =A=;;;.....แอ๊บแบ๊วเข้ากระแสเลือด

กลับมาที่งานเรากันต่อ, เราเริ่มงานด้วยการลง BG กับสีพื้นหญ้าไว้ก่อนเลย  (เอาไว้คุมโทน) จากนั้นก็ค่อย ๆ เก็บไปทีละส่วน อยากทำอันไหนทำก่อน ฮา

งานแบบนี้ต้องใจเย็น ๆ ค่ะ ใจร้อนอาจจะล้มโต๊ะก่อนเสร็จได้ 555

การทำงานทั้งหมดจริง ๆ มีแค่นี้ค่ะ ที่เหลือนี่ใช้ประสบการณ์ + เซนส์ล้วน ๆ เรื่องสีอะไรแบบนี้

อย่างพวกฉากเราจะไม่ตัดเส้นทั้งหมด แต่จะไล่สีเอาแทน ส่วนตรงไหนอยากให้เด่น ๆ เราก็จะตัดเส้นทั้งหมด + ให้ขอบนอกเป็นสีดำ งานมันจะโดดออกมา ดูสวยดี อันนี้ความชอบส่วนตัวนะคะ >v<

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

ใกล้จะเสร็จล่ะ ทำต่อโลด

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

 (ในภาพนี่เป็นตัวอย่างนะจ๊ะ ลองไปประยุกต์ดู)

ลงสีทุกอย่างเสร็จแล้วเราก็เซฟเป็น *.psd แล้วย้ายไปทำใน Photoshop (เราทำใน SAI น่ะค่ะ)

รวมทุกเลเยอร์แล้วไปที่ Edit > Stroke ทำเส้นขอบด้านนอก ใส่แบคกราวด์ เท่านี้ก็เป็นอันเสร็จ!

คลิกที่รูปเพื่อดูรูปเต็ม : )

เท่านี้ก็เสร็จงานที่รับมาส่วนนึงล่ะ เหลืออีก (หลาย) ส่วน ก็จะเอางานนี้ไปต่อยอดอีกที เฮ~

ไม่แน่ใจว่าจะเข้าใจกันรึเปล่า เราเป็นคนอธิบายไม่เก่งเลยล่ะค่ะ =v=;; นี่เขียนเองยัง งง เองเลยนะเนี่ย แฮ่

ถ้ามีประโยชน์กับคนอ่าน แค่นี้เราก็ดีใจแล้วล่ะค่า แฮ่

งั้นวันนี้ขอตัวก่อนนะคะ เพราะงาน เยอะมาก!! T_T

แล้วเจอกันค่ะ : )