Arduino: Introduction and initial experiments

The class started with an introduction to what the course is about. A likely merging of Imaging and Design Form & Communication, where of course we’ll be looking at images, but also be learning new softwares and technologies like programming Arduinos. This last part sounded really fun.

The next session was spent fiddling with littleBits. We split into groups  to briefly play with how separate pieces of hardware snap–literally–together, to do different things. Testing out different sensors and motors.
What I do hope is that we’re given another explanation of the physics of the parts, because as I’m writing this I can feel that I’ve already forgotten some important information. Did the transformer (i don’t think it’s even called that–the thing that controlled the current) connect to the battery? The orange part was meant to be an extension thing, but there was a weird way it connected (was it called a divider?).

At the end of the day, I think the more we fiddled with them, the better our understanding of the parts got.

Next came learning some programming.

Experiment (dots):
Screen Shot 2016-01-25 at 3.10.08 PM
First we learnt to draw a single pixel using Rb.setPixelXY(); . Then moved on to learning how to store colours using hexadecimal codes to save space. We learnt the basics of programming this way: Functions, commands, the fact that data types need to be specified (e.g.  uint32_t for colors), the importance of [] () and ;

I started by creating gradients, focusing on blues and greens mainly because one of my LEDs had a fused Red filament.

I figured out how to create blinking lights using delays  and Rb.blankDisplay();


Further animations at home:

Experiment (ripple):

Screen Shot 2016-01-25 at 3.11.04 PM

I had the idea of ripples, fire and a ping pong game.
I decided to try making a rippling effect where squares of colour turn on turn by turn, and as the third one turns on, the first on turns off and so on until the edge square is reached. I didn’t start my square from the centre of the matrix so that it looks more like a ripple and not just like a pattern.

To do this I had to store each section of blue in a void funtion. I couldn’t understand how to do that so I struggled for a while until it FINALLY worked!

The wrong method:

store as
void blinkRipple(int x,int y)

call with

The correct method:

store as:
void blinkRipple(int x,int y, uint32_t)

call with
Rb.setPixelXY(3,3, blue0);

Next came figuring out how to turn the lights off. I figured that all I needed was to use RGB values of 0,0,0.

Rb.setPixelXY(x, y, 0, 0, 0);

I tried this with the hexadecimal code and I got a compilation error if I recall correctly. Maybe I was doing something else wrong. Here is what I tried: Rb.setPixelXY(x, y, 0x000000);

After thinking about it for longer I figured that I had to store the blank pixels too:

uint32_t blank = 0x000000;

//void drawRipple(int x,int y, uint32_t){

//turn off light
void blinkRipple() {

  // 1middle 4 pixels in blue0
     Rb.setPixelXY(2,2, blue0);
     Rb.setPixelXY(2,3, blue0);
     Rb.setPixelXY(3,2, blue0);
     Rb.setPixelXY(3,3, blue0);

void blinkRippleoff() {
     Rb.setPixelXY(2,2, blank);
     Rb.setPixelXY(2,3, blank);
     Rb.setPixelXY(3,2, blank);
     Rb.setPixelXY(3,3, blue0);

Screen Shot 2016-01-25 at 3.12.10 PM

I tried switching colours. Purples were very bright, not as pretty as blues. The reds also looked brighter than blues. So where I had the blues going from dim to bright at the edges, I did the opposite with reds, because otherwise it looked very odd.

Experiment (spiral):
I used a similar codes to make a looping spiral. It went from light blue to dark in the centre and then dark red to light red in the centre and looped.

Experiment (hello):
Next I wanted to do something complex. I created a system of using a whiteboard marker and transparent sheet to help me visual the pixels I wanted turned on. I wanted to create scrolling text, a simple HELLO. My sister told me to see if the system accepted negative values or values greater than 7, if so then I could draw my entire word and shift the pixels. Screen Shot 2016-01-25 at 3.16.01 PM
While trying to understand how to shift the pixels I finally understood how:

void hello1(uint32_t color) {}

is like a function. the ‘color’ in the parentheses is like the x in a mathematical function. so if I type in:

Rb.setPixelXY(7,3, colour);
Rb.setPixelXY(7,4, colour); in between the {} after it,
it means I can call it later in the loop with:
and then specify what I want my x to be, which will be a hexadecimal  BECAUSE i specified the datatype as uint32_t  when writing my function!!!

Until now I didn’t get it for some reason. but when it becomes clear it’s so obvious.

wrote out the entirety of my word after testing whether the system accepted extra numbers (more than 7 or less than 0). Then used the x technique (7-x) where x was shift (7-shift). I did this for all of my x numbers, since I wanted the text to scroll horizontally (got hinted in that direction by my sister).


void helloMessage(int shift) {
    Rb.setPixelXY(7-shift,3, blue0);
    Rb.setPixelXY(7-shift,4, blue0);
    Rb.setPixelXY(7-shift,5, blue0);

and so on.

I got a lot of support from my sister when it came to making it loop. She explained a ‘for loop’ to me. Like an amateur I typed in ‘4()’… because…4 loop

it was actually:

 for(int number = 0; number <25; number=number+1){

This was me using ‘x’ again, where x this time was ‘number’. The ‘number’ was how much I wanted the ‘hello’ to shift by. calculated the 25 by seeing that the entire message, went from 7 to 25. 

just the above didn’t work. It resulted in a block:


Screen Shot 2016-01-25 at 3.18.10 PM

the reason being was that after the delay of each ‘number’, the screen wouldn’t go blank, so it just kept copying the first line of the H…I fixed this problem by using the Rb.blankDisplay after the delay.

Screen Shot 2016-01-25 at 3.20.26 PM

I ended the loop with a smile (with no assistance!!!). To make the ‘smile’ I had to figure out how to stop this loop when the O is at the exact spot where I need it to be.

I went online to get a better understanding of for loops:

arduino00008 arduino00009

My current understanding of for loop:

initialization, happens once, it initializes, statement begins with 0. Loop continues to be tested through to the number in the ‘condition. <25 for example if thats my number of Until that range is covered, the statement block (shifting function) is executed and the increment of the step is added…

Experiment (snooze):

I tried making my own looping forloop, by myself, without assistance. I made a series of 3 Z’s that would scroll up diagonally from bottom left to top right of the matrix. My plan was to make them loop endlessly.

for(int number = 0, number >-12, number = number+1){
^WRONG. need to be separated by semi-colons not commas.

for(int number = 0; number >-12; number = number+1){
^SUCCESS…in the test the function of snoozeScroll just had one LED on, it seemed to do what I wanted, shift up and right (diagonally):

void snoozeScroll(int shift) {
    Rb.setPixelXY(-1+shift,-1+shift, blue0);

Another thing I discovered was by adding another datatype or variable in the parentheses I could vary the color easily:

void snoozeScroll(int shift,uint32_t colour) {
    Rb.setPixelXY(-1+shift,-1+shift, color);

for(int number = 0; number >-12; number = number+1){
      snoozeScroll(number, blue7);
^could alter blue7 to any other stored colour.

At the end of it all I couldn’t get the Zs to loop properly. Once the 3rd Z left the screen it wouldn’t loop until after a very long delay which I hadn’t put in.

My sister explained that something in my for loop is wrong, the range of numbers maybe, which is causing the pixels to be shifted up forever. It returns after reaching an insanely huge number.



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s