Birden fazla çözünürlük için 2D oyunlar yaparken nelere dikkat etmeliyim?


27

2D (Android) oyunu yapıyorum. Android cihazlar ekran çözünürlüğünde oldukça değişkendir; Oyunumu yaparken akılda tutmam gerekenler nelerdir?

  • Tüm resimlerin büyük sürümlerini tutmam ve çözünürlüğüne bağlı olarak küçültmem gerekir mi?
  • Bitmap fontları iyi ölçeklenir mi yoksa başka bir şey kullanmam gerekir mi?
  • Unuttuğum başka bir şey var mı?

Yanıtlar:


26

PC'lerden TV'ye, hatta Black & White Amazon Kindle'a (Smiles HD - http://smileshd.com - Orada gördüğünüzden daha fazla cihaz ve platform) , her şeyle çalışan son derece taşınabilir bir mobil oyunun geliştiricisiyim. .

Herhangi bir cihazı desteklediğimi tespit etmenin en iyi yolu, bir temel çözünürlük seçmek, ardından geçerli ekrana ölçeklendirmek (veya küçültmek). Hile yapmak istiyorsanız, yeni ekran çözünürlüğüne sığabilirsiniz, ancak ideal olarak aynı en boy oranını korumalısınız. 4: 3 ekran için yapılan bir oyunun ayarlanması 16: 9'da çirkin görünüyor, ancak 16: 10'a 16: 9'un takılması hiç kimse farketmeyebilir. Bu, tamamen rasgele LCD boyutlarının bu döneminde düşünmenin özellikle yararlı bir yolu olan boyutlara değil ekran boyutuna baktığımı not edersiniz.

En boy oranını korurken herhangi bir ekrana uyan resimleri yapmak için, şimdiye kadar göreceğiniz en tipik ekranlardan daha büyük arka planlar oluşturun. Bu, Televizyonlu başlık güvenli alanlarına benzer.

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

Oluşturulan arka planlar bunun için gerçekten harika çalışıyor. Döşenmiş desenler, dama tahtası, fraktal şekiller, vb. Yeni bir ekrana sığdırmak için biraz daha üretmeniz gerekir.

Ayrıca, tipik kullanıcınızın göreceğinden daha büyük statik görüntüler oluşturmak. Geniş ekrandan daha geniş (16: 9) ve standart değerden daha keskin (4: 3). Yine başlık güvenli bölgelere geri dönün, önemli bilgilerinizi güvenli bir alana yerleştirin, biraz ölçeklendirin, böylece güvenli alanınız ekranınızın kenarlarından birine değsin ve biraz daha büyük olan cihazlar için biraz akın.

Bugün çalışıyorum bir varyasyon "başlık güvenli" 3D nesneler yaratıyor. Tamamen köşelerden oluşan 3D olduklarından, onları ekrandan daha büyük yapmak pratikte sığacaklarından daha fazla bellek gerektirmez. Piksellerin yoğunluğu arttıkça, daha yüksek detay dokuları elde etmek isteyebilirsiniz. Olmazsa, oh pekala, biraz bulanık.

Kullanıcı arayüzleri, ana UI'yi ekranın ortasındaki mükemmel bir kareye sığdırmayı seviyorum. Köşeler ve orta kenarlar aynı zamanda bir şeyler koymak için gerçekten iyi yerler yapar; Koordinatlarını bu şekilde hesaplamanız gerekir (göreceli köşe veya orta kenarlar).

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

Gerçekten fantezi almak istiyorsanız, hem Uzun hem de Geniş yönelimleri destekleyebilirsiniz. Bazı cihazlar ekran çözünürlüklerini geniş olduğundan daha uzun olarak bildirir (örneğin iPhone), bu nedenle, tüm koordinatlarınızı döndürüyor olsa bile, bu cihazlar için bir şeyler yapmanız gerekebilir.

Hem uzun hem de geniş ekranlara adapte olan bir Kullanıcı Arabirimi oldukça etkileyici bir manzara olabilir.

Geniş: http://www.smileshd.com/press/iPad/jpg/SmilesHD01.jpg

Uzun: http://www.smileshd.com/press/iPad/jpg/SmilesHD02.jpg

Artı tarafta, akıllıca tasarlayın, sadece Portre + Ters Portre + Manzara + Ters Manzara yerine Uzun ve Geniş düşünün. Ekrandaki şeylerin pozisyonlarını seçtiğinizde, diğer yönlendirme için daha uygun bir alternatif pozisyon almayı düşünün.

Tüm resimlerin büyük sürümlerini tutmam ve çözünürlüğüne bağlı olarak küçültmem gerekir mi?

Peki ya "alan israfı" yapabilir ve tek bir yapıya sahip daha çeşitli aygıtları destekleyebilir ya da "zamanınızı boşa harcayabilirsiniz" ve MANY'yi birçok aygıt için resim oluşturup yeniden boyutlandırmanız gerekebilir.

En iyi örnek, resminizi 1080p bir Televizyonda (1920x1080) elde edeceğiniz boyuttan daha yüksek çözünürlükte oluşturmalısınız. 2048x2048, kaynak resminizde ortak bir boyut olmalıdır. Bunu ya da Flash ve Adobe Illustrator gibi Vektör çizimleri araçlarını kullanmayı düşünün.

Resminizi yeniden boyutlandırmak için otomatik bir işlem oluşturmanızı şiddetle tavsiye ederim. Günümüzde çoğu mobil cihaz, tabletler dahil, en azından 720p (1280x720) 'den büyük çözünürlükleri geçmiyor. Yine de gelecek yıl gelin, bunun artık doğru olup olmayacağını bilmiyoruz (iPad 3?).

Her iki durumda da, en iyi performans için, kaynak çizimleri ve kaynak varlıkları fikrine alışmalısınız. Ardından, hedeflediğiniz cihazlara ait verileri optimize eden bir işlem gerçekleştirebilirsiniz.

Bitmap fontları iyi ölçeklenir mi yoksa başka bir şey kullanmam gerekir mi?

İyi bir filtreleme kullanıyorsanız, iyi ölçeklenirler. 2B oyununuzu 3B donanımla (OpenGL ES) yapıyorsanız, MipMapping (örneğin küçültülmüş bir görüntü kümesi) ile birleştirilmiş Doğrusal Filtreleme kullanmanızı şiddetle tavsiye etmeliyim. Bununla mükemmel bir şekilde mükemmel sonuçlar alabilirsiniz ve mipmap kullanmak çoğu zaman daha hızlıdır.

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

Neyse, umarım yardımcı olur. Projende iyi şanslar.


2

Genel olarak, yaptığınız her doku 256x256 veya 512x512 olmalıdır. Ayrıca, pedleri (Galaxy Tab, Honecomb, iPad) hedefliyorsanız, 512x512 ekranın tamamını doldurmaz, bu nedenle ekranı doldurması gereken sanat varlıklarının daha büyük sürümlerini dahil etmek isteyebilirsiniz. Apple bu durumu ele almak için yerel bir "@ 2x" görüntü eki içeriyor.

Kendimi kullandığım basit çözüm, 320x480 ekran (iPhone) için oyununuzu oluşturmak. İPhone 2 (640 x 960) için bunun doğal olarak iki katına çıkmasına izin verin, sonra gerçekten farklı şekilde ele almanız gereken diğer durum, bazı Android cihazlarının daha uzun boylu bir ekrana sahip olmaları gerçeğidir; modu).

Kısacası - oyununuzu bir nötr ekran boyutu için oluşturun ve ardından


2
Sanırım etiketimi kaçırdın Android. Neyse, tampon berbat; Oyununun gerçekten yükselmesi ve hoş görünmesi daha iyi.
ashes999

1

Sahip olduğunuz tüm varlıkların çalışma kopyalarını saklamak en iyisidir. Photoshop'ta bir görüntü geliştiriyorsanız, örneğin, orijinal psd dosyasını kaydedin. Farklı bir res görüntüsüne ihtiyacınız olduğunda, açıp yeni görüntüyü minimum kalite kaybıyla dışa aktarabilirsiniz.

Bir ekran boyutu veya başka biri için derlenmek yerine , en baştan size çeşitli bir yapı oluşturmanızı şiddetle tavsiye ederim. Sadece farklı piksel yoğunluklarından değil, aynı zamanda farklı boyut oranlarından da bahsediyorsunuz. 16x9 ve 16x10, çok farklı bir görsel deneyim sağlayabilir. Bu nedenle, çeşitli değişiklikleri farklı ekran şekilleri ve boyutlarında test ettiğinizden emin olun.

Deneyimlerime göre, bitmap fontları hiç iyi ölçeklenmiyor. Kullandığınız font stiline çok bağlı olabilir, ancak genel olarak font bitmap'in yeniden örneklenmesi çok kötü sonuçlar verir. Bitmap yazı tipleri, doku örneklemeniz çoklu örneklemeye ayarlanmadığında (GL_NEAREST ve mipmapler olmadan) en iyi şekilde çalışır ve ekrana piksel piksel eşleştirecek şekilde oluşturulur. Aynı yazı tipinin bir dizi sırasını farklı boyutlarda oluşturmayı düşünebilir ve yazı tipinin oyunda her zaman ölçek = = 1 olarak görünmesini sağlayabilirsiniz; Bu, belirli bir senaryoda kullanılacak font boyutunu seçerken bazı sınırlı seçeneklere izin verir.


1

Android bunun için bazı yardım sağlar ...

Grafikleriniz gibi öğeler için "alternatif kaynaklar" belirleyebilirsiniz.
Bu bağlantıdaki "Alternatif Kaynaklar Verme" bölümüne bakın: http://developer.android.com/guide/topics/resources/providing-resources.html SDK örneklerinde veya Google üzerinden örnekler bulabilirsiniz.

Ayrıca Google, SDK ile birlikte alabileceğiniz bir Android Emulator sağlar. Kodunuzu test etmek için farklı konfigürasyonlarda birkaç sanal cihaz tanımlayabilirsiniz. İşte daha fazla bilgi için bir link: http://developer.android.com/guide/developing/devices/emulator.html

İyi şanslar amb


0

Değişken ekran boyutunda bir oyun tasarlarken teknik özelliklerin yanı sıra (Bay Strange tarafından ele alınan) da dikkatli olun. Örnek olarak, peyzaj benzeri bir ekranda ve ardından bir portre ekranında öfke sokaklarını oynamayı hayal edin.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.