Maker.io main logo

Halloween Skeleton Transformation Illusion Prop

63

License: See Original Project Microcontrollers WS2812/SK6812 (NeoPixel) LED Strips Proximity Touch Arduino Adafruit Feather ESP32

Courtesy of Adafruit

Guide by Erin St Blaine

Overview

Get spooky with a magical Halloween coffin that holds a surprise inside. A 2-way mirror and an array of animated lights creates a face-blending illusion, melting your face into a creepy skeleton or other Halloween monster. You can also prop this up and blend two human faces together, creating a very creepy and surreal experience.

This project requires a little soldering and some software installation, but no coding. It uses an ESP32 Feather board to program and control lights over WiFi, so you can control and change the colors or animations with your smart phone or any web-enabled browser.

This illusion was inspired by TANZER's Infinity Boxes, and first created for Maker Faire 2024, where we built it inside a Love Tree. It turned out so good that we wanted to recreate it to scare the kids in our neighborhood on Halloween!

tree_1

Parts

Additional Materials

You'll also need a life-sized skeleton or Halloween monster for the transformation illusion.

illusion_2

How It Works

diagram_3

The viewer stands on one side of the illusion and the skeleton, or monster (or a second viewer) stands on the other side. There is a two-way mirror suspended in the enclosure, spaced evenly in the middle.

There are lights on both sides of the enclosure. When the lights are on the viewer's side, they see a reflection of their own face. When the lights are on the skeleton's side, the viewer can see through the mirror and catch a glimpse of the skeleton.

If the viewer aligns their eyes with the skeleton face, the motion of the lights will appear to blend the two faces together, transforming one into the other and back again. This is spooky with a skeleton transformation -- the flesh appears to melt away into bone and then back again. It's also very effective with a second human on the back side -- the faces melt into each other, creating a visage that's a blend of the two faces.

Wiring Diagram

wiring_4

Feather Setup

Power comes in through the screw terminal and passes through the on/off switch, then splits to go to the Feather (via the JST port) and also to the LEDs. This is a safer way to power a large number of lights, since it doesn't pull all the power the lights require through the delicate electronics in the Feather.

NeoPixel Setup

+5v goes to the red power wire and G goes to the black wire. The DI pin goes to pin 12, though you can use any GPIO pin here. Just be sure to select the correct pin number in WLED setup.

I've used four 1/2m strips of pixels, with a short "bend point" soldered between the first and last two, and an 8" strand of wire between the middle two. The first two will go on the front of the illusion and the last two will go on the back, so the wire in between should be enough to reach from one side of your enclosure to the other.

WLED Software

Board Choices

WLED runs on several different boards in Adafruit's collection. There are different benefits to each, but the installation process is largely the same. This page contains instructions for multiple boards -- be sure to use the pinouts and installation instructions for the one you're using,

Sparkle Motion

This is our flagship ESP32 board, designed with WLED and Xlights in mind. It has 4 outputs and is set up to drive either 5v, 12v or 24v pixels. It's a workhorse of a board and for larger projects it's the clear winner. It has an onboard microphone for instant sound-reactive support, and an IR sensor built in, to make it easy to control your project with an infrared remote. It also has a couple stemma ports so you can add your own sensors or peripherals.

Sparkle Motion Mini

The Sparkle Motion Mini is a smaller version of the Sparkle Motion board. It has two LED outputs, a microphone, and two stemma ports that make it easy to add an IR sensor or other peripherals. It's got an onboard NeoPixel and a small footprint, making it perfect for wearables or smaller projects. It will power a whole lot of pixels through the onboard USB port: it's safe to draw up to 4A through this port, giving you plenty of power for most wearable projects.

For Sparkle Motion Mini use at least the 0.15.1 release of WLED.

QT Py Pico ESP32

The QT Py Pico is small and affordable, so usually my go-to for smaller costumes or wearables. It also has a range of BFF add-on boards that add functionality. Here's a guide with more QT Py info. The QT Py will drive up to around 30 pixels through the onboard USB port, so if you have more LEDs than that you may want to consider the Sparkle Motion Mini instead, or you can power the board through the +5v pin.

Note: WLED works on the QT Py Pico but NOT on the S2 or S3 versions, at the time of writing.

Feather Huzzah ESP32

The Feather Huzzah ESP32 the top of the line. It's a great choice for projects where you want to add sensors, interaction, or drive a whole lot of LEDs. It's the most reliable as well -- I've run these for two months straight with no power cycling and they just keep on truckin. Adafruit has a very wide selection of Feather Wing boards that connect to the Feather microcontroller line. The sky is the limit with these boards.

It also comes in a version with a high-powered WiFi range extender! If you're trying to sync multiple instances across distance, check this one out. Feather Huzzah ESP32 V2 w.FL Antenna

Feather Huzzah ESP8266

The Feather Huzzah ESP8266 will run WLED as well, but won't drive as many pixels: the ESP32 limit on WLED is around 1000 pixels per input, but the ESP8266 tops out at around 500. It's about $5 cheaper though, so for smaller projects it's a great way to save a little money and still have access to all the FeatherWing options in the Adafruit store.

Driver Update

Some versions of our controllers have a new serial chip which needs a driver installed before we can install WLED. Head over to our How to Install Drivers for WCH USB to Serial Chips tutorial, and download and install the new driver.

If you have an older QT Py with CP2102 USB-to-Serial bridge, use SiLabs’ driver instead.

Install WLED

These next steps require a Web Serial-compatible browser. As of this writing, that means Google Chrome, Microsoft Edge or Opera, or Firefox “desktop” browsers. Other browsers (Safari, Explorer and anything mobile) won’t work.

Visit https://install.wled.me/

Plug your microcontroller into your computer with a known good USB cable. Click "Install" and select the port for your board.

Depending on the USB-to-serial bridge chip on the board, you might see one or two serial ports. On Mac, for instance, there might be both “/dev/cu.usbmodem[number]” and “/dev/cu.wchusbserial[number]”. Use the “wchusbserial” one.

wled_5

After successful installation, enter your WiFi network name and password when prompted. This must be a 2.4 GHz WiFi network; ESP32 does not support 5 GHz networks. If it can’t connect, then as a fallback WLED will create its own 2.4 GHz WiFi access point.

wled_6

Sometimes the "Connect to Wi-Fi" prompt doesn't show up. Don't panic, just see the step below on connecting your computer or mobile device to the WLED-AP access point created on the microcontroller itself!

If you don't see the "Connect to Wi-Fi" prompt, you'll need to set up your WiFi network using AP (access point) mode. Open up your WiFi settings and look for a WiFi network called WLED-AP. (Note, this access point can take up to 30 seconds to appear sometimes.) Connect to this network using the default password wled1234. The WLED interface will pop up in its own captive browser window.

From here, go into Config/Wifi Settings and enter your WiFi credentials for the access point you normally use near the top.

Give your project a name in the mDNS field a little further down the page. Now you can type in "projectname.local" (where "projectname" is your mDNS name) into any web browser on the same wifi network to access your microcontroller.

You can also scan the QR code below to open access point mode.

For more help and troubleshooting tips visit the Getting Started page on the WLED knowledge base.

prompt_7

prompt_8

prompt_9

qr_10

Setup & Preferences

WiFi Setup

Head to the WiFi Setup screen under Config and create a good URL so you can control your project from any web-enabled device. Call it something you'll remember, that's easy to type into any web browser on your WiFi network in order to connect to your project.

In Safari or Chrome on your phone or computer, type in this web address to access the WLED interface: http://projectname.local (where "projectname" is whatever you put into this field).

Check out the Additional Settings page for more info on accessing your project. WLED has an "access point mode" that doesn't require a WiFi network for when you're out on the go. It's also helpful to download one of the WLED apps to help manage and organize your projects.

setup_11

setup_12

LED Preferences

Next, head to the LED Preferences tab under the Config menu.

Scroll down to Hardware Setup. Put your total number of LEDs into the "Length" field, and change GPIO to the pin number associated with the pin you soldered to. Check the pinout diagram for the board you're using (it's the number in yellow).

prefer_13

Use It

use_14

Now you can use any computer or handheld device to control your LEDs.

Make sure your device is on the same WiFi network as your board. Navigate to your custom URL (projectname.local/ ) in a web browser. You'll see a color picker above a whole bunch of color palette choices.

Choose a color, choose an effect, and watch your lights animate and glow!

Save your favorite combinations as presets, create playlists, control the speed and intensity of the animations, and lots more. This web app is incredibly intuitive and easy to use.

Head over to the WLED wiki at https://kno.wled.ge/ to delve into all the particulars.

Electronics Assembly

Plug the male end of the power switch into your Feather's JST port.

Cut the female JST connector off the other side of the switch. Strip some shielding from the wires and screw them securely into your screw terminal, red to + and black to -.

Strip around 1/2" of the insulation off each wire and fold the bare wires over onto themselves before stuffing them into the screw holes, just to give the hardware a little more to grab.

assembly_15

Cut the wires going to the male JST connector (currently plugged into the Feather).

Solder the middle wire from the JST connector (green, in my case) into pin 12 on your Feather. This is the data wire.

Twist the wires you just cut back together, and splice them to your 3-pin JST connector's red and black wires. These will feed power to the Feather and to the lights.

cut_16

cut_17

Solder the red wires to the leftmost wire (red) and the black wires to the rightmost wire (white on this connector).

solder_18

A Word about Connectors

These little locking JST connectors are very handy and they're everywhere in DIY electronics projects. They come soldered to the ends of LED strips and many of us eventually end up with a drawer full of these, salvaged from various projects.

However, there seems to be no industry standard for color-coding. Sometimes you'll find a connector where the red wire is on the left, and sometimes it's on the right. This can be really problematic. When you're knee-deep in a project and trying to keep diagrams straight in your head, it's VERY easy to just roll with whatever color code schema is in front of you. But just because the wire is red on your connector does not mean it's going to neatly line up with the power wires in your project.

Do not use the wire colors to determine what wires to connect to each other. There isn't a standard for the color of wires on NeoPixel and JST connectors. Please follow the wiring guide on what wires to connect.

Note how this connector I'm using has the red wire on the left, and the connector that comes with this LED strip has the red wire on the right. Hooking this up will cause a short circuit, because power and ground will be reversed. This is a great way to damage the electronics, so always double check your wiring and don't depend on color coding!

hooking_19

NeoPixel Setup

Solder the female end of the 3-pin JST connector to the IN end of the NeoPixel strip. Look for arrows on the strip and make sure they're pointing AWAY from the end you're soldering to. These strips are directional and soldering the data wire to the opposite end will not work.

neopixel_20

For surrounding a coffin-shaped opening I want at least one "corner" bend for my lights. These lights are bendy up and down but not left to right. To make a flexible corner, cut the lights in the center of the copper pads and solder a little piece of silicone stranded ribbon cable (or any 3 short, flexible wires) to each side. Make sure to match up the wires so the pads are reconnected in the same order as before they were cut.

Cover the connections with your clear heat shrink and fill them up with hot glue before shrinking, to outdoor-proof, and robustify your strips.

cover_21

I used 30 lights, then made a "corner" and added another 30 lights. This uses up 1m perfectly and will line 3 sides of the hole in the coffin.

I then added an 8" piece of ribbon wire to the end of the second section of lights. This will allow the strip to pass around the edge of the mirror so to continue the lights on the back side of the illusion.

I added another 30 lights, a corner, and 30 more lights for the back side of the mirror, using 120 lights (2 m) total.

lights_22

If you've already installed the software, it's time for testing. Plug your lights in using your 5v power supply and click the switch, if needed.

The lights should come on in solid yellow. Hooray!

lights_23

Troubleshooting

If your lights didn't come on, here are a few things to try:

  1. Flip your on/off switch. Was it just turned off?

  2. Head back to WLED and check your pinout configuration under LED Preferences. Be sure your data wire is connected to pin 12 and that you've told WLED it's on 12.

  3. Check your wiring! Be sure you soldered to the IN end of the LED strip. If the arrows on the strip are pointing toward your solder joints, you've got the wrong end -- they should be pointing away.

  4. Try re-uploading the WLED software.

  5. Make sure you're on the correct WiFi network - if you're on a different network you won't see the WLED connection.

WLED Additional Settings

Brightness Limiter

Find this on the LED Settings screen.

WLED automatically limits the brightness of your project so your power supply doesn't get over-taxed. The default amperage is 850mA, which is a little low for most power supplies.

For some projects, especially battery-powered projects, having the limiter turned on is a good idea. But if you're not getting the brightness you expect, try adjusting this number to match the amperage of your power supply or battery pack.

amp_24

Access Point (AP) Mode

While you're home, it's easy to control your project over your local WiFi network. But when you're out at a festival you probably don't have WiFi access. It's still possible to connect to your project and control it using WLED's Access Point Mode.

Turn your project on and give it a minute or two to start broadcasting. Look in your WiFi networks and find WLED-AP - this is a mini WiFi network being broadcast by the microcontroller. Connect to it - the default password is "wled123". An instance of WLED will automatically pop up and you can control your project from anywhere.

If you're putting your lights up in public, it's a good idea to change the AP Mode default password so strangers can't log in and control your lights. This could be a security risk.

AP Mode only broadcasts for a few minutes after you boot up the board so if you don't see the WLED-AP network try rebooting.

mode_25

WLED App

There are a couple different apps available to manage your WLED projects. Name and organize your projects, and find them quickly without having to type in a URL. Check the Apple or Android store for downloads.

My favorite is "WLED Native". It allows you to organize multiple instances and easily switch between devices without having to remember any URLs.

app_26

Backup Config & Presets

Under Config / Security & Updates you will find a place to back up your data. It's a good idea to back up your config file as soon as you're happy with the settings. Save it as a .json file on your computer. Now you can prototype and experiment to your heart's content, and if everything breaks, just re-upload this file. Or, if you're doing another build you can use this feature to copy all your settings from one board to another.

backup_27

Build the Illusion

I used this pop-up fabric coffin from the Spirit Halloween Store. It doesn't have a lot of stability and probably wouldn't support the weight of the mirror without collapsing. So the first step was to reinforce the coffin to make it sturdier.

I cut several long pieces of cardboard to the depth of the coffin (about 8"). I spray painted the cardboard black, and used gaffer's tape to tape the corners together. For the small bend in the sides, I scored the cardboard lightly and that gave me enough play to push it into the corners.

build_28

build_29

I fit the cardboard support frame into the coffin and it added a lot of stability. It also gave me a good surface for attaching the mirror.

mirror_30

The two-way mirror is the central piece of this illusion. You can buy two-way mirror online, but it's fairly expensive, especially for a really large piece. Another option is to buy two-way mirror film and an acrylic sheet and make your own. The mirror isn't quite as perfect or clear, but you get a lot more bang for your buck this way.

I got a large piece of acrylic that's 24"x36" so it will fill my coffin edge-to-edge, and I can make a rather large viewing hole.

Follow the directions that come with the mirror film. For mine, here were the steps I followed:

  1. Clean the plexiglass thoroughly. Any specs of dust or dirt will DEFINITELY show.

  2. Cut the film to size, leaving a little extra along the edges.

  3. Peel the clear backing off the mirror film.

  4. Mist the plexiglass with water from a spray bottle.

  5. Place the mirror film adhesive-side down onto the wet plexiglass. Use a wallpaper scraper or other straight-edged tool to smooth out all the bubbles by pushing them from the center out to the edges. Take your time with this -- any bumps or dust motes or bubbles will mess up your illusion.

film_31

film_32

Once the adhesive has dried, you'll find yourself with a fairly decent 2-way mirror.

I placed my coffin on top of the mirror and traced around it with a sharpie to get the shape of the coffin. Then I cut the mirror to size with a band saw. It fit on the first try!

cut_33

Run gaffer's tape along one side of the mirror, hanging the tape over so half of it is on the mirror and half is free.

Place the mirror inside your coffin halfway between the front and the back. I propped mine up on small paint can to hold it at the right level. Stick the tape securely to the inside of the coffin. You'll want to tape both sides. I found it easiest to place the tape side down with the coffin open and reach underneath to get the tape stuck on to the back side. Then I went over the front side with more tape in the same fashion.

place_34

place_35

Once the mirror is secure and not going anywhere, tape the lid of the coffin closed with more gaffer's tape.

Mark and cut a hole in the front fabric of the coffin using a utility knife. This is your viewing window so make it fairly big, but not so big that it shows the edges of the mirror.

mark_36

mark_37

Flip the cut-out piece upside down and put it on the back of your coffin, lined up with the front hole. Trace around it to get the same shape hole on the coffin back.

Add a border of gaffer's tape around the edges of the hole to define it and keep it from raveling.

flip_38

Now it's time to install the lights. Reach inside the coffin and peel back a little bit of the tape holding the mirror up on one side. Thread the last two strands of LEDs through the hole so you have two strips on each side of the mirror.

Use gaffer's tape to securely tape the LED strips to the inside of the coffin around the opening. The light should be facing outwards, so they shine on the viewer (or the skeleton) standing outside the coffin.

Use enough tape that the light doesn't bleed through the back of the strips. Any stray light that escapes will get picked up by the mirror and wreck the illusion. The idea here is to isolate the light strip on the front from the one on the back, so you have only one side lit at a time.

install_39

Use more tape to secure the microcontroller somewhere out-of-sight, and run the power wire through the hole in the back or through the bottom of the coffin where it can be plugged in easily.

This coffin won't stand up on its own, but it works perfectly tucked into a corner. I got a small kid-sized chair for my skeleton so he sits at kid-face height, more or less, and then leaned the coffin up in front of him in a dark corner.

This illusion works best at night or in a dark room. A lot of ambient light on either side will wreck the illusion. Play around with locations until you find what works.

Program the Lights

program_40

Open your browser window and navigate to the WLED interface for your project. This will be the name you set during software setup -- I called mine coffin.local so that's what I type into my browser to connect.

Be sure your device is on the same WiFi network you set up on your microcontroller.

Now it's time to play around and create animations that create the effect you want. I had the most success using a chase animation, slowed down considerably (use the slider at the bottom of the Effects tab to control the speed). The bottom slider will allow you to control the width of the bands.

What we want here is for the first half of the strip to light up and then go dark, while the second half of the strip turns on. The animation speed and type can really make or break this illusion.

Watch some videos of the illusion "The Infinity Boxes" by TANZER to get some inspiration. Different light settings make this project feel vastly different. WLED gives you the tools to allow your own artistry to come through.

Once you're happy with your animation you can save it as a Preset, and if you tick the box labeled "Apply at Boot" then your animation will start up automatically. when you turn the project on.

Mfr Part # 3405
HUZZAH32 ESP32 FEATHER LOOSE HDR
Adafruit Industries LLC
Mfr Part # 1138
ADDRESS LED STRIP SERIAL RGB 4M
Adafruit Industries LLC
Mfr Part # 3064
JST-PH2 EXT CBL 2PIN SWITCH 20"
Adafruit Industries LLC
Mfr Part # 368
ADAPT TERM BL 2POS TO 2.1MM JCK
Adafruit Industries LLC
Mfr Part # 3892
CBL RIBN 4COND FLAT BLACK 3.28'
Adafruit Industries LLC
Mfr Part # 1020
HEATSHRINK 3/8" X 1' CLEAR
Adafruit Industries LLC
Mfr Part # 5395
ADAFRUIT QT PY ESP32 PICO - WIFI
Adafruit Industries LLC
Mfr Part # 5438
ESP32 FEATHER V2 STEMMA QT
Adafruit Industries LLC
Mfr Part # 2821
ESP8266 FEATHER HUZZAH LOOSE HDR
Adafruit Industries LLC
Add all DigiKey Parts to Cart
Have questions or comments? Continue the conversation on TechForum, DigiKey's online community and technical resource.