Skip to main content

Create a Tile


To gain an insight into the how the technology behind the tiles work, please read the section on Hardware and Software and then how to use the ScratchX extension to control the tile. Its really useful to have an example tile to play with, so before starting a large project, first build a tile to have an understanding of the possibilities and first hand experience of what is involved.

Note:- the wiring on tiles to the microcontroller can be done in a variety of different ways. Our examples below use pre-wired LEDs with resistors already included, and terminal connector blocks.

Tile Base

Find a suitable box to act as the base of a tile. My examples use folding cardboard mailing boxes, suitable for a book. They are cheap to purchase and have sufficient depth to store the electronics, alternatives would be cardboard shoeboxes, or other box containers. Think about what is best for the application you are creating.

Design Tile

moonDesign a simple scene, and then plan how to illustrate it with coloured LEDs. Keep it simple, don’t use too many LEDs; less than 6 to begin with. Every LED introduces 2 wires that need to be connected, and the wiring can quickly get complicated. Think about how to group LEDs together. All LEDs connected to the same pin will have the same behaviour. LEDs that operate together (connected to a single pin) should all be wired in parallel. This means they will all be equally bright when switched on.

Decorate Tile

Decorate the tile lid based on your earlier design. Felt works well, as does coloured paper and pens to create the design. If you use any wet materials, its essential that you allow sufficient time for them to completely dry, also avoid using conductive materials like tin foil. Should any bare wires accidentally touch there is the possibility of creating short circuits and creating a fire hazard.

Build and test LED circuit

LED Wiring HarnessDraw a diagram of the wiring in your circuits. The LEDs in my examples are already pre-wired with a resistor to protect the LED, and with a red (positive) and black (ground) connecting wires. A cheaper alternative would be to purchase LEDs and resistors - but the resulting circuit needs to be suitably insulated to avoid short circuits and being a fire hazard.

For short workshops we create a simple pre-wired harness, with 2 LEDs connected and pins ready to connect to the NodeMCU. The photograph shows 2 LEDs, each with its own circuit, connected using Terminal Connector Blocks. The red wire from each LED will be connected to a pin on the NodeMCU, the black (ground) wires can all be connected together to provide a single connection to ground on the NodeMCU.

Wiring up the NodeMCU

NodeMCU pinsConnect LEDs to any of the digital pins on the NodeMCU (shown in red) and connect the ground wires to one of the ground pins on the board. In Scratch you can control the digital pins highlighted in this diagram, setting the LED light On, Off or to a percentage of the brightness in between On and Off. Controlling the brighness is referred to as Pulse Width Modulation (PWM).

You are now ready to download the webserver software onto the NodeMCU, see the section Hardware & Software about how to do this. Once software is on the NodeMCU, you are then ready to use the ScratchX extension to control the tile.