Bad Vibes Desk: Update (The Motor)

It’s been a bit since introducing the Bide Vibes Desk project. And since it’s due tomorrow I figure it’s time to go over what’s happened since our last episode…


Photo Nov 20, 2 38 04 PM

Photo Nov 20, 2 36 37 PMThis is Bertha. She’s 45mm in diameter. Weighs in at a staggering .2 lbs. And is rated to operate at 24V.  That’s (and I’m guessing here) about 100 times larger and more powerful than your iPhone’s puny vibration motor.

Here’s the spec sheet for you motorheads: Bertha’s Spec Sheet

The Mount

You might notice, as I did, that there’s no engineered-in way to mount Bertha. Which proved to be a pain in the ass.

I considered buying some sort of pipe fitting or bracket, but that would have been expensive. I also would have had to customize it to some degree. So I decided to prototype a mount with what was lying around in the meantime, while I researched a longer-term solution.

To the junk pile!

I found a 2 x4, cut it down to size, drilled a hole, and cut in half. Using a couple of wood screws I created a surprisingly decent clamp to hold the motor in place. I soldered on the wires you see dangling out. In these photos they’re temporarily connected to a bench power supply that I was using to test Bertha’s vibrational strength.

Photo Nov 22, 3 13 09 PM

Photo Nov 22, 3 13 04 PM

 Next: Prototyping…


“Everything’s a Prototype”

If ITP had an (even more) unofficial slogan than “a Center for the Recently Possible,” it would be: “Everything’s a Prototype.”

This is still something I’m coming to terms with on a daily basis. Obviously there’s only so much you can do inside or outside of a class, within a semester, while you’re taking a handful of the most mentally grueling, thought and production intensive classes imaginable. But, still. In my head I’m always looking at a polished, finished, fully realized piece of work on display in some imagined gallery-type space. White walls. People quietly milling about. Curious but also very respectful of whatever project of mine they’re enraptured by. They give it plenty of space, but you can see in their eyes the need to play with it. So while no one’s looking, they do. And it holds up. Rock solid. No janky screws. Perfectly squared. If it’s a digital piece, maybe they somehow pull up the code. And it’s beautiful and concise and well organized.

But this isn’t the real world. Or, in any case, it’s not whatever ITP is. So I’m stuck doing the best I can. Improvising. Making it up as I go.

Everything’s a prototype. 


It’s only been a week since we used the laser cutter. A week since I fell in like with it. I’ll admit, I’ve been daydreaming about accurate cuts, the precision, the perfectly straight lines, laser-light evenings alone in the shop. But like a fool, I was blinded by love. And got burnt. Metaphorically, at least.

I had picked up some wood off the street. The top of a wine box. I was going to laser cut some pieces for this week’s enclosure. But when I went to cut it, things went south pretty quickly. I had put masking tape on the face being cut (per that Instructables post) to prevent any smoke from marring the surface. Instead of working, the laser set the tape on fire. Then the wood. It just wasn’t going to happen. Everything’s a prototype. 


Luckily someone had tossed a few really nice pieces of scrap wood. Long, slender. Cherry, maybe? They’re a bit reddish. I made some quick measurements and banged out a little box. Not perfectly squared. Everything’s a prototype. 

A Magic Box

Next I went to the junk shelf to see what I could see. I took apart a DVD player and a fog machine for parts. From the DVD player I got an LCD screen and from the fog machine I got some cool switches. A concept was forming. Maybe some sort of automatic counting device or a mysterious smart box that knows the secrets of the universe (or your fridge or something).

I, rightly or wrongly, went back to the laser cutter to cut out spaces in the lid for these components. I screwed up here. I was in a rush. I didn’t measure properly. I didn’t calibrate the machine like I should have. But I got away with a couple nice cuts that were close to what I needed. Not perfect. (You might be expecting my new mantra to show up right here, but it doesn’t. Error on my part doesn’t fall into the Everything’s a Prototype category. I should have more patience. I know. I’m working on it.)

Photo Nov 20, 2 25 38 PM

The components don’t connect to anything. Maybe the switch could, but the LCD would be tough. I’m not sure about any of the connections and I imagine it’d be painful to look up. If it’s even possible.

And so, it remains a conceptual object. Full of possibilities. It’s function: whatever amazing, wonderful, impossible thing you project on to it. Your own imagined prototype. 

Photo Nov 20, 2 26 18 PM

Photo Nov 20, 2 26 28 PM

Friggin’ Lasers

Fabricating with the Laser Cutter

This week I thought about the precision the laser affords as a tool. I wanted to use it in a way such that it made creating my object possible, but it didn’t create the object for me.

Laser cutting the parts for a small-scale architectural model seemed like a good application of these principles.


I sketched a variety of different imagined buildings. This helped me form a mental stock list of the type of shapes and the relative proportions that kept coming up. The characteristics became the basis for the vector shapes that would be laser cut. This way the build would maintain the fingerprint of my imagined buildings, even if they weren’t identical.

Photo Nov 13, 5 25 02 PM

Laser Output


While the parts were precision cut, my sloppy hot glue job didn’t do the final model any favors. Next time I’d find a more precise way of affixing the pieces to each other. I’d also spend more time considering a set of rules for how each piece is connected. (I.e. “Wall” pieces are always glued to the top of the “floor” pieces, “ceiling” pieces are glued to the insides of “wall” pieces.) That way there would be far more consistency over the whole build. I found that dimensions were more and more off as I build the model because I wasn’t consistent with how similar pieces were attached.


Making Multiples

The assignment this week is to create five of the same object. That means developing and using systems for reliable repetition, like jigs.


I’ve had some quarter-inch plywood in the shop for a while, so instead of buying new material I wanted to use that. I also want to make something functional, that I could potentially get some use out of after class.

The thickness of the material, or lack there of, limited my options when it came to joining pieces. Screws and nails were likely out of the picture. So I thought that using channel joints to connect pieces and add structural integrity might be a good solution. That limitation in the material also was the jumping off point for my idea of what to construct.

Multipurpose Mini Platform

I did a quick sketch and paper prototype to visualize how the structure might come together. I thought about creating semi-circular bottoms, but on second thought that seemed unnecessarily complicated and didn’t add anything to the idea.

I started with five boards already cut to nearly identical size. I taped them together to make measurements and cuts easier.

From there I divided the stacks into 12″ x 12″ tops and base material which were cut into 6″ x 12″ pieces and given a middle seam. I used the band saw to measure out 3″ cuts in the middle of the boards and then used the circular saw to take out the thickness equal to the board along that 3″ cut. I slide each piece in against a stopper to ensure I was making the cut at the center of each piece.

The circular saw blade was almost perfectly equal to the thickness of the wood, so the piece slipped together nicely. I did have to take a bit out with a rasp because the circular saw blade cuts in an arc.

I used wood glue to connect the bases to the tops. And secured the build with all of the available clasps.

Completed Piece

Visual Reading with Strings and Data

 As Long as We’re Visualizing Data…Productivity_DataVizGraph

String difficult = “difficult”;

This week was difficult for a few reasons.

I found that strings got tricky once they were broken down into characters and it comes time to reassemble them. I can’t really fathom doing anything besides just counting them or showing them on screen. Like animating…although that’s certainly the next step.

And data…actually, data isn’t so bad. It’s only a problem whenever you’re trying to use or work with it. I’ve never read anything that’s made less sense then some of the API documentation I looked at this week.

Ok. I’m done now.

Visual Reading

What is it? 

It’s something I just made up right now. It’s a way of reading a text using images that match strings in the text.

How’s it work?

The sketch displays the text of Arthur Conan Doyle’s A Study in Scarlet on screen, one word at a time. It’s also checking the individual words against a CSV database for matching strings. When it finds a matching string (i.e. “sherlock”) it loads an image from an online image search and displays the image.*


Processing Pixels

This week we took a look at manipulating images and video in Processing. Because our medium is a screen, we’re dealing with pixels. It’s a seemingly obvious fact that I take for granted. Getting into a mind set dealing with a myriad of points instead of a whole shape or larger system of shapes has been difficult but rewarding. I can feel my brain bending.

(Not) Pixel Sorting

A week after being introduced to the concept, I’m still trying to wrap my mind around manipulating pixels. So instead of working with an entire image I figured that a good way to discover the nature of pixels was to look at them on an individual scale. (Nick Bratton actually sent an email to the listserv about pixel sorting that kicked off this path of exploration.)


This is the image I’ve been starting with.

I took this on a Canonet QL17 while in Puerto Rico.

The Algorithm

It’s terrible. Just a poor example of programming all around.

That’s because it’s mostly a random construction designed to allow me to mess with it.

It takes forever  to make a pass through the image and I’ve got no idea how to optimize it. (I tried right shifting the colors (>>), because I read that it was a faster way to retrieve color info, to no avail.)

The Results

The variables I’ve focused on are  s, r, g, b, i, j, t and c.

  •  r, g, b being individual RGB values of the pixel array.
  • s being a random settable value.
  • being the squared factor of s.
  • i and j being the variables determining the size of the rectangle matrix I’m creating to help visualize what’s happening.

Depending on the  combination of variables I get images returned that look like this.


I had a hunch that what I thought was going on wasn’t actually going on.  So I took out the background image. And like I thought I got virtually the same pixel pattern…as long as the window size stayed the same size as the initial image. 

A quick sidebar:

When I removed the image completely and used the same code (I think with a different window size) I got this result that updated for some reason. Maybe the other program runs too slow and I’m not patient enough to wait for it?


That means I’d been altering the pixels of the window and the image remained an untouched layer underneath. These pixel/color patterns and relationships are based on the mathematics of the window and the size of the rectangles not the image information.

My image is merely being drawn behind the color patterns.

I’d bet that every one of these results is reproducible on a separate machine simply by inputting the same window size and integers for variables. The image information probably isn’t used at all except for background fill.

I need to create a relationship between the image colors and the pixel/pattern algorithm…but that’s where I’m getting stuck. I can’t quite figure out how to retrieve and use information from the image’s pixel array. It seems to be sitting right there, but I can’t grasp at it. Yet.

More pixel sorting experiments to come.

ITP Logo Redesign

Exploration & Iteration

I started with pen and paper but ended up doing most of the design exploration in Illustrator.

Photo Oct 19, 4 32 03 PM

Doing iterative design in Illustrator totally new workflow for me. Very convenient for iterating designs…almost too convenient. I definitely spend a lot of time tweaking and not a ton of time starting with a fresh idea.

The design started with ‘ITP’ in a variety of fonts. I took a couple of the ones I liked and stylized them. The basis for the final design is a monospaced font called Inconsolata. Using it is a nod to traditional monospaced programming fonts.


Final Design

This was incredibly close to the first version. I found something I liked and tweaked it until all of the elements came together.

Like I mentioned before, the font choice was a nod to monospaced programming fonts. The abstract nature of the negative space only works because it’s borne out of the rigidness of the capital letters of ‘ITP’. This highlights the duality of the program; the complex structure and disciplined academic focus balanced by the creative, abstract, artistic and conceptual nature of a lot of the work.

Also using the interior shape as a mark is a way of making details important, which is something I’m finding is a constant theme in work at ITP. It’s also a recognizable and scalable symbol that could eventually represent ITP without any lettering at all.

Additionally, the small diamond at the base of the logo can be used as a cool, subtle accent.


  • Each letter is connected.
  • The negative space forms two interior shapes.
  • The interior shape between ‘I’ and ‘T’ is extrapolated to create an ITP mark that can be used in place of, or in addition to the logotype.
  • The stylized angles on the upper bars are identical
  • The angles on the lower bars are also identical (but different from the upper angles).
  • Small diamond can be used as an accent.
  • Colors were chosen based off of NYU guidelines and what I’ve seen around ITP. (The green is from the ITP Camp website.)




ITP_Logo_Boards-45   ITP_Logo_Boards-43

Logo Critique


Love it or hate it, for most people in creative fields the name Adobe is synonymous with digital creative tools.

(Except for my Swedish friend Cris, who works in Autodesk Smoke. Which I’ve always thought of as some sort of powerful, mysterious thing. Like alien technology. In any case it’s something I know less than nothing about.)

The Adobe logo isn’t a roaring success or triumph of human creativity. But it is ubiquitous. And so it’s become extremely well known in creative circles. Which makes it easy to play around with while still maintaining its original associations and meaning.

And I do consider that a roaring success.

Original Logo

The original Adobe Systems Incorporated logo was designed by Marva Warnock in 1982. She was a graphic designer and the wife of John Warnock, Adobe’s co-founder and one of only two employees at the time.


Contemporary Logo

Adobe’s current logo is a stylized version of the Marva’a original ‘A.’ They, like any behemoth corporation, have a very strict style guide (which you can download for your perusal and pleasure here). They have several variations of their logo that are prescribed depending on the situation.  The most common version is the two color tag, which is “reserved for Adobe use only.”

From their brand guidelines:

“The red tag logo should be used as an introduction of the Adobe brand on a communication, not as a signature to close a communication.”

Screen Shot 2014-10-19 at 5.00.01 PM


You don’t get to be the chief provider of creative software the world over without making a few friends. Not surprisingly Adobe has partnered with creatives to create unique versions of their logo.

by Alex Trochut
by Alex Trochut //

These logos were created by Sagmeister & Walsh on a game show that they created for the campaign.

Here’s their full case study. 

Array Lists

Flexible Arrays

Last week we were introduced to arrays. Or…I was introduced to arrays.



We don’t know. In any case the idea of an array was introduced to some conscious being/s. One of whom may or may not have been me. Or You.

One characteristic of these lists of items called arrays is that they have a fixed length. If you initialize an array with 8 slots (indexed 0 – 7), then it will always have 8 slots. If you want to change the length, you find where you initialized the array and change the length. Then you have to change that number everywhere you’re calling the array. Which is time consuming and kind of a pain in the ass. The solution is to use the syntax arrayname.length to refer to…you guessed it…the array length, but you still have to change the hardcoded length.

An ArrayList allows you to call functions that change the length of the array dynamically. On the fly. In the field. On a whim. Should the mood strike you.

For example, in the video below I’ve made a watery, ring object thing and then created an ArrayList of such watery, ring object things. Now I can create a new ring that’s part of the array every time I click the mouse. There are a whole bunch of functions that I can’t remember off hand, but the idea is that they give you the ability to change the number of index slots in the array at will.