ลองมาอ่านดู ก่อนจะเขียนแม๊พนะครับ น่าจะช่วยได้เยอะ

[boyhit]

บทเรียนที่1

การสร้างแม๊พ : คุณต้องรู้จักเรื่องของเลเยอร์ซะก่อน

เราลองคิดว่าเลเยอร์คือพลาสติกใส ในRMXP จะมีทั้งหมด 3 เลเยอร์
ก็เท่ากับว่า มีพลาสติกใส3แผ่น แผ่นแรกอยู่ล่างสุดคือ
BASEหรือพื้นผิวแผ่นที่สองจะอยู่ทับแผ่นแรก ไว้ใช้เพื่อการซ้อนทับ
หรือสร้างมิติของภาพ
แผ่นที่สาม เอาไว้ซ้อนทับในสิ่งที่เราต้องการ **สมมุติว่าเราใส่ต้นไม้ไว้ใน
เลเยอร์2แล้วต้องการใส่โพรงไปในต้นไม้ เราจะใช้เลเยอร์ที่3 เป็นต้น


นี่คือเทลเซ็ทนะครับ

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


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


คราวนี้ลองเทส เพลย์นะครับ

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


อันนี้ก็อีกตัวอย่างหนึ่งนะครับ



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



บทเรียนที่สอง

การซ้อนเลเยอร์

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



ก่อนอื่น คุณต้องเข้าใจเรื่องการซ้อนทับของเลเยอร์ก่อน
เราลองคิดว่าเลเยอร์คือพลาสติกใส ในRMXP จะมีทั้งหมด 3 เลเยอร์
ก็เท่ากับว่า มีพลาสติกใส3แผ่น แผ่นแรกอยู่ล่างสุดคือ BASEหรือพื้นผิว
แผ่นที่สองจะอยู่ทับแผ่นแรก ไว้ใช้เพื่อการซ้อนทับ หรือสร้างมิติของภาพ
แผ่นที่สาม เอาไว้ซ้อนทับในสิ่งที่เราต้องการ**สมมุติว่าเราใส่ต ้นไม้ไว้ใน
เลเยอร์2แล้วต้องการใส่โพรงไปในต้นไม้ เราจะใช้เลเยอร์ที่3 เป็นต้น

วิธีซ้อนทับ
1.เลเยอร์แรกเป็นฐาน ใสพื้นหญ้า และ อื่นๆ


2.เลเยอร์ที่สอง ใส่ต้นไม้ และส่วนที่ต้องการซ่อน
***ถามว่า ทำใมต้องใส่ส่วนที่ต้องการซ่อนไว้ด้วยในเมื่อเราก็มองไม่เห็น
ที่ทำก็เพราะว่าบางที อาจจะเกิดการทับเทลเซ็ทเช่น การเดินทะลุกำแพง
การเดินเหยียบหลังคา เป็นต้น เราทำไว้เพื่อป้องกันเหตุการณ์เช่นนี้
ลดขนาด: 79% จากขนาดเดิม [ 644 x 465 ] - คลิกเพื่อดูภาพขยาย



3.เลเยอร์ที่3 เป็นเลเยอร์ปกคลุม จะใช้ควบคู่กับการปกคลุมของชั้นในเทลเซ็ท
เพื่อการคลุมสิ่งของ ฮีโร่ หรือเทลเซ็ทอื่นๆ คล้ายๆว่าเราต้องการปกปิด
หรือบังสิ่งใดก็ให้ใส่ไว้ในเทลเซ็ทนี้
ลดขนาด: 79% จากขนาดเดิม [ 642 x 467 ] - คลิกเพื่อดูภาพขยาย


ใช้ควบคู่กับ การปกคลุม และ ลำดับชั้น
ลดขนาด: 68% จากขนาดเดิม [ 746 x 654 ] - คลิกเพื่อดูภาพขยาย


ลดขนาด: 68% จากขนาดเดิม [ 752 x 653 ] - คลิกเพื่อดูภาพขยาย


ลองเอาไปทำดูนะครับ



บทเรียนที่3 ตามคำขอ
Tileset และ ปัญหาเวลารันในเทสเกม หรือ เวลาเล่นจริง


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


1.
เริ่มจากการ import ไฟล์เข้ามา เป็น
ไฟล์ของไทล์เซท[ไฟล์ของไทล์เซ็ทจะต้องอยู่ในโฟลเดอร์ Graphics/Tilesets
เท่านั้น]แล้วเข้าไปที่ฐานข้อมูล กำหนดจำนวนของแม๊พให้เพิ่มขึ้น
ลดขนาด: 93% จากขนาดเดิม [ 550 x 484 ] - คลิกเพื่อดูภาพขยาย



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


3.ลองทดสอบดูจะเห็นว่า ทุกพื้นที่ในแม๊พ เราผ่านได้หมด
ลดขนาด: 80% จากขนาดเดิม [ 640 x 512 ] - คลิกเพื่อดูภาพขยาย



4.
คราวนี้มาลองที่ ผ่านได้ - ไม่ได้ กัน ปรกติแล้วถ้าเรา import ไฟล้เข้ามา
ทุกพื้นที่ของmapจะเป็น "o" = ผ่านได้
แต่ถ้าเราต้องการให้บางพื้นที่ผ่านไม่ได้ล่ะ เราก็ต้องคลิ๊กไปที่
"o"มันจะกลายเป็น "x" = ผ่านไม่ได้
ปล.**การผ่านได้ หรือไม่ได้ จะกินเนื้อที่ 1 กรอบที่ตัว "o"หรือ"x"อยู่ในนั้น
แต่ยังมีอีกสัญลักษณ์ นั่นคือ "สี่เหลี่ยม" = อนุญาติให้ผ่านได้เฉพาะการกำหนดตัวแปรอื่นๆแล้วเท่านั้น



5.
เมื่อลองเทสดูแล้วได้ผลว่าเข้าไม่ได้ แต่ส่วนที่กำหนดให้ผ่านได้บางพื้นที่
ตัวเรายังบังอยู่ จึงลอง เข้าไปที่ลำดับชั้น พอเข้าไป จะเห็นว่า มี " . "
อยู่เต็มไปหมด จึงทดลองคลิ๊กดูที่" . "ดูจะพบว่ามีสัญลักษณ์ดาว และ
ตัวเลขขึ้น ัวเลขบ่งบอกถึงลำดับชั้น ตัวเรารวมถึงเทลเซ็ทที่ไม่มีดาวจะ
อยู่ลำดับชั้นที่0 เลข1-5 คือลำดับการบัง 5จะอยู่บนสุด ส่วน1 จะอยู่ล่างสุด
แต่1ก็ยังบังเราอยู่ดี ลองให้เสา[ในรูป ]เป็น3ดาว แล้วทดลองรันเกม


6.
ปรากฎว่า เสาบังเราซะมิด วิธีนี้นำไปประยุกต์ได้หลากหลาย
ลองนำไปทดลองปฎิบัติหลายๆแบบดูสิครับ อย่างผมเอาไปประยุกต์เรื่องคานหรือเสา
ของบ้าน อะไรแนวนี้อ่ะ
ลดขนาด: 80% จากขนาดเดิม [ 633 x 481 ] - คลิกเพื่อดูภาพขยาย



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


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



9.เมื่อรันเกม จะเห็นได้ว่า เราเข้าไปในประตูได้แต่พอหันซ้ายและขวา ตัวละครของเราจะไม่บังเทลเซ็ทแล้ว
ลดขนาด: 80% จากขนาดเดิม [ 633 x 484 ] - คลิกเพื่อดูภาพขยาย



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



บทเรียนที่สี่


แสงและน้ำหนัก

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

เรามาดูตัวอย่างกันนะครับ

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

มาดูอีกตัวอย่างครับ

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

ตัวอย่างสุดท้าย

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


ถ้าคุณมีความละเอียดในการทำแม๊พสูงล่ะก็ จะทำให้เกมของคุณน่าเล่นกว่าเดิมเยอะเลยครับ
บทเรียนที่ 5

หลักของความสมดุลย์


Balance ความเท่ากันของวัตถุ
จริงๆแล้วการเท่ากันของวัตถุนั้น
ไม่จำเป็นต้องเป็นสิ่งของชนิดเดียวกันก็ได้เพียงแต่
เราต้องมองแล้วรู้สึกว่ามันเท่ากัน สายตาของมนุษย์
เวลาจะมองสิ่งที่ดูเท่ากันแล้วสวยนั้น จะต้องใช้ Focal Points ในอัตราส่วน 1
: 1.618 ด้านซ้ายเท่ากับ 1 ด้านขวาเท่ากับ 1.618 ถึงจะมองแล้วสวย
จะดูได้จากGolden Ratio มันจะทำให้คุณค้นหาFocal Points ได้ง่ายขึ้น


จากรูปด้านบน แสดงถึงจุด Focal Points หรือจุดสนใจของภาพนั้นๆ

ผมจะแสดงตัวอย่างให้เห็นว่า รูปข้างล่างแสดงถึงความเท่ากัน และไม่เท่ากันได้อย่างไร
ลดขนาด: 79% จากขนาดเดิม [ 642 x 511 ] - คลิกเพื่อดูภาพขยาย



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


Value and Contrast น้ำหนักและความพอดี

ลดขนาด: 79% จากขนาดเดิม [ 642 x 507 ] - คลิกเพื่อดูภาพขยาย



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

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


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

Size and Shape ขนาดและรูปทรง

ลดขนาด: 79% จากขนาดเดิม [ 645 x 510 ] - คลิกเพื่อดูภาพขยาย



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

Credit withcrime