So I made this font mock-up for my game. The goal was to get as small font as possible yet to have as much consistency and readability as possible. My main target were letters and numbers so all the funky symbols haven’t had much love since they weren’t meant to be used anyway. Here it is on a 8 x 8 px grid.
Any criticism or suggestion is welcome in order to improve it. Also, I can upload the ttf version as well if someone wants it.
Edit: Since some of the small letters like a,e,g,s and z were already 4 pixels high, I thought I would stretch others taller pixel as well. Should make the reading flow bit better. Here’s how it looks now.
Feedback still appreciated.
They look very good to me!
And yes, if you could upload the ttf file I’d appreciate it, thanks.
There are only three small changes that I would make to the font, but they are only a matter of taste I think.
Unfortunately there’s a problem with the ttf. While the characters turned out to be fine, the spacing is way off for some reason. Since I promised, I’ll upload it but I wouldn’t recommend using it before I manage to fix it first. Link
I think the font lost over 1/3 of its width compared to the original draft, before I posted here anything. The j was squeezed together since it visibly goes below the base line and shouldn’t get confused with the i. I’ll admit that your (the original) j looks better than this compact one though. So, while the compact version stays, I can still export version with the j you want for you. Only there’s another thing to consider. The way font spaces letters. Here’s an illustration what I mean by it.
The font thinks they have 1 pixel space yet visually there’s mostly 2. I would have to adjust that manually in order the j not to be so lonely. Fortunately, I found out that besides FontForge and ShoeBox, there’s such great solutions like Glyphr, Fonstruct and BirdFont, that give bit more options than BitFontMaker2. So when I get more into fonts, I can fix your j as an exercise then.
Anyway. Since the stretching turned the p identical to the P, I had to adjust that. I was also pointed out that A was quite similar with the R, so that was changed. 4 lost a pixel to look less similar to Y. And I’m unsure about the y since it looks different on different screens. So here’s how it looks right now:
(Just ignore the j for now, I’ll export special version for you)
The spacing problems I had might be caused by my text editor. So I’m not too worried about that any longer.
The spacing with fonts has been always a nightmare to me ^^U When you finish the font I’d be grateful if you could tell us which software you ended using and/or recommend. I’ve always been interested in font creation but it’s usually pretty hard (and I never made ttf files, just bitmap fonts).
About the P and the p, I have a suggestion that I think that works also, while mantaining the font consistence a bit more (again, just my opinnion XD). Also a pair of suggestions about the 7 and the Y.
I used to do some bitmap font editing back in the day when I was into modding but if I remember correctly, they all used some sort of engine specific stuff that could read straight from a png or other image formats.
I saw the way our engine renders this ttf and I’m most likely have to do this in bitmap myself. It can import fnt files (the actual legacy format for windows and not some random stuff people have simply called .fnt) but it’s hard to find editor/creator which can still run on modern OS.
You don’t mind telling what software and bitmap formats did you use?
And here is a nice and free ttf font that you can use for tests if you want (put the font size to 8px when converting to bitmap fontfor best results): Press Start 2P | dafont.com
FontForge is a free and open source font editor with bitmap font support and a pretty nice bitmap editor, and it can output .fnt/.fon and BDF bitmap fonts, as well as vector fonts with embedded bitmaps. https://fontforge.github.io/en-US/
In my own game, I use TTFs with dummy (empty) vector glyphs and embedded bitmaps, and the rendering framework I use renders the bitmaps just fine.
Unfortunately it has no way to transform images into bitmap fonts, but there might be something that transforms images into BDFs, which you can then open with FontForge. I mention BDFs specifically because that’s the easiest format to generate automatically, since it’s very simple and human-readable. If there isn’t such a tool, one could probably write one fairly quickly. Though, with a small font like this, it would probably be pretty quick to just redraw the characters in FontForge.
+plus Aseprite then, right? If the textures are stored in png then Aseprite would be perfect to edit that. The plain text is just instructions to define locations to each glyph I suppose?
I just found out, that this BMFont .fnt+png can also be used by implementing hacks and workarounds so I’m going to look into that now.
I know my font isn’t that nice right now but I haven’t done anything so tiny before.
Also, I assume you know some Spanish, so if you don’t mind, when I have done butchering the accented characters, you could give your judgement maybe how they (the Spanish ones) turned out as well?
I managed to install Font Forge already yesterday but that thing sure looks complicated. I suppose I just have to look more into it then. And just as a side note, BSD and MIT are free and open source. GNU is glorified “access to source code”.
Yeah, Aseprite is perfect to edit the png files. Also yes, the plain text is just locations fo each glyph, size, offset, etc. You can have a look at one of the fonts I made based on the press-start-2p.font, link here: ahnw font.zip
I didn’t mean it in that way at all!! XD Your font looks really nice, I only told you about that press-start-2p.font font because I think it is easier, as a first contact with the software and all, to convert a ttf font to fnp+png and play around a bit with it. Also I never created a font, I just edited some fonts after converting them with that software ^_^U
Yeah, I’m Spanish. No problem, just tell me when they are done and I’ll have a look at those accents
Thanks for the info! It looks neat, I’ll have a look at it later!
I have been testing FontForge, and while it is a really nice program, it seems it doesn’t support the bitmap “.fnt” format used by BMFont and Hiero created by AngelCode (it supports Windows “.fnt” format, but it’s totally unrelated, and not compatible).
I just wanted to point that to avoid confusions for people that is trying to create or modify AngelCode’s “.fnt” files, because some middleware like 2DToolkit uses that format, and it is sometimes confused with the Windows “.fnt” format (I was quite confused for a while, and then I realized there were 2 different formats with the same extension ^^U).
