zylum’s Indie Game Development Blog

While watching TV, I saw a cartoon that looks sort of like a flip book style animation. The lines were all squiggly and constantly moving. This gave me inspiration to create a game with a similar style. I chose snake because the game play is very simple which would allow me to focus on achieving the desired effect.

To create the effect, I used an adaptation of brownian motion. Basically, you draw a random path from one point to another. Each squiggly line consists of smaller incremental lines. At each stage of drawing the squiggly line, the path chooses a random direction based on the current position of the end point. This ensures that the path doesn’t go too far off course. Once the path is within the incremental drawing length of the desired endpoint, we connect the current position with the end point.

The main challenge of this project was ensuring that each line segment is drawn only once. For example, at each frame the game draws the border, the food and the snake (in that order). Thus, once the border is drawn, if the piece of food is generated on the border then one of the sides of the food should not be drawn. If it’s generated on the corner, two sides should not be drawn. Furthermore, if the snake is along the border, or moving along a portion of it’s tail, many line segments should not be drawn. If in any of those cases the lines were drawn, then the effect would be ruined because the squiggly lines would overlap and create thick, ugly lines.

To solve this problem, I keep track of which lines have been drawn. Specifically, the lines are stored in a TreeSet which is implemented as a red black tree. This ensures fast queries which is good since there could potentially be hundreds of lines drawn per frame. Rather than creating a new class which defines the x-position, y-position and orientation, I decided to generate a unique number for each line based on each of these variables. This way I save some memory and avoid having to write a comparator for the new class. Since each line has a semi-unique position (a horizontal line can share a position with a vertical line), the integer generated is the location of the line plus an offset of N if the line is vertical (where N is the number of positions). This scheme ensures that each line gets a unique number since the problem of shared positions is fixed by adding the offset to vertical lines.

All in all the effect turned out quite nicely. I don’t know why, but I find snake a very addictive game. After I completed it I played it for quite some time. I managed to get a highscore of 63 — see if you can beat that!

Play Hand Drawn Snake.

Source code: Snake.java, Game.java