Pcomp (Big Board – Image to Neopixel)

As Danny assured me in his office hours, serial communication really does open the doors wide open. My PComp midterm is about opening the doors for my ongoing art project, the Bushwick Lightbox. 


From January-February 2017, I constructed a larger light board than the one I had been experimenting with last fall. This new light board was 32 x 70 = 2250 RGB LEDs.

One of the first thing I wanted to experiment with on this board was taking the light painting concept to the next level. I wanted to do a renaissance painting on it. I took one of the greatest painters of light of all time, Rembrant. I wanted to translate his Philosopher in Meditation into a new medium.

However, it was too much trouble to program each line manually. Below is an earlier iteration of this attempt. While it proved that the image had depth (and proved that it was possible to do figurative with light painting), it was a far cry from its highest potential.

Learning how to control the LED with the webcam during the Serial lab showed me the way forward on this particular piece. Controlling on LED is one thing, but controlling 2250 LEDs using a 2D matrix array would be a different matter. I have seen LED TVs before so obviously I know its possible — but I don’t know how to do this. This is a great opportunity to up my lightboard game w/ serial.

OBJECTIVE: to put up an image of Rembrant’s philosopher on the lightboard.


Session #1: Time is 6:57pm Saturday night Oct 21. Progress made in trying to make an array of the pixel values in P5 of the imported Rembrant image. But I’m encountering problems in printing them on console. It’s printing out a RGBA values, but it’s nothing but black, which is wrong. I’m close… but alas, I have social obligations to attend to.

Session #2: Resumed work on Sunday evening at 9pm. Encountering difficulties around the J5 pixels and displaying them. Get() doesn’t seem to be working consistently, even if I preload() the image. Shiftman’s video on Pixel arrays is helpful in this regard.

10:24pm – figured out why I was getting random readings on get(): the background was being painted every time! no wonder I was getting black. Now I am getting a beautiful console full of array RGBA values 🙂 However it runs from top left to right… my big board is programmed bottom-right to left. I’ll have to reconcile the two. Stopped working around midnight after my Arduino Due power light stopped working without a reason why.

Session #3: Monday morning 1030am. Figured out that I needed to plug the power supply to the entire board in order to keep the Due ON light from fading and assuring the computer could read the arduino on the serial port. Not sure why, since I was only powering one LED. Maybe it’s because there were so many LEDs the data wasn’t getting through to it.

12:30pm – having problems reading P5 serial data. I’m using serial.write on P5 and Serial.read() on the arduino. Not sure what’s up….

1:15pm – isolated the problem to the P5 wonky output I’m seeing through the console. For some reason, me mapping the pixel data to an array is stopping the console in its tracks. When I comment out the whole array part, the console operates normally. (Taking a break to see an acquitaince’s LED installation now).

3:00pm – figured out the error is this: “Exiting potential infinite loop at line 29. To disable loop protection: add “// noprotect” to your code“. I ignored it before since it didn’t seem to freeze the entire program, but somehow everything grinds to a halt when it shows up.

LINE 29 seems to be the culprit. But 29 is a fixed loop! how can it be infinite???

5:34: The P5 editor gave different results between myself and Dano (who I emailed for help on sorting out the above problem), so I have concluded that part of the problem may be the P5 alpha editor. Therefore, I had to sort out another way to get a P5 sketch running on my screen without the P5 editor… which was itself a journey. Now I’m up and running w/ Sublime text, a directory, for which this video was a great help. (Youtube has everything!) I am now watching a Shiftmann video on running a local server since the image wouldn’t load.

6:09pm: I am realizing this is really getting me to intimately involved with the Chrome console, which I have always wondered about.

6:31pm: really going down a rabbit hole here. Now I’m getting “from origin ‘null’ has been blocked by CORS policy” error on the chrome JS console. Seriously how do I change text colour in this wordpress editor? Very not useful, guys.

6:40pm: got it working! boom! it was just a simple matter of having the serialport.js in the libraries folder and making sure the scripting in the html file reflected that. Mental notes: CHECK FILE PATHS. The image loads after all! OK! Time to get back to work on serial to arduino after that detour!

6:50: everything should be working and data should be sending to serial. BUT now I am unsure of the order of operations to recieve data from P5 to arduino. Do I run the sketch first, then open the serial port, then open the Arduino console? etc. Experimenting with this…

7:06: having problems uploading the sketch to the Due. Getting the error [avrdude: stk500v2_ReceiveMessage(): timeout] Thought maybe the P5 sketch run through local server may be taking up the serial port so I closed the serialport app and the browser, but I’m still getting this gorgeous little error. (I give compliments to computers in the place of curse-words in the hopes this will appease them). I have disconnected the USB and restarted arduino and it still happens. Maybe it’s just a weird inexplicable error? ARDUINO GODS PLEASE WORK!

Oh crap Arduino was  on the MEGA mode from me taking a break to program my basement light, that’s why. Jeeez.

7:19: back on track. Still not reading serial data from the Arduino. My J5 is sending serial data, as confirmed in the chrome console but the Arduino is not reading it. Not sure why. My serial reading is basically taken straight from the lab.

7:48: trying to debug it with “here’s johnny!”. It’s weird because something shows on monitor… but stops, mid string. Weird. Attempting to google troubleshooting arduino receiving serial data.

8:06pm: wow seems like everything is not working now. When I reload the sketch, there’s no serial data on the console anymore, despite it being written serial.write(get(1,1)); clearly in the code! What the hell bro… Don’t tell me it’s not just an alpha editor issue!

A bit at a loss as to how to go forward from here. I may need to wait for tomorrow’s office hours…

8:11pm: discovered that serial.write() does not always show up in the console. But print() does.

8:19pm: at a complete standstill, no direction to explore. In such a situation, I think I’ll take a walk to the local pub and have a Miller High Life to celebrate the joys of life. Why am I in such a good mood? Who knows? Lina, if you’re reading this: MUAH 😉

Sessions #4, Tuesday, October 24:

11:28am: At ITP. I realized it may have something to do with my Arduino Due than anything else. I plugged in my UNO and immediately I am getting better values. Output still sort of uneven but its a start. I also figured out order of operations: 1. upload sketch to arduino, 2. open P5 sketch but don’t run it, 3. open serial port, 4. run sketch, 5. open Arduino serial monitor.

11:36am: Yup, still not working. I dont trust the alpha editor because of the unjustified infinite loop error and my localhost is not sending the values I want. Good thing I am seeing Mathura the resident in a few minutes.

12:11pm: Boom! It works! With Mathura’s help I discovered my error: I didn’t include the + ‘\n’ in my code. Apparently serial only starts reading value when it receives a non-binary. I should have read the lab a little more thoroughly.

12:24pm: back it not working. hmmm it seemed so smooth when Mathura was here…

12:56pm: BREAKTHOUGH. It just so happened that Jeff Feddersen was sitting in the adjunct zone and I was introduced to him by someone. I asked him a serial question and he gave me great pointers:

-don’t push too much emphasis on what you see on the Arduino Serial Monitor (ASM). Because there’s so much stuff going on there. P5 Serialport and P5 are competing things, and just because you see nothing in the ASM doesn’t mean there’s nothing there.

-better to debug with a blinking LED (the built-in PIN 13 one). That allows your serial data to manifest its presence indepdnetly of the demands of the serial port.

-put serial data in mousePressed() instead of draw() to control the tempo of serial port speed.

2:23pm: moving on to the array, now that I am sure that serial communication is coming through. The array from my 32×70 image, even if each pixel element has 4 elements seem impossibly big. I am going to simplify even further and not do this on the big board, but do this on the small board that I made for the fabrication enclosures assignment. It’s 81 LEDs, 9×9. I am also going to simplify the image so there is no mistake. I used the pixel drawing website to draw a 9×9 GIF that I will use. Nothing fancy.

2:33pm: At this point I am relying more on the LED blinking to tell me what’s going on. The values I’m reading from the ASM are pretty sporadic. Also in the JS Chrome Console (CC) I am seeing that the array length is 40014? 9 x 9 x 4 array elements = 324 at most! Even more confusing is when I print c.length() it prints out 18549. Where are they getting these two array length numbers from??

2:55pm: Figured out the culprit. I had put the function which contained append(c,get(i,j));  in draw() so it was just exponentially expanding! It should have been in setup() all along! DUH! Back on track!

NOTE: test pattern on small board is “smallboardtest”

6:43pm: back at it after Applications. Before I breaks I was having trouble extracting the value from the array since the arduino reads just a bunch of ints on serial.read(). I just want to dumb down the serial data coming over from P5 a little more. And Im content just passing on the R value of the pixels.

7:12: BREAKTHROUGH – After I popped my head into the residents office one of them helpfully told me I could extract out the R of the array with:


And he advised me to print to console first before going to serial. “One step at a time”. Great advice. Back on track!

7:32: I was getting the right feedback on the JSC but not on the ASM. I was getting strange values. I asked Aaron about it, and he advised me to send one big string from P5 to Arduino, separated by commas. Makes sense. I’m doing it like this:

var justR = ” “; //this is a global

justR = justR + c[i][0] + ” , “;

Apparently you can just declare a variable like ” “? And then attached numerical and symbolic values together in a string? Very useful. And then, BOOM we are in business son!

9:32pm: Jason Beck is helping me debug this thing. At issue is that fact that after I had gotten my R values into a nice, comma-deliniated string, it wasn’t reading in Arduino. We thought it was my machine but I think it’s not, since the same code and arduino runs the same on Jason’s computer. Very sporatic values in the ASM.

10:48: After a brief moment when the thing worked and the board lit up — briefly — and then blowing my computer’s serial port, the Arduino no longer seems to read serial info from P5. Jason kindly taught me how to “handshake” the Arduino and P5 — to establish serial contact before any of the real serial work is done. Unfortunately the current situation is my P5 is not picking up the handshake info from the Arduino.

Not gonna lie folks — thinking about calling it quits. Haven’t even started my ICM homework yet…

Writing this chronicle brings to mind that scene in LOTR where they find the book of the dwarf war against the orcs where they write a journal about how every day they are losing the battle… LOL

11:07pm: OMG! Inexplicably it works!!! I just fiddled with the P5.Serialport App, opened and closed some stuff and it works!!!! THANK THE GODS!

OMG!! I’m so happy!!! I feel like they felt at the Battle of Helms Deep when Gandalf saved them!

Lessons learned:

-The ASM itself contaminates the P5 serial input into the Arduino

-inData[i] = Serial.parseInt() RETURNS AN ARRAY!

-The whole thing worked when I just stopped trying to ascertain the P5 input conceretely (i.e. seeing it on the ASM and just wrote it directly to the LED matrix).

Leave a Reply

Your email address will not be published. Required fields are marked *