Just Another Indie Studio

PicoBreed Breakdown #001 It’s full of stars

P

The star field in the background

Pico8 Horizontal Starfield In Game

One of the first things I did was make a star field. I wanted to give the impression of a ship in space always moving. In the game the ship you enter is at warp moving to the right. In the game you start at the ‘back’ in the shuttle bay and work your way forwards to the boss encounter.

There are a set number of stars. 100 in fact. They go off the left edge and come back on the right. There are always 100 stars on the screen and their position and speed are randomly generated.

stars={}

Here is the list that will store them.

s_col={1,5,6,7}

This list has the colours. Dark blue, dark grey, grey and finally white.

s_mult = 1;

This governs the speed of the stars, more in this later

for star=0,100 do
  s={} -- Individual star
  s.x = rnd(128) -- Assign a random x somewhere on the screen
  s.y = rnd(128) -- Assign a random y somewhere on the screen
  s.px = s.x -- This is to draw the stars as lines later
  s.py = s.y
  s.col = s_col[flr(rnd(4))+1] -- We pick a random colour
  add(stars,s) -- Add this star to our star list
end

We loop 100 times, making a temporary list to store the stars individual properties. in this code it’s called ‘s’. I do this in the _init() part of the code, it only needs doing once.

How do we draw the stars?

For simplicity sake i’m doing some logic for the stars in the _draw instead of in the _update

function _draw()
  cls() --clear the screen to black
 
  for s in all(stars) do --loop over every star in our list
    s.x -= s.col*s_mult; --the speed is goverend by the colour and our multiplier
    if(s.x<0) then --when this star touches the left side of the screen s.x = 128; --move it to the right side s.px = s.x; -- draw a random coloured bright streak if (s_mult>0.9) line(c1_x+0,c1_y+s.y,c1_x+128,c1_y+s.y,rnd(16))
    end
    if(s_mult<1) s_mult+=0.00005; -- slowly speed up
    line(c1_x+s.x,c1_y+s.y,c1_x+s.px,c1_y+s.py,s.col) --draw the star with its own colour
    --we use the px and py to draw longer lines to give the illusion of speed
    s.px = s.x; s.py = s.y;
  end
end

And here is what this looks like all together:

I almost forgot, remember that variable ‘s_mult’? Well this governs the speed of the stars. In the game, when you destroy a backup generator to open a door there is a momentary interruption of the power, causing the ship to drop out of hyperspace. When this happens, i drop the value of s_mult to simulate slowing down and then speeding up, as the ship re-routes power to the engines again.

For those that want to use this effect in their game or modify it to go in different directions, here is the cart:

If you liked this and want to help me make more awesome things then become a patron:
patreon.com/gabrielcrowe

Follow me on Twitter for updates:
View @gabrielcrowe on Twitter

– GC

About the author

Gabriel Crowe

During the day I'm a mild mannered web developer and online marketing wizard but at night I become an indie game warrior and all round badass.

I develop mobile and desktop games with Game Maker in my spare time and I am utterly addicted to Pico8.

If you liked this and want to help me make more awesome things then become a patron
patreon.com/gabrielcrowe

Just Another Indie Studio