I am Trixeling so hard right now

For a while now, I have been inspired by etall’s Processing + Hexels tutorials for animating trixel based graphics procedurally - but I wanted to take a slightly different approach in how I implement mine. I’m not using Hexels Pro’s SVG export to get my data - I’m using its CSV export to get the data in a little bit more of a raw form.

The CSV output looks like this…

#Hexels CSV Export of star.hxl
#Size
16, 9
#Hexel data: (column), (row), (R), (G), (B), (A)
0, 0, 0, 0, 0, 0 <- here, I stripped a lot of empty lines like this
3, 5, 255, 0, 123, 255
4, 3, 255, 171, 0, 255
4, 5, 255, 0, 123, 255
5, 3, 255, 171, 0, 255
7, 1, 255, 0, 123, 255
7, 3, 255, 0, 123, 255
7, 4, 255, 0, 123, 255
7, 5, 255, 171, 0, 255
8, 2, 255, 0, 123, 255
8, 4, 255, 171, 0, 255
8, 6, 255, 171, 0, 255
9, 3, 255, 171, 0, 255
9, 4, 255, 0, 123, 255
10, 3, 255, 171, 0, 255
10, 5, 255, 0, 123, 255
11, 5, 255, 0, 123, 255

…and then I manually determine the position of, and render each triangle based on some maths. This also gives me the flexability to do a few additional fun things with the trixel data using more advanced animation techniques, so hopefully, I’ll be posting some GIFs using those tricks soon.

What’s up with all of the trixel fascination lately? Well, I also happen to be working with a few friends on developing a small comedy oriented video game about the future of humanity in space, and we’ve decided that all of the game’s artwork will be trixel-based. I needed to work out a conceptual understanding of the trixel rendering workflow in the simpler Processing environment before I implement the technique in the more complex Desktop Java2D and Android Canvas environments.

The Source Code for this GIF can be found in this Gist:

https://gist.github.com/AdmiralPotato/027b8134674909b3cbd0

The complete Processing Sketch folder with the CSV and HXL files can be found here:

sketch_140124a.zip

The multi-sampling motion blur code used in this GIF is again, based on the algorithm that Bees & Bombs shared with me a while ago.