Hi, this is Steven from Core Electronics. I'm here to talk to you today about MakeCode for the Adafruit Circuit Playground Express. MakeCode is a great coding option for educators and beginners in code, because it doesn't take any actual typing all you need to do is drag and drop blocks of code, that snap into each other and you can get started coding right away with little or no programming knowledge at all and it's still quite a versatile program, with a lot of different options for coding within.

It if we look at the interface we see that MakeCode browser-based, so you don't need to have any software on your computer or to run it you just must have any web browser, it'll run on the tablet and it'll even run on a smartphone if you want. MakeCode is made by Microsoft and has a few different supported boards but we'll go to the Circuit Playground Express on makecode.adafruit.com. MakeCode is great as well because there's on the website they have quite a few tutorials that walk you through step by step which block to grab and where to drag it to make a quite a few fun little projects that only take the Circuit Playground Express board itself and little or no extras.

Today we'll go into a new project we'll make the code that I showed in our overview tutorial video of the Circuit Playground Express. Just to explain what we have on the screen here, is we have the workspace on the right, we have a column in the middle with our various code blocks that we can add to the program and we have our virtual interface on the left. The virtual interface is great because it allows you to test your code as soon as you've made it in the program and see the results on screen without having to transfer your code to your board every single time to see if it worked.

So just to get started we have a forever loop that starts on the screen and everything that we want the program to run will need to be within a loop if it's not within a loop then the program would just run it once and then stop so whatever is in the forever loop runs continuously while the board is powered. So, what we want to make, is we want to utilize the buttons on board, so we'll make the left-hand lights light up when we hit the A button, who will make the right-hand lights light up when we hit the B button. So, a great way to do that is a while loop so we'll go into loops and drag that inside our forever loop see how it snaps into place. So right now we have a forever a while and the logic is true but we want it to be while the button is pressed, so we'll go into our inputs and we have an option here for button A is pressed and notice how it's a diamond-shaped much like the true so it fits in that spot so well button is pressed, we'll grab the show ring command so while button is pressed it will show this ring. Currently it's all red but you can click on the colour wheel to change the colour of the lights that it lights up, I've just be selected the right hand to be not coloured, to be off and then the left hands red.

So, if we go over to our virtual board we can click on the button and see that it lights up red. The only problem now is that we have a show the red lights, but it has no command and turns off, so it just continuously shows. So, we'll go into our light menu options again, scroll all the way down to the bottom there's a clear and we'll drag that out and put it the ring so now when we do quick momentary presses of the button, it'll show the red lights and then turn them off afterwards.

If you've got a nice block of code that you want to essentially copy one of the nice features within make code is the duplicate, so you can right-click on it and duplicate it and it will give you an exact copy. We can drag that beneath this while loop, change our options from button A to button B and make the lights the colour we'd like for button B and now once the virtual board refreshes we have red on button A click and blue on a button B click.

So just out a little bit more interactivity to our board, let's make the lights all light up in a rainbow animation when the board is shaken. So, the as far as shaking goes, there's we could go into inputs and there are some loops within the input columns, so these are a little bit different than the loops but they're functionally the same and that whatever is in this bracket will run continuously waiting for a command or waiting for the shake to be detected and while the boards power. So we'll put this on shake and the light animation we want will be a rainbow so there's a show animation option here, it puzzles in place and we'll select the rainbow animation from the possible animations and set the time to two seconds and again just so it turns off after two seconds we'll scroll down and grab clear and put it beneath it. So, this is a fun little addition to our program.

So, once you add an element of the program that includes the accelerometers, the virtual board now tips and leans because it is capable of detecting being tipped in any direction and you can have your code react to that and then the shake button appears, so that's what we want. So, if we hit the shake button, we see we've got a rainbow animation now.

So, now just to add another element to our shake animation is a little bit of sound. So, the Circuit Playground has an on speaker, so if we go into the music we can select play sound and we'll put that within our on loop on the shake. So, on the shake we could do a magic wand sound effect to go with our rainbow, so we'll say play sound we'll select magic wand. Now when we go back to shake on the board we'll have a magic wand sound to go with our animation. So if we click JavaScript, we can see the actual code of what we've created with the blocks which is a good learning tool and if you were going to teach JavaScript as a programming language, it could be quite useful to be able to switch back and forth between the two and you could just type all your code straight in JavaScript if you want and not use the blocks at all.

So, the last thing we want to do is get our newly created program on to our Circuit Playground Express. So, to do that we go to download, in the bottom left corner of the screen and save our UF2 file. So, you have two files just the format that the MakeCode uses and that's the program that you will put on the Circuit Playground Express. So, if we go to our downloads folder now we see our Circuit Playground, my files, Untitled.Uf2 and the next step is to connect the Circuit Playground with a micro USB to the computer.

When you plug it in initially it may enter bootloader mode automatically, but if it doesn't the reset buttons right in the middle and by pressing the reset button, you may need to double press it. It will show a red ring of lights, which means that it's going into bootloader mode and green when it's ready and if we look at our computer devices and drivers now we see CPLAYBOOT drive has appeared, that is our Circuit Playground Express and all we need to do is drag our I've just downloaded .Uf2 file, so our program into the play blue boot drive and now we're ready to go.

So if we look at the board we have the left button press, for the A button press for red lights, we have a B button press for blue lights and if we shake it we have our tone and the rainbow animation and now if you want you can power this off of a small battery pack so it's mobile for a project or you could power off of a lithium battery as well. So now we have again off a battery pack the red lights, on the A press the blue lights on the B press and an animation and a sound on a shake.

So that's all we have today, for the MakeCode with the Adafruit Circuit Playground Express. Stay tuned for more tutorials about the Circuit Playground Express, MakeCode and other ways that you can program this Circuit Playground Express, such as Circuit Python and Arduino.

Thanks.