Pixel Günlükleri 3: Haydi Sprite Yapalım

Nihayet bir pixel art yazısıyla daha huzurlarınızdayım. Daha önce yazdığım giriş ve teknikler yazılarına yönelik, “eline sağlık” tadındakilerin yanı sıra, az sayıda “tam olarak nereden başlıyoruz?” ya da “benim çizimim iyi değildir” minvalinde, biraz göz korkmuşluğu taşıyan geri dönüşler aldım. Bu yazıyı da, hem sizleri cesaretlendirmek, hem de zorla pixel arta başlatmak için yazıyorum. Daha önce belirttiğim gibi, eğer bilgisayarınızda hali hazırda Photoshop yüklü değilse, ücretsiz olan GrafX2’yi indirip kurabilirsiniz. Arayüzü gayet kolaydır.

Pixel arta giriş yapılabilecek bir kaç farklı kapı var ama özellikle amatör oyun yapanların ilk yapmak istedikleri genellikle karakterlerdir. Oyunlarda bu karakter, düşman, toplanabilir obje, mermi vb. objelerin her birine sprite denir. Şimdi sizlerle birlikte, eskiden “gitmeli” tabir edilen side-scroller ya da platform türünde bir oyunda kullanılabilecek bir karakter sprite’ı yapacağız. Bu aşamaları adım adım takip ederek, ister kendi karakterinizi yaratın, ister birebir benim pixellerimi kullanın. Her ikisi de size kullandığım bütün teknikleri öğretecektir. Tabi isterseniz de sadece okuyun.

Ne Çizelim?

Elbette öncelikle yapmamız gereken, nasıl bir karakter istediğimize ve boyutuna karar vermek. Boyut işi genellikle yaptığınız oyuna bağlıdır ama pixel art bir karakter yapıyorsanız, 100×100 pixelden daha büyük çalışmamaya özen gösterin, çok yorulursunuz. Aşırı küçük, mesela 16×16 pixel bile çalışabilirsiniz ama aşağıda göstereceğim tekniklerin çoğunu o boyutlarda uygulayamazsınız.

Nasıl bir karakter istediğiniz elbette tamamen size kalmış, ancak size tavsiyem çok gerçekçi karakterlere başlangıçta girmemenizdir. Ben sizlere bol teknik gösterebilmek adına bilimkurgu temalı bir oyunda kullanılabilecek, zırhlı ve silahlı bir kedi çizeceğim. Eğer insan ya da humanoid bir karakter örneği arıyorsanız benim ya da diğer pixel art’çıların işlerini tarayabilirsiniz. Bu arada, bu yazıda hem herkesin uygulayamayacağı sulara girmemek adına, hem de uzun iş olduğu için animasyona girmiyorum, daha sonra talep olursa girebilirim.

Adım Adım Başlayalım

Herşeyden önce bir poz seçelim. Karakterinizin durduğu poz mümkün mertebe havalı olmalıdır. Bu pozu çizerken düzgün çizmeye çalışmayın, basit bir orantı yeterlidir. Aşağıda çeşitli açılardan farklı poz denemeleri görebilirsiniz, ben mümkün mertebe gövdeyi önden gördüğümüz bir poz tercih ediyorum ki karakterimizin önünü kolu kapatmasın.

Daha sonra da pozumun üzerine çok kabaca siyah ile karakterimi çiziyorum. Varsa sketch pad kullanabilirsiniz ama ben bunu mouse ile çizdim. Burada aşırı özenli olmak zorunda değilsiniz, bolca silin, tekrar yapın, detaya girmeden önce kafanızda size hitap eden bir şey çıkmasını sağlayın. Yavaş yavaş karakterin bitmiş halini gözünüzde canlandırmaya başlayın. Seçtiğiniz pozda hatalar ya da hoşunuza gitmeyen detaylar bulabilirsiniz, bu aşamada düzeltin. Kafası ya da ayağı yeterince büyük gelmezse, bu aşamada büyütün. Her detaya bu aşamada girmeyin (misal parmak aralarına, kürk dokusuna) ama karakterin kollarını ve bacaklarını ikişer parça, gövdesini ve kafasını birer parça olacak şekilde çizin. Gözlerini ve ağzını da ekleyin ki karakterin neye benzeyeceğini daha iyi canlandırabilesiniz.

Çerçeve Oluşturalım

Asgari olarak hoşunuza giden bir şekil ortaya çıktında bunu temizleyerek bir çerçeve oluşturacağız. Burası önemli bir nokta, hem biraz detaya giriyoruz, hem de bu noktada şekillerimizin bozuk olmamasına özen gösteriyoruz. Bu noktada ve bundan sonra mouse kullanın. Gördüğünüz üzere tek pixellik bir siyah çizgiden oluşan bölmeler yaratıyorum. Bu aşamada ne kadar düzgün ilerlersem, daha sonra rötuşlarken o kadar az uğraşırım. Şekillerin ve çizgilerin düzgünlüğünü daha net görmek için farklı zoom seviyelerinde bakın. Aşağıda gördüğünüz gibi ilk skeçte çizgiler çok bozukken, ikincisinde nispeten daha düzgün. Yine detaylara girmiyorum, onlara boyarken gireceğim.

Burada tatmin olduğumuz bir noktaya geldiğimizde kullanacağımız renkleri seçeceğiz. Bir zırh yapacaksak genellikle gri bir skalamız olacak. Fakat siz siz olun saf gri kullanmayın, çiğ durur. Bunun yerine satürasyonu biraz yükseltin. Ortaçağ zırhı için işin içine biraz kızıl tonlar katmak, bilimkurgu zırhlar için ise mor katmak iyi sonuç verir. Yeşil ve mavi tonlar da deneyebilirsiniz. Karıştırmaktan da korkmayın. Kedimizin kürkü için ise kızıl ve sarı tonlar kullanacağız. Yeşil ve kırmızılar, biraz bilimkurgusal (ışık vb.) efektler için. Aşağıda benim kullandığım palete dikkat ederseniz bir sürü ara renk göreceksiniz. Bunu buraya isterseniz alın aynen kullanın diye koydum ama özünde ana 6-7 renkle başlayıp ara renkleri sonra seçebilirsiniz. Göreceğiniz gibi her alanı tek bir renkle dolduruyorum. Birden karakter canlanmaya başlayacak.

Bu aşamada son bir kez şekillerin istediğiniz gibi görünüp görünmediğine de bakın. İlk sprite’ınızı yapıyorsanız gerek şekli, gerek renkleri konusunda fazla gerilmeyin. Bir sonraki adımımızda kıyafetin gölgelerini ekleyeceğiz. Önce gölge, zira gölge hem şekli belli eder, hem de malzeme bilgisi gerektirmez. Malzeme mi? diye sormadan önce devam edin, oraya geleceğiz.

Işık ve Gölge

Öncelikle ışık kaynağını belirliyoruz. Herhangi bir pixel art işte ışık kaynağını kafanıza göre belirleyebilirsiniz. Genellikle yukarıdan bir yerlerden seçmek daha gerçekçi bir görüntü ortaya çıkartır. Karakter çizerken ise, bu karakterin ekranda hem sağa, hem de sola aynı sprite ile gideceğini / ateş edeceğini vs. düşünmemiz lazım, o yüzden yukarıdan ve tam ortadan ışık vermek en doğrusudur. Aşağıdaki üç örnekten sağdaki gibi yani.

Bu ışık açısına göre her bir bölmemize ayrı ayrı gölgeleri düşürüyoruz. Bu işlemi de bir siyah, bir de bölmenin rengi ile siyah arasındaki bir ara ton ile yapıyoruz. Bu boyutta bir karakterde gölge için iki ton hayli hayli yeterli olacaktır. Burada bu bölmelerin şekillerini hayalinizde canlandırmanız gerekiyor. Ayrıca bölmelerden birbiri üzerine gölge düşürenler varsa onları da boyayın.

Aslında özellikle metalik objelerde birbirine yakın yüzeyler birbirini aydınlatır ve gölgeyi bozar ama şimdilik bu detaya girmeyelim, zira iyi yapılmazsa karakteri çok kötü gösterebilecek bir ayrıntıdır. Elbette iyi yapıldığında da nefis görünür.

Materyal Nasıl Gösterilir?

Bir sonraki aşamada da zırhı ışıklandıracağız. Işıklandırmanın gölgelendirmeden büyük bir farkı var. Gölge bir yüzeyin geometrisini belli ederse, ışıklandırma da malzemesini belli eden şeydir. Örnek vermek gerekirse parlak ve düzgün metalik yüzeylerde geniş, keskin ve açık renk parlamalar görünür. Plastik ve deri yüzeylerde parlama geçişli ve daha dardır ama yine açık renk olur. Kumaş ve cilt yüzeylerinde ise parlama soluk ve geçişlidir. Ayrıca dövülmüş demir, ağaç, kürk vb. pürüzlü materyallerin parlamaları az ve dağınık olur. Aşağıda bazı örnekleri görebilirsiniz.

Bizim karakterimizin zırhı parlak ve düzgün ama krom da değil diye düşünüyorum. Geniş parlak yüzeyler yapıyorum. Bu parlaklığı yaparken bir şey daha yaptım, bakalım görebilecek misiniz? Zırhın çerçevesinin rengini, ışığın geldiği yönlerde 1-2 ton açtım. Böylece siyah çerçeveyi biraz daha göze batmayan bir hale getirdim.

Yumuşatma Teknikleri

Bir noktaya kadar geldik. Şimdi de bu ışık ve gölgeyi yumuşatacak son darbeyi vuracağız. Bu noktada iki yöntem var, belli durumlarda ikisi karıştırılabilir de. Birisi “anti-aliasing” diğeri de “dithering”. Bu yöntemlere daha önceki yazımda etraflıca değindim ama okumaya üşenirseniz, anti-aliasing ara tonlar kullanarak kırıkları alma, dithering ise noktalayarak geçiş yumuşatmadır. Ben aşağıda ikisini de uyguluyorum.

Birebir zoom’da gördüğünüz üzere iki teknik, birbirinden çok farklı sonuçlar veriyor. Anti-aliasing ile yumuşatılmış parlaklık metalikliğini korurken, dithering dokulu ve daha sönük bir efekt getirdi. Eğer parlaklığını kaybetmiş ve bolca darbe yemiş bir ortaçağ zırhı yapıyor olsaydım ditheringi tercih ederdim ama öyle olmadığına göre soldaki anti-aliasing’li versiyonu tercih edeceğim. Ayrıca dithering bir karakteri anime ederken ayağınıza dolaşabilecek bir teknik.

Bu arada dikkat ettiyseniz silahı da yaptım. Silahın gövdesi, karakterin zırhı ile benzer bir malzeme ama biraz daha açık renk olacağını düşünüyorum (açık renk daha çok dikkat çeker). Sırf sci-fi bir görüntü için içine asit benzeri bir sıvı da koydum. Şeffaf bir sıvı yaparken çift renk kullanmak ve içine gölgesi de olan beyaz baloncuklar koymak şeffaflığı belli eder.

Kürk

Şimdi kürke geçebiliriz. Aşağıda solda kürkün gölgelerini, sağda ise ışıklandırmalarını göreceksiniz. Dikkat edin, yüzde gölgeyi minimal, ışığı ise maksimum kullandım. Çünkü demin dediğim gibi açık renk dikkat çeker ve daima karakterimizin yüzüne dikkat çekmek isteriz.

Ayrıca burada demin bahsettiğim şekilde düz olmayan kürk dokusunu belirginleştirmek için parlaklığı çizgili bir biçimde atıyorum. Hem tekir gibi bir efekt alıyorum, hem de boyut katıyorum.

Gelelim kürkü yumuşatmaya. Burada tek tavsiyem yüzde mutlaka daha dikkatli olun ve bol vakit harcayın. Yüz geometrisi karmaşıktır ve de bozuk oldu mu, kol-bacak gibi gözden kaçmaz. Karakterinizin yüzüyle bolca oynayın ve gerekirse cesur bazı oynamalar yapın.

Bu noktada bir sorun kalmadı gibi görünse de, geniş yüzeylerimiz pek etkileyici durmuyor. Karakterimiz detay eksikliğinden dolayı sci-fi bir zırh mı giyiyor, pijama mı giyiyor çok belli değil. Gelin geniş yüzeylere gereksiz bazı detaylar ekleyerek daha iyi bir görüntü elde edelim.

Pek çok farklı detay yapmayı seçebiliriz ama bu boyutlarda sadece zırhı parçalara ayırmak yetecektir. Keyfinize göre siyah çizgiler çekin. Sonra da daha önceki proseslerdeki gibi boyut katın ve yumuşatın. Bir kaç gereksiz LED eklemeyi de ihmal etmeyin. Çünkü LED=sci-fi.

Son Rötuşlar

Bitirmeye yakın bir aşamaya geldiğimize göre son rötuşları yapalım. Bu aşamada bolca zoom in/out yapıp karakterin üzerinde kırık ya da bozuk görünen noktalara eğilin. Dikkatle bakarsanız bu aşamada dirseği sivrileştirdim, sol gözdeki bir noktanın rengini açtım ki göz bebeği gibi görünmesin, bir de sağ ayak ile oynadım. Aslında uğraşılacak daha bir sürü şey çıkabilir ama fazla kurcalamak daima iyi sonuç vermez, tatmin olduğunuz bir noktada bırakın.

İşte karakterimiz. Umarım bu rehber ile siz de biraz pratik yapar ve hoşunuza giden karakterler yaratırsınız. Eğer yaptıklarınızı göstermek ya da bana herhangi bir soru sormak isterseniz, gerek bu yazının altına yorum bırakabilir, gerekse beni Pixel Joint’ten Gecimen diye aratıp bulup oradan yazabilirsiniz. Bu rehberin ardından özel bir talep olmaz ise izometrik grafik ve tileset rehberleri yazacağım. Hepinize bol pixelli günler diliyorum.

Bu yazı, "Pixel Art" adlı yazı dizimizin bir parçasıdır.

Yorumlar