Light-up raincoat no-code no-solder - nLiten, Bekonix

People who have seen my projects before know that my tech-fashion brand, Art by Physicist, was created with a philanthropic purpose. I frequently collaborate with organizations aligned with STEAM education, sustainability and environmental protection. Recently, I got to learn about Half Smile 半个微笑, a philanthropic clothing brand dedicated to helping kids with autism. Their products feature the children's drawings on the clothing. Every item sold includes a loyalty fee that is paid back to the children. We decided to collaborate on this design to promote awareness of this effort.

Half Smile showed me a collection of drawings from their children artists. They are all very beautiful. In fact, the subjects the kids chose to paint are all landscapes and animals - very similar to myself - I have always been inspired by nature and the beautiful creatures it creates. I could use any of them to make clothing. Eventually I picked one that is a painting of a blue bird. It is cute and shows the texture of the painter's brushstrokes.

As a tech-fashion designer, of course, I'll also feature some really cool tech that aligns with the theme. nLiten wearable components were made by Fuss33 Makerspace and Make Fashion team. Yes, we've seen lots of LEDs elsewhere before. But these ones do not require any soldering or coding, specifically made this way to help designers (who don't have a tech background) get hands-on with embedding wearable tech in their creations.

All components are connected with plug-and-play cables (there are stretchable options too!). The programming is done through the tiny Bluetooth controller with Bekonix's drag-and-drop software interface. All the components come with sticky tapes that are easily attachable to the object you wish to embed the components into. Once the components are connected, simply plug in a 5V USB power source, like a phone charger, and the entire sequence of LEDs will reflect the colors and patterns you design on Bekonix. See a short intro in my unboxing video.

In this project, I'll show you my creative process for the raincoat so you can create your own projects. Don't forget to submit it to the Tech Fashion Design Challenge Hackster contest to win a chance to make your idea into actual products and go to market!

Oh, did I mention why I made a raincoat? One of the most frequently asked questions I get as a tech-fashion designer of wearable tech products is how to wash them or if they could be worn in the rain. I understand people are curious but they forget to ask why people would want to wear non-waterproof clothing in the rain in the first place. Adding technology does not add complexity to clothing care. If the clothing is waterproof, yeah, you can wear it in the rain, and you don't need to wash it ;)

Besides, don't you get mesmerized by the colorful jelly fish moving about in the ocean, clean water, the bird, nature, our blue and green planet...

Inspiration

We now have generative AI tools. Regardless of how designers are divided between traditional pro-human originality and AI-assisted creativity, I was curious to see what a tool like Dall-E could come up with. I already knew I wanted a bubble raincoat that is semi-transparent (so I could light it up) but I didn't have any visuals. Since sketching has never been part of my process anyway, I might as well let the AI generate something. Let's see what it came up with!

Even with the same prompt, the results are quite different. It never gives you exactly what you want. But here are the top few among the 40 variations it came up with. I asked people on social media which ones are their favorite. #1 and #4 were picked the most. I do like the see through effect of an inner coat while the entire arms are wrapped inside the outer layer.

Pattern design

As shown in my other projects, I've been using a fully digital workflow for fabric and pattern designs. Again, here's a screenshot of my pattern pieces drawn and stitched in BrowZwear VStitcher. The painting of the bird is digital, which lets me directly drag into the artwork. I started with an coat template and modified it into a two-layer raincoat. The two layers are needed because 1. the LEDs should be put on the inner layer so they are hidden inside; 2. I wanted to create a puffy bubble look; 3. the gap between the two layers enable diffusion effect for the LED to spread out.

I wanted to use another painting from the kids, which you can see on the pocket and the back, but decided to remove it from the physical design due to fabric supplier printing limitations.

I printed the patterns of the inner layer onto A4 papers and cut the fabrics accordingly.

The pattern for the outer layer is very big, which is not very practical to be printed by my home printer. So I just draw it on the fabric freehand.

Fabric treatment

To find a waterproof material, I looked up SwatchOn. It's got a lot of options with sustainability criteria. The problem is that they are not local and needed to ship the fabric overseas. As a test run, I went ahead with the translucent white TPU.

TPU can be heat bonded. So I actually didn't need to use a sewing machine to construct the raincoat for the most part. I didn't have a proper tool for heat bonding, only a home iron. The edges were not perfect but it did the job. One has to be careful to make sure that the smooth side of the TPU is the bonding side.

Another limitation is fabric painting. They only do that for bulk orders so I couldn't get all these birds onto the 5 yard sample I was purchasing. I needed to find another way to put the bird on the raincoat. Thankfully heat bonding is again the solution. I printed the bird on paper and sandwiched it in between two TPU layers.

Add the LEDs

nLiten is just fantastic. I remember in the early days when LED stripes were note designed for wearable purposes, we had to find all kinds of ways to connect them to each other and onto the fabrics. You can see my painstaking methods in my past projects. But now with nLiten, just plug them in and stick the stripes onto the fabrics.

Program the LEDs

Here's a fast-forward process of programming the LEDs with Bekonix. As you can see, the interface is interactive and visual. One can find the components and lists of effects directly from existing libraries. You can also build your own libraries. nLiten has provided this tutorial to learn how to program the LEDs with Bekonix step by step.

I uploaded a visual and then just placed the components into the position arrangement like exactly where they are physically. (The visual is just a guide since in real life, the LEDs in the middle are on the back of the raincoat, rather than in front.)

The LEDs can then be configured by dragging library effects into the timeline. One can see the effects right away since the nLiten board is connected to Bekonix via Bluetooth. Once you are happy with the sequence of effects, it can be uploaded to the nLiten board. Here we go! The LEDs will light up exactly as planned every time you power them on.

Final touch

My favorite part of the project perhaps is the final step of adding the zipper. Who would have thought that using a serger to sew the zipper and TPU together is so satisfying!

Now create your own with the no-solder no-code nLiten LEDs and submit your work to the Hackster contest. Together we can make sustainable STEAM tech-fashion for everyone!