VL-1: Principles of Design & Analysis

The Image
Grundy Body

This design, by Peter Grundy, is an infographic depicting the cost of your body in pounds as valued by human tissue recovery agencies that use life and limb for research (If you’re interested, here is similar, but less effective infographic). I generally love infographics, but I think this one is particularly clever with the cut out body parts and the abstract figure. And it’s very fascinating, particularly to those of us paying NYU tuition.
The most expensive part is the pituitary gland at £2,085 and if you can’t grow your own pair of testicles at the behest of a taunting foe, you can buy a pair for £1,526.


The Grid:
The underlying grid for this image was a little daunting and I admittedly realigned it several times. However, the most striking part of the image is the body, so I worked from this outline. There are only two grid lines that do not fall along the edge of the body: one that bisects the spine and one just above the eyes the provides the top edge border. Despite many parts, the graphic never seems overwhelming because of the dominant single figure.


Using type analyzers, the font most closely matched Slate Std Black, but my version of Photoshop did not have such a font (see odd ‘My Grandfather’ snapshot). In PS, Avenir Next Heavy was quite similar. Interestingly, I found the ‘e’, ‘t’, and ‘a’ to be most telling.
There is another typeface used in the list of brain organs and it reminds me of medieval textbook font used in historical medical texts.

Screen Shot 2015-09-09 at 5.34.24 PM

The colors of this graphic are fairly obvious: black, white, tan, and pink. Black screams at you and your eye is immediately drawn to the central figure, again, to distract from the detail surrounding the body. The next color I see is the white, which provides the price detail, which in turn, draws my eyes to the organs. I like the subtlety of the body parts, despite being the central idea of the image.
The background is very neutral and not too contrasting from the black. It keeps the design from being overwhelming.

Screen Shot 2015-09-09 at 5.38.05 PM

Negative Space
As aforementioned, the background, though not white, is incredibly neutral and it’s not coincidental that the majority of information is set on this background and not on the man himself. It’s very clear where the eye was intended to go — on a man with outlines of missing organs. It provides a gentle introduction to the barrage of information.

Screen Shot 2015-09-09 at 5.52.45 PM



PComp-1: What is interaction?

A visual definition of interactive technology (gifbay.com)

Interaction is an action, processed, that elicits an appropriate response. Repeat.

Where I get a little lost is wether said action can and should be bi-directional. Chris Crawford is certainly of the mindset that a conversation is a two-way street, but many of our interactive technologies are reliant solely on input from the user. An interactive website may be able to “converse” with the user based on user choices, but an interactive projection only responds to user action — it never acts on or initiates conversation with the user.

I do like Chris Crawford’s gradient scale of interactivity (from low to high), but maybe this categorization is just a temporary necessity on our way to interaction at its highest, purest form. That is, if we are using the model of human conversation as the holy grail of interactivity.

And human conversation is a very interactive process, but is it the best measure? We can make audible our thoughts, as well as include subtle physical gestures with our body. Smell may very well mediate an interaction, however subtly or disturbingly, and depending on the type of interaction, touch may be involved. Our only lacking sense during a conversation is taste. Except for that one time.

So it is true that that this type of interaction calls on most of our senses which are the primary ways we interact with our entire world.

Bret Victor points to the lack of sense-use in our current modes of interactive technology. He speaks most directly about our sense of touch and the use of body movement, but the point is the same: our current technologies employ fairly simplistic modes of interaction.

And not just our current technologies, but our vision of future technologies. There is nothing more humorous to me than looking back on our expectations of the future. Most of the time, we are wildly incorrect. It is genuinely difficult to imagine a thing or an idea or a technology that does not exist, so we often just expound upon known ideas, which in this case, is touching a screen. In the future, apparently, we will touch ALL the screens! Or we will touch just slightly above or to the right of the screen*, but Victor’s point is the same. And completely valid.

I’m not sure there is complete agreement on what constitutes a great piece of technology, but I would have to believe that ‘being intuitive’ must be amongst the most highly desired qualities. If that is true, there is nothing more intuitive to human beings than proprioception, understanding how to move and use our bodies in space. It only makes sense that designing interactive technologies that take advantage of this intuitive sense would move toward a more seamless interaction between man and machine.

*The following video depicts a newly designed watch that allows you to control the screen via a virtual knob mere inches from where an actual knob would be, but with the added benefit of not needing to touch a damn thing. It’s interesting to me, because it does make use of finer motor functions than simply pointing a finger, but it still fails to shift any interaction paradigms – we are still turning a dial to change a digital interface. I am in awe of the ability to build such a thing, but I honestly don’t think I would have use for it. I like manipulating an object. My brain likes when I manipulate objects.

ICM-1: Impressed

This week I’ve learned that when you set out to create Dracula, even with the clearest of visions, sometimes you create Frankenstein.


And that’s ok, particularly when you’re creating said monster in an unknown lab and you’re essentially hacking away in the dark.

But I’m being dramatic. I have had some experience with code and have dabbled in processing, but it’s one thing to read and it’s another to do. My drawing is relatively simple, but I enjoyed tinkering with all the iterations of the figures I had already drawn – many of my questions were answered as I went along this way. I wanted to be quite familiar with the basic building blocks of p5.js and the grid system itself. For me, the most difficult part was figuring out the first coordinate of the shape I was trying to draw. From that point, it was relatively quick and easy to derive the the rest of the dimensions and coordinates. I do wish the shapes had some consistency with regarding to starting point (corner vs center).

Sample code
Sample code

A couple of things re writing the code — It quickly became apparent how necessary it was to organize the drawing with categories and looking back now, I realize my lines are lacking an ‘;’ at the end, but they still seemed to work in the editor.

I really enjoyed the process and though I didn’t spend an inordinate amount of time on this first drawing, I can see how quickly a simple drawing can turn into hours of obsession.

Color me impressed.

The final monster mash can be seen in all its glory here: http://www.blondishmoment.com/icm/DanaDraws1/