Tag Archives: tricolor

Update: tricolor

Today I refactored much of the tricolor project (live page), a cellular automata simulator. It’s one of those projects that had a great scope for improvement and extension, and was actually an offshoot of the Conway’s Game of life project.

The most significant improvements were:

  • Giving the user more control over the parameters. Many new variables were added that the user can edit, including the number of “breeds” of cells, number of “families”, the size of the cells, how the play area wraps around in the \(x\) and \(y\) directions, the base health of the cells, and after how long they start to decay (a new feature.)
  • Addition of the history bar. This records the recent evolutiom of the simulation, allowing the user to see how changing the different varaibles affects the overall stability of the populations.
  • Refactoring to object oriented code. Initially the code borrowed from Conway’s Game of Life, where the history of the cells was not important. As a result the code was simply a two dimensional array of states. As the tricolor cellular automata became more sophisticated it became necessary to introduce a class to handle the cells. This simplified the code greatly.
  • The user can now view the “health” of the cells. Each cell has a health associated with it, and turning on the option to see the health clarifies where most of the changes are taking place. The regions close to the boundaries have less health, giving a dark outline. Large areas without any “food” lose health, making the decay more obvious/
  • The layout of the page was tidied up significantly. There is less whitespace and better use of existing space. There is still room for improvement though, as a single button should be used for changing all settings, and a description of all the parameters should be given. It should also be made explicit which changes of settings require the play area to be completely redrawn.


Sample screenshot
Sample screenshot
Example history showing transient behaviour.
Example history showing transient behaviour.

Tricolor (cellular automata)

While investigating Conway’s game of life I wanted to see if I could easily extend the framework I’d developed to explore other systems. One of the more interesting cellular automata is the rock-paper-scissors system where three populations feed on each other.


Live page
GitHub repository


The algorithm used to make the rock-paper-scissors cellular automata is does not seem to be well documented in an easy to obtain source, so I had to interpet much of the algorithm based on subjective descriptions. Each cells has a health which can take a value between \(0\) and \(10\). If a prey species is adjacent to its predator species then the prey species gives a health point to the predator species. When the prey species health reaches \(0\) it is replaced by a predator species. The result is that this creates spiral patterns on the canvas.


Challenge: The algorithm needed some experimentation and tweaking to get right.
Solution: There are numerous papers and articles about how these algorithms work, but I couldn’t find a source that was explicit or that I could understand. As a result I had to create my own algorithm and tweak it until it was stable. Hopefully others users can read my code and develop it further. (Resolved)

Sample outputs

Sample 1, early in the evolution of a system
Sample 1, early in the evolution of a system
Sample 2, late in the evolution of a system
Sample 2, late in the evolution of a system