Will O' The Wisps

Make a Jar of Ethereal Wisps Come to Life!

Approximate cost of materials: $35

Have you ever captured fireflies in a jar when you were a kid? Of course! Are they all dead now? Probably. I wanted to recreate this (minus the insect corpses) but make it more ethereal by calling them Wisps and giving it an old-timey product feeling. You know, those old "elixirs" that claimed to cure everything; like this one. This is a great first time project that combines Halloween + software + hardware!

The "wisps" in the jar animate using randomized colors, movement speeds, and fade speeds. They also come to life at random intervals as well to give it a realistic feeling! Be sure to read through the entire guide before starting. There are a lot more words than I expected to write but I wanted to make sure this project covers all the bases for beginners where possible. It's a lot easier than it seems!

Here are the skill and material requirements for this project:

Skills:

• Comfortable with soldering
• Pushing code to an Arduino (Easy to learn! Tutorial here)

Materials:

Crafting materials:

• Medium grit (~150) sandpaper (about 2-3 pads)
• Take-out restaurant chop sticks (or any semi-long stick)
• Mason jar with lid
• Scene-a-rama fake bushes and grass (Michael's has these)
• Crafting glue (paper craft glue was used in this case)
• Card stock paper (beige)
• Black-ink/laser printer
• (Optional) Glue dots (mini size). Not really needed but makes things easier and cleaner
• (Optional) Long twisty-tie (like those used to bundle USB cables together), about 6" long.
• (Optional) Silhouette Cameo cutting machine

Hardware materials:

• Arduino Gemma (sold HERE)
• Adafruit NeoPixel strip (1X 60 LED black strip, sold HERE)
• Wire (about 6" is a good minimum length; 26 AWG was used)
• Solder
• Soldering iron
• Wire cutters
• Lithium-polymer (LiPo) battery (sold HERE)
• LiPo charging circuit board (sold HERE)

Some notes about the hardware materials:

• Adafruit sells all of the hardware you would need for this project but you're free to source them elsewhere (I have no affiliation with Adafruit, I just like their products). The NeoPixel strip however is an Adafruit product so you'll have to purchase it from them anyway; they're sold in 30 and 60 pixel lengths but for this project we'll be using the 30 pixel strip.
• The wires are optional...sort of. The NeoPixel strips sometimes come with connecting wires already attached to both ends of the strip but only one of the two ends will be usable "out-of-the-box" since the data-in line is uni-directional, therefore requiring you to cut the strip in half and then solder new wires to the cut-end of the strip in order to connect them to your Gemma. If you use the other end (the one with wires already attached to the correct data-in connector) then no additional wires are needed from you; you can use the wires that are already attached. I listed "wires" in the materials list to make sure you're prepared in the case that you end up with a strip that has the wires connected to the "wrong end" (it's on the wrong end for factory testing). I don't believe Adafruit makes any guarantees as to which end of a strip you end up with since they are cut from a longer strip at the factory.
• The NeoPixel strip listed above is the 60-pixel variety. We're only going to use 15 of these pixels, leaving you with an additional 45. You can opt to get the 30-pixel version but this leaves you with a less dense strip and therefore your animations won't be as seamless due to the larger gap between the pixels. You can opt for the less dense strip at your wallet's discretion.
• The battery should be a lithium-polymer battery (3.7V) but the capacity is up to you. The one used in this example is the 1200 mAh capacity one that should last for MANY hours of use (and is probably overkill). You can opt for a 500 mAh capacity to save a few bucks which should last for several hours as well.
• The LiPo charging circuit board is required in order to charge the LiPo battery (via micro-USB). You won't include this component inside the jar at all, just buy it once and keep it around for future battery powered projects.
• The Gemma used is the updated version that connects to your computer via micro-USB.

Let's begin!

Download all of the files and source code you need for this project HERE

Step 1: Prepare the mason jar

We don't want to show the electronics inside the jar if possible so we will diffuse it using the sandpaper. Take the sandpaper and sand the inside of the jar. Unless you have freakishly small hands, use the take-out chop sticks to push the sand paper to the lower areas of the jar. Do this back and forth until the jar is sufficiently diffused; this took me about 3 pads and half an hour of work. If your mason jar has raised lettering on the exterior wall, use sandpaper and apply a light sanding on top of the letters to aid in glue adhesion later.

I don't have any photos here because I didn't get the idea to post up instructions until much later :)

Step 2: Prepare the NeoPixels

The NeoPixels come in a silicone wrapped 1 meter long strip. The strip should contain 60 LED "pixels" (assuming you purchased the 60-pixel version), so from any end, count 15 pixels and use your wire cutters to cut down the middle of the three copper contacts between pixel 15 and 16. Since the strip is thin and flexible it should be effortless to cut through the silicone sleeve and PCB. Be careful not to flex the strip too much as it is not designed for constant movement.

Look at the NeoPixel strip and you will see an arrow along the "D.IN" line. That is the direction that the data signal travels down. Follow the arrow BACKWARDS until you hit the end of the strip. That's the end you want to solder wires to, or, if the wires are already attached from the factory then leave them there.

If the wires already exist from the factory: use the wire cutters to cut off the JST connector (but leave as much wire as you can). Use the wire stripper to expose some of the wire for each strand. You may see that you have two black ground wires, that is normal. We will solder these together later.

If the wires don't exist on the end you're using: cut off the silicone end piece (but don't cut off the strip) to expose the copper pads. Cut three pieces of your spare wire about 2-3" inches each. Use the wire stripper to expose the ends and solder them to the strip. The pads are very close to each other so take care not to bridge them together. You may have noticed that the other end of the NeoPixel strip with the factory wires has two black ground wires despite the fact that you're soldering just three wires instead. That's totally normal as the other ground wire is for an external power source that you won't be using.

Step 3: Solder the wires to the Gemma

You'll be soldering the wires to the Gemma now. Having a third hand comes in handy here. Take each wire strand and separate them into three separate groups. Position the NeoPixel strip such that the pixels are facing DOWNWARDS when the Gemma is face-up towards you (the on/off switch is facing you). This will minimize the amount of twisting needed later when we bend the strip back.

The ground wire(s) go into one group together. Solder the ground wires to the GND pad of the Gemma. If you have only one ground wire, just run the exposed bit through the pad's hole and bend it over the pad for an easy time. If you have two ground wires, you can either twist them together into one super wire, or solder them to either side of the GND pad on the Gemma (see photo).

Solder the white data wire into D1 pad (labled as "1~"). Optionally, you can INSTEAD, extend the data wire and solder it to D0 (labled as "0~"). If you do this, you'll have to modify the code (just a one line change); this has the benefit of not activating the red on-board LED on the Gemma which can be visible during operation without covering it up. That's up to you though.

Solder the red power wire to the Vout pad on the Gemma. Two notes about this:

1. On some Gemma boards you might see this pad labled as "Vin". Not sure why, but it's really a Vout pad.
2. Be careful NOT to solder it to the "+3.3v" pad instead. That pad cannot provide enough power to the strip and will not work as expected or at all.

Here's how it should look like:

Another note (per Adafruit), don't rely on the wire colors to determine what they are. Always check which pad they're connected to on the NeoPixel strip.

Step 4: Load the code on to the Gemma

Follow the instructions on the Adafruit learning page about how to load code on to the Gemma (it's different than other Arduino boards). You'll need to have the code (provided above right before Step 1) loaded into the Arduino IDE and your Gemma plugged in via micro-USB cable. Before anything else, you'll need to add the following libraries to your Arduino IDE:

• Adafruit_NeoPixel (instructions here)
• elapsedMillis (instructions here)

See the Arduino library installation page for instructions on how to download these libraries from within the IDE easily. The provided source code does not include these libraries as they need to be installed outside of the code project.

Open the "Gemma_Wisps_Tiny.ino" file from the Arduino IDE to get started.

Click the "Verify" button to ensure everything builds correctly. If there are issues during compiling it's likely that you may not have one or more of the required libraries above. Be sure you've configured the IDE to use the "Arduino Gemma" board and "Arduino Gemma" programmer options before you click the "Verify" button. When finished you should see that about 97% of the Gemma program storage space will be consumed by the program. If you don't see something near that number, you may have the wrong board selected in the IDE.

When you're ready to program the microcontroller follow these steps:

1. Set the Gemma's onboard switch to OFF
2. Plug in the micro-USB cable to your computer and to the Gemma
3. Set the Gemma's switch to ON
4. During the first few seconds, you'll see the onboard red LED glow, this is the bootloader phase when you can load your code on to the board. In the IDE, click the "Upload" button and begin. More often than not, the IDE will fail to upload code the Gemma, my guess is there's some odd bootloader timing going on. If that happens, just press the reset button and try again; I find that I have the most success by uploading the code as soon as the LED starts glowing red.

When the program has loaded, you should see the NeoPixel strip come to life and begin animating and glowing randomly. These are the wisps in action! If you do not see any activity, most likely you've soldered the data wire to the wrong end of the strip. If the arrows on the strip are pointing AT your wire, you've got it backwards. Use your soldering iron and a solder vacuum to desolder the wires on the strip and resolder them to the other end.

At this point, turn the Gemma back to the OFF switch and unplug the USB cable.

Step 5: Print and cut the harness and labels

So this part has some flexibility to it because I used a Silhouette CAMEO to cut out the support harness and label but you can do the cutting manually. I've provided both the STUDIO3 file as well as a PDF that you can print and cut manually.

Both files include two components: the outline of the mounting harness X2 which you should cut out both of them on to card stock paper, and the label graphic that you will affix to the jar. The two harness pieces should be glued together for added stability. It's up to you though, if you really want to use one or two pieces. When assembled, the hardness should look like a one-armed alien baby:

Fold the "arms" as shown in the photo above. I had accidentally made the "neck" piece a little longer than actually needed so I ended up folding it at the half-way point as well. You're more than free to correct it yourself before printing/cutting.

Note that there are two holes on one of the sides of the harness. These are for routing a support wire through later.

Step 6: Assemble harness and Gemma

If you'd like, use the Glue Dots and stick about 5 or 6 dots on the underside of the Gemma. If you only have regular crafts glue, it should work (just make sure it's not conductive) if you apply it to the underside of the Gemma and then stick it onto the mounting harness. Then, position the Gemma to the center of the solid side of the harness towards the center. The wires should be protruding on the side between the "neck" and the "single leg". Give it a little bit of pressure to maximize the surface area for the glue to adhere to.

Bend the other side over like a hamburger and fold the arms over to the other side like above. Use the crafting glue to adhere the arms to the outer face and wait for the glue to dry completely.

Next we're going to route and position the NeoPixel strip. Use the twisty-tie wire and route part of it through the two holes to give the wire some stability. Use the rest of the wire to position the pixel strip as you'd like. I went with a spiral pattern but you're free to use whatever you want.

Be careful not to flex the wire too often and too extremely during this process. The copper contacts could potentially over-flex and snap if you're too aggressive with them. When you're satisfied with the strip position, use glue dots to stick the mounting harness to the jar lid as centered as you can get it. I was pretty liberal with the glue dots here, probably using about 10 dots.

Step 7: Make some fake moss

Use the fake scenery pieces and grab a little bit from both and use  your fingers to tear them up into smaller bits. Mix them up in a bowl to make sure they're well distributed.

In the mason jar, use your crafting glue and add some glue to the bottom and sides of the jar (like they do when they make those fancy caramel machiatos!). This will hold the moss relatively in place and give it some nice adherence to the sides of the jar. Pour the fake moss in, cover the top and shake it all about for a bit until the glue is well covered with the moss.

When your label is printed and cut out, use the crafts glue to adhere it to the side of the mason jar as straight as you'd like it to be. In this case, I mixed in some glue dots as well since they'll hold the label better while waiting for the liquid glue to dry.

When everything is dried up, you're ready to attach the battery. Plug the LiPo battery using the JST connector side of the Gemma. Position the battery into the center, basically to keep it from being pressed up against the glass where it would be visible. You don't want the battery to cover up any of the LEDs on the strip. If you're using a spiral pattern, place the battery in the center and hang it off of the twisty-tie.

Step 8: Final assembly

When you're ready to go, slip your finger into the harness and move the switch to the ON position. Carefully place the strip into the jar. If you're using a spiral pattern, I've found that putting the strip in and twisting the entire lid helps maintain the spiral pattern and makes it easier to insert into the jar.

Close up the cap (if you have a two piece cap) and you're done!

I hope you all enjoyed this project as much as I did making it!
Other information:

• The software provided is distributed under the MIT License

• I wrote the original version of the software to run under larger memory constraints (such as with the Arduino Uno R3) and came to a grave realization that the Gemma had nowhere close to the amount of memory and RAM as the Uno. As a result, you'll see some areas in the code that look like it would support more than the 15 LEDs and more than 1 wisp. You'd be right in guessing that I had to make a lot of sacrifices in the code to get it to fit onto the Gemma board.

• If you'd like to modify the code to support more than 15 LEDs and 1 wisp, take a look at Defs.h to see which constants you need to change to support this. You will need a controller with more memory however!