สิ่งที่ฉันควรทราบเมื่อสร้างเกม 2 มิติสำหรับความละเอียดหลาย ๆ


27

ฉันกำลังสร้างเกม 2D (Android) อุปกรณ์ Android มีความละเอียดหน้าจอค่อนข้างแตกต่างกันมาก ฉันต้องคำนึงถึงอะไรเมื่อสร้างเกม

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

คำตอบ:


26

ฉันเป็นผู้พัฒนาเกมพกพาที่พกพาได้ทุกอย่างตั้งแต่พีซีไปจนถึงทีวีหรือแม้แต่ Amazon จุดดำและขาว (Smiles HD - http://smileshd.com - อุปกรณ์และแพลตฟอร์มมากกว่าที่คุณเห็น) .

วิธีที่ดีที่สุดที่ฉันพบว่าสนับสนุนอุปกรณ์ใด ๆ คือเลือกความละเอียดพื้นฐานจากนั้นขยายขนาด (หรือลดลง) ไปที่หน้าจอปัจจุบัน หากคุณต้องการโกงคุณสามารถปรับให้เหมาะกับความละเอียดหน้าจอใหม่ได้ แต่โดยหลักแล้วคุณควรคงอัตราส่วนภาพไว้เหมือนเดิม การปรับเกมให้เหมาะกับจอแสดงผล 4: 3 นั้นดูน่ากลัวใน 16: 9 แต่การปรับ 16: 9 เข้ากับ 16:10 คงไม่มีใครสังเกตเห็น คุณจะทราบว่าฉันอ้างอิงถึงหน้าจอตามสัดส่วนภาพไม่ใช่มิติซึ่งเป็นวิธีที่มีประโยชน์อย่างยิ่งในการคิดในยุคของขนาด LCD แบบสุ่มทั้งหมดนี้

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

http://en.wikipedia.org/wiki/Safe_area

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

นอกจากนี้การสร้างภาพสแตติกใหญ่กว่าที่ผู้ใช้ทั่วไปของคุณจะเห็น กว้างกว่าแบบจอกว้าง (16: 9) และความกว้างกว่าแบบมาตรฐาน (4: 3) กลับไปที่พื้นที่ปลอดภัยที่มีชื่อเรื่องติดตั้งข้อมูลสำคัญของคุณในพื้นที่ปลอดภัยเพิ่มขนาดขึ้นเล็กน้อยเพื่อให้พื้นที่ปลอดภัยสัมผัสกับขอบหน้าจอด้านใดด้านหนึ่งของคุณแล้วปล่อยให้อุปกรณ์บางอย่างที่ใหญ่กว่านั้นเล็ก

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

ส่วนต่อประสานกับผู้ใช้ฉันชอบให้พอดีกับ UI หลักภายในสี่เหลี่ยมจัตุรัสกลางหน้าจอที่สมบูรณ์แบบ มุมและขอบตรงกลางยังทำให้สถานที่ที่ดีสำหรับวางสิ่งของ คุณควรคำนวณพิกัดของมันเช่น (สัมพันธ์กับมุมหรือขอบกลาง)

http://www.smileshd.com/press/iPad/png/UI01.png

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

ส่วนต่อประสานกับผู้ใช้ที่ปรับให้เหมาะกับหน้าจอทั้งสูงและกว้างอาจเป็นภาพที่น่าประทับใจ

Wide: http://www.smileshd.com/press/iPad/jpg/SmilesHD01.jpg

สูง: http://www.smileshd.com/press/iPad/jpg/SmilesHD02.jpg

ในด้านบวกการออกแบบที่ชาญฉลาดคุณเพียงแค่ต้องพิจารณาความสูงและความกว้างแทน Portrait + Reverse Portrait + Landscape + Reverse Landscape เมื่อคุณเลือกตำแหน่งของสิ่งต่าง ๆ บนหน้าจอให้พิจารณาตำแหน่งอื่นที่เหมาะสมกว่าสำหรับการวางแนวอื่น

ฉันจำเป็นต้องเก็บภาพขนาดใหญ่ทั้งหมดและย่อขนาดขึ้นอยู่กับความละเอียด (ไม่เปลืองเนื้อที่)

คุณสามารถ "เสียพื้นที่" และสนับสนุนอุปกรณ์ที่หลากหลายในแบบบิลด์เดียวหรือ "เสียเวลา" และต้องทำให้ MANY สร้างและปรับขนาดอาร์ตเวิร์กสำหรับอุปกรณ์มากมาย

กรณีที่ดีที่สุดคุณควรสร้างงานศิลปะของคุณที่ความละเอียดสูงกว่าขนาดสุดท้ายที่จะเป็นในโทรทัศน์ 1080p (1920x1080) 2048x2048 ควรมีขนาดร่วมกันในแหล่งงานศิลปะของคุณ หรือพิจารณาใช้เครื่องมืออาร์ตเวิร์คของ Vector เช่น Flash และ Adobe Illustrator

ฉันขอแนะนำอย่างยิ่งให้สร้างกระบวนการอัตโนมัติสำหรับปรับขนาดงานศิลปะของคุณ อุปกรณ์มือถือส่วนใหญ่ในปัจจุบันรวมแท็บเล็ตไม่เกินความละเอียดมากกว่า 720p (1280x720) ... อย่างน้อยก็ไม่มาก มาปีหน้าเราแค่ไม่รู้ว่ามันจะเป็นจริงอีกต่อไป (iPad 3)

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

แบบอักษรบิตแมปมาตราส่วนดีหรือฉันต้องใช้อย่างอื่นหรือไม่

มันจะขยายได้ดีถ้าคุณใช้ตัวกรองที่ดี หากคุณกำลังสร้างเกม 2D ด้วยฮาร์ดแวร์ 3D (OpenGL ES) ฉันต้องขอแนะนำอย่างยิ่งให้คุณใช้การกรองเชิงเส้นร่วมกับ MipMapping (เช่นชุดภาพที่ปรับขนาดลง) คุณสามารถรับผลลัพธ์ที่สมบูรณ์แบบด้วยวิธีนี้และบ่อยครั้งที่จะใช้ mipmaps เร็วกว่าที่จะไม่ทำ

http://en.wikipedia.org/wiki/Mipmapping

อย่างไรก็ตามฉันหวังว่าจะช่วยได้ ขอให้โชคดีกับโครงการของคุณ


2

โดยทั่วไปทุกพื้นผิวที่คุณทำควรเป็น 256x256 หรือ 512x512 หากคุณกำหนดเป้าหมายไปที่ pads (Galaxy Tab, Honecomb, iPad) ดังนั้น 512x512 จะไม่เต็มหน้าจอดังนั้นคุณอาจต้องการรวมเนื้อหาศิลปะที่มีขนาดใหญ่กว่าซึ่งจำเป็นต้องเติมเต็มหน้าจอ Apple มีคำต่อท้ายภาพ "@ 2x" ดั้งเดิมเพื่อรองรับเคสนี้

ทางออกที่ง่ายซึ่งฉันใช้เองคือสร้างเกมของคุณสำหรับหน้าจอ 320x480 (iPhone) ปล่อยให้สองเท่านี้ตามธรรมชาติสำหรับ iPhone 2 (640 x 960) และอีกกรณีเดียวที่คุณต้องจัดการแตกต่างกันคือความจริงที่ว่าอุปกรณ์ Android บางรุ่นมีหน้าจอที่สูงขึ้น - ดังนั้นเพียงวางบัฟเฟอร์ที่ด้านบนและล่าง โหมด).

ในระยะสั้น - สร้างเกมของคุณด้วยขนาดหน้าจอที่เป็นกลางหนึ่งขนาดจากนั้นครอบคลุมข้อยกเว้นตาม


2
ฉันคิดว่าคุณพลาดAndroidแท็กของฉัน อย่างไรก็ตามบัฟเฟอร์ดูด; มันจะดีกว่าถ้าเกมของคุณเพิ่มขนาดและดูดี
ashes999

1

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

แทนที่จะสร้างสำหรับขนาดหน้าจอเดียวหรือขนาดอื่นฉันขอแนะนำให้คุณสร้างสำหรับความหลากหลายตั้งแต่ต้น คุณไม่เพียง แต่พูดถึงความหนาแน่นของพิกเซลที่แตกต่างกัน แต่คุณยังพูดถึงอัตราส่วนที่ต่างกันด้วย 16x9 และ 16x10 สามารถให้ประสบการณ์ภาพที่แตกต่างกันมาก ดังนั้นให้แน่ใจว่าคุณทดสอบการเปลี่ยนแปลงใหม่ในรูปร่างและขนาดหน้าจอที่แตกต่างกัน

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


1

Android ให้ความช่วยเหลือสำหรับสิ่งนี้ ...

คุณสามารถระบุ "ทรัพยากรสำรอง" สำหรับรายการเช่นกราฟิกของคุณ
ดูที่ส่วน "การจัดหาทรัพยากรสำรอง" ที่ลิงค์นี้: http://developer.android.com/guide/topics/resources/providing-resources.html คุณควรจะสามารถหาตัวอย่างในตัวอย่าง SDK หรือผ่านทาง Google

นอกจากนี้ Google ยังมี Android Emulator ที่คุณได้รับจาก SDK คุณสามารถกำหนดอุปกรณ์เสมือนหลายตัวที่มีการกำหนดค่าที่แตกต่างกันเพื่อทดสอบรหัสของคุณ นี่คือลิงค์ไปยังข้อมูลเพิ่มเติม: http://developer.android.com/guide/developing/devices/emulator.html

ขอให้โชคดี


0

นอกจากด้านเทคนิค (แก้ไขโดย Mr Strange) ระวังเมื่อออกแบบเกมที่มีขนาดหน้าจอตัวแปร ตัวอย่างเช่นลองจินตนาการถึงการเล่นบนถนนที่มีความโกรธในหน้าจอที่เหมือนแนวนอนและในหน้าจอแนวตั้ง

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.