VberAI Bitmap Font: upload glif / sprite sheet auto-split → BMFont

VberAI Studio (singkat: AI Studio, ≠ Google AI Studio) menyertakan bitmap font generator: bangun atlas font game lengkap dengan metrik untuk karakter yang benar-benar dipakai proyek Anda. Hasilnya tetap berada di kanvas game yang sama untuk pixelation, matting, atau ekspor. Format pertukaran antar-engine adalah AngelCode BMFont .fnt + PNG (opsi ekspor mengikuti panel).

Mulai di sini: AI Studio. Glosarium: bitmap font.

Mengapa game masih butuh bitmap font

TTF / OTF dinamis cocok untuk teks panjang dan ukuran sembarang. HUD, skor, penghitung koin, judul piksel, dan digit bergaris biasanya butuh hal lain: ukuran terkunci, gaya yang dipanggang ke tekstur, tanpa blur saat diskalakan, dan pemuatan engine yang dapat diprediksi.

Tiga jalan memutar yang umum:

1. Memaksa font dinamis — garis luar hancur saat diperbesar; huruf piksel jadi keruh saat diperkecil; penyaringan bilinear melembutkan tepi sel.
2. PNG per-glikon yang digambar tangan tanpa metrik — engine tidak tahu lebar, tinggi, baseline, atau advance, jadi Anda menyusun sprite lepas.
3. BMFont desktop atau online, lalu unduh — Anda pulang membawa atlas dan .fnt, lalu membuka alat lain untuk merapikan tepi, pixelate, dan impor ke Unity / Godot / Cocos.

AI Studio menjaga pembuatan tetap di workbench game yang dapat diedit: font adalah aset, bukan zip yang mengakhiri pekerjaan.

	Alat BMFont mandiri	Generator bitmap font VberAI
Masuk	Aplikasi desktop atau situs lain	Kanvas AI Studio yang sama
Input	Mostly rasterize from TTF / system fonts	Panel generate, upload glyphs, upload sprite sheet + auto-split
Keluaran	Biasanya unduhan .fnt + atlas	Atlas mendarat di kanvas untuk diedit lebih lanjut
Tampilan	TTF sumber plus efek alat	Digit bergaya / huruf piksel sesuai panel
Setelahnya	Umumnya “impor ke engine”	Selesaikan di kanvas, lalu kirim ke engine

Three ways to feed the generator

Panel labels follow the product. Common paths:

Path	When to use it
Generate from charset	No art yet—need HUD digits, pixel type, or stylized numbers
Upload glyph images	Artists already drew per-glyph PNGs; you need .fnt width, height, advance
Upload sprite sheet + auto-split	A full 0123456789 strip, glyph grid, or digit sprite sheet to slice and metric

Sprite-sheet splitting is similar to in-place slice / layer split, but the output is a BMFont atlas + .fnt, not a UI Prefab.

Apa itu bitmap font / BMFont

Definisi yang siap dikirim:

1. Atlas — rasterkan glikon yang Anda butuhkan ke satu (atau beberapa) lembar PNG.
2. Berkas metrik — biasanya AngelCode BMFont .fnt: UV, lebar/tinggi, xoffset / yoffset, xadvance per karakter.
3. Runtime — engine mengambil sampel atlas untuk menyusun Label, alih-alih menesselasi garis luar vektor saat berjalan.

Ini mencakup teks game berukuran tetap dan bergaya tetap. Ini bukan font body TextMesh Pro SDF, dan bukan font dinamis CJK lengkap.

	Bitmap font (BMFont)	TTF dinamis	SDF / MSDF
Tampilan	Gaya dipanggang ke tekstur; piksel bisa terkunci	Vektor dirasterkan di setiap ukuran	Skala relatif bersih
Terbaik untuk	HUD, skor, judul piksel, digit bergaya	Teks panjang, chat, pengaturan	UI body yang harus diskalakan
Biaya	Ukuran / charset baru berarti atlas baru	Garis luar dan tampilan piksel sulit dikendalikan	Kunci grid piksel lebih lemah daripada bitmap asli

Kapan memakainya — dan kapan tidak

Pakai untuk: angka health, skor stage, penghitung koin / permata, cooldown skill, judul piksel, strip angka bergaris atau metalik. Charset kecil, ukuran tetap.

Lewati untuk: dialog, surat, chat, teks pengaturan; UI body yang harus diskalakan bebas; kosakata Han / kana / Hangul lengkap. Set CJK lengkap meledakkan ukuran atlas — pertahankan font dinamis atau SDF untuk itu.

Cara membuatnya di AI Studio

Label tombol mengikuti panel saat ini. Jalurnya empat langkah.

1. Buka bitmap font generator

Di kanvas AI Studio, buka bitmap font generator.

2. Pick an input path, then lock charset and size

Choose panel generate, upload glyph images, or upload a sprite sheet and auto-split (per the panel). Either way, list the characters that will actually appear in-game.

HUD sets often need only 0123456789, +$%/.,, and a few Latin letters. Missing glyphs become blanks or tofu at runtime; extra glyphs bloat the atlas.

Set size to the final HUD pixel size — do not design large and scale down. Scaling a bitmap font scales the texture. After a sprite-sheet split, check cell padding and advance so digits do not collide.

3. Buat dan pratinjau atlas

Periksa baseline, apakah garis luar memakan tetangga, glow kotor di tepi semi-transparan, dan ruang kosong yang terbuang. Untuk tampilan piksel, rangkai image pixelate di kanvas yang sama; untuk alpha bersih, rangkai matting.

4. Ekspor, lalu ke engine

Opsi ekspor mengikuti panel. Untuk Unity / Godot / Cocos Creator, pastikan Anda punya:

• Satu (atau satu set) lembar PNG atlas
• Berkas .fnt (AngelCode BMFont teks atau biner; dokumentasi engine mengacu pada .fnt)

Nama berkas, indeks halaman, dan referensi tekstur di dalam .fnt harus cocok — jika tidak, engine bisa menerima font tetapi tetap menampilkan glikon magenta atau kosong.

Impor ke Unity / Godot / Cocos

Ini adalah daftar periksa penerimaan, bukan tur editor lengkap. Setelah impor, render 0123456789SCORE dan periksa perataan, tracking, dan tepi alpha.

Unity

• Setel Filter Mode atlas ke Point untuk mengunci tepi piksel; penyaringan bilinear membuatnya kabur.
• UGUI legacy: Custom Font + material yang memakai atlas, lalu tetapkan ke Text.
• TextMesh Pro: buat aset font bitmap di Font Asset Creator, atau impor pasangan BMFont (ikuti versi TMP Anda).
• Perbaikan yang umum: slot material kosong, atau nama tekstur .fnt ≠ nama tekstur yang diimpor.

Godot 4

Godot mendukung BMFont (.fnt). Simpan .fnt dan PNG di folder yang sama, impor, dan tetapkan ke slot font Label (atau RichTextLabel). PNG saja tidak punya persegi glikon.

Cocos Creator

Bitmap font Cocos adalah .fnt + .png: .fnt mengindeks setiap thumbnail karakter. Letakkan keduanya di folder aset dan setel tipe font Label ke bitmap font (nama menu mengikuti panel 3.x). Jangan tertukar dengan LabelAtlas (strip angka sel tetap) — LabelAtlas tidak membawa metrik BMFont lengkap.

Daftar periksa perbaikan

• Glikon hilang — perluas charset dan buat ulang; jangan campur TTF kedua di dalam engine.
• Baseline tidak rata — 1 vs 0, koma, dan titik desimal paling dulu menunjukkannya.
• Tracking terlalu rapat / longgar — edit xadvance di .fnt atau setel ulang spasi di generator.
• Garis luar kotor — glow tumpang tindih dengan tetangga; sisakan padding 1–2 px di atlas.
• Blur saat diskalakan — jangan perlakukan bitmap sebagai vektor; pakai SDF / MSDF atau font dinamis jika harus diskalakan.
• Atlas terlalu besar — kurangi charset, atau pisahkan set “digit” dari set “judul”.

Batasan

• Atlas pertama jarang menjadi final yang siap dikirim; glikon merek dagang, locale yang hilang, dan resolusi tambahan tetap butuh pemeriksaan manusia.
• Kompresi, packing, material font, dan filter mode berada di proyek engine.
• Teks panel, input (font sumber / referensi gaya), dan format ekspor mengikuti AI Studio saat ini.
• VberAI Studio ≠ Google AI Studio; lihat perbandingan.

Penutup

Anda tidak butuh “satu lagi BMFont online.” Anda butuh digit bergaya dan huruf piksel yang dikirim sebagai aset game lengkap dengan metrik. Buat → pratinjau atlas → rapikan tepi atau pixelate di kanvas → .fnt + PNG ke Unity / Godot / Cocos — semuanya di AI Studio.

FAQ

Apa itu bitmap font / BMFont?
Bitmap font melukis glikon ke atlas PNG dan memakai berkas metrik agar engine tahu cara memotong setiap karakter. AngelCode BMFont (.fnt + PNG) adalah pasangan pertukaran yang dipahami Unity, Godot, dan Cocos.

Apakah VberAI bisa membuat bitmap font game?
Ya. Pakai generator di canvas AI Studio — charset, glif, atau sprite sheet — lalu lanjut edit atau ekspor di canvas yang sama (sesuai panel).

Bisakah mengunggah glif atau sprite sheet?
Ya. Unggah gambar glif (PNG per karakter dll.) ke font. Atau sprite sheet + auto-split (strip digit, grid) untuk .fnt BMFont + atlas (sesuai panel).

Bitmap vs TTF dinamis vs SDF?
HUD berukuran tetap, judul piksel, dan digit bergaya → bitmap. Teks panjang dan UI yang harus diskalakan → TTF dinamis atau SDF / MSDF.

Apa yang penting saat impor ke Unity?
Penyaringan Point pada atlas; Custom Font atau TMP bitmap sama-sama bisa memakai pasangan BMFont, tetapi nama tekstur harus cocok dengan .fnt dan slot material tidak boleh kosong.

Bisakah saya memanggang atlas Tionghoa lengkap?
Tidak praktis. Set CJK lengkap membengkakkan atlas. Sisakan bitmap font untuk digit, huruf Latin, dan beberapa glikon judul; pertahankan teks body pada font dinamis.