Feature

Wearable LED T-Shirt

Pete Januarius

Issue 65, December 2022

This article includes additional downloadable resources.
Please log in to access.

Log in

With an Arduino LilyPad, RGB LED Strips and some electronics, Pete made this fun t-shirt with a programmable 4-grid LED display for a 90s party.

Back in Issue 49, we caught up with Pete from Nexgen Codecamp about their affordable robots to teach kids about robotics and coding. Recently, Pete sent us details about his wearable t-shirt for a 90’s party. We just love it when electronics meets art, so we found out all about it.

Great to hear from you again, Pete. How's business since we last spoke?

We spoke a while ago now - probably before COVID. To be honest, business has been very tough. During COVID, we had to pull out of schools as up until that time the only offering we had was a face to face club. It was really a case of pivot or close our doors. Fortunately, a couple of schools who have been amazing clients since we started working with them asked for an online substitute offering. We managed to convert our existing Canvas LMS courses into an online version so that we now had both offerings and so were able to run a Zoom session every week for a couple of terms until we were able to get back into schools.

We also received some help from the Department of Education who sponsored us to run 10 incursions at 10 Sydney high schools, plus we were given 10 free Laptops from Dell Technologies who also saw what we were doing and wanted to help us grow our vision.

Since that time we have been working with about 10 schools (Independent, Catholic & Government) and growing our content base. Canvas LMS is an amazing platform to host our courses and with its open source version, we were able to set up our own Canvas server which we look after and administrate ourselves. We have developed over 2 years worth of content in this time, meaning that we could run a variety of STEM courses every term for 2 years at any single school. We continue to develop new and interesting content at a pace. Sources like DIYODE, Maker Pro and Hackster are invaluable for helping us with potential ideas. The key for us though is creating courses that are suitable for high school students from year 7-11. That always provides a challenge as the basic skills that underly our projects are generally not taught until students get to around year 9/10. We, therefore have to come up with interesting, fun and innovative ways of teaching these skills and weaving them through the termly projects.

Our plans for next year are to double in size and be working with 20+ schools. We believe we are well set to do this as we have been working with some high profile Sydney schools for the last 2 years and will be continuing with them all of next year. This is great news compared to where we were when COVID hit and we are very grateful to all the help we have received. I am also grateful for my growing team of instructors who have been excellent and continue to deliver great results.

Great to hear that your business has made it out to the other side of the lockdowns. Also great to hear that you are getting plenty of support. Now, tell us all about your curious-looking t-shirt project.

The t-shirt was nothing to do with the business - at first anyway. My wife and I were invited to a 90s birthday party (it's what happens when you get to our age). We were thinking of what costume to wear and she came up with the idea of Windows 3.0 that came out in the early 1990s - in particular the logo. I thought it was a great idea and ended up pinching it, however, I decided that it would be good if it were on a t-shirt in the form of LED lights that were programmable - perhaps with a mobile app! Retrospectively I decided that it could possibly be a wearable course for Nexgen that the students would enjoy and this is still on the cards.

With cosplay becoming popular, we’re sure a course with wearable electronics would be well received. What parts does your t-shirt use?

I have had a go at wearables in the past and the one thing that I didn't want to do was any sewing. Not because I have any objection to sewing but because it is so hard, prone to error and difficult to fix issues. We have tried wearable projects in the past that included a fair amount of sewing. They didn't work too well. We need to iron out the issues before we tackle this again. Anyone who posts a wearables project and claims it is easy isn't telling the truth!

Anyway back to the parts! The best solution appeared to be a 5V addressable LED strip - a WS2812B with 60 LEDs per metre.

I wanted to make 4 grids which meant I would have to chop up the strip and solder it back together in the form of a grid. This was pretty quick and easy to do as these strips are built for such 're-configuration'.

The heart of the project was an Arduino LilyPad. I wanted a small Arduino and this was perfect.

I then needed a Bluetooth card, so I used something like an HM-10 - again super easy to configure and use.

The last thing was perhaps the most perplexing, though it shouldn't have been really - what battery do I use? I wanted a switchable battery and figured that a 3.7V LiPo boosted to 5V might be the best option as I might need to recharge it. I had two problems therefore: battery voltage protection (discharge to safe levels before shut-off) and boosting a 3.7V battery to 5V.

I ended up making my own battery using the following components, including a 3.7V 1100mAh LiPo, TP4056 battery charging board, DC-DC Automatic Step Up-down Power Module (3~15V to 5V 600mA) and JST RCY connector.

The power module was able to supply 600 milliamps. I was hoping that this would be able to power my 100 LEDs. I didn't really do the math to work it out. I figured the LEDs only needed to be at half brightness. Lots of previous tests convinced me (in my mind) that this was likely to work so I just went ahead with it. Worst case was that I would have to get a better power supply. Fortunately, it didn't come to that. The battery ended up working but I noticed that during the evening it was getting warm so periodically I turned it off. In retrospect, I was probably way under in terms of current needed to supply the strip at full brightness. It probably needed around 5A for 100 LEDs. Even though it worked, it isn't a great idea to use an underpowered power supply for your project. It is no wonder I needed to keep turning it off during the evening. They reckon each LED draws 50mA when set to full brightness. So I should probably have been powering mine at about one tenth the brightness!

What made you choose to use the Arduino microcontroller?

One of the things that I love about the Arduino is that most simple projects work exactly the same: take some input from somewhere, manipulate that input value with your code and use that to produce some output somewhere. That might sound a bit vague but that pretty much what microcontrollers do right? In some ways, it doesn't get any harder - which is good news for all budding makers everywhere! The difference becomes your creativity!

Agreed. We’re spoilt with Arduino board choices these days. Can you go into detail about the App?

The t-shirt would not have been very useful without an app. I guess most wearables don't have an associated mobile app, however, most such products probably have very static behaviour. I wanted something that would be infinitely flexible and totally programmable. For me, it wouldn't really be worth producing anything else. I knew that if I did this, I would possibly be able to turn it into a course for the company if it turned out all right.

With a mobile app, you have many options. You could build a Swift app for iPhone and a separate Kotlin app for Android. I could have done this but it would have been an insane idea as the time it would take would far outweigh the benefit. I only had 1 week to plan, design, build and test the t-shirt and I had never done anything like this before (from an aesthetic point of view anyway). So that idea was out. I could have built a React Native or Google Flutter app - again too much time and effort.

That left Thunkable and a host of similar platforms. As I have used Thunkable successfully before for some of our courses, I decided to use it again. The app really only took me a couple of hours to build. Once you have built a Bluetooth app - they are all pretty much the same. Testing the app on my phone was simple once I had the mobile app version of Thunkable installed. I'm proud to say it worked the first time which was great as I was running out of time - I started building it on the day I needed the whole thing to work - party day!

The interface to the app was simple. I decided to have one 'Connect' button and a whole bunch of other coloured buttons that would each map to a function in the Arduino code.

So, in a 'nutshell', we start with the app which I made using Thunkable. It is such a quick and easy platform to knock up a simple application that you can immediately test. Fortunately, I have an Android phone, as when you add Bluetooth, iPhones become a real pain to test as you effectively have to have the iPhone Developer testing framework setup which is possible but painful if you haven't done it before. With Android, it literally takes 2 seconds to test a Bluetooth app on Thunkable. You install the Thunkable app on your phone, log in and you can run all your projects as if they were mobile apps - which indeed they are!

Once connected to the Bluetooth card, you just send commands which are assigned to various buttons on the app. The Arduino program then receives the data over Bluetooth and calls a function depending on what it receives. For example, one of the buttons on the app was assigned to displaying the Windows 3.0 logo. I had a corresponding function in the Arduino app called windowsThree() which changes each 'grid' of LEDs to the appropriate colour. That's pretty much it. If you haven't played with LED strips before, you might not know that to turn the LEDs off, you just set the colour to black. You also should know that there is a very powerful and handy library that you can use called FastLED (https://github.com/FastLED/FastLED). This takes a lot of the pain out of creating the code and if you are new to it all, will teach you some stuff about colour palettes, arrays and a bit of C++. For experienced users it should be easy.

So to summarise: User starts the app and connects to Bluetooth card.

User presses a button, causing a message to be sent to the Arduino program installed on the Lilypad.

void loop() {
 recvOneChar();
 processCommand();
 delay(50);
}

The Arduino loop() function receives the message and sends it to a processCommand() function.

void processCommand() {
  if(receivedChar == 'A') {
    Serial.println("blink...");
    blink();
    isOff = false;
  }
  else if(receivedChar == 'B' || receivedChar == 'b') {
    red();
    isOff = false;
  }
  else if(receivedChar == 'C' || receivedChar == 'c') {
    green();
    isOff = false;
  }
...

The processCommand() function forwards the message to the appropriate function.

 void windowsThree(int numLEDsInRow) {
  for(int i=0; i<25; i++) {
     leds[i] = CRGB::Red;
  }
  for(int i=25; i<50; i++) {
     leds[i] = CRGB::Blue;
  }
  for(int i=50; i<75; i++) {
     leds[i] = CRGB::Green;
  }
  for(int i=75; i<100; i++) {
     leds[i] = CRGB::Yellow;
  }
  FastLED.show();
 }

That manipulates the LED strip with some FastLED code.

You make the app and coding sound straightforward. How did you go about attaching the electronics to the t-shirt?

Yes - this bit was actually pretty successful - surprisingly so, as I am not confident with making any sort of wearable item. It isn't really my thing. So, I thought long and hard about how I should do this.

In the end, I decided to build the whole thing onto a square piece of a white t-shirt and then stick that piece onto the actual black t-shirt I was going to wear.

That would mean I could test the whole thing and then just stick one piece of material to another and I should have a working t-shirt. I only had to do a bit of sewing.

I was concerned that the two wires I was using to connect to the battery would come loose or be pulled out so I sewed them to the t-shirt material to secure them.

For the LED strips and the components that I stuck to the t-shirt material, I used duct tape as it is the sort of stuff that works on anything. I left a border around the material because I wanted to make the installation of the whole thing onto the main t-shirt as easy as possible.

To attach it, I turned the black t-shirt inside out and placed the material onto the t-shirt like a sandwich so the LEDs and components were in between the t-shirt and the material backing. I ironed this on with some iron-on interfacing strip - a kind of webbed strip that I bought from Spotlight. I left 2 jumper cables protruding from inside so they could be hooked up to the battery. I sewed them on for a bit more stability.

All I had to do now was hope it worked because if it didn't I was stuffed!

How long does it run on a full charge?

This was my only concern. I already described how I created the battery which was an 1100mAh battery. I didn't do any of the math but was hoping that it would last the night. Turns out that it did last a few hours, although, I did turn it off a few times during the party.

Working out how long it would keep the LED lit for now..... it is just an approximation as the different programs used different amounts of power. One of them was a kind of random starry effect where there would only be one LED on at any one time but it made it look like the t-shirt was twinkling. Another was a kind of snake pattern toggling from one end to the other.

These animations sound great. We’ll have to get a video of these in action and share with our readers. For our readers who want to build something similar, Do you have the code we can share with our readers?

Yep, the code is on GitHub at this location:

https://github.com/peetj/LED-TShirt

It contains instructions on the whereabouts of the Thunkable project as well.

We assume you just need the regular maker gear to put it all together?

Correct, you’ll need a breadboard, jumper wires, and alligator clips for prototyping. A soldering iron, heat gun, wire strippers/cutters, heatshrink, tape, and Blue Tac (always useful).

A programmer for the LilyPad is needed, and for the t-shirt, you’ll need fabric glue and iron-on interfacing fabric.

Great! Is there anything else important our readers should know about?

A project to me is like a bit of an adventure in which I learn a bunch of stuff and hopefully have fun in the process. This is also the philosophy of my company, Nexgen Codecamp - students should learn by taking a risk and having fun in the process. We have found this to be a successful formula more or less. With Co-curricular activities, students come voluntarily after school so the last thing they want is to have another 'lesson'. This makes things somewhat difficult as you want them to learn rather than just contribute more 'press-button' projects into the mix. Given the right mix of scaffolding and directed learning, plus a couple of friendly & knowledgeable instructors and you have the makings of a great club. We are hoping to grow the number of high school clubs next year in and around Sydney so if there are any schools out there keen on supporting their STEM strategy with an after school club, please get in touch at pete@nexgencodecamp.com.au.

Thank you for sharing your project with us, Pete. We wish you every success with your business.

Electronics RequiredJaycarAltronicsPakronics
1 x Arduino LilyPad or compatibleXC3920Z6349-
1 x Roll of WS2812B Strip LED with 60 LEDs per metreXC4390X3222AADA2959
1 x LilyPad programmer-Z6212ADA284
1 x HM-10 Bluetooth ModuleXC4382Z6365-
1 x 3.7V 1100mAh LiPo or similar-S4725PAKR-A0301
1 x TP4056 battery charging board or equivalentXC4502Z6388AADA259
1 x DC-DC Automatic Step Up Power Module (3~15V to 5V 600mA)-Z6337ADA2190
1 x JST RCY ConnectorPT4452P7830ASS321050009
1 x SPST SwitchSS0852S2010-

Electronics Required