Challenge: How small can you draw all 16 hexadecimal digits?
Andrei Ellman

I've been messing around with tiny fonts and decided to see how small I could draw the 10 numbers and 6 letters required to display hexadecimal digits. After plenty of experimentation, I came up with a font as small as 2x3 pixels (with a bitdepth of just 1 bit). I'm not sure how legible it is in general, but to someone who's been trying out different font-sizes, I've already trained myself to recognise them. So far, only my 3x5 font seems to be clearly legible, but I'm not sure about the others I came up with.

Attached are the fruits of my labours. Also attached is a 2-bit 3x2 and 4x2 font, but adding a shade of grey doesn't seem to improve things much.

Do you find these fonts legible? Can you do any better?

603246

603247

AE.

Edgar Reynaldo

I can read the third line of the first bitmap, and that's it. The right side of the third line is easier to read than the left side.

Billybob

Yeah, I can read them all, but it hurts the eyes :P

The bottom-right font in the first image is the easiest to read, IMO.

LennyLen

The 3x5 fonts are the only ones I can read clearly.

Edgar Reynaldo

What happens if you use a ClearType style (Drawing in 24-bit color, using the r, g, and b as individual pixels)? Then a 2X3 font would actually be 6X3. I say try it with a 2X5 font.

kenmasters1976

Can I do any better?, I don't think so but it reminds me of this tinyfont applet at Ken Perlin's page.

The applet doesn't have numbers, though. It uses RGB values independently as Edgar Reynaldo suggested.

Oh, and I can read only the third and fourth lines in the first image. The 3x5 ones are easier to read.

X-G
gnolam

Completely illegible on my monitor. :P

Trent Gamblin

I agree, the 3x5 fonts (the second to last one especially) are the only reasonably legible ones.

Andrei Ellman

What happens if you use a ClearType style (Drawing in 24-bit colour, using the r, g, and b as individual pixels)?

Sadly, I plan on drawing these digits in different colours and using a lower screen-resolution, so ClearTyping them won't be of much use. The only thing I'd be allowed to use is up to 8 shades of grey (3-bit colour), but in my attempts, the 1-bit fonts came out the best.

kenmasters1976 said:

it reminds me of this tinyfont [mrl.nyu.edu] applet at Ken Perlin's page

This is actually legible (as long as I'm not too far from the screen), but relies too much on ClearType for my liking.

Either I can't read that one at all or they've deliberately written gobbledygook.

Anyway, I've posted a magnified version of my fonts. Does it make any of the fonts smaller than 3x5 more legible?

{"name":"603255","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/a\/2\/a2b26895cb0c508c299a19f1d19ff271.png","w":320,"h":62,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/a\/2\/a2b26895cb0c508c299a19f1d19ff271"}603255

603256

AE.

Trent Gamblin

3x4 might pass as legible but I imagine when you get to q and x etc it won't.

Andrei Ellman

I'm only planning on doing the 16 hexadecimal digits so I'll never move on to Q and X.

Anyway, here is a full ASCII 3x5 font that cheats a bit by occasionally using the space between letters (either below or to the right), so it's really a 4x6 font without spacing (the glyphs occasionally touch).

603257

603258

The images use an extra pixel space to make the individual letters stand out more.

kenmasters1976

In the magnified version you can definitely read most of the 1 bit fonts without problems (keeping in mind that you're only doing hex digits). Maybe the ones in the first row are a bit hard to recognize. The 2 bit fonts continue to be quite illegible to me.

The full ASCII font looks fine, particularly in the zoomed version.

MiquelFire

Magnified: 3x4 is the smallest I would use, EVER! 2 width is too small
Non-magnified: On my screen, 3x5 is smallest that can be read.

Bruce Perry

Having the digits in order gives the reader enough clues that they will think it's readable even if it isn't. You should post the digits in a random order and then see how people do :)

Anyway, this prompted me to mess around with the BBC computer's Teletext graphics. If a character with a code from 145 to 151 is output, then for the rest of the line, any character with bit 5 (32) set will be interpreted as graphics. First I reminded myself which of the other bits from 0 to 6 corresponded to which pixels.

{"name":"bbchexfont1.png","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/4\/5\/4567490b15f939c3f8c6310f79769209.png","w":652,"h":537,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/4\/5\/4567490b15f939c3f8c6310f79769209"}bbchexfont1.png

AU. is short for AUTO; P. for PRINT; V. for VDU. The last-mentioned takes character codes and invokes the Operating System's 'write character' command.

You can see I forgot that BBC BASIC doesn't support the += operator. Then I ran into trouble with the OS's Teletext output algorithm: it remaps #, £ and _ to resolve a discrepancy between the Teletext chip and the rest of the computer, and it interprets 127 as delete (of the backspace variety). So I tried again, this time with bit 7 set. None of the 128-255 range have special meanings to the OS, and the Teletext chip ignores bit 7. In both cases, I had an extra '>' prompt on the same line, which got reinterpreted as graphics, and which I ignored.

Then I chose a new colour and coded Andrei's digits, along with a space after each one. (Lines 90 and 100 scrolled off the top, but they just say "P.".) Unfortunately, it didn't occur to me to do them in a random order.

{"name":"bbchexfont2.png","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/0\/1\/016726e0dca40fe7726b26d8ab4c9044.png","w":652,"h":537,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/0\/1\/016726e0dca40fe7726b26d8ab4c9044"}bbchexfont2.png

[EDIT]
The fact that we've gone from that to

{"name":"portal4dimensionsno3.jpg","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/8\/1\/81cde3d088c80473f85abf7dd4ad9516.jpg","w":1440,"h":900,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/8\/1\/81cde3d088c80473f85abf7dd4ad9516"}portal4dimensionsno3.jpg

is making me feel seasick ;D

Aaron Santiago

The text is really hard to read, but I got it.
It's a rick'roll.

Striker

here is a full ASCII 3x5 font that cheats a bit

With the cheats it is actually a 4x6 font. Here is an Allegro 4.4 font file useable with load_font. You can say the smallest readable Allegro font...

Andrei Ellman

A 4x6 font with cheats could pass as a 3x5 font if the 'overflow' is used sparingly enough that people don't notice or don't care about the adjacent glyphs touching.

Anyway, I only recently noticed that in the 2x3 font, '6' & 'b' were identical, and in the 2x4 font, '3' & 'a', and '6' and 'E' were identical. I have attached an image with the 2x3 and 2x4 fonts fixed (in the 2x3 font, I also adjusted 'd' to make it look like a mirrored 'b', and in the 2x4 font, adjusted the '9' to make it look like a rotated '6'). Seeing that nobody else noticed, this must mean that the 2x3 and 2x4 fonts are on the whole illegible.

603276
{"name":"603277","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/2\/3\/235dbdb409532644824a3a0963404144.png","w":320,"h":62,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/2\/3\/235dbdb409532644824a3a0963404144"}603277
603278
603279

Anyway, as a readability test, I have posted versions of these fonts with the glyphs in random order.

603280
{"name":"603281","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/2\/f\/2fabe8140f3255e765eb037295bdfb3b.png","w":428,"h":62,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/2\/f\/2fabe8140f3255e765eb037295bdfb3b"}603281

AE.

Trent Gamblin

Again, the square 3x5 font (squared off one) is the only one that doesn't require a good deal of inspection of the glyphs, you can just read like normal.

MiquelFire

3x5 (both) for me. The second is a little better with 0 however.

Trent Gamblin

That's true about the 0, I agree... I find most or all of the other glyphs easier to read in the squared version though.

kenmasters1976

Bruce was right. Now that the characters are in a random order only the 3x5 fonts are easily readable.

Funny thing no one noticed the identical glyphs in the smaller fonts.

Neil Walker

You need to randomise your letters/numbers otherwise your brain will fill in the gaps and guess the correct ones more easily, making the experiment pointless.

Andrei Ellman

Here is a tiny 3x3 (with cheating but not in the hex-digits) font I downloaded from a.cc many yonks ago (about 2003 and it might have been by Matt Smith). Also included is a modified version (modified by me) of the hex-digits.

603317

{"name":"603320","src":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/0\/3\/036aabfcba125efcd4c54f1b5d201241.png","w":332,"h":32,"tn":"\/\/djungxnpq2nug.cloudfront.net\/image\/cache\/0\/3\/036aabfcba125efcd4c54f1b5d201241"}603320

603318

603321

Striker

Sorry, i don't understand where there is a "cheat" because it is obviously that it is a 4x4 font. And many characters are impossible to read, and are not even similar to the original characters, like the 4, 8, S, g, m, w, which are most damaged.

Andrei Ellman

Re cheating: I consider the space between glyphs not to be part of the font. If the glyphs overflow into that space, they touch adjacent glyphs, and are therefore cheating. If cheating is done sparingly, the merged glyphs can still be recognisable as individual glyphs joined together, but if it is done often, it becomes harder to work out where one begins and another ends. However, if the glyphs are drawn in different colours, it once again becomes easier. Without cheating, no account needs to be taken of which combinations of adjacent glyphs do not need to be used.

Sirocco

I have serviceable 3x3 and 3x5 fonts I've created over the years. Experience tells me anything smaller than 3x5 is of questionable merit unless you've got a stylistic reason or you just want to tinker with sub-pixels.

Thread #606221. Printed from Allegro.cc