See the Light!

Scott W. Vincent on Flickr

Create illuminating art with micro:bit

What will you need for this project?

  • A microbit
  • Micro USB lead to connect micro:bit to computer
  • 3 x Neopixel rings of different sizes (24, 16, 7)
  • A Kitronik breakout board like this. Or you can make your own – take a look at “How can we take this further?”
  • Breadboard
  • A soldering iron
  • Solder
  • Sponge & stand
  • 3 x Single Core Wires (Of different colours)
  • Wire strippers and cutters
  • A 2 x AA battery box (to power the neopixels)
  • A USB battery (to power the micro:bit away from your computer)
  • Arts and crafts materials to make a stand, we used foam core.

All of the code for this project and a high resolution circuit diagram can be found at https://github.com/lesp/KidsCodeCS-NeoArt/archive/master.zip

Building your own piece of light art is rewarding as it teaches us concepts of coding, electronics and design.
The circuit for this project consists of the neopixels, the micro:bit and the power source for the neopixels. All are connected with a “common ground”.

Intro

In the last two issues we introduced the micro:bit by using it with a block based JavaScript programming language, formerly called PXT. But for this issue we shall delve a little deeper and learn how to use Python with the micro:bit to create a 3D light sculpture using LEDs called Neopixels, a brand name created by Adafruit, but the formal name for these LEDS is WS2812B. The super bright LEDs are sold in many shapes. From individual LEDs called “pixels”, to rings, squares and super long strings of pixels that can stretch for metres!

We’ll also be learning how to solder the connections for our neopixels, and use a cost effective breakout board that enables our micro:bit to be used with a breadboard, in much the same manner as an Arduino or Raspberry Pi can be used.

But before we start a word of caution. Neopixels are very bright and they can cause headaches / eye strain and could be harmful to those with photosensitivity. So please use a sheet of paper / acrylic to diffuse the light.

We shall be covering the following concepts

  • Importing libraries of pre-written code.
  • Using loops to repeat code indefinitely, and for a predetermined number of times.
  • Using tuples to store RGB colour values.
  • Creating animations via algorithms.
  • Learning how to create electronic circuits with soldering irons.

Getting Started

First we need to solder our neopixel rings together, so set up your soldering area so that everything is to hand and so that you have easy and free access to your soldering iron. Turn on the iron and let it warm up, but do not leave it unattended. You will see that each neopixel ring has solder points labelled IN, OUT, V / PWR and GND. We will need to add a little solder to each of these points. Take your time, and ensure that you are wearing protective glasses, and that you are soldering in a well ventilated room. Children should be supervised as they solder, or parents may wish to tackle this bit of the build.

Now we need to cut, strip and “tin. Take a length of each colour single core wire, and cut each length into three equal parts. Now using your wire strippers, strip about 1CM from the ends of each wire. Using a blob of modelling clay to hold each wire, gently touch the hot soldering iron to the wire and then touch the solder to the wire. After a second it should flow and coat the wire in solder. Repeat this for all of the wires.

Now let’s solder three wires to the largest neopixel ring. Ensure they are different colours and that you stick to these colours!

We used:

Power / VCC = RED
GND / Ground = GREEN
Data (In and Out) = YELLOW

So now we solder our yellow wire to the IN pad of our neopixel ring, this will receive pulses that control the colour of each LED, and these are sent from pin 0 of our micro:bit. Next solder the wires to the GND and VCC pads that are next to the IN pad.

Now we need to solder the same colour wires to the OUT, VCC and GND pads on the largest ring. These will connect to our next size ring via it’s IN, VCC and GND pads. Then for the final tier of our sculpture we do the same again.

With all of the rings soldered, we now need to connect the wires from the largest ring to our breadboard. Our breadboard has two “rails” along its longest two sides. These are + and -, in other words VCC (+) and GND (-) We need to connect the GND and VCC from the largest ring to these rails, we still have one wire left to connect on the ring, we shall do that later. Now connect the VCC and GND wires from our battery to these rails. Now using the breakout board connect pin 0 of the micro:bit to a spare hole in the breadboard, but not the rails. Now take the IN wire from the largest ring and place it in line with the pin0 wire. Pin0 is now connected to our input pin and can control the neopixels. Lastly we need to connect the GND pin our micro:bit to the (-) rail of the breadboard. This creates a “common ground” reference, and enables all parts of the project to talk to one another.

With all of the hardware connections made, now we can start writing the code. In a web browser go to http://python.microbit.org/editor.html

In here we can write the Python code that will control the neopixels,and then when we are ready we can download the code compiled into a .hex file, that the micro:bit can understand. We then copy the hex file to the micro:bit which appears as a USB flash drive when connected to our computer.

We start the code by importing the micro:bit Python library, which enables us to use the pins of our micro:bit. Then we import the neopixel library so that we can control the neopixel rings.

from microbit import *
import neopixel

Now we shall create an object, “np” that will contain the pin to which our neopixels are connected, and the number of neopixels (count each ring and add them together for the total)

np = neopixel.NeoPixel(pin0, 47)

Using a loop we shall run the code inside the loop “forever”, and our first line of code in the loop is indented for us, this identifies that the code is to run in the loop. We create a “for” loop, a loop that will go round a set number of times. In this case it will go round 12 times, starting at 0 and advancing 2 steps at a time (2 * 12 = 24, the number of LEDs in the largest neopixel ring.)

Each time the for loop goes round, it will change the colour of the a single LED in the neopixel ring, “np[i]” where “i” is an even number (0,2,4,6…12) so the first time round the firs led lights up, then the loop goes round and we skip an LED and go to the next. This gives us a staggered pixel effect, similar to stripes on a candy cane. To control the colour of the LED we use three numbers that represent Red, Green and Blue. These go from 0 to 255, with 0 = LED off, and 255 being full brightness. In the first loop we set the Red level to 30 and the rest to 0. So we get a pleasant red glow. In order to see the LED change colour we need to instruct the LED to “show” the change. Lastly we instruct the code to wait for 0.1 seconds.

    for i in range(0,24,2):
        np[i] = (30,0,0)
        np.show()
        sleep(100)

We then create another for loop, for the same neopixel ring (24 LEDs) but this time we start at LED 1 (the second LED on the ring) and advance 2 steps each time the loop goes round, effectively lighting up the odd numbered LEDs. This time we light them “0,30,0” which is green.

    for i in range(1,24,2):
        np[i] = (0,30,0)
        np.show()
        sleep(100)

Now moving on to the next neopixel ring, which has 16 LEDs, we repeat the same two for loops, but this time alter the colours so that we have yellow “30,30,0” and green “0,0,30”

    for i in range(24,40,2):
        np[i] = (30,30,0)
        np.show()
        sleep(100)
    for i in range(25,40,2):
        np[i] = (0,30,0)
        np.show()
        sleep(100)

Our final neopixel ring has just 7 LEDs and we set the even numbered LEDs to white “30,30,30” and the odd numbered to yellow “30,30,0”. Outside of the for loops we create a delay of 1 second using “sleep”.

    for i in range(40,47,2):
        np[i] = (30,30,30)
        np.show()
        sleep(100)
    for i in range(41,47,2):
        np[i] = (30,30,0)
        np.show()
        sleep(100)
    sleep(1000)

With the code completed, click on “Save” to download a copy of the code to your computer, save this in case you wish to tweak the code in the future. Now click on “Download” to download a compiled hex file to copy to our micro:bit. Plug your micro:bit into your computer and it will appear as a USB flash drive. Copy the downloaded hex file to the micro:bit and it will start flashing the device. After a few seconds the micro:bit will reboot and the LEDs on all of the rings will light up.

How can we take this further?

What if I can’t find a breakout board?
Don’t worry! You can easily make your own breakout board using nothing more than some M4 countersunk machine bolts, some wire, and nylon washers and nuts. You can learn how to make your own micro:bit to breadboard breakout by visiting the MakerspaceUK website (part of Premier Farnell / Element 14 / Newark) for around $14 and still have enough spare parts to convert multiple micro:bits to use with breadboards.
http://www.makerspace-uk.co.uk/microkit-a-low-cost-breadboarding-solution/

Adding animation
Right now our project is illuminating, but not animated, so how can we inject movement and create a kinetic piece or art? Well in the example code for this project, which you can download and share, you will see that we have added another level of for loops to create a mesmerising animation across our 3D light sculpture.

Learn More

MicroPython Introduction Tutorial

http://microbit-micropython.readthedocs.io/en/latest/tutorials/introduction.html

What are NeoPixel LEDs?

https://core-electronics.com.au/tutorials/what-are-neopixel-leds.html
https://learn.adafruit.com/adafruit-neopixel-uberguide/the-magic-of-neopixels

More about the BBC micro:bit

https://www.kidscodecs.com/resources/microbit/
http://www.bbc.co.uk/programmes/articles/4hVG2Br1W1LKCmw8nSm9WnQ/the-bbc-micro-bit

Also In The December 2017 Issue

Learn some nifty coding tricks while creating a Formula EV3 Race Car.

With binary search, you don’t have to be a mind reader to beat this simple coding activity.

Controllers have come a long way in 50 years. Let’s appreciate the bulky, awkward ancestors that led us here!

Take your Scratch games to the next level by adding multiple modes with multiple sprites.

Let the CSS Zen Gardens wow you with variety and elegance. Making a pretty website isn’t so complicated after all!

An introduction to a hip new alternative to Java. It’s all the rage in android development!

Resources to transform you into a web virtuoso, from messaging apps to testers to code converters.

New treasures and new enemies await in two unique, dangerous realms.

Create your own 3D digital museum and learn how you can help preserve cultural artifacts.

Interesting stories about computer science, software programming, and technology for December 2017.

Add data types to your new programming language in this third installment of the series.

Links from the bottom of all the December 2017 articles, collected in one place for you to print, share, or bookmark.