You can code your Crickit and Circuit Playground Express using MakeCode! If you aren't already familiar with MakeCode, check out this guide to get started, then return here when you're ready.

Crickit Extension

Inside of MakeCode, we'll add the Crickit extension so that we can access these powerful additional blocks!

To enable Crickit functionality in MakeCode, click on the Advanced category, then click on Extensions.

Then, type 'crickit' in the text field and press enter. The Crickit package will appear. Click on it and it'll be added to MakeCode!

Now that the package has been added, you'll see a new block category appear named Crickit

Click on the Crickit category to see all of the things you'll be able to do.

Servo Zeroing

Click the CRICKIT category and then add the crickit set servo 1 angle to 90° block to your program.

Place this block into the Forever loop, and then right-click on it and create a duplicate. Change the duplicate to set servo 2 as shown.

Be sure you use the green Servo blocks under the CRICKIT group and NOT the red Servo blocks under the PINS block group!

Change the program's name from 'untitled' to 'Animatronic Eyeball' and then download it to your local hard drive. With the Circuit Playground Express (CPX) plugged in via USB, press the CPX's reset button once so the NeoPixels turn green. This places it into bootloader mode.

Drag the 'circuitplayground-Animatronic Eyeball.uf2' file you downloaded onto the CPLAYBOOT drive.

The CPX will reboot and the two servos will go to their center positions, since 90° is the halfway point of the servo's 0° to 180° range.

If the eye is no longer looking straight ahead, remove the servo horns and reposition them. They are now 'zeroed'!

Eyeball Range of Motion

Now, let's have the eyeball look around a little bit. First, we'll run through the range of motion of the left/right and up/down motions.

We can create this effect by adding a pause 100 ms block from the LOOPS category, and then duplicating the crickit set servo blocks as shown.

First, set the horizontal and vertical rotations to 90° so the eyeball looks forward. Then after a half second pause, look left ( on servo 1) pause a second, and look right (180°).

After another short pause, we'll center the eye horizontally (90° on servo 1) as we have it look down (0° on servo 2). Pause one second, then look up (180° on servo 2).

Pause again, and then repeat forever!

Here's a link to the shared project.

Eye Darts

Random eye darts a great way to add some realistic life to your animatronic eyeball!

For this, we'll create three variables to represent the two servo angles and a delay time. We can then randomize those values.

First, click on the VARIABLES category and then click on Make a Variable...

Then, type in the name eye_LR for the horizontal ('left/right') variable.

Do this two more times to create the eye_UD ('up/down') and eye_delay variables.

Now, create this simple set of blocks in the Forever loop and use the new variables in place of explicit values, as shown.

Currently, this won't do anything useful, because we haven't assigned values to any of the variables. Let's add some set _variable_ to _value_ blocks as shown, then we'll add some randomness.

From the MATH category, drag in a pick random block onto each of the variable value assignments.

Each time the program loops it will find a new random value from within the specified range. Fill in some appropriate values for the randomization range -- for the delay I've picked anywhere from half a second to three seconds. For the angles, I've tightened up the range a bit so it looks like the eye is watching things, not just rolling around in it's imaginary eye socket!

You can open the shared project from this link if you like.

Interactive Tilt Sensing

The previous mode is self-running, but what if you want to interactively puppeteer your animatronic eyeball? Here's a simple way to do it using just the accelerometer that's built onto the Circuit Playground Express!

You can see that when the board is face up, the eye will go to center position. Then, as you tilt in each direction, the servos will respond in kind!

You can click this link to check out the program.

Going Beyond

You're now all set up with your own animatronic eyeball. From here, you can decorate it, embed it inside of a mask, prop, sculpture, or who knows what?!

Try using other inputs for control such as capacitive touch sensing, the microphone, light sensor, buttons, and more!

This guide was first published on Jun 18, 2018. It was last updated on Jun 18, 2018.

This page (Code with MakeCode) was last updated on Nov 06, 2020.