insecure cameras by Sebastian Morales

Last summer I happened attend a coding meetup, there I actually met Leon Eckert who turns out to also be an ITP student (2nd year)! One of the presenters during the meetup was showing a project he did with insecure cameras pulled from insecam.org. At this point I became really intrigued by the concept and once in NYC, I started looking for cameras in the city. 

Most of the cameras happen to be inside buildings. Aside of being a little creepy they are not very interesting to me, this lead me to focus in just a couple of cameras which pointed to the outdoors. 

After going through the 100 or so cameras in nyc, I came across two that looked promising, the problem then was that not a lot of information is given about the location of the cameras, except for... well, the camera feed itself. 

Tracking the locations

The first camera I found was actually the one with the cobblestone ground, this actually narrowed down the search significantly since only a couple of streets in ny have this type of pavement. 

Looking through the internet, I came across this NYC Bike Maps website that lists all the streets in the city with cobblestone pavements. 

http://www.nycbikemaps.com/maps/cobblestones/

After a long virtual walk I finally found that distinctive red building!

Time to go pay a personal visit!

The second camera was a little harder to find but eventually I did.

Also, thanks to Tiri for joining my last minute adventures! and thanks to Jenny for capturing some of the images. 

Thinking forward, I am not exactly sure what do I want to do with this knowledge, the first thing that comes to mind is a video but there could be other things to explore. Perhaps distance the project from questions of privacy and surveillance and use the cameras a medium to explore something completely different. 

In the mean time, here a quick video a couple of friends and I did:

New tab window to the sky by Sebastian Morales

This idea was inspired by spending too much time in front of the computer and not enough time looking at the moon. 

I first started by looking at the Astronomical Applications Department website (aa.usno.navy.mill), in particular at their moon phase api. 

Here I learned that the most basic api call I could make was something like this:

"http://api.usno.navy.mil/moon/phase?date=today&nump=1"

Which in tern returned a JSON string with well... todays moon. 

{
  "error": false,
  "apiversion": "1.3.0",
  "year": 2016,
  "month": 10,
  "day": 27,
  "numphases": 1,
  "datechanged": false,
  "phasedata": [
   {
      "phase": "New Moon",
      "date": "2016 Oct 30",
      "time": "17:38"
    }
  ]
}

See how the date I entere (Oct, 27) doesn't match the date returned for the phase (Oct 30)? Thats because Oct 27 did not have a full phase and the next actual phase was Oct 30. 

 

This was my first swing at using APIs but I realized that I could go much deeper still exploring this same API.

The sun

Using a couple of extra parameters, I could get not only the phase of the moon but also the time it would set and rise for a given location. The same was true for the sun which made me excited about doing a day animation.

{
"error":false,
"apiversion":"1.3.0",
"year":2016,
"month":10,
"day":26,
"dayofweek":"Wednesday",
"datechanged":false,
"state":"NY",
"city":"New York",
"lon":-73.92,
"lat":40.73,
"county":"",
"tz":-5,
"isdst":"yes",

"sundata":[
            {"phen":"BC", "time":"6:52 a.m. DT"},
            {"phen":"R", "time":"7:20 a.m. DT"},
            {"phen":"U", "time":"12:40 p.m. DT"},
            {"phen":"S", "time":"5:59 p.m. DT"},
            {"phen":"EC", "time":"6:27 p.m. DT"}],

"moondata":[
            {"phen":"R", "time":"3:17 a.m. DT"},
            {"phen":"U", "time":"9:50 a.m. DT"},
            {"phen":"S", "time":"4:16 p.m. DT"}],

"closestphase":{"phase":"Last Quarter","date":"October 22, 2016","time":"3:14 p.m. DT"},
"fracillum":"15%",
"curphase":"Waning Crescent"
}

The structure is slightly different so it required a little tweaking but nothing crazy. What took a while to figure out is that for some days, the moon will set before it rises... WHAT??? This happens when the moon rises duing the evening and sets in the morning, as you would usually expect, the problem is that the moon is setting on the next different day. Which means that if you only look at one day, the moon will set before it rises. This kept causing all this problems in my animation where you would see the moon come out from the wrong side and set on the opposite time at the wrong time. 

At the end I decided to include this little program as my default new tab in chrome, meaning that every time I open a new tab I see a subtle reminder that there is more than pixels in this world, and that perhaps it is worth going outside to explore it.

Joystick Mouse by Sebastian Morales

If you are reading this post it is likely that you spend more than 4 hours a day in front of a computer. Depending on what you are doing this can create a lot of strain on your wrists, arms and shoulders. 

I remember a friend of mine would have a collection of mice on her desk, every couple of hours she would grab a different one, no matter how ergonomic the mice was she would eventually get tired of the position.  

I think this is because all of these mice are meant to be used in only one configuration, and no matter how ergonomic it is, the human body is meant to move. 

Inspired by this challenge, I wanted to create a mouse that didn't locked the user into a single position, one that could be used upside down, laying down or standing up far away form the computer.  

Welcome the Arduino Joystick Mouse!

Turns out that the Arduino Leonardo is perfect for this since it can out of the box access your mouse controls through USB. 

The prototype is quite simple, it has a 2DOF joystick plus a push button. I also added two more buttons as a regular mouse would. An additional idea was to include a 9DOF sensor to detect complex movements. 

This could transform the mouse into a 3D mouse, ideal for creating complex CAD models where you can easily move around your models with elegant precision. This however, requires additional programming that I didn't prioritize in these short weeks. 

An additional advantage of using such 9DOF sensor would be programming movement patterns, perhaps you could copy and paste by simulating the motion of spooning and pouring for example. 

A lot more complex behaviors could be programmed as desired, this means that the firmware inside the mouse should be able to update easily, this means that the brains inside of the mouse should be able to update simply thought the same cable. This made the ATMEGA32U4 the ideal candidate.

After simplifying my MVP for my first prototype I settled on having a simple mouse that could click (right and left), scroll  and move the cursor. Pretty basic but simple to modify if I ever decided to add the 9DOF sensor. 

Eagle 

Ripup, route, ratsnest... your 3 favorite commands while laying out the circuit 

Once I finally simplified my traces and thought it could work it was actually time to make it. 

I skipped a couple of pictures here but it involved printing on vinyl and transferring the ink by pressing it and heating it inside a hair iron. 

Then dropping it on acid.

The process didn't came out without its own problems. 

...like all my pads touching or even completely connected.

The solder is the right place but it looks lime the solder is a little too liquid.

Time to do a continuity check!

MUSIC EVERYTHING BEEPS!!!

So back to the microscope and try to make  things stop touching. Hard to see it but there is a knife trying to separate two paths that looks like might be touching. 

...test again... beeps again... f this...

Final thoughts

My final (not working) prototype is about (pretty much exactly) the same size as my original one. Making me reconsider if this was the right project to try this on. 

Gradients!!! by Sebastian Morales

For this weeks assignment I wanted to explore making gradients and smooth transitions without using the lerpColor() function. This to have total control on the gradient and shape. 

This prove difficult to achieve on the online editor due to a bug that will think I was running infinite loops. I filed the bug but in the mean time hosted my sketch on amazon s3. 

Rafael Lozano Hemmer by Sebastian Morales

I can no longer tell you when exactly it was that I fist discover his work. I have been trying to remember but I cannot tell you what piece it was either. I can tell you however that I was deeply moved and that he has been a rich inspiration since. Perhaps it was Pulse Room, a piece he did in 2006. 

Last year I finally was able to see many of his works live at the MUAC, in Mexico DF. 

Best Practices for Conservation of Media Art from an Artist's Perspective 

This past Monday I had the chance to attend a talk at NYUs Institute of Art given by Rafael himself. The talk was focus towards Conservation of Media Art and the challenges artists, preservations and collectors often have to face. 

Like many, if not all media artists out there, Rafael's work eventually stops working, perhaps it is the computer that died, a hinge that broke, or simply a lightbulb that needs replacing. Some of these problems might sound easy to fix. The problem really grows when you consider that his artwork includes technology, technology that in just a couple of years will go obsolete and perhaps difficult to fix. 

To address this Lozano and his team prepare a set of detailed instructions, anything from CAD drawings, source codes, assembly instructions to a list of suppliers and acceptable guidelines for replacing or fixing components. He says that this details are so descriptive that if they were shared one could build the artwork from nothing. At this point he made reference to Sol Lewitt, mentioning that his artwork is nothing but a set of instructions, this had led him to the challenge of creating un-replicablecertificates to ensure collectors or museums that they have an original work.

These thoughts more and more made me think of his work appropriate for this class, reason why I am choosing him for this week's assignment.

Tape Recorders

Tape recorders is a piece that they did back in 2011 for the MCA Sydney. It includes the use of a computerized tracking system (kinects), computers, cameras, a thermal printer and custom hardware and software.

http://www.lozano-hemmer.com/showimage.php?img=Sydney_2011&proj=257&type=artwork&id=2

As people walk through the gallery, the Kinects pick up the location of the expectators, map their position and project the measuring tapes upwards.  

http://www.lozano-hemmer.com/tape_recorders.php

Eventually the measuring tape collapses on itself, point at which it recoils back to its initial position. 

Finally, every hour, a statement is printed with the total time spent by the audience looking at the artwork. 

Here a video:

Lozano-Hemmer has a website where you can find all of his works as well as projects that he and his team are working on. However, I find that Bitforms has a much cleaner page and it is a nicer experience if you want to explore and discover his work. 

Finally, I couldn't finish this blogpost without showing the picture to the right, Melissa, Sejo, Rafael and myself.

Populating the Board by Sebastian Morales

Creating the solder stencil

Once the board has been printed, milled or etched. Once the board is ready to be populated, there are a couple of steps that one needs to do first. 

In order to facilitate the process, it is best to apply a uniform layer of solder paste in all the pads where components will be solder. To do this a good practice is to laser etch a sheet of acetate to make the mask.

The settings might vary depending the film used as well as the laser selected. The recommended settings where 10 power 10 speed and seemed to be working fine for my first tests. 

Applying the solder mask

seconds prior to applying the solder paste

seconds prior to applying the solder paste

Before you even start this make sure all your components are out, once you apply the paste you don't have much time so you don't want to waist it looking for that 1uF capacitor.

It is best if the board is constrained while the solder is applied, that way you don't risk the stencil to move and the solder will be applied on the pads.

After locking the board and positioning the stencil, apply some solder paste at the top or bottom of the stencil. In one uniform (maybe two, max 3) movement apply the paste by gliding a plastic spatula (credit card) over the board.

Carefully remove the stencil, carefully to not smudge the solder paste on the pads.  

 

If everything went according to plan you should have something that looks like this!

Placing components

Perhaps one of my favorite steps in the process. If you followed the instructions you already have everything you need out. Using the manual pick and place make sure to delicately place the components in the right location and orientation. Don't worry if they are slightly crooked, they will magically aligned once the solder flows. 

Melting the solder

Here a picture of the settings used in case they are useful. 

I guess the only other thing to mention is to allow for the machines to heat up before using them.

 

 

I think it is ideal practice to heat all the board a little before focusing on one specific area. Move the heat gun around the entire board, soon you will see the solder change color, transforming from a matte gray to a very shiny silver. You will also see how the solder groups together.

Test before you power

To my naked eye, the board looks great, there seems to be some two resistors bridging (top left). This is not really a problem since they are where already connected in parallel in the schematics. 

Perform some basic continuity tests to make sure only what is supposed to be connected is connected. This can save you some severe damage to your computer (in case you would connect this to your computer).

Programming the board

So you did everything right?

Congratulations, you are almost there. The class website has some great resources, as well as links to more resources. Go there and learn how to properly use the burn the boot loader to later be able to upload arduino sketches. 

Structured Glitch art by Sebastian Morales

Instructions:

1. Open facebook and download both your profile picture and your cover picture.

2. Open both pictures side by side in a text editor

3. Scroll down a random amount on the second text and copy a chunk of text. Scroll down a random amount and past (or replace) the text.

4. Check the original image and evaluate changes.

5. Repeat process

6. If the change is too drastic or undesirable simply undo the changes in the file and save again.

7. Again, if the change is too dramatic it might happen that the computer no longer recognizes the file. Simply undo changes and save. 

8. Continue the process.

9. Once the image has been modified to your taste save one last time.


UPDATE:

This is a response by the comments:

At the beginning I had stricter rules of what to change or what to remove. I first started searching for specific letters or dates and removing them. This made the image way too corrupted and I could no longer open it. It is clear that I don't understand what the code means as I am modifying it, therefore I take a more exploratory approach. 

Here a video of me redoing it and getting a very different result.

I am making decisions as of where to add/subtract/change code, as well of if continue that path or go back. Still since I don't understand what I am doing I really don't have any real control. Often my goal in the process is to see how far I can go before the computer tells me I went to far and refuses to open the file. Not sure if I am cooperating with the machine or against it.

 

Finally, something strange that happened to me was that even that my computer was able to properly display the image, once I uploaded it to my website it could't be displayed. In another moment my glitch actually got unglitched...

There are other methods I have used to generate glitch visuals. One of my favorites cannot be found.

Expressive Words by Sebastian Morales

From top to buttom. Serif: Cinzel,Cutive Mono, Cardo.  Sane Serif: Bungee, Confortaa, Baumans

Also, I used this tool to compare different fonts: https://typezebra.com/

This week assignment is divided into two sections, the first half are expressive words, this are words that by using font and cleverness define themselves. 

The second half is more an exploration on fonts, in particular the assignment challenged us to find three serif and three sans serif fonts with which we feel identified.  

Visual language- Signs by Sebastian Morales

Having spend many hours in fabrication shops I have seen many warning signs. From pinching fingers to very loud noise signs. They often tend to be a little gory, I guess it is part of the processes of explaining you why you should or should not behave in certain way.

Out of all of them, the Haas caution sign for their lathes is my favorite. 

Yes it is a little explicit, do you really need flood squirting everywhere?

The reason I like it is because it illustrates something not particularly obvious, having too much unconstrained stock can be fatal.

I am sure that if you are the operator and saw the sign, next to your exposed stock, you would think it twice before powering the thing on. 

With shops in mind I decided to go take a look at our own ITP machine shop...

Entrance to Shop

Ten feet away and the experience starts becoming overwhelming... Not sure what is going on but it looks like there is even a crying baby! Aragorn is also trying to tell me something, most be important. 

Safety Goggles... Got it!

What is on that sign half way falling apart?

Is there someone bleeding inside? Can't really tell, can't see through all the signs.

You get the idea...

 

 

 

 

Shop Signs

After gathering the courage to walk inside my fears materialized once again. 

Is there really a sign behind the blinds??

Lets just focus on the machine for a minute. 

Just as you walk towards it you are presented with an ocean of information. What should you focus on? I guess that if you have time you might read them all...

I have time, so I did, turns out the diagram repeats what the instructions at the top say. You also have some info on what materials to cut on this machine, that is useful. 

They also tell you not to feed the material too fast... but what is too fast to begin with? 

Ahh! Almost forgot... Turn the dust collector on!

Lets be a little constrictive here, how can we share all this important information in a way that is more efficient. Here a stab at it, not saying it is perfect but might be a place to begin. 

Other thoughts on what makes a good or bad sign.

The Skull and Crossbones

Early-Skull-Image-GraphicsFairy.jpg

The Skull and Crossbones, perhaps one of the most recognized symbols for keep out, danger, poison...dead.  A couple of years ago I was listening to Roman Mars in his podcast series 99% Invisible. For those of you not familiar with the podcast, Roman Mars and his small but amazing team share incredibly crafted stories, mostly on topics of Design and Architecture. 

On episode 114, they share the seemingly impossible task of waring future generations about the dangers of a radioactive waste dump. The challenge being that they have to warn them for the next 10 000 years!

They first start talking about language and how it changes so fast through generations. How we have such a hard time trying to understand Shakespeare, that being just from 200 years ago. Now imagine how meaningless our language might be in 10000 years. 

Then they start looking a symbols and diagrams. They soon realize as well that this also are victims of time and culture. For example, the Skull and Crossbones. Once a symbol for resurrection, then a symbol for dead and danger. No a meaningless symbol that you can find on basically anything:

I won't spoil the end of the podcast because the story is quite amazing. 

The reason I included this as relevant is to show the importance of context in design. How something that previously was good design is no longer so. In other words, how it has lost the ability to transmit a message clearly.

If good design can stop being so, is there such thing as good design?

 

Raining Pianos by Sebastian Morales

This blogpost started not with pianos but with Fluxus. Through one of the links shared I came across Fluxus.org, and there a brief interview with George Maciunas, the founder of Fluxus. More than an interview it was an introduction to the beginings of the movement and what it really is about.

Sooooo... what is Fluxus? I'll paraphrase here: something like a band of people (often avant garde artists) that came together to liberate us from our monotonous lives. Fluxus is not just an art movement, more like a release of creativity into our daily lives. Bukoff defines the beginnings of Fluxus as a movement trying to challenge the social standardized notion of what is good, what is normal and, what is appropriate. Who is Bukoff you ask? In his own words: "The coolest person you've never met". 

At some point during the audio (15:28), Bukoff starts talking about Al Hansen and how he threw a piano out of a window and called the sound produced by the impact music. There was something about this scene that really caught my attention. Immediately, tons of memories of falling pianos came to mind, perhaps it Hansen started it all with some help from Yoko Ono.  

I then started to read more about the story. To be quite honest I couldn't find much more info than provided in the interview but there is something of that scene, a falling piano, that felt so familiar. 

The original event actually happened during the middle of the night and not much evidence exists about it. In one blog post I actually found an image. It looks like it could be from the 60s right? 

Baker House (MIT) residents throwing piano in 1972.

I kept searching and later found that the previous image happened many years later, actually at an event that now happens every year at MIT. This celebrated event is organized every year to celebrate "Drop Date", the last day students are allowed to drop a class. Big emphasis is made on the fact that the pianos are damage beyond repair before the they are completely destroyed. Here the clip from last year.  

Piano drops in mainstream media:

We have all seen pianos falling form the sky, well, at least on tv. The first thing that comes to mind are of course cartoons and mischievous villains with terrible luck. Here are two other examples, one from popular British show Top Gear and . 

 A quick google search gave dozens of results, here some:

The internet is full of people throwing pianos, whether virtually or physically, some with purpose, others just to feel "rebellious".  

By now you might think I am a little off topic, I guess where I am trying to get at is the personal realization of the effect of Fluxus in our lives. You see, just a couple of days ago, I knew nothing about it, I didn't know it existed! Yet, it had been an important part of my life. 

Point Waves by Sebastian Morales

This is a simple animation demonstrating a couple of principles. The circles change size based on time, they also change size and color based on the mouse position. Every time the page is refreshed the color scheme also changes.

Programming the board by Sebastian Morales

The foot pedal was being used so I ended up using the fancy pick and place machine. 

Heated the board a little...

BEAUTIFUL! Actually two of my resistors are connected together but after looking at the diagram you know that this are connected regardless. In other words, no need to worry. 

I skipped a couple of steps here, well, not really but I didn't include them in the documentation. 

It is IMPORTANT to verify that all the components are solder correctly before connecting them to a computer, to power for that matter. 

To test this grab a multimeter and verify that the grounds are connected to the grounds and nothing else. The same goes for the powers. 

Even after doing this, I was still a little nervous so I actually used a power supply instead of my computer (to power it). It turned out that all the components were solder correctly but better to be safe. 

 

Programing / Burning the bootloader

In this case I was using the AVRISP MKII to burn the bootloader and then to upload my sketch to the atmega. 

There are a couple of tutorials on how to do so online but I found them a little confusing. The actual process is really simple. 

First make sure the pogo pins are oriented in the right direction. The green LED should light up on the programer. 

  • Select the right Programer from the "Tools" menu. 
  • Click Burnbootloader
  • Upload sketch using programer (⇧⌘U)

Note: I had to change the frequency variable on the code (pulse_khz) from 36 to 72. I think I had the wrong crystal so my code was running twice as fast. After some frustrating attempts I was able to turn the projector in the classroom off.

Arduino Mouse by Sebastian Morales

A couple of months ago, while still working as a full time engineer I would have my desk filled with mice; a regular mouse, a 3D mouse, a fancy mouse, a tiny mouse, a wireless mouse... you get the idea... Although I did have one that was my favorite, I would eventually get tired of the position and switch to another one. This made me think about creating a mouse that allowed you to change positions, a mouse that would work even if you where standing upside down. 

CUSTOM SLIDERS USING P5.JS by Sebastian Morales

Having some experience with P5, I wanted to take advantage of this assignment to do something that I can reuse later in future sketches. In the past I have used the DOM elements but didn't really like the default sliders so I decided to make my own.

Ideally I would like to make some sort of library of design tools that I can just drop into projects. Although currently I don't really know how to do that. 

Using the live web editor could be a life changer, it definitely made embedding my sketch on squarespace a lot easier.  After trying to do it for almost 1h in the traditional fashion I gave up and embed it directly from the editor.

A potential problem I see with this process is that anyone can modify the content of the sketch as long as they know link, which can be easily found from the developer tools. 

ANALYZING VISUAL LANGUAGE by Sebastian Morales

THE GRID

Lets take a look at what happens if we sub-divide the poster in equal segments. 

You know what? Lets take a closer look...

Yep, this most have been intentional...

What is important?

I believe the grid in this poster also helps to accentuate what is important here. You have Steve Zissou/Bill Murray dead center, everyone else in second plane, slightly offset form the line. 

Perhaps the second thing you notice is the title of the movie, BIG YELLOW letters also well aligned with the grid. Take a look:

Keep gazing downwards... With who? Steve Zissou? I wonder who that is? Perhaps.... Wait what? There is a fish? Oh!!! They are under water, in a yellow submarine!!!!

I am starting to believe I know what this movie is about. 

THE TYPEFACE

Two different fonts, both same color. I am actually not quite sure if they are really two different fonts, they both have the same general shape, the curves, sans serif, the perfectly round O, the E who's sections all go all the way. I don't know much about fonts but there might be something here. 

THE COLOR

All in dark shades of green and yellow, very underwater... Wait, I see some red, you see, their red caps, there most be something about those.

FINALLY, FOR THE FUN OF IT

Apparently, Wes Anderson is famous for his perfectly framed shots, someone actually took the time to make this amazing video. 

Enjoy!

and...

Thanks for reading!