Piksel sanat platformumun 720p'den 1080p'ye ölçeklendirilmesi


12

PC ve akıllı telefon için bir piksel sanat 2D platform geliştiriyorum, ancak teknik bir sorunla karşı karşıya kaldım.

32x32 karo çözünürlüğüne ve 64x64 karakter hareketli grafiğe sahip olmayı seçtim. Seviyeler "ekranlar" dediğim bölümlere ayrılmıştır ve her ekranda 40x23'e yakın 40x22.5 döşemem var, bu yüzden minimum çözünürlük 1280x720'dir.

Oyunda, bir çift atlama mekaniği var, bu yüzden her "ekranda" iyi bir dikey görüş menziline ihtiyacım var.

Sorun geliyor: 1280x720 çok yüksek bir çözünürlük değil. HD monitörlerde pencere büyük olmaz ve çözünürlüğü 2x arttırırsam, 2560x1440'ta olur ve pencere gerçek bir HD monitörden çok daha büyük olur. 1280x720 ile 2560x1440 arasındaki boyutları denersem grafikler kesilmeye başlar veya deforme olur.

Bu sorunu nasıl çözebilirim? Tüm karoları ve spriteları 16x16 formatında yeniden çizmemi gerektirmeyen bir çözüm var mı?


Çözünürlüğü azaltmak ancak kameranın ekranı hareket ettirmesi kabul edilebilir bir tasarım seçeneği midir? yani çözünürlük şimdi 640 x 360, ancak ekranlarınız hala 1280x720, ancak Metroid veya Axiom Verge gibi odanın etrafında hareket etmeniz mi gerekiyor?
lozzajp

Yanlış bir yerdesiniz, 2d oyun olsa bile, bir kamera tanımlamanız gerekiyor. Böylece kamera görüntüleme çözünürlüğünü, fov ve açıları tanımlar ve verileri sadece kameraya sunarsınız. Bu şekilde oyununuz resoultiondan bağımsızdır
Yosh Synergi


Sorunun tam olarak ne olduğundan emin olmaya çalışıyorum. 1280X720 harita ekranınızın 1920X1080 monitör ekranından daha küçük olduğu için harita ekranınızı mümkün olduğunca 'tam ekran' olacak şekilde yükseltmek mi istiyorsunuz? Ben 16X16 fayans çizim zaten (anladığım gibi) sorunu çözmez gibi karıştı.
RobM

@DMGregory, bana kesirli ölçek kullanırken ölçeklemede eserler içeren bazı örnekler verebilirseniz, bu, her iki yönde bir görüntüyü ölçeklediğimde, tutarın aynı olması durumunda daha önemli olmadığı tek bir senaryo hayal edemediğim için harika olurdu. tam veya kesirli bir sayı, bu yapay nesneler ortaya çıkıyor. eserler ile, yani orada olmamalı, bulanıklıktan farklı, yeterli piksel olmadan yüksek ölçeklemeye kadar olan şeyleri kastediyorum.
Yosh Synergi

Yanıtlar:


16

Bunun neden piksel sanatında bir sorun olduğunu merak eden herkes için, Super Mario World'den bir sahne kullanan hızlı bir örnek:

Ölçekli, eserleri gösteren piksel sanat sahnesi örneği

Bir piksel sanat oyununu çalışma zamanında 720 ila 1080 arasında ölçeklendirirsek (tipik bir oyun kamerasının yapabileceği şekilde), kaynak piksel başına ekran piksellerinin tamsayı olmayan oranı nedeniyle yapay öğeler alırız. Sağdaki ölçeklendirilmiş örnekteki sayıların tutarsızlığını ve yaprak ile Mario'nun kulağının nasıl göründüğünü kontrol edin.

Oynanabilir, ancak büyüleyici piksel sanatının netliğini kaybetti. Ve hareket halinde bu eserler sprite genelinde tarayabildiğinden o pırıltılı görünmesini sağlar.

Bitişik pikselleri harmanlayan bir filtreleme modunun kullanılması dalgalanmalardan kaçınır, ancak bunun yerine piksel resmini lekeler ve bulanıklaştırır, bu yüzden de arzu edilmez.


Ne yazık ki 720p ve 1080p arasındaki 1.5x oranı karşılaşabileceğimiz en kötü senaryodur.

Belirttiğiniz gibi, 1x ölçeklendirmesi çok küçük ve 2x çok büyük, her iki yönde de geniş bir kenar boşluğu var ve aramızda tam sayı ölçeklendirme oranı yok .

Seçenekleriniz aşağıdakilere kadar kaynar:

  • Oyununuzu ekrandan 1/3 daha küçük bir pencerede göstererek 1x ölçeği tolere edin, alanı doldurmanız gerekiyorsa dekoratif kenarlıklar ekleyin.

    • Yüksek çözünürlüklü ekranlarda bir kerede daha fazla sahnenizi göstererek kırpmayı uzatabilirsiniz. Bu, gerekli dolgu / posta kutusunu azaltır, ancak oyunun nasıl oynandığını etkileyip etkilemediğini değerlendirmeniz gerekir.

      (örneğin, bazı cihazlardaki oyunculara haksız bir avantaj sağlıyor mu veya kolayca görmemesi gereken sırları bulmalarına izin veriyor mu?)

  • 2x ölçeklendirin ve sahnenizi kırpın , böylece oyuncu bir kerede daha az sahne görür (daha önce görebildiği kadar yaklaşık 3/4).

    Bu da oyunun nasıl oynandığını etkileyebilir, örn. oyuncunun çift atlamak için ihtiyaç duyduğu yerleri görmesini zorlaştırarak.

    • Bunu kamera mantığıyla telafi ederek, görünüm panosunun oynatıcıyı takip etmesini veya tahmin etmesini sağlayabilirsiniz, böylece önemli içerik daha küçük kırpmadaki bir ekranda hala görülebilir, ancak kullanılacak en iyi evrensel kamera yoktur.

      Bu rotaya gitmeye karar verirseniz, oyununuzun ve mevcut kameranızın bazı ayrıntılarını ve örnek bir sahneyi paylaşmayı deneyin. Bununla, kamera davranışını telafi etmek için ayarlamaya yardımcı olabiliriz (veya oyununuz daha fazla görünürlük gerektirebilir)

  • Farklı bir çözünürlükte alternatif varlıklar oluşturun . (Evet, bu çok fazla iş, ancak oyunun görünümünü ve hissini kontrol etmek için en iyi seçenekleri sunuyor)

    Bu, 720p'de harika görünen mevcut varlıklarınızı atmanız gerektiği anlamına gelmez. Bu makalede, daha geniş bir yelpazedeki hedef çözünürlüklerini desteklemek için farklı varlık kümeleri arasında bağlamsal olarak geçiş açıklanmaktadır (Unity'de, ancak ilke Unity olmayan oyunlarda da uygulanabilir).

    • Belirttiğiniz gibi, tüm öğelerinizi yarım boyutta ( 16x16 fayans, 32x32 karakter ) yeniden çizmek , şu anda sahip olduğunuz sayıda karo ile 2x ölçeğinde 720p ve 3x ölçeğinde 1080p kullanmanıza olanak tanır. Küçük karo çözünürlüğünü görsel olarak daha kısıtlayıcı bulabilirsiniz.

    • Ayrıca , 1x ölçeğinde 1080p'yi işleyebilecek % 150 daha büyük ( 48x48 kutucuk, 96x96 karakter ) alternatif, "geniş format" bir varlık kümesi çizebilirsiniz . (Mevcut varlıklarınızı 720p veya 1440 vb. İçin kullanırsınız). Daha büyük çözünürlük, mevcut sanatınızın sadakatini korumanıza yardımcı olacaktır, bu nedenle şu anda sahip olduğunuz stil ve ayrıntıları feda etmek zorunda kalmazsınız.

      % 150 ölçekte yeniden çizilen varlık örneği

    • Üçüncü bir seçenek, 2x ölçeğinde 1080p'yi işleyebilen ve yine tüm varlık boyutlarınızı yarıya indirmekten daha az fedakarlık anlamına gelebilecek sadece biraz daha küçük bir varlık kümesi ( 24x24 fayans, 48x48 karakter ) çizmektir .

      Bu seçeneklerin üçü de çerçevelemenizi ve oyununuzu 720 & 1080'de tamamen aynı tutmanıza izin verir, ancak varlık çalışmasını kabaca iki katına çıkarır.

Maalesef burada kolay bir kazanç yok, sadece farklı takaslar var.


2
orijinal ölçeği korumayı ve dekoratif sınırları kullanmayı belirtiyorsunuz. Bağlama bağlı olarak, burası puan ve hayat gibi GUI öğelerini koymak için mükemmel bir yer olabilir. Bu sınırlar bu tür bilgilere uygun şekilde sığacak kadar büyükse, 'dolgu' gibi daha az, daha 'içerik dolu' ve oyunla alakalı görünmesini sağlayabilir.
Gnemlock

3

Özel olarak @ DMGregory'nin farklı çözünürlüklerde alternatif varlıklar oluşturma seçeneği üzerinde durmak:

Bildiğim en iyi çözüm muhtemelen bu noktada sizin için en az kullanımdır: sanat varlıklarınızı vektör formatında geliştirin ve daha sonra gerektiği gibi rasterleştirin. Bu sihirli bir kurşun değil; çoğu zaman rasterleştirmeden sonra küçük bir el işi modifikasyonu yapmanız gerekir.

Bir sonraki en iyi seçenek, çeşitli görüntü ölçekleme algoritmalarını, özellikle piksel sanat ölçekleme algoritmalarını denemektir . Daha önce olduğu gibi, bu bir pankea değil; belirli bir ölçeklendirme algoritmasının seçilmesi yüksek oranda içeriğe özgüdür. Oyunun 'sanat' ile olduğu kadar sanatın kendisi ile de ilgisi vardır ve iyi bir algoritma + sanat eşleşmesi ile bile, muhtemelen bazı spriteları elle ayarlamanız gerekecektir.

Her iki durumda da fikir, işin büyük kısmını sizin için yapmak ve insan çabasını kalan ayrıntılara odaklamak için bir araç kullanmaktır. @DMGregory'nin dediği gibi, "burada kolay bir kazanç yok, sadece farklı takaslar var."


Kesirli ölçeklemeye ilişkin düzenleme: Çoğu piksel resmi ölçekleme algoritması yalnızca tam sayılara göre artar. Kendi özel ölçekleme algoritmanızı döndürmekten kısa bir süre sonra, aradığınız 1.5x değişikliği elde etmek için muhtemelen ölçeklendirme ve ölçek küçültmeyi birleştirmeniz gerekecektir. Referans olarak, scale3x algoritmasını lüks ve fant algoritmasını küçültme ile% 50 oranında birleştirmenin sonucu:

Orijinal:

resim açıklamasını buraya girin

Ölçekli:

resim açıklamasını buraya girin


Ne yazık ki, bulduğum çoğu piksel sanat ölçekleme algoritması hala sadece tam sayı yükseltme (genellikle 2x, 3x, 4x) işleme eğilimindedir, bu yüzden 720-> 1080 durumuyla fazla yardımcı olmazlar. (? Belki biri 3x piksel upscaler sonra altörnekleyebilirsiniz yarı yarıya ... Değil emin doğrudan lüks daha iyi veya daha kötü olmazdı eğer kullanabilirsiniz)
DMGregory

Geçerli nokta. Bunu ele almak için biraz düzenlenmiş. Ayrıca , kesirli ölçeklemeyi destekliyor gibi görünen bu gölgelendiriciyi de tökezledim .
Pikalek

Vektör çözümüne +1. Varlıklarınızı gerçekten büyük ve küçültmelisiniz.
Mark Aven
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.