Firecracking Coders!

On Saturday, young people in my Creative Computing Club at Science Oxford, designed some incredible fireworks to run on Sky Fawkes during the competition!

They used 5×5 grids to design each stage of their firework animation, then programmed BBC micro:bits (in MicroPython, using Mu) to display them.

They then investigated what happens when we run and change this piece of code:

for x in range(0, 5):
    for y in range(0, 5):
        display.set_pixel(x, y, 9)
        sleep(100)

And learnt how to fade their micro:bit’s display to make fireworks slowly disappear.

Finally, they decided how they wanted to ‘launch’ their fireworks, and even added backing music!

Check out their fireworks on YouTube, or keep reading to learn how to design and program your own fireworks in Python!

Design your own!
This tutorial assumes no prior Python experience!

You will need:

• A BBC micro:bit
• A way to code it – I recommend Mu, but you can also use the online Python editor.

STEP 1: Design your firework!

The micro:bit has 25 LEDs on the front, making up its display. They are arranged in 5 rows of 5.

You can turn each of these LEDs on individually, and they can vary in brightness.

Draw a 5×5 grid like below, and decide which of the LEDs should be on, and how bright each one should be.

You can design a different grid for each stage of your firework. Think about:

• how does it look when it’s just been launched?
• how does it look at the end, just before it starts fading away?

STEP 2: Display it on the micro:bit!

Each of the squares on your grid has a different brightness:

• If the LED is off, it has a brightness of 0.
• If the LED is at maximum brightness, it is 9.

Work out the brightness value for each square, like so:

And translate this into Python syntax:

Image("30003:06060:00900:06060:30003")

Each row on the micro:bit’s display is separated by a colon.

Type this code into your editor, replacing my firework with your own:

from microbit import *

firework1 = Image("30003:06060:00900:06060:30003")

display.show(firework1)

Flash your new code onto your micro:bit:

• In Mu, click the ‘Flash’ button
• In the online editor, click ‘Download’, then drag and drop your file onto the micro:bit.

Does your firework design show up on the micro:bit’s display?

If you get a scrolling message on the display, this is an error message! Don’t panic!

Check for spelling mistakes, and make sure you have capital letters in the same places that I have capital letters. Python is very particular about what you type.

STEP 3: Animations!

Add the rest of your firework images into your code, giving them each a different name (e.g. firework2, firework3…).

Now make a list of these images, by using this syntax:

fireworks = [firework1, firework2, firework3]

Placing your new list underneath the images that you have defined, but before you tell the micro:bit to show the image.

Next, change display.show(), and tell it to display your list of fireworks, instead of just one of them! You can also set the speed of the changes:

display.show(fireworks, delay=400)

Test a few speeds and decide what works best for your firework.

STEP 4: Extra steps!

Try out the for-loop code at the top of this blog post! What happens to your micro:bit’s display? What happens when you change the numbers?

Try launching your firework! You will need to choose your input (e.g. pressing a button, or shaking the micro:bit).

Take a look at the example code and fireworks at the link below for some inspiration!

https://github.com/ScienceOxford/microbit-fireworks

• The first three folders that you can see are the fireworks designed in the Creative Computing Club workshops.
• The last folder, SkyFawkesFireworks, are the files that are running on the robot in the video above.
• The other ‘loose’ files are my examples.

Are you / do you know a young person who wants to design a firework for us?

Thank you!

We need the code, the name of the creator, and a favourite colour for the Neopixels (the sparkly lights on the robot), so either:

• leave a comment below
• open a pull request on the Github repo
• tell someone from Science Oxford if you see us at a workshop!