Code with MakeCode

MakeCode is an easy way to get up and running with the Circuit Playground Express. No prior coding knowledge is needed, and it's an easy way to experiment and learn to think like a coder.

To get started, go to makecode.adafruit.com and then choose New Project. You'll find yourself in the MakeCode Editor. From here, you can click on any of the colored tabs and drag blocks of code onto your workspace, then preview it using the Circuit Playground Express pictured on the left.  

Once your code is written, plug your Circuit Playground Express into your computer via its USB port and click the "reset" button. All the lights will turn green and your Circuit Playground will appear as a drive on your computer called CPLAYBOOT.  Simply drag your downloaded code onto this drive to program the Circuit Playground Express. Easy!

Note: If you see a drive called CIRCUITYPY then press the reset button again (or twice in a row) to get to CPLAYBOOT.

Head over to this Intro to MakeCode guide for more info on getting started with MakeCode.

If you want to skip right to the end and work backwards, here's the completed MakeCode project.

Set Up the Lights

First, let's tell the Circuit Playground that we have a strand of lights wired up to pin A1, and how many pixels we're using. We'll also set the brightness of our lights. This needs to be done in the on start loop, so if you don't already see that in your workspace, click the LOOPS tab and grab an instance of it.

Click the LIGHT tab to make the NEOPIXEL tab appear beneath it. Anything in the NEOPIXEL tab will refer to the strip of lights you attached, and anything in the LIGHT tab refers to the lights on the face of the Circuit Playground Express. 

Drag an instance of create strip on A1 with 30 pixels into your on start loop. We're using A1 and we've got 30 pixels, so we don't need to change anything here.

Also drag an instance of strip set brightness into your on start loop.  Set your brightness to whatever you'd like. I set mine all the way up to 255 for maximum brightness.

That's it for setup. Now let's make the LEDs do something. From the NEOPIXEL tab, drag an instance of strip show animation for 500 ms into your forever loop. Anything in this loop will run over and over, forever, while the Circuit Playground is switched on.

Change 500 ms to 100 ms. We want to add some different animations that happen when the umbrella spins. If this is set to 500 ms, then the Circuit Playground will only "listen" for the spin every 500 ms (half a second). Changing it to 100ms means the spin trigger will be much more responsive.

Now let's add an input, telling the Circuit Playground to play a different animation when the umbrella is spinning. Drag an instance of INPUT > on shake into your workspace and change the dropdown to read 3g. Now, when the board spins around and accelerates, it will trigger whatever we put into this block. 

Choose an animation from the NEOPIXEL tab. I like the comet animation, since it really looks great with the spiral shape of the lights inside the umbrella. I want it to play for 5 seconds, so I changed 500ms to 5000ms. Play with the different animations and see what you like best.

Save your work, and click the Download button in the lower left corner. Plug in your Circuit Playground Express and press the reset button. The onboard NeoPixels should all turn green, and you'll see a new drive appear on your computer called CPLAYBOOT.  Drag the file you downloaded onto this drive. You're done!

If you're having trouble or don't see the CPLAYBOOT drive, head over to the Circuit Playground Express guide for some troubleshooting tips.

This guide was first published on Apr 24, 2019. It was last updated on Apr 24, 2019. This page (Code with MakeCode) was last updated on Sep 15, 2019.