Coding the Cloud

Program the Adafruit Circuit Playground Express to make is show a nice blue glow and play Twinkle Twinkle Little Star!

Concepts

  • Neopixels
  • Light
  • Brightness
  • Music

Duration ~ 30 minutes

Step 1: Setting up the Neopixels

Clip the GND wire to the GND pin on the board. Clip the DO wire to the A1 pin and the 5V wire to the VOUT pin on the board.

wires

Step 2: Coding the NeoPixels

Open MakeCode in your web browser.

From ||loops:LOOPS||, drag out an ||loops:on start|| block. From ||light:LIGHT||, click on ||light:NEOPIXEL|| just below it. From there, drag out ||light:set strip to||, ||light:strip set all pixels to||, and ||light:strip set brightness 0||. Place them inside the ||loops:on start||. Click on the (+) in the ||light:set strip to|| and type in 30. For ||light:strip set all pixels to||, change the color to blue. For ||light:strip set brightness||, type in 200.

let strip: light.NeoPixelStrip = null
strip = light.createStrip(pins.A1, 30)
strip.setAll(0x007fff)
strip.setBrightness(200)

Step 3: Coding the Adafruit Circuit Playground Express to light up

From ||light:LIGHT||, drag out a ||light:show ring|| and put it into the ||loops:forever||. Turn everything to blue. From ||light:LIGHT|| drag out a ||light:set brightness|| and place it just below the ||light:show ring||. Type in 200 instead of 0 for brightness.

forever(function () {
    light.showRing(
    `blue blue blue blue blue blue blue blue blue blue`
    )
    light.setBrightness(200)
})

Step 4: Create the song

From ||music:MUSIC||, get a ||music:set volume|| and place at the bottom of ||loops: on start||. Type in 155 for the volume level.

let strip: light.NeoPixelStrip = null
strip = light.createStrip(pins.A1, 30)
strip.setAll(0x007fff)
strip.setBrightness(200)
music.setVolume(155)

Go to ||variables:VARIABLES|| and click Make a Variable.... Name your new variable twinkle. Pull out the ||variables:set twinkle to|| and place it at the bottom of ||loops:on start||. Click ADVANCED and in ||text:TEXT||, get the "" string block and place it in the ||variables:set twinkle to||.

let strip: light.NeoPixelStrip = null
let twinkle = ""
strip = light.createStrip(pins.A1, 30)
strip.setAll(0x007fff)
strip.setBrightness(200)
music.setVolume(155)
twinkle = ""

In the blank string "" for ||variables:twinkle||, type in the notes, rests, and beats of the Twinkle Twinkle Little Star song.

The way to do this is to type in the note first, then the octave (in this case, it will always be 4), then a : symbol followed by how many beats you want it to play for. Here is an example:

let twinkle = "c4:2"

After you type in one note, you can add a rest before another note plays. Type in r:2 after your first note if you want a rest for 2 beats before the next note, like this:

let twinkle = "c4:2 r:2 c4:2"

Keep typing in the notes one by one, with the rests. Experiment with the rests and beats until you get the perfect song! You don’t have to use rests but they might make your song sound better. The first line of the song without any rests is this:

let twinkle = "c4:1 c4:1 g4:1 g4:1 a4:1 a4:1 g4:2"

Here are all the notes and beats for the song:

TWINKLE TWINKLE LITTLE STAR
c4:1 c4:1 g4:1 g4:1 a4:1 a4:1 g4:2
HOW I WONDER WHAT YOU ARE
f4:1 f4:1 e4:1 e4:1 d4:1 d4:1 c4:2
UP ABOVE THE WORLD SO HIGH
g4:1 g4:1 f4:1 f4:1 e4:1 e4:1 d4:2
LIKE A DIAMOND IN THE SKY
g4:1 g4:1 f4:1 f4:1 e4:1 e4:1 d4:2
TWINKLE TWINKLE LITTLE STAR
c4:1 c4:1 g4:1 g4:1 a4:1 a4:1 g4:2
HOW I WONDER WHAT YOU ARE
f4:1 f4:1 e4:1 e4:1 d4:1 d4:1 c4:2

Step 5: Play Music

Now, to play the song, you have to create a new melody. To do this, you have to switch from Blocks to JavaScript. So, click on the JavaScript tab to go to the JavaScript editor.

Below the last line of code, type let song = new music.Melody(twinkle). This makes a new ||music:Melody|| object which we’ll play the song from. So, add one more line of code at the end that says song.play().

forever(function () {
    light.showRing(
    `blue blue blue blue blue blue blue blue blue blue`
    )
    light.setBrightness(200)
})
let strip: light.NeoPixelStrip = null
let twinkle = ""
strip = light.createStrip(pins.A1, 30)
strip.setAll(0x007fff)
strip.setBrightness(200)
music.setVolume(155)
twinkle = "c4:1 c4:1 g4:1 g4:1 a4:1 a4:1 g4:2"
let song = new music.Melody(twinkle)
song.play()

Complete

You have now finished coding your musical cloud. Download all the code to your Adafruit Circuit Playground Express and start making your cloud sing!

NEXT: Start making!