To follow along and learn how I did it, point your browser at maker.makecode.com and select "New Project".
Select the Gemma M0 board, since that's the one we're working with today. While you're here, take a second to notice all the other development boards MakeCode will work with. So many possibilities!
You'll find yourself in the MakeCode editor window. From here, you can drag and drop snippets of code from the different blocks listed in the middle, into the workspace on the right. Then, the Gemma emulator will simulate what your code is doing on the left.
We'll start with the on_start loop, which will run some code when the Gemma first boots up. For now, drag the forever loop down out of the way.
Choose the PIXEL tab. Anything in this tab will deal with Gemma's onboard NeoPixel, the one on the front face. For this project, I want to turn this pixel off entirely so it doesn't compete with the jewel. Drag an instance of set pixel to red into the on start loop and change the color to black.
Next we'll tell Gemma about our jewel. Any lights we solder to the Gemma will be controlled by code snippets in the LIGHT tab or the LIGHT > MORE tab.
From the MORE tab drag an instance of set strip to create WS2812 strip on LED with 30 pixels. We soldered onto D1, so change the first dropdown to D1. Since we have 7 lights in our jewel, change the number in the set strip snippet to 7. Drag an instance of strip set brightness into your on start loop as well. Then choose your brightness. For this project I like around 150 -- bright enough to see but not so bright you'll blind people.
The very easiest way to get your lights going is with one of the pre-made animations that come with MakeCode. Back in the MORE tab, drag out an instance of strip show frame of animationonto your workspace, and put it in the forever loop. You'll notice that your Gemma emulator now has a strip of LEDs that are playing a rainbow animation.
You may notice that there are two different code blocks dealing with showing animations: one called show animation for 500 ms and one called show frame of animation.
The first one will run the selected animation for the specified amount of time, then move on to do something else. If you want a few seconds of rainbow, then a few seconds of twinkle, etc, you can make a "playlist" of animations inside your forever loop to accomplish this. You won't have any control over the animations except to tell them how long to run.
The second one will show just one frame of the animation and then look for more instructions. This will give you a bit more control - you can change the speed or the brightness between each frame, slowing it down or making it appear to pulse or flicker. I want a slower rainbow, so I've chosen this version for this project.
Go into the LOOPS tab and drag an instance of pause 100 ms into your forever loop beneath the animation block. Watch the emulator on the right as you try different values in this block. When you have a speed you like, move on to the next step.
Give the file a name and save it to MakeCode. I called mine "Fascinator - Rainbow". Then click the Download button, and plug your Gemma into your computer via the USB port.
Click the Reset button on the face of the Gemma and a drive will appear on your computer called GEMMABOOT. This means it's in bootloader mode and you can program it. Drag the file you just downloaded onto that drive.
It may ask you if you want to pair the Gemma to your computer. If you want to do this, follow the onscreen instructions. You may need to update your bootloader before proceeding. Pairing will make code testing a bit easier - you'll no longer need to drag the file to the GEMMABOOT drive each time you want to test it. But it's not necessary - you can cancel out of the pairing process and simply drag the file onto your Gemma.
Another way to tell if Gemma is in bootloader mode is that you'll see a red and green light on the Gemma's face. Once you've downloaded the code to Gemma, the light will be magenta and the code will be running. To get back into bootloader mode for another download, just click the reset button again.
Troubleshooting
If the GEMMABOOT drive is not appearing, first check to be sure that the on/off switch on the face of the Gemma is switched on. It's easy to miss!
Next, try using a different USB cable. Some cables are "charge-only" and won't pass data. Also try using a different USB port on your computer (mine is sometimes twitchy).
If it's still not working, head over to the Gemma M0 intro guide for more suggestions.
If you can drag the code onto GEMMABOOT but your jewel isn't lighting up, check to be sure that your code reflects the pin you soldered to (did you remember to change to D1?). Also be sure you've soldered your connector to the IN pin on the back of the jewel -- it won't work if you soldered to the OUT pin.
Text editor powered by tinymce.
