Cara Mengubah Lembar Sprite Menjadi GIF dengan Putaran Mulus

Lembar yang penuh dengan pose belum menjadi sebuah animasi. Sel-selnya harus dipotong dengan ukuran yang tepat, diputar dalam urutan yang benar, dan diatur durasinya agar akhir animasi tersambung kembali ke awal secara alami. GIF menambahkan satu batasan lagi: format ini tidak dapat mempertahankan seluruh detail warna dan transparansi PNG asli Anda.

Periksa kisi sebelum mengunggah

Untuk lembar 256 × 128 piksel dengan empat kolom dan dua baris, setiap sel berukuran 64 × 64 piksel. ImageMint membaca sel dari kiri ke kanan, lalu atas ke bawah. Jika lembar memiliki ruang tambahan, sel tidak merata, atau baris terakhir dengan ruang kosong, pemotongan baris dan kolom langsung dapat menyertakan bagian tetangga atau pose kosong. Potong bingkai tersebut terlebih dahulu dengan Pemotong Lembar Sprite dan gunakan opsi gambar terpisah sebagai gantinya.

Berikan setiap pose ukuran kanvas dan jangkar sama. Karakter berjalan tidak seharusnya naik satu piksel karena satu bingkai dipangkas lebih rapat. Ketidaksejajaran terlihat dalam pratinjau sebagai pantulan; mengubah kecepatan pemutaran tidak dapat memperbaikinya.

Delapan pose berjalan petualang seni piksel bersyal merah disusun dalam lembar, lalu menjadi animasi berulang.
Ilustrasi rangkaian delapan pose. Ikuti sel-selnya sesuai urutan dan pastikan pose terakhir dapat beralih kembali ke pose pertama; gambar ini menjelaskan alur kerja, bukan atlas yang dapat diunduh untuk digunakan. Buka gambar ukuran penuh

Buat dan uji loop delapan bingkai

  1. Pilih Opsi B untuk satu sheet dengan sel sama besar. Masukkan dua baris dan empat kolom sebelum unggah. Jika Anda sudah memiliki delapan PNG bernomor, gunakan Opsi A sebagai gantinya.
  2. Buka strip Urutan bingkai dan klik seluruh delapan pose. Gunakan panah untuk memindahkan pose salah tempat lebih awal atau akhir. Bingkai terakhir harus kembali secara alami ke pertama; hindari duplikat pose pertama di akhir kecuali sengaja menginginkan jeda.
  3. Putar pada 8 FPS sebagai tes awal. Delapan bingkai pada 8 FPS memerlukan satu detik per loop; pada 16 FPS gambar sama selesai dalam setengah detik. Nilai kaki dan pusat massa karakter, bukan menganggap satu FPS benar secara universal.
  4. Gunakan Putar berulang jika ini animasi diam atau berjalan. Nonaktifkan untuk efek sekali pakai seperti reaksi terkena pukulan. Ekspor hanya ketika pratinjau browser memiliki urutan dan ritme yang diinginkan.

Ketahui perubahan oleh GIF

GIF memiliki palet warna terbatas dan transparansi yang pada dasarnya aktif/nonaktif, sedangkan PNG dan WebP dapat mempertahankan tepian semitransparan lebih halus. Bayangan tipis atau antialias lembut mungkin terlihat lebih keras setelah ekspor. Ini paling terlihat pada sprite dengan cahaya, asap tembus pandang, atau rangkaian warna halus. Bandingkan GIF unduhan dengan pratinjau PNG pada latar terang dan gelap.

Pengekspor memakai satu durasi untuk semua bingkai berdasarkan FPS pilihan, dibulatkan ke 10 ms. Tidak menyimpan durasi tahan khusus satu pose. Untuk meniru jeda lebih panjang, tambahkan bingkai duplikat sengaja, atau edit waktu per bingkai dalam alat animasi khusus setelahnya. Simpan bingkai asli jika perlu aset game lossless.

GejalaKemungkinan penyebabPemeriksaan berikutnya
Karakter memantulKanvas atau jangkar bingkai tidak konsistenSejajarkan bingkai sumber sebelum mengekspor.
Bagian dua pose dalam satu selJumlah baris/kolom salah atau sheet memiliki paddingVerifikasi dimensi sheet dan pemotongan secara terpisah.
Loop tersentak di akhirPose terakhir tidak bertransisi ke pose pertamaUrutkan ulang atau hapus pose ujung tambahan.
Tepi tampak kasarBatas warna/transparansi GIFSimpan PNG untuk aset produksi.

Ekspor GIF dibatasi 1024 piksel per sisi dan total 20 juta piksel bingkai. Jika lembar valid melebihi itu, perkecil atau ekspor lebih sedikit bingkai. Pratinjau animasi tetap membantu diagnosis waktu sebelum memilih ekspor kecil.

Uji kesejajaran dengan titik acuan tetap

Sebelum mengekspor, pilih titik yang harus tetap stabil: kaki yang berpijak dalam animasi diam, pusat ikon berputar, atau pegangan objek berayun. Telusuri gambar mini dan bandingkan titik itu dengan batas bingkai. Jika gambar berukuran berbeda diunggah, pengekspor GIF menempatkannya di tengah kanvas terbesar; tidak menyejajarkan kaki atau pegangan yang Anda pilih. Letakkan pangkasan kecil kembali pada kanvas bersama sebelum mengimpor.

Untuk siklus berjalan, bedakan gerakan tubuh yang disengaja dari kesalahan pangkasan. Kepala dapat naik turun sementara kaki yang berpijak tetap di lantai. Memindahkan setiap pose agar tepi atasnya sama akan menghapus perbedaan itu dan membuat kaki bergeser. Gunakan garis dasar yang dimaksud dalam karya, bukan kotak pembatas paling rapat.

Verifikasi putaran yang diunduh, bukan hanya pratinjau browser

Loop delapan bingkai pada 8 FPS dipratinjau dengan 125 ms per pose. Pengekspor GIF membulatkannya menjadi 130 ms, sehingga loop berkas berlangsung 1.04 detik. Pada 16 FPS, durasinya ditulis 60 ms, sehingga loop berlangsung 0.48 detik. Perbedaan ini dapat penting saat membandingkan animasi dengan musik atau efek lain yang terikat waktu. GIF bukan berkas master untuk pengaturan waktu presisi.

  1. Buka ulang GIF dan amati beberapa loop lengkap. Lompatan terakhir-ke-pertama lebih mudah terlihat setelah pengulangan.
  2. Periksa keluaran yang sama pada latar terang dan gelap, khususnya di sekitar tepian yang sebagian transparan.
  3. Simpan lembar asli, pengaturan baris/kolom, dan FPS pilihan dalam catatan proyek. GIF saja bukan proyek animasi yang dapat diedit.
Siap dibagikan: jumlah bingkai yang benar, jangkar stabil, batas putaran yang disengaja, tepi GIF yang dapat diterima, dan sumber lossless tersimpan. Jika tujuannya mesin game, gunakan bingkai asli, bukan GIF.

Coba alur kerjanya

Muat lembar sel sama besar atau bingkai terpisah, urutkan, pratinjau durasi, dan unduh GIF animasi.

Pratinjau bingkai dan ekspor GIF →