Tweading shader cahaya untuk membuatnya terlihat lebih baik

Saya memiliki permainan sederhana dan subjeknya adalah garis-garis kecil ini. Ini ditargetkan untuk iOS dan android sehingga ia memiliki jajaran prosesor yang besar yang dapat dijalankan, sekarang.

Saya mencoba menambahkan cahaya waktu nyata kepada mereka karena dua alasan

1. Saya mencoba menyembunyikan fakta bahwa saya tidak punya waktu render untuk memproses anti-aliasing pada sebagian besar perangkat.
2. Subjek permainan seharusnya adalah cahaya murni, ergo bahwa gambar harus terlihat seperti hal-hal itu adalah cahaya murni.

Saya telah mengutak-atik gaussian blur shader yang dapat dipisah untuk beberapa saat dan saya telah sampai pada titik frustrasi, saya hanya tidak bisa membuatnya terlihat benar, mungkin masalahnya adalah saya mencoba menyembunyikan ujung-ujung cahaya lampu yang bergerigi dengan sia-sia. sementara itu tidak membuat cahaya tampak buram.

Masalah terbesar saya adalah semua variabel yang terlibat dalam membuatnya terlihat terbaik.

Saya sangat baru di bidang grafis / rendering dan saya sama sekali tidak seorang seniman. Mungkin hal yang paling membuat frustrasi tentang rending kepada saya adalah semua variabel yang tampaknya terlibat. Dengan cahaya saya telah melihat begitu banyak kemungkinan perubahan.

• A. Tambahkan mode campuran, mode campuran layar, atau ramuan lainnya
• B.Berat kabur, dan normal berbeda sebelum kombinasi
• C. Sigma dari fungsi bel gaussian (saya telah menggunakan kalkulator yang membingungkan ini tetapi tampaknya tidak memberikan nilai yang sama dengan yang saya lihat dimiliki orang lain)
• D. Skal pada nilai "x" yang dikirim ke fungsi sigma
• E. Skala sampel (membuat radius blur lebih kecil atau lebih besar)
• F. Mengubah resolusi buffer cahaya

Bagaimana seseorang menemukan konstanta "paling tampan" ketika bekerja dengan begitu banyak variabel seperti ini?

Saya juga mengalami masalah karena waktu antara saya membuat tweak dan melihatnya sangat lama sehingga sulit untuk melihat perubahan, saya akan melakukannya dalam mainan shader namun saya tidak dapat memuat gambar ini atau secara prosedural menghasilkan gambar seperti itu.

Saat ini saya benar-benar terjebak pada sigma dari kernel kurva lonceng gaussian, terutama karena saya mengkode angka daripada rumus karena saya memerlukan kecepatan prosesor. Bisakah Anda menyarankan sigma yang baik untuk digunakan ?

Ukuran sigma dan kernel dari filter Gaussian

Mengenai bagaimana memilih sigma dan ukuran kernel (piksel) dari Gaussian: Anda mengatur sigma berdasarkan seberapa lebar kekaburan yang Anda inginkan (menilainya secara visual) dan kemudian memilih ukuran kernel berdasarkan sigma. Ini adalah permainan menemukan ukuran kernel yang menangkap cukup banyak kurva lonceng (secara matematis tak terbatas) agar terlihat bagus, sementara tidak terlalu mahal.

Sebagai aturan praktis, ukuran kernel harus setidaknya 6 kali sigma. Kemudian kernel diperluas hingga 3 sigma di setiap arah, yang cukup untuk menutupi hampir semua bobot kurva lonceng matematika. Ini juga bagus untuk mengumpulkan ukuran piksel ke angka ganjil berikutnya sehingga filter akan simetris. Jadi misalnya, dengan sigma = 1,5 px, Anda akan menggunakan filter 9-pixel; dengan sigma = 2.0 px, gunakan filter 13-pixel, dll.

Atau, jika Anda memiliki batasan kinerja yang mengontrol seberapa besar ukuran kernel yang dapat Anda gunakan, maka bagi dengan 6 untuk mendapatkan sigma maksimum yang bisa Anda hindari. (Perhatikan bahwa sigma dapat berupa pecahan, karena itu hanya input ke persamaan kurva lonceng.)

Ngomong-ngomong, trik untuk mendapatkan kinerja yang lebih baik pada gambar Gaussian yang besar adalah dengan melakukan downsample gambar, melakukan pengaburan yang lebih kecil, kemudian mengompensasi. Misalnya, untuk mendapatkan kekaburan 13-piksel yang efektif, Anda bisa menurunkan sampel dengan 2x (menggunakan bilinear filtering), lalu melakukan blur 7-piksel, dan kemudian upample (menggunakan pemfilteran bilinear). Ini akan terlihat hampir sebagus blur 13-pixel, tetapi akan jauh lebih cepat.

Membuat filter cahaya yang cantik

Trik yang umum dengan ini adalah dengan menggunakan beberapa Gaussians dari radius yang berbeda, ditambahkan bersama-sama. Itu membuat efek cahaya yang lebih baik daripada Gaussian tunggal dengan sendirinya. Sebagai contoh, inilah mockup di Photoshop yang dibuat dengan tiga lapisan yang dicampur bersama secara aditif. Tiga Gaussians berukuran 3px, 5px dan 11px (sesuai dengan sigma = 0,5px, masing-masing 0,83px, 1,83px).

Anda juga dapat menambahkan Gaussians yang lebih besar untuk lebih meningkatkan jari-jari cahaya. Ini adalah bagaimana efek "bloom" standar diimplementasikan dalam mesin game 3D.

Jika kinerja menjadi masalah, Gaussian terkecil dapat diganti dengan salinan gambar asli yang tidak dikaburkan; efek yang dihasilkan akan terlihat lebih tajam, tidak begitu lembut, tetapi masih memiliki cahaya di sekitarnya. Seperti disebutkan sebelumnya, Gaussians yang lebih besar dapat dilakukan dengan downsampling, blurring, dan upsampling; dan upampling dapat dilakukan dengan menggunakan penyaringan bilinear perangkat keras, dilipat ke dalam celah yang memadukan lapisan bersama.

Jaggies

Anda akan melihat bahwa jaggies masih terlihat di beberapa area gambar di atas. Sayangnya, blur tidak terlalu efektif untuk menyembunyikan jaggies kecuali radius blurnya cukup besar. Tidak ada cara mudah untuk menggunakan pasca-proses menyingkirkan jaggy: cara terbaik untuk menghindarinya adalah dengan tidak membuat mereka terlebih dahulu. :)

Saya mendengar Anda bahwa Anda tidak dapat menggunakan MSAA karena alasan kinerja, tetapi mungkin merupakan pilihan lain. Bergantung pada bagaimana Anda membuat jejak cahaya, Anda mungkin dapat sedikit meningkatkan ukurannya, dan menulis shader yang menerapkan gradien untuk memudarkan warna dalam beberapa piksel tepi. Itu akan membantu mereka terlihat lebih halus. Ini shadertoy yang menunjukkan falloff edge selebar 1px yang digunakan untuk antialiasing bentuk prosedural.