ผมเอาจากเวปเมืองนอกที่เขามีสอนบวกกับประสบการณ์ในการทำกราฟิคเกมแบบ Pixel Art เอามาอธิบายกับแนะนำครับ โดยวิธีการที่ผมใช้จะเป็นการใช้การดอทล้วนๆนะครับ
พิกเซล (Pixel) เป็นคำผสมของคำว่า Picture กับคำว่า Element หรือหน่วยพื้นฐานของภาพ เทียบได้กับ "จุดภาพ" 1 จุด แต่ละพิกเซลเปรียบได้กับสี่เหลี่ยมเล็กๆ ที่บรรจุค่าสี โดยถูกกำหนดตำแหน่งไว้บนเส้นกริดของแนวแกน x และแกน y หรือในตารางเมตริกซ์สี่เหลี่ยม ภาพบิตแมปจะประกอบด้วยพิกเซลหลายๆ พิกเซล
จำนวนพิกเซลของภาพแต่ละภาพ จะเรียกว่า ความละเอียด หรือ Resolution โดยจะเทียบจำนวนพิกเซลกับความยาวต่อนิ้ว ดังนั้นจะมีหน่วยเป็น พิกเซลต่อนิ้ว (ppi: pixels per inch) หรือจุดต่อนิ้ว (dpi; dot per inch) ภาพขนาดเท่านั้นแต่มีความละเอียดต่างกัน แสดงว่าจำนวนพิกเซลต่างกัน และขนาดของจุดพิกเซลก็ต่างกันด้วย
ซึ่งโดยหลักการของกราฟิคแบบ Pixel จะต้องอาศัยการไล่ระดับของสีเป็นชั้นๆ เพื่อให้เกิดแสงเงา และใช้ดินสอเป็นเครื่อง มือในการจุด แบบลักษณะจุดต่อจุด รวมทั้งต้องเป็นกราฟิคแบบ Aliased คือต้องเป็นหยักธรรมชาติ ไม่มีการ Anti-Aliased เด็ดขาด
เริ่มกันที่วาดรูปตัวละครขึ้นมาหนึ่งตัว ตรงนี้แนะนำว่าอย่าใส่รายละเอียดมากนะครับ เพราะตัวละครในเกมแนวFightingขนาดส่วนมากพวกตัวละครขนาดกลางจะมีความสูงโดยประมาณ 128 x 128 Pixel ถ้าใส่รายละเอียดมากไปเวลาย่อมันจะดูมั่วๆหรือรายละเอียดหายไป ทำให้ทำงานได้ยากครับ งาน Pixel Art ต้องตั้งความละเอียดอยู่ที่ Resolution ที่ 72 นะครับ
รูปที่ 1 ได้ภาพมาแล้วก็ทำการย่อ ถ้า Photo Shop แนะนำให้อยู่ในโหมด bilinear นะครับ ภาพจะไม่แตกมาจนเกินไป เข้าไปปรับได้ที่ Edit/Preference/Genaral แล้วปรับตรงช่อง Image Interpolation เป็น bilinear ย่อเส้นก็นำมาย่อให้ได้ขนาดที่ต้องการ ตรงนี้คนที่ไม่รู้ว่าขนาดไหนพอดีก็ลองหาภาพจากเกมอื่นมาอ้างอิงได้ครับ ตรงนี้อาจจะเปลี่ยนสีเส้นเป้นสีฟ้าเพื่อจะได้ง่ายในการดอทภาพทับ แต่ตัวอย่างนี้ผมใช้สีดำ
รูปที่ 2 ทำการดอทตัวเส้นเป็นสีดำขึ้นมา ตามภาพต้นแบบ
รูปที่ 3 ก็ทำการลงสีในส่วนต่างๆก่อน โดยลงแค่หนึ่งสีต่อหนึ่งระดับนะครับ
รูปที่ 4 เราก็จะทำการเพิ่มการไล่ระดับชั้นสีเข้า ตรงผมตั้งระดับของแต่ละสีไว้ไม่เกิน4ระดับ
รูปที่ 5 เส้นดำที่เราตัดเส้นไว้ เราจะการเปลี่ยนสี เพื่อให้เป็นการเพิ่มมิติของตัวละครเข้าไปอีก
รูปที่ 6 ตรงนี้ก็เป็นการเก็บรายละเอียดต่างๆ ภาพนี้ใส่สีไปทั้ง24สีครับ
เอามาวางแปะเทียบกับตัวละครอื่น ทุกขั้นตอนสามารถประยุกต์ใช้ตามความถนัดของแต่ละคนได้นะครับ ส่วนเรื่องการทำอนิเมชั่นให้ตัวละครไว้คราวหน้าจะหาโอกาสทำมาลงเพิ่มให้อ่านกันนะครับ
อ้างอิง ข้อมูลบางส่วนจาก
http://www.zoggles.co.uk/ ---------------------------เวปนี้ใครอยากศึกษางานPixelArtเพิ่มเข้าไปดูได้ครับ
http://www.nectec ----------------------------------- ข้อมูลอธิบายเรื่องไฟล์ของงานกราฟิค
edit @ 30 May 2008 18:57:44 by nikki009







