วิธีที่ดีที่สุดในการอนุญาตให้ผู้เล่นถ่ายภาพ“ Dye” โดยไม่สูญเสียคุณภาพสี?

ฉันกำลังสร้างเกม 2.5D isometric (ภาพ 2 มิติ)

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

ตัวละครในเกมของฉันไม่มีอุปกรณ์มากมาย เกมดังกล่าวใกล้เคียงกับที่ League of Legends จัดการกับตัวละครและกราฟิก อาจมีอักขระประเภทเดียว (เช่นฮีโร่) แต่มีหลายชุดสำหรับตัวละครเป็นตัวเลือก ฉันต้องการให้ผู้เล่นสามารถปรับแต่งได้มากที่สุดใน "ชุด" และตัวละครในจำนวนที่ จำกัด

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

ถ้าฉันสามารถใช้โทนสีเทาได้โดยไม่ทำให้สีผมเสีย

นี่คือตัวอย่างของสิ่งที่ฉันกำลังพูดถึง:

มันเป็นไปไม่ได้ที่จะ "ย้อม" มังกรไม่ว่าฉันจะใช้ตัวเลือก "Color Overlay" ของ Photoshop ก็ตาม เห็นได้ชัดว่าฉันทำผิดถ้าเป็นไปได้ที่จะทำให้สีดีขึ้นโดยใช้โทนสีเทา สำหรับสีเช่นสีเขียวหรือสีเหลืองหรือสีม่วงอ่อนงานนี้ใช้ได้ สำหรับสีอื่น ๆ มันทำลายศิลปะ

อย่างไรก็ตามมันดูดีขึ้นมากถ้าฉันไม่ได้ระดับสีเทาและเพียงแค่ใช้สี "HUE" กับภาพต้นฉบับ (แดง / เหลือง)

สีแดง

ม่วงเว้

ตอนนี้ผู้เล่นสามารถย้อมสี Dragon ANY ได้และมันก็ยังดูดีอยู่! (สีเหลืองเปลี่ยนเป็นสีขาวในขณะที่สีแดงเปลี่ยนเป็นสีรุ้ง)

นี่หมายความว่า WHITE หรือ BLACK เป็นสีรองที่ดีที่สุดหรือไม่? จากนั้นใช้วิธีหรือ shader เพื่อเปลี่ยนสีขาว (รอง) เป็นสีอื่น?

มีบทความใดบ้างเกี่ยวกับวิธีการที่ซับซ้อนนี้ในการถ่ายภาพเดี่ยวและใช้สีย้อมพิกเซลที่แตกต่างกันหรือไม่?

สำหรับมังกรมันจะดีที่สุดในฐานะมังกรคอนทราสต์สูงสีขาว / ดำหรือไม่ ชุดสีแดง / เหลืองดีที่สุดหรือไม่ มันกลับกลายเป็นสิ่งที่ดีกว่าสำหรับภาพมากกว่าสีอื่น ๆ ที่ฉันลอง สีเทายังคงเหนือกว่าหรือไม่?

"ตัวเลือกการผสม" ของ Photoshop ไม่มีวิธีการในการ "ย้อม" ภาพที่เหมาะสมสำหรับวิดีโอเกมหรือไม่ Shaders / วิธีการที่ซับซ้อนช่วยให้ฉันประสบความสำเร็จได้ดีขึ้นหรือไม่?

หมายเหตุ: หาก GrayScale อนุญาตให้ฉันลดการใช้ RAM ของภาพหรือป้องกันการสูญเสียคุณภาพในระหว่างการบีบอัดข้อมูลที่สูญหายนั่นจะเป็นสิ่งที่ฉันจะพิจารณาอย่างจริงจัง

Hue-shifting เป็นความเป็นไปได้อย่างหนึ่งที่จะทำให้คุณได้สีที่หลากหลายโดยไม่สูญเสียรายละเอียดของสี แนวคิดพื้นฐานคือการแปลงแต่ละพิกเซลจาก RGB เป็นพื้นที่ HSV จากนั้นชดเชยเว้ด้วยจำนวนที่ผู้ใช้กำหนดจากนั้นแปลงกลับเป็น RGB ที่จริงแล้วสามารถทำได้อย่างมีประสิทธิภาพมากขึ้นโดยใช้เมทริกซ์การหมุนกับค่า RGB: สร้างเมทริกซ์ที่หมุนรอบแกน (1, 1, 1) โดยมุมสีที่ผู้ใช้กำหนด จากนั้นคุณสามารถนำเมทริกซ์นี้ไปใช้กับค่า RGB แต่ละค่าในส่วนของพิกเซลของคุณ

สิ่งนี้จะช่วยให้มังกรสีแดง - เหลืองเปลี่ยนเป็นสีเหลือง - เขียว, เขียว - น้ำเงิน, ฟ้า - น้ำเงิน, น้ำเงิน - แดงอมม่วงหรือมังกรแดง - แดง นี่เป็นข้อ จำกัด เล็กน้อยเนื่องจากทั้งสองสีไม่สามารถเปลี่ยนแปลงได้อย่างอิสระด้วยวิธีการนี้ พวกเขาจะรักษาเฉดสีญาติของพวกเขาในขณะที่พวกเขาเขียนในภาพต้นฉบับ นอกจากนี้ยังมีบางสีที่คุณไม่สามารถเข้าถึงได้เช่นคุณไม่สามารถสร้างมังกรขาวดำได้ อย่างไรก็ตามนี่อาจจะเพียงพอสำหรับวัตถุประสงค์ของคุณ

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

finalColor = image.r * userColor1 + image.g * userColor2 + image.b * userColor3;

วิธีนี้จะช่วยให้ผู้ใช้สามารถเลือกชุดสีที่ต้องการรวมถึงสิ่งต่าง ๆ เช่นขาวดำหรือม่วงและทอง

ปัญหาที่คุณเผชิญคือการที่คุณไม่สามารถ "แต้มสี" ภาพทั้งหมดลักษณะที่คุณเห็นเป็นมากกว่าแค่สีพื้นฐาน สำหรับหนึ่งคุณมีการไล่ระดับสีที่ดีจากวัสดุหนึ่งไปยังอีกวัสดุหนึ่ง แต่ที่สำคัญกว่านั้นคุณยังมีการสะท้อนแสงไฮไลท์และเงาซึ่งไม่ได้รับอิทธิพลจากสีพื้นฐาน (สิ่งเหล่านั้นจะถูกเพิ่มเข้าไปด้านบน)

ดังนั้นคุณต้องแยกส่วนประกอบภาพออกเป็นส่วนประกอบ

ตัวอย่าง :

ในกรณีนี้เรามี 3 ชั้น:

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

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

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

อินพุต: MainTexture (RGB), Mask1Texture (A), Mask2Texture (A), Colour1 (ลอย), Colour2 (ลอย)

เอาท์พุท: (Mask1Texture + Mask2Texture) -MainTexture + Colour1 * Mask1Texture + Colour2 * Mask2Texture

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

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

ปล. ถ้าคุณแค่คิดถึงการใช้สีที่กำหนดเองคุณสามารถใช้ช่องอัลฟ่าของพื้นผิวหลักของ RGBA32 เป็นหน้ากากของคุณ

คุณสามารถใช้จานสีและให้ผู้เล่นแก้ไขจานสี หากคุณใช้เฉดสีคุณสามารถใช้พื้นผิว 1D เป็นจานสีและค่าสีเทาดั้งเดิมเป็นดัชนี

ในการแปลงภาพสีจริงให้เป็นภาพที่มี 255 สีคุณสามารถนำค่าสีพิกเซลทั้งหมดของคุณและจัดกลุ่มพวกมันในพื้นที่สี 3d เป็น 255 กลุ่มด้วยอัลกอริทึม k-mean หรือใช้เครื่องมือแปลงภาพทั่วไป จากนั้นจึงเป็นสิ่งสำคัญที่จะกล่าวถึงการแก้ไขของค่าพื้นผิวสีเทาจะเป็นการแก้ไขดัชนีในพื้นผิวสีของคุณ วิธีนี้จะนำไปสู่ผลลัพธ์ที่คุณมีหลายสีระหว่างสองข้อความในภาพต้นฉบับของคุณ สิ่งนี้สามารถแก้ไขได้โดยการปิดใช้งานการแก้ไข (ฉันคิดว่าคุณไม่ต้องการทำเช่นนั้น) หรือโดยการเรียงลำดับจานสีของคุณในลักษณะที่มีประโยชน์

คุณสามารถแปลงภาพเป็นภาพสีเทา แต่ยังคงบันทึกด้วยช่อง rgba เก็บค่าน้ำหนักในช่องอัลฟาจากนั้นใช้สิ่งนี้เพื่อตัดสินใจว่าจะใช้สีย้อมกับพิกเซลเท่าใด น้ำหนักนี้สามารถคำนวณได้โดยขึ้นอยู่กับว่าสีใกล้เคียงกับสีขาวอย่างไร ยิ่งพิกเซลใกล้ชิดกับสีขาวมากเท่าไรก็ยิ่งใช้สีย้อมน้อยลงหรือยิ่งมีน้ำหนักน้อยลง สิ่งนี้จะทำให้ไฮไลท์ส่วนใหญ่มีความสว่างดั้งเดิม แต่ใช้สีย้อมเล็กน้อย พิกเซลสีสุดท้ายสามารถพบได้โดยการคำนวณแต่ละช่อง Ro + (Rd * Ao) โดยที่ Ro คือสีแดงดั้งเดิม Rd คือสีแดงในสีย้อมและ Ao คืออัลฟ่าของต้นฉบับ ดังนั้นพิกเซลสีขาวทั้งหมดจึงไม่มีสีใหม่และพิกเซลสีดำทั้งหมดจะถือว่าเป็นสีย้อม