Let's do some creative projects to get familiar with the GlowBit™ rainbow and micro:bit. The animation runs for 10 seconds, and can be started by pressing either of the micro:bit's buttons
In this guide we will:
- Wire a rainbow to a micro:bit,
- Upload an example program to make sure everything works, and
- Create several interesting projects from scratch!
To follow along, you'll need:
- 1x micro:bit with USB cable - the micro:bit GO kit is a great way to get started.
- 1x GlowBit rainbow
- 3x Alligator test leads. I'll be using Red, Black and Yellow. If you already have some Banana leads, those will work too.
- A battery pack for your micro:bit will allow you to drive your rainbow to maximum brightness. If you don't have a battery pack, that's ok too. If your rainbow flickers, that could be an indicator you're drawing too much power for the micro:bit to output. Try your experiment again at lower brightness.
Let's get started!
Contents
Getting Started
Projects
- Project 1: Tilt-o-meter (MicroPython)
- Project 2: Marquee display (MicroPython)
- Project 3: Mood Lamp (MicroPython)
- Project 4: Skill Game (MicroPython)
- Project 5: Pair of Dice (MicroPython)
- Project 6: Electronic Compass (MicroPython)
- Project 7: Comet Tail: Multi-Rainbow project (MicroPython)
- Remix: Animate a Beautiful Rainbow: (MicroPython)
Wire a rainbow to a micro:bit
It's best to unpower your micro:bit when wiring - make sure the USB lead or any batteries are disconnected for this bit.
- Use the Black alligator clips to connect GND on the micro:bit to GND on the rainbow
- Use the Red alligator clips to connect 3V on the micro:bit to 3V on the rainbow
- Use the Yellow alligator clips to connect 0 on the micro:bit to Data on the rainbow
Wiring diagram for connecting a micro:bit to a GlowBit rainbow
Upload a Code Example
Time to make sure everything works, we'll upload a test pattern to the micro:bit.
- Open this test program
- Click the Download button
- Connect your micro:bit to your computer with a USB cable
- copy the program onto your micro:bit
Once the program is uploaded, your rainbow should look like... a rainbow!
If you're having trouble with this step, take a picture of your setup and open a thread in our forums - we're full-time maker's and are here to help!
Project 1: Tilt-o-meter (makecode)
Let's code a project that measures the tilt-angle of the micro:bit, and displays it on the rainbow by lighting up a corresponding LED. Since we're already wired up, all we need to do is reprogram the micro:bit. If you really want to skip ahead, the code for this project is linked here, but I've always found doing code-alongs to be more fruitful.
Step 1 - Setup & Measure
Create a new project. First, on start we'll initialise the rainbow as a strip of 13 NeoPixels. Then, in forever we'll begin by clearing the strip, and measure the micro:bit's roll angle - store that in a variable called roll.
Step 2 - Map
Next, we will convert the roll-angle into an index for which LED to illuminate. Roll is zero when the micro:bit is level. As the micro:bit tilts left or right, the roll angle is negative or positive. A quarter turn in either direction is 90 degrees, so we can map the range -90 to 90 degrees into an LED number (0 to 12). We'll store the result in a variable called gauge. Map will return floating point numbers, but we need the gauge variable to be a whole number - set gauge to the rounded value of itself.
Step 3 - Dazzle
Finally, all that's left is to send the data with the NeoPixel: set pixel color command and show the data. Since we clear the rainbow at the top of the forever loop, this code will only ever illuminate one LED at a time.
That's all there is to it! Upload the new code to your micro:bit and experiment with rolling the microbit.
Step 4 - Remix
There's a few interesting observations we can make! What happens if we...
- Fix the rainbow to a table and roll the micro:bit?
- Roll the rainbow with the micro:bit?
- Flip the rainbow around and then roll the rainbow with the micro:bit?
Project 2: Marquee Display
Marquee lights are fancy, eye-catching lighting displays used by cinemas, theatres and shops. We're going to program our rainbow with an animated marquee pattern - lighting every third LED and giving the illusion of movement.
We'll program in micropython for this project, head over to python.microbit.org to get started. Code along with this project video - if you get stuck, you can copy the working code below.
# Create a marquee light animation using simple math tricks
from microbit import *
import neopixel
# Setup the Rainbow as a Neopixel strip on pin0 with a length of 13
rainbow = neopixel.NeoPixel(pin0, 13)
violet = (60, 33, 60)
counter = 0
while True:
rainbow.clear()
for i in range(13):
if (i - counter) % 3 == 0: # true for every third LED
rainbow[i] = violet
rainbow.show()
counter = counter + 1
sleep(200)
Project 3: Mood Lamp
Create a moody-display that's different every time - use random numbers to generate a new unique colour
We'll program in micropython for this project, head over to python.microbit.org to get started. Code along with this project video - if you get stuck, you can copy the working code below.
# Make a mood lamp with the GlowBit Rainbow
# Press either button to step through random colours
from microbit import *
import neopixel
from random import randint
# Setup the Rainbow as a Neopixel strip on pin0 with a length of 13
rainbow = neopixel.NeoPixel(pin0, 13)
while True:
if button_a.was_pressed() or button_b.was_pressed():
red = randint(0, 60)
green = randint(0, 60)
blue = randint(0, 60)
for i in range(13):
# Assign the current LED a random red, green and blue value between 0 and 60
rainbow[i] = (red, green, blue)
# Display the current pixel data on the Neopixel strip
rainbow.show()
sleep(100)
Project 4: Skill Game
Put your reaction time to the test with this skill-game - press the button only when the middle LED is lit to increase your score.
We'll program in micropython for this project, head over to python.microbit.org to get started. Code along with this project video - if you get stuck, you can copy the working code below.
# Press button B when the middle LED is lit
# the game gets harder the more points you score
from microbit import *
import neopixel
from random import randint
# Setup the Rainbow as a Neopixel strip on pin0 with a length of 13
rainbow = neopixel.NeoPixel(pin0, 13)
# game variables
active = 0 # which LED is active
direction = 1 # the direction to move
score = 0 # current score
# game colour changes every game
red = randint(0, 60)
green = randint(0, 60)
blue = randint(0, 60)
while True:
# Update the game display
rainbow.clear()
rainbow[active] = (red, green, blue)
rainbow.show()
sleep(400 - score)
if button_b.was_pressed():
if active == 6: # LED 6 is the middle LED
score = score + 25 # increment the score
else:
# LOSE
print("Scored {} points".format(score))
sleep(1000)
reset()
# Update the game state - move the LED and bounce off the ends
active = active + direction
if active >= 12:
direction = -1
elif active <= 0:
direction = 1
Project 5: Pair of Dice
Create a pair of virtual dice to add some colour to your games-night.
We'll program in micropython for this project, head over to python.microbit.org to get started. Code along with this project video - if you get stuck, you can copy the working code below.
# Make a set of electronic dice
# Create two independent, six-sided dice
from microbit import *
import neopixel
from random import randint
# Setup the Rainbow as a Neopixel strip on pin0 with a length of 13
rainbow = neopixel.NeoPixel(pin0, 13)
orange = (51, 33, 0)
fuchsia = (51, 0, 51)
while True:
if button_a.was_pressed(): # roll the left die
value = randint(0, 5)
for i in range (0, 6):
if i <= value:
rainbow[i] = orange
else:
rainbow[i] = (0,0,0)
rainbow.show()
if button_b.was_pressed(): # roll the right die
value = randint(7, 12)
for i in range (7, 13):
if i >= value:
rainbow[i] = fuchsia
else:
rainbow[i] = (0,0,0)
rainbow.show()
Project 6: Electronic Compass
Get your bearings with an electronic compass! We'll read the heading from the micro:bit's magnetometer and use our rainbow to indicate the direction of magnetic North.
We'll program in micropython for this project, head over to python.microbit.org to get started. Code along with this project video - if you get stuck, you can copy the working code below.
# Make an electronic compass using the micro:bits magnetometer and a GlowBit Rainbow
from microbit import *
import neopixel
from random import randint
# Setup the Rainbow as a Neopixel strip on pin0 with a length of 13
rainbow = neopixel.NeoPixel(pin0, 13)
# A function to convert from one range of numbers to another
# Useful to convert FROM 0-360degrees TO LED no. 0-12
def convert(x, i_m, i_M, o_m, o_M):
return max(min(o_M, (x - i_m) * (o_M - o_m) // (i_M - i_m)), o_m)
while True:
rainbow.clear()
# convert 0-360 degrees to -180 to 180 degrees
heading = compass.heading()
if heading > 180 and heading <= 360:
heading = heading - 360
# convert (-90 to 90) degrees to LED number (0 to 12)
index = convert(heading,90,-90,0,12)
print(str(heading) + " " + str(index))
index = round(index) # round to nearest whole number
rainbow[index] = (30,0,0)
rainbow.show()
sleep(100)
Project 7: Comet Tail: Multi-Rainbow Project
Did you know you can connect multiple rainbows together to create a longer strip of GlowBits? In this project we wire two rainbows together and create an animation that moves across them
We'll program in micropython for this project, head over to python.microbit.org to get started. Code along with this project video - if you get stuck, you can copy the working code below.
# A bright comet flies across two rainbows
from microbit import *
import neopixel
# Set up the rainbows (2x rainbows = 26 LEDs)
numLeds = 26
rainbow = neopixel.NeoPixel(pin0, numLeds)
headBrightness = 60
frame = 0
while True:
val = headBrightness
for i in range(0, numLeds):
rainbow[ (i frame) % numLeds ] = (val, 0, 0)
val = round(val * 0.75) # the next LED is dimmer
if val <= 1: # 'clip' low values
val = 0
frame = frame - 1
rainbow.show()
sleep(50)
You may have to clip the lower brightness to zero. In the video we check
val = round(val * 0.75)
if val == 1:
val = 0
but a more robust check would be this, which is provided in the full example above
val = round(val * 0.75)
if val <= 1:
val = 0
Animation Remix: Animate a Colourful Rainbow
This code remix uses ideas we've already explored in this tutorial (colour-wheel, animation) and brings them together to create a beautiful, multicoloured rainbow.
# Animate a beautiful, multicoloured rainbow
# Press the A or B button to begin!
from microbit import *
import neopixel
from utime import ticks_diff, ticks_ms
# Python colour wheel - returns R,G,B values based on an input from 0-255
def wheel(pos):
# The colours transition through r - g - b - back to r.
if pos < 0 or pos > 255:
return (0, 0, 0)
if pos < 85:
return (255 - pos * 3, pos * 3, 0)
if pos < 170:
pos -= 85
return (0, 255 - pos * 3, pos * 3)
pos -= 170
return (pos * 3, 0, 255 - pos * 3)
# Set brightness based on a value from 0 to 100
def adjust_rainbow_brightness(brightness):
if brightness > 100: brightness = 100
if brightness < 0: brightness = 0
brightness = brightness / 100
for i in range(13):
(r,g,b) = rainbow[i]
r = int(r * brightness)
g = int(g * brightness)
b = int(b * brightness)
rainbow[i] = (r,g,b)
# Clear the rainbow (turn off each LED)
def clear_rainbow():
for i in range(13):
rainbow[i] = (0,0,0)
rainbow.show()
# Setup the Rainbow as a Neopixel strip on pin0 with a length of 13
num_LEDs = 13
rainbow = neopixel.NeoPixel(pin0, num_LEDs)
clear_rainbow()
frame = 0 # used to drive the animation.
# and now for our main loop
while True:
# wait for a/b button press
if button_a.was_pressed() or button_b.was_pressed():
# Get the animation start-time
start_time = ticks_ms()
# Show a rotating rainbow and stop after 10 seconds
while ticks_diff(ticks_ms(), start_time) < 10000:
for i in range(13): # for each LED
hue = int(frame + (i * 255 / num_LEDs)) # get a unique hue for this LED. i is the LED number, and frame changes the colour over time
if hue > 255: hue = hue-255 # Wrap hue back to zero if it goes above 255
rainbow[i] = wheel(hue) # convert hue to RGB and apply to this LED
adjust_rainbow_brightness(20) # scale the brightness. Default is *really* bright
rainbow.show()
frame += 1 # increment the animation by one "frame". Larger steps make for a faster scrolling pattern
sleep(10)
# rainbow complete! clear the LEDs and wait for another button press
clear_rainbow()
