Light Up the Darkness - Halloween Costume

I've been waiting for a Halloween party since last year's got cancelled due to Covid. I wanted to make a detachable costume that can be added to any dress and includes a whole lot of LEDs and a color sensor that determines the colors of those LEDs. I found an incredible library called FastLED that creates some nice gradient effects on the colors.

I already have experience with the Adafruit Color Sensor from a project I did 6 years ago ('Dancing Star') so the time and effort mainly went into figuring out the gradient effects, the assembly and all of the sewing!

1. Black Dress somewhat see through
2. Petticoat to put all the LEDs on
3. Black Sash Belt to put the color sensor on
4. Snaps - this is how the belt and the petticoat are connected to the dress
5. Magnetic Buttons to connect the petticoat to the dress from the inside
6. Metal Snap Buttons to connect the belt to the dress
7. Conductive Thread to sew it all together. The needles in this kit are not the greatest but the thread is great
8. Connector Cables for the battery
9. Adafruit GEMMA M0 - Miniature wearable electronic platform
10. USB cable - USB A to Micro-B for uploading code on to the micro controller. You don't need a 3 foot long one, this is just something I got for a different project
11. 9 x Adafruit NeoPixel LED Dots Strand - 20 LEDs at 2" Pitch 180 LEDs all together
12. Flora Color Sensor with White Illumination LED
13. Lithium Ion Polymer Battery - I started with 3.7v 1200mAh but needed to go up to 3.7v 5000mAh to support the 9 stands. If you're using less/more, check out the calculations in the 'Additional Resources' below. The 5000mAh one I got from Amazon had the black and red wires switched so you need to switch them back.
14. Connector Cables for the battery switch
15. USB LiIon/LiPoly charger - v1.2 to charge the battery
16. USB cable - A/MiniB for connecting the battery charger
17. Alligator Clips for testing

In order to set up my wiring and initial code I used an Adafruit NeoPixel Ring I had lying around. You could easily use one of the LED strips, I just had limited space on my desk.

The Adafruit NeoPixel LED Dots Strands come with black plastic connectors. You can take the end connector, clip it off of the last strand and use it to connect the first strand to the microcontroller (Gemma in this case). This gives a good explanation on how to do this properly. Although I think they meant male connector and not female.

You'll also have 2 additional wires coming out of the (I think) female connectors, you can clip them, they won't be needed.

WIRING (start with alligator clips, sewing will come later):

From the NeoPixels to the Gemma:

Using the pins on the right side of the Gemma, you connect:

• Top strand to GND
• Middle strand to D1
• Red (bottom) strand to the Vout

From the Gemma to the Color Sensor:

  Using mostly the pins on the left side of the Gemma, you connect:

• SCL (A1/D2) to SCL
• SDA (A2/D0) to SDA
• 3Vo to 3V
• GND (on the right side) to GND

So you've got 2 connections to GND on the Gemma - one from the LED strand(s) and one from the color sensor

And of course you add the battery and the usb connector for uploading the code.

Download the Arduino IDE and the required libraries:

1. FastLED
2. Color Sensor TCS34725

You can pretty much use the attached code as is.

Calling out below a few rows you may consider changing:

1. I used 9 strands of 20 LEDs, total of 180 LEDs. If you use a different amount, change the number in this line of code:

#define NUM_LEDS  180   // Change this to reflect the number of LEDs you have

2. While working on the project the lights might be too bright, If so reduce the number in this line of code. 255 is the max for brightness:

#define BRIGHTNESS  255      // Set Brightness here 255

3. In the setup, the following code makes one of the LEDs blink 3 times to let you know that the color sensor is ready to read a color value. I picked to light up LED #17 since in the way I set up the LEDs that was close to the microcontroller and a bit to the side. Also you can change the color of the blinking light. In my code it goes from Black to White making it blink White.

for (int i=0; i<3; i++){ //this sequence flashes a pixel three times none/white as a countdown to the color reading.
    leds[16] = CRGB::Black; 
    FastLED.show(); 
    delay(1000);
    leds[16] = CRGB::White; 
    FastLED.show(); 
    delay(500);
  }

4. Although I have an MSc in Computer Science I still couldn't follow all of the mathematical computations in the colorwaves() function. What I did find is that if I changed this row the pattern looked more dynamic. If you have any insight on the math, please comment!

 uint8_t msmultiplier = beat8(147); //beatsin88(147, 23, 60);

The rest of the code is pretty much a combination of FastLED sample code and Color Sensor code.

I set it up so that on restart the color sensor reads the color and the skirt fills up with a transition gradient of that color until the next reset. Similar to the Adafruit Chameleon Scarf project. You can also set it up so that it fires off the color sensor every x seconds and changes the lights according to the color it picks up. This can be achieved by moving the code starting from:

tcs.begin(); 

from the setup() function to the loop() function and do some modifications. 

To upload code you need to quickly double press the reset button on the Gemma. You know its uploading if the green and red lights on the Gemma are on.

The images show the testing - one with a red object in front of the color sensor and one with a blue object.

Ok, so here's where I need to invest some thought process. The petticoat with the microcontroller, battery and all of the LEDs sits underneath the dress and can't be accessed without pulling up the dress or putting the microcontroller at the bottom making it hard to reach. I didn't want to add XBees or any other type of wireless/remote control hardware. I also didn't want any visible wiring going all over the place. Lastly, I wanted the color sensor to be in a central part of the costume.

The solution - snaps! Or to be precise conductive snaps.

The idea was to snap the petticoat to the dress, then snap on another element on top of the dress (the belt) to hold the color sensor and then run conductive thread from one set of snaps to the other. This will also enable connecting the belt and the petticoat to another dress/skirt.

And wait, I also added on on/off reset snap on the dress that runs all the way down to the battery.

PLANNING

1. Decide on the placement of the microcontroller. That will determine the battery, the snaps that hook up to the dress and the starting point of the LEDs. I suggest on the waist line to be as close as possible to where the belt will be on the dress. Also a bit to the left side at the hip made sense to me.
2. Decide on the pattern of the LED strands. They can spiral around the petticoat, swirl around semi randomly, zig zag up and down, whatever. I suggest connecting them with a whole bunch of safety pins first before sewing them in place. I went with a spiral around and around the petticoat. Also my dress was shorter than the petticoat so I made sure to finish up all the LEDs before they crossed over the edge of the dress.
3. Decide on the placement of the snaps. For the petticoat to dress snaps I used the larger magnetic buttons. You can go with either 4 snaps for just the color sensor or 6 snaps for both the color sensor and the on/off switch. You need to space them to make sure you can create separate connections that don't cross each other. And plan the order right so that you have direct lines to the place where the belt will be connected

SEWING

Test all of the time! There's nothing more annoying that having a project not work and try to trace all of the connections to see where there might be a problem. Test every connection several times. I can't stress this enough!

Fun fact: Alligator clip magnate to the magnetic buttons so they easily connect for testing.

1. Sew in the microcontroller with some regular black thread to keep it in place.
2. Then start with the LEDs strand's connector. Using conductive thread connect the GND, D1 and Vout on the right to the wiring the connects to the strands.
3. Next sew the snaps to the GND on the right and the SCL (A1/D2) ,SDA (A2/D0) and 3Vo on the left. Use both the front side and inner side of the petticoat to avoid crossing circuits. You can later sew ribbon on top of each connections to further ensure they won't touch each other and also to avoid irritating the skin on the inner side. I sewed in kind of a back and forth pattern to double up on the connection. There are different techniques for sewing with conductive thread. You can read more about that here.
4. Sew up the LED strands. I sewed around every 5 LEDs either the LED itself or the wiring. Try to follow the natural curves of the petticoat so that the LEDs with flow nicely under the dress. What's nice about the Adafruit LEDs strands is that they barely weight anything and don't burden the petticoat.
5. Now for the battery, I wanted control over resetting the color so I wanted a switch closer to the belt on the outside of the dress. I cut the red wire to the battery and split it between 2 snaps. When the switch is "on" it essentially connects these 2 snaps and closes the circuit.
6. Lastly I added a battery pocket that is held secure with a non conductive snap to keep it from moving around. There's a nice rubber band trick to keep the wires from detaching from the battery. Its in nearly all of the Adafruit tutorials, for example here. Make sure you choose the right battery size before sewing the pocket!

PLANNING

1. Decide on the placement of the belt relative to the dress and where you'll position the belt snaps. I'm using the smaller snaps for the belt. Lastly, trace the lines between the belt connections and the petticoat connections to ensure separation of the lines.
2. Remove some of the jewels on the belt to make room for the color sensor. I'm really happy with how this turned out. It looks as if its always been like that.

SEWING

Keep testing all of the time!

1. Sew in the color sensor with some regular black thread to keep it in place. Sew conductive thread from the 4 pins on the color sensor to the placement of the belt snaps. The belt is pretty narrow so make sure to space out correctly. I found that a banana shape for the snaps worked best for me.
2. I took a scrap piece of black satin and sewed in on both sides of the belt sash to both cover the stiches and keep them from touching each other.
3. Instead of just tying the belt on, I created a bow at the back at the right length that could snap together. And I also added a few non-conductive snaps around the dress to keep the belt in place.

PLANNING

1. If you have been planning when sewing the petticoat and the belt, this should be straight forward. For the 4 color sensor connections, you need to align the positioning of the petticoat snaps to their position on the inside of the dress, create direct lines from them to the back side of the belt connections and verify the lines don't intersect.
2. Also plan where on the dress you want to put the on/off switch and plan for that connection to the remaining 2 magnetic snaps.

SEWING

Keep testing all of the time!

1. Because I was going to use ribbon to cover up the thread lines I didn't sew from one snap to other I just left the thread flat with some extra room for flexibility. So for each connection, I started with the petticoat matching snap, sewed that on with conductive thread (remembering to try it on and see its placed in the right place to snap on to the associated petticoat snap), laid enough thread on the dress and sewed the other side of that connection to the back side of the belt snap.
2. I then added ribbon that I sewed to conceal the connection and keep them separated.
3. On/Off switch - the way I constructed this was using another pair of conductive snaps and a decorative button which I placed in a relatively convenient place on the dress. Because of the lace on the dress the snap keeps getting under the lace so I'm considering adding conductive velcro to the snaps.

As a last step I went over all of the connections and secured them a bit more and most important remember to charge the battery before the party night.

I used this costume as an excuse to get/make a lot of new cool things:

1. I bought some beads and a pendant at Joann and used this clasp to put together a neckless.
2. Got some cool eco friendly gloves. Truth is they're a bit pricy and the zipping up is tricky but they're awesome cool.
3. I wanted some color to put next to the color sensor so these bracelets - Matte Black Agate and Lava Rock fit the look perfectly.
4. I've been looking for a good black winter coat for a while now, found this that was great. Don't be fooled by the model's pictures on the website. This is a really nice coat.

Ahhhh, I had so much fun making this and it came out super cool for wearing to go out to a costume party.

Putting it all together

It take a good few minutes to put this on.

Start with putting on the dress, then turn on the microcontroller, hook up the petticoat and then the belt, then connect the on switch on the dress.

Additional Resources

1. Color Sensors - more info on Adafruit color sensors
2. Color Waves With Palettes - excellent code that goes through predefined color pallets. Can be used instead of using a color sensor
3. Powering Neo Pixels - depending on how many stands you hook up, you may need a different battery.
4. FastLED - API documentation