Procedural Spaceships

2015-07-11

This is an old post of mine about procedurally generating spaceships:

The Algorithm

The algorithm needs a pseudorandom number generator and a spritesheet as input to generate a spaceship. An example number generator is shown below, the spritesheet may look something like this: Spritesheet There is also a second file, containing the mountpoint-data for the sprites. As an image this file would look like this: Mountpoints In this image every green dot is a wing mountpoint and every red dot is an engine mountpoint. The generator uses these point to connect the selected sprites and generate a full spaceship.

To understand what the generator is doing we are going to use an example:

  1. The generation starts with a hull. Which hull is determined by the result of a call of the number generator:

    hull = generate_number() % 2;
    

    Step 1: Two hulls

  2. Then for each mountpoint we have to find a sprite:

    wing = generate_numer() % 3;
    

    Step 2: Adding wings

  3. As you can see, the wings have mountpoint again. These need to be filled in next:

    weapon = generate_number() % 3;
    engine = generate_number() % 2;
    

    Step 3: More mounts

In this case, the results look like this:

Results

Pseudorandom Number Generator

In this example the PRNG used is based on the fibonacci sequence. We use a PRNG instead of just Math.random because we want to be able to regenerate the spaceship by just saving a seed.

The implementation has two parameters (n1 and n2) and looks like this:

var n1 = 0;
var n2 = 0;

function seed_prng(a, b) {
    n1 = a;
    n2 = b;
}

function next_number() {
    var n = n2 + n1;
    n2 = n1;
    n1 = n % 10;
    return n1;
}

Javascript Version

Here is a demonstration of this algorithm. You can either choose Random generation, select the initial values for n1 and n2 or provide a sequence of numbers manually. The order of the sequence is [Hull, Wing, (Wing), Empty, Engine].

Random
Use fibonacci sequence
Startingvalue n1:
Startingvalue n2:
Use own number sequence
Sequence:

image/svg+xml