Daha iyi görünmesi için bir parlayan gölgelendiriciyi ayarlama


9

Basit bir oyunum var ve konuları bu küçük çizgiler. İOS ve android için hedeflenmiştir, bu yüzden şu anda üzerinde çalışabileceği BÜYÜK bir işlemci yelpazesine sahiptir.

resim açıklamasını buraya girin

İki nedenden dolayı onlara gerçek zamanlı parlaklık katmaya çalışıyorum

  1. Çoğu cihazda kenar yumuşatma işlemek için oluşturma sürem olmadığını gizlemeye çalışıyorum.
  2. Oyunun konusunun saf ışık olması gerekiyordu, bu resim saf ışık gibi görünmelidir.

Bir süredir ayrılabilir bir gauss bulanıklığı gölgelendiricisini ayarladım ve bir hayal kırıklığı noktasına geldim, sadece doğru görünmesini sağlayamıyorum, belki de sorun ışığın pürüzlü kenarlarını gizlice saklamaya çalışıyorum bu arada ışığın bulanık görünmemesi.

En büyük sorunum, en iyi şekilde görünmesini sağlayan tüm değişkenler.

Grafik / render konusunda çok yeniyim ve hiçbir şekilde sanatçı değilim. Bana ulaşmakla ilgili belki de en sinir bozucu şey, dahil olduğu düşünülen tüm değişkenlerdir. Işıma ile pek çok olası değişiklik gördüm.

  • A. Karışım modu, ekran karışım modu veya başka bir karışım ekleyin
  • B. bulanıklık bulanıklığı, ve normal kombinasyondan önce farklı
  • C. Gauss çan fonksiyonunun Sigma ( Bu kafa karıştırıcı hesap makinesini kullanıyorum, ancak diğer insanların sahip olduğu değerleri gördüğüm gibi görünmüyor)
  • D. sigma işlevine gönderilen "x" değerlerindeki skaleler
  • E. Numune ölçeği (bulanıklık yarıçapını küçültme veya büyütme)
  • F. Kızdırma tamponunun çözünürlüğünü değiştirme

Böyle çok değişkenle çalışırken "en iyi görünen" sabitleri nasıl bulur?

Ayrıca sorunlarım da var çünkü aramda bir değişiklik yapmak ve değişiklikleri görmek zor olduğu uzun bir zaman, gölgelendirici oyuncakta yapardım, ancak bu görüntüyü yükleyemiyorum veya prosedürel olarak böyle bir tane oluşturamıyorum.

Şu anda gerçekten gauss çan eğrisi çekirdeğinin sigma üzerinde sıkışıp kaldım, özellikle de işlemci hızına ihtiyacım olduğu için formül yerine sayıları kodluyorum. Kullanmak için iyi bir sigma önerebilir misiniz ?

Yanıtlar:


8

Gauss filtresinin Sigma ve çekirdek boyutu

Gauss'un sigma ve çekirdek boyutunun (piksel) nasıl seçileceğiyle ilgili olarak: sigmayı istediğiniz kadar bulanıklığa (görsel olarak karar verir) dayalı olarak ayarlarsınız ve sonra sigma'ya göre çekirdek boyutunu seçersiniz. Çok pahalı olmasa da iyi görünmek için yeterince (matematiksel olarak sonsuz) çan eğrisini yakalayan bir çekirdek boyutu bulma oyunudur.

Genel bir kural olarak, çekirdek boyutu sigmanın en az 6 katı olmalıdır. Daha sonra çekirdek her yönde 3 sigmaya uzanır, bu da matematiksel çan eğrisinin neredeyse tüm ağırlığını kaplamak için yeterlidir . Ayrıca, piksel boyutunu bir sonraki tek sayıya yuvarlamak da güzel olur, böylece filtre simetrik olur. Örneğin, sigma = 1,5 piksel ile 9 piksel filtre kullanırsınız; sigma = 2.0 piksel ile 13 piksel filtre vb. kullanın.

Alternatif olarak, ne kadar büyük bir çekirdek boyutu kullanabileceğinizi kontrol eden performans sınırlamalarınız varsa, kaçabileceğiniz maksimum sigmayı elde etmek için 6'ya bölün. (Sigma'nın çan eğrisi denklemine yalnızca bir girdi olduğu için kesirli olabileceğini unutmayın.)

Bu arada, büyük Gauss bulanıklıkları üzerinde daha iyi performans elde etmek için bir hile, görüntüyü aşağı örneklemek, daha küçük bir bulanıklık yapmak, sonra örneklemek. Örneğin, 13 piksellik etkili bir bulanıklık elde etmek için görüntüyü 2x (bilinear filtreleme kullanarak) aşağı örnekleyebilir, sonra 7 piksellik bulanıklık gerçekleştirebilir ve sonra (bilinear doğrusal filtreleme kullanarak) örnek oluşturabilirsiniz. Neredeyse 13 piksel bulanıklığı kadar iyi görünecek, ancak oldukça daha hızlı olacak.

Güzel bir ışıma filtresi oluşturma

Bunlarla ortak bir hile, farklı yarıçaplı çoklu Gaussluları bir araya getirmektir. Tek başına herhangi bir Gauss'tan daha iyi bir parıltı etkisi yaratır. Örneğin, Photoshop'ta üç katıklık bir araya getirilmiş üç katmandan oluşan bir model. Üç Gaussian, 3px, 5px ve 11px boyutundadır (sırasıyla sigma = 0.5px, 0.83px, 1.83px'e karşılık gelir).

alaycı çiçek filtresi

Işımanın görünür yarıçapını daha da arttırmak için daha büyük Gausslar da ekleyebilirsiniz. 3D oyun motorlarında standart "çiçeklenme" etkisi bu şekilde uygulanır.

Performans bir endişe kaynağıysa, en küçük Gaussian'ın yerini bulanık olmayan orijinal görüntünün bir kopyası alabilir; ortaya çıkan etki daha yumuşak görünecek, çok yumuşak görünmeyecek, ancak yine de onu çevreleyen bir parıltı olacaktır. Daha önce de belirtildiği gibi, daha büyük Gausslular aşağı örnekleme, bulanıklaştırma ve örnekleme ile yapılabilir; ve üst örnekleme katmanları bir araya getiren geçişe katlanmış donanım bilinear filtreleme kullanılarak yapılabilir.

jaggies

Yukarıdaki görüntünün bazı alanlarında jaggieslerin hala görünür olduğunu fark edeceksiniz. Ne yazık ki, bulanıklık yarıçapı oldukça büyük olmadıkça bulanıklaştırma jagjileri gizlemede çok etkili değildir. Bir post-işlem jaggies kurtulmak için kolay bir yolu yoktur: onlardan kaçınmanın en iyi yolu onları ilk etapta render etmektir. :)

Performans nedenleriyle MSAA'yı kullanamayacağınızı duyuyorum, ancak başka bir seçenek olabilir. Işıma izlerini nasıl oluşturduğunuza bağlı olarak, boyutlarını hafifçe artırabilir ve kenarın birkaç pikseli içindeki rengi soldurmak için degrade uygulayan bir gölgelendirici yazabilirsiniz. Bu onların daha düzgün görünmelerine yardımcı olmalı. İşte bir prosedür şeklini yumuşatmak için kullanılan 1 piksel genişliğinde bir kenar serpintisini gösteren bir shadertoy .


@Nathan_Reed Ben 2x bir hit çok değil ile hile garip bir şekilde yaptı MSAA yapmak dışında, senin ipuçlarının çoğunu uyguladım. Mevcut efekte daha fazla vurgu eklemekle ilgili bir sorum olsaydı, soruyu düzenlemeli miyim yoksa yeni bir tane mi yapmalıyım?
J.Doe

@ J.Doe Harika, çalıştığını duyduğuma sevindim! İstediğiniz belirli bir görünüme sahipseniz, efektin ayarlanması hakkında yeni bir soru sormanın daha iyi olduğunu söyleyebilirim.
Nathan Reed
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.