Programmatic Pixel Art

Started by
6 comments, last by Servant of the Lord 9 years ago

Hello. I was just wondering, has anyone ever tried making a game with programmatic pixel art? What I mean is, instead of using a spritesheet, this individual would have used an array (for example) to map out a sprite in the program and draw them with pixels using a graphics primitive function.


// Basic example using C++ syntax
pixelArt[3][3] = {
    {'1', '1', '1'},
    {'1', '0', '1'},
    {'1', '1', '1'}
};


// Output (the ? represents a pixel drawn by a graphics function)
// ???
// ? ?
// ???

However, the aim would be to output something like this:

5ea3be34ec5d504d177dd6373573d070.jpgmrrapv.png

Does it make sense to try such a method if the sprites are generally small and simplistic? Or is it better to just use a spritesheet (texture atlas)? It might be a fun project for me if it proves to be practical.

Advertisement

Sure it would work, and you could indeed build something like that for fun.

But when you want to add colour, and have larger images it is going to be severely limiting.

Drawing images will always be so much faster with image editing software than editing text... and if you wrote a converter (image->text) well then it is self defeating as the image will generally compress much smaller/faster and be faster to decode.

If you used a raw array of data then you could just use a memcopy to create an image, and that would be fast - but might not worth the effort to geneate the code anyway in the first place, as it would no doubt take up more space.

That said... I have done this exact kinda thing before in a tiny console utility, I cached the bitmap data for the characters 0-9 in 10 unsigned integers in an array.
the first 24 bits described the character's shape (4x6 grid) and then the other bits can be used to store metadata such as the characters width in pixels.

This enabled me to blit numbers to a bitmap very quickly with very little data - just 1 uint to describe the pixels of a character :D

Has anyone ever tried to do that, you ask? Oh yeah. I can guarantee you that in the medieval ages of computing people were routinely hardcoding graphics directly in their source code like that.

You may want to have a look at the XPM format, a text based bitmap format that is also actually valid C code defining palette and pixels as arrays. Some editors even recognize it and can turn into bizarre text editor / image editor hybrids:

Screenshot-xterm-linux.xpm-GVIM.png

@Zlodo nice, in the link you posted under the comparisons section you can see the XBM format:
#define test_width 16
#define test_height 7
static char test_bits[] = {
0x13, 0x00, 0x15, 0x00, 0x93, 0xcd, 0x55, 0xa5, 0x93, 0xc5, 0x00, 0x80,
0x00, 0x60 };
that is very much like the idea I described in my reply, not that much use in this day and age but still fun to play with all the same!
as an additional note to think about with things like this is the editing side of things... if you wanted to grab and move a selection of pixels and move them (some that is easy in an image editor) most text editors are going to fail here :( so just another things to bear in mind - are generation will probably be very tedious indeed

Well the thing is that things like gimp can directly load and save XPM images so you can just edit them like normal images and then just #include them in your code. You still have to decode them into an RGB format before you can use them anyway, so I'm not sure it's really very useful.

If you really want to embed images directly into your executable, you might be better off just including images in PNG or JPG in your code using something like bin2c and using stb_image (a full featured image loader that fits entirely in a header file) to decode them.

Thanks for the responses and recommendations. I've never heard of XPM before. I might try this later, after I've wrapped up some of my other projects.

Might not be exactly what you mean but I have a procedural sprite generator (no shaders) for Unity on the Asset Store. It will produce an unlimited (well, whatever C#'s Int32.MaxValue is i guess) of spaceship, planets, moons, asteroids, suns, space stations (early stage) and backgrounds. It deals with setting pixels (and a few .net GDI drawing to make it a bit quicker). So while nothing is hard-coded like your example, I do consider them to be "pixel art".

Therefore, to answer your first question:

has anyone ever tried making a game with programmatic pixel art?

Yes, yes i have.

Stellar Sprites - Asset Store

Stellar Sprites - Website

Hello. I was just wondering, has anyone ever tried making a game with programmatic pixel art? What I mean is, instead of using a spritesheet, this individual would have used an array (for example) to map out a sprite in the program and draw them with pixels using a graphics primitive function.

Sure. It's not very practical because it goes the exact object direction of separating assets from code, but yes, it's been done.

Advanced automated examples of this are systems like Visual Studio's and QtCreator's resource-packing wizards that load arbitrary files from disk and convert them to code so they can be baked into the resulting DLLs or EXEs.

There are even projects that have gone further, and use algorithmic rules to generate the assets procedurally.

This topic is closed to new replies.

Advertisement