Coding & Computers Pixel Art Finger Paint

Maker Class Lesson Seven: Pixel Art Finger Paint

45 min – 1 hour

Ages 8-13

What Will You Learn?

Combine conductive touch points on a coordinate plane and code pixel art finger paint in Scratch with Makey Makey!

Craft This: Coordinate Plane Touchpad for Pixel Art Finger Paint

Step 1

You need to cut a flat piece of cardboard into about a perfect square that is at least ten to twelve inches in length.

Step 2

Measure half the height and draw a horizontal line for the X- axis. Then measure half the width and draw a vertical line for the Y- axis.

Step 3

Measure 1/2″ or 1 centimeter increments along both the X and Y axis. Instead of labeling those increments from 1-20, label in increments of 20 to scale with the coordinates you will plot in Scratch in step three.

To make a simple triangle, plot these points on your physical coordinate plane:

(80,0)
(-80,0)
(0, 200)

Step 4

In the next step, you will mark more points and add conductive touch points with to each plot point with brass fasteners.

Plot These Points

Step 5

On your cardboard coordinate plane plot the points from this chart and place a brass fastener in each spot to turn this into a conductive touchpad. (We like to use a dull pencil to start the hole, and then press the brass fastener through.) These are your conductive touch points for your pixel art finger paint.

Step 6

Plug an alligator clip from each spot to the appropriate input on your Makey Makey.

Step 7

Check this chart for inputs and make sure to label all plot points and key inputs on your physical coordinate plane! This will help you in hooking up to Makey Makey, coding and troubleshooting!

Step 8

As you mark each spot, start noticing different shapes you can create. You might want to use a rubber band around your brass fasteners to help visualize different shapes.

Hook up Makey Makey

Step 9

Now that you’ve crafted your cardboard coordinate plane and added all your conductive touch points, it is time to hook up your invention to Makey Makey! Follow the chart (and your labels!) to hook up each conductive touch point to the appropriate Makey Makey inputs.

Tips

Refer to the chart often!

You are using the back of the board for this project! You should have small white jumper wires in your classic kit. If you have a STEM kit, you will have a ribbon cable where all the jumper wires are connected. Gently push each jumper wire into the header on the back of the board. You will see that the header on the left side is for the key presses W A S D F G. If you need a full guide just on using the back of your Makey Makey, check out this resource.

Since we used the colorful ribbon cables, we color coded our alligator clips from each jumper wire to the conductive touch point. This is helpful if you have wires come unplugged or short circuits, it will be easier to troubleshoot!

Since metal is what is conductive, the heads on these alligator clips are very close together and to keep them from touching, cover the conductive end with electrical tape (or you could use low adhesive masking tape to cover alligator clip heads.)

Step 10

Let’s do a little wire maintenance before you start coding! Binder clips make great switches, but you can also use them to tidy up your wires.

Code This: Pixel Art Finger Paint

Step 11

Create alongside us with this Scratch video tutorial for coding your own pixel art finger paint!

Note: You need to be signed in to Scratch see the “Remix” button.

Tip

The virtual Makey Makey is already coded for key press inputs and we’ve already added the pen and Makey Makey extension. You will just need to code the Scratch cat to move to the correct plot points for each key press. (Double check your chart or try each touch point as you code it!)

Tip

You can adjust pen settings, and you could even add more inputs to code a color palette or code a “clear all.” The choice is yours to make!

What's Next?

Now you are ready to plug and play and create pixel art finger paint!

What shapes can you create?
How many triangles can you make?
Can you make other shapes?
What plot points would you need to make an octagon?
Could you create a heart?

Share you creations with us on social or in our Makey Makey At Home Scratch Studio.

Makey Makey Classic Inventor's Kit

The original Makey Makey Classic – Named one of Consumer Reports’ “Best Tech Toys of 2014,” “Best of Toy Fair 2014” by Popular Science, and a finalist for Toy of the Year 2016.

Makes STEM Education fun! Start out easy with a banana piano. First setup takes seconds. Then make game controllers, musical instruments, and countless inventions. Advance to additional inputs and multi-key remapping up to 18 keys. Ages 8 to infinity.

Turn everyday objects like bananas into touchpads!
Connect the world around you to your computer! Setup takes just seconds.
Just plug, clip, and play! No programing knowledge needed. No software to install. Works with Mac and Windows.
1000s of possibilities! Draw your own game controller, sneak a cat selfie, and dance like never before.
Ages 8 to infinity.

Visit the Makey Makey website for tons of projects, educator resources, apps and more.