Sprite Sheet Nedir, Unity ve Godot'ta Nasıl Kullanılır?

Sprite sheet ve animasyon şeridi

Sprite sheet, bir karakterin ya da nesnenin karelerini tek görselde toplayan dosyadır. İki yaygın biçimi var. Birincisi paketlenmiş atlas: kareler yer kazanmak için sıkıştırılır, kırpılır, bazen döndürülür; hangi karenin nerede olduğu ayrı bir veri dosyasında (plist, JSON ya da XML) yazar. İkincisi şerit ya da ızgara: kareler eşit boyutlu hücrelere dizilir ve konumları hücre boyutundan hesaplanır.

Atlas dosya boyutunda kazandırır ama onu okuyacak bir içe aktarıcı ister; kırpılmış karelerin orijinal yerine geri konmaması animasyonun titremesine yol açar. Eşit hücreli şerit ise her oyun motorunun yerleşik bölme aracıyla tek seferde açılır. Elinizdeki dosyayı motorunuza en az uğraşla almak istiyorsanız şerit daha rahattır.

Unity'de sprite sheet kullanmak

Görseli Assets klasörüne sürükleyin ve Inspector'da Texture Type'ı Sprite (2D and UI), Sprite Mode'u Multiple yapın. Piksel sanatıysa Filter Mode'u Point (no filter), Compression'ı None seçip Apply'a basın.

Sprite Editor'ü açın, Slice menüsünde Type olarak Grid By Cell Size seçin ve Pixel Size'a bir karenin genişliğini ve yüksekliğini yazın. Slice ve Apply'dan sonra görselin altında kareler tek tek görünür. Kareleri seçip sahneye sürüklediğinizde Unity bir animasyon klibi ve Animator oluşturur; Animation penceresinde Sample Rate'i animasyonun kare hızına ayarlayın.

Godot 4'te sprite sheet kullanmak

Sahneye bir AnimatedSprite2D düğümü ekleyin, Inspector'da Sprite Frames alanından yeni bir SpriteFrames oluşturun. Alttaki SpriteFrames panelinde "sprite sheet'ten kare ekle" düğmesiyle görseli seçin; şerit tek satırsa Horizontal'a kare sayısını, Vertical'a 1 yazın, kareleri seçip ekleyin.

Her animasyonun kare hızını (FPS) ve döngü ayarını aynı panelde verirsiniz. Piksel sanatının keskin kalması için Proje Ayarları > Rendering > Textures altında Default Texture Filter'ı Nearest yapın.

GameMaker ve Phaser

GameMaker'da sprite düzenleyicisindeki Import Strip Image komutu şeridi açar; kare sayısını, satırdaki kare sayısını ve kare boyutunu girmeniz yeterli.

Phaser'da görseli this.load.spritesheet ile frameWidth ve frameHeight vererek yükleyin, sonra this.anims.create içinde generateFrameNumbers ile kareleri ve frameRate ile hızı belirleyin. Döngü için repeat: -1 kullanılır.

Piksel sanatı neden bulanıklaşır?

Bulanıklığın iki sık nedeni var. Birincisi doku filtresi: motor küçük görseli büyütürken pikselleri yumuşatır; Unity'de Point, Godot'ta Nearest filtresi bunu önler. İkincisi tam sayı olmayan ölçek: bir pikseli 2,5 kat büyütmek bazı pikselleri iki, bazılarını üç kat yapar ve çizgiler titrer. Karakteri 2, 3 ya da 4 kat gibi tam sayılarla büyütün; Unity'de Pixel Perfect Camera bileşeni bunu kendisi ayarlar.

Sıkıştırma da renkleri bozabilir. Piksel sanatında kayıpsız PNG ve sıkıştırmasız doku ayarı en güvenli seçimdir.

Hazır karakterle deneyin

Bu adımları denemek için animasyonlu karakter arıyorsanız ücretsiz pixel art karakter paketimiz her animasyonu eşit hücreli bir PNG şeridi olarak, kare boyutu ve kare hızı yazan bir JSON ile verir. Beğenirseniz devamı tam sette; karakterleri satın almadan önce tarayıcıda da oynatabilirsiniz.