block by eesur 93ee8dddc4c38f584833a695c78152a8

d3 | UI for MakeyMakey and lego characters

Full Screen

Built to use within a girls codeClub event for illustrating the computer as an output by triggering events with lego characters via Makey Makey

The idea is to place a LEGO character on each author block/card, to get a quote outputted by it’s respective author (based off this one I did years ago using processing.js )

To start: Click the screen, to ensure it’s active. Place the character to make a connection and trigger the event.

animated

Note: The LEGO characters have copper tape on them (one piece, starting under feet and running up the back) that makes the connection when you are holding and placing on the block/card connected to the crocodile clip.

There are four data files, each containing quotes that will be randomly picked when the relative figure is placed to connect to the respective arrow keys via the Makey Makey:

The SPACE key includes all the quotes in data/space.json and also those in the other data files (they are concatenated together)

These files can be changed to any quotes or author

script.js

index.html

data_down_arrow.json

data_left_arrow.json

data_right_arrow.json

data_space.json

data_up_arrow.json