Generative Posters 

All course code is here and here.

For my final project I wanted to come out feeling extremely confident in typography and colour generation that could be used in a practical context. A significant portion of generative work that I’ve seen often creates interesting art while playing with type, but rarely have I seen it to create actual communication pieces. When I was first introduced to generative art and design, my peers and I felt a bit nervous. We were apprehensive and felt that some were saying that code could replace our jobs as designers. However, through this final project I finally understood how creating work with generative typography is no different than using tools that that are so familiar to designers, such as the Adobe suite.
My favourite project of the semester had been the book project because I was given new tools to explore a different way of thinking about type manipulation. Being able to easily create image and pattern through type is a powerful skill for a communication designer and I now feel more prepared to create pieces in the future that contain greater visual complexity and depth. As reflected in my personal work, I am very fond of repetition and intricate pattern details. Through the book project, and this final project, I feel that I can now effortlessly create patterns and length repetitions, that would normally take hours by hand. I also feel comfortable writing multiple programs to create richer work, which allows me to understand how to use the strengths of each language.

(Above) Some of Yuan Guo’s poster work that inspired me.

When I began this project I looked to the work of two other designers for inspiration for where to start and what type of goals to set for myself. The first designer I looked to was Yuan Guo who is very talented when it comes to colour and form relationships. His poster work was a great source for inspiration, and I began to wonder which elements from his work I could recreate with code. The first element I was interested in was his effective use of fluorescent colours and neon gradients. That became the first goal of my project, to create generative neon gradients that would translate well from screen to print. The second goal I had set for myself was to create my own style of glitching. I’ve seen this design trend overused and misused very often, but I still think it can be a tasteful way to create texture if used effectively. In think in Guo’s glitch art calendar, I think he has over used the effect, as many designers and artists do, to the point where some pieces are illegible.  In terms of creating my own glitching I first attempted to use pixel manipulation, but then discovered that I would not be able to export my work as a PDF, which is vector based. I ended up creating fake “vector pixels” (single points) as pixels instead. I selected portions of the gradients and replaced rows of “pixels” with the colour of a pixel in close proximity. I think this created a subtle texture rather than the jarring distortion that is commonly seen in glitch art.

In addition to Guo, I looked to my professor Kyuha (Q) Shim for typography inspiration. Q’s site Code and Type was a good source to look to for examples for coded type that plays with form. However, Q’s work was node based which I am unfamiliar with. Using Processing I first attempted to write type on complex wave paths, then tried to manipulate the type the same way I did with the glitching, by manipulating the pixels. Later Golan introduced me to Geomerative, which made typography manipulation effortless. I was then able to create subtle generative titles that mimicked the style of the glitch art.

(Above) Some of Q’s coded typography play that inspired me.

After creating the backgrounds, which contained the gradients, the glitch texture, and the title, I used Illustrator to convert the PDF’s to TIF’s that were the appropriate size for my InDesign file. I was then able to use basil to create the growing 60-212 title, as well as the “matrix” type treatment in the background. The “matrix” pattern uses the text from the course description paragraph, then splits the page into a grid of text boxes, large enough for only one character. It then places one character from the paragraph into each text box, then arbitrarily shifts the baseline between a given scale.

(Above)The wall behind my desk in my studio, showing the three generative posters with other work, including a page from the generative book, and a print from Brandon Ngai. Using an inkjet Epson p800 project effective for printing, as the colours turned out pleasantly neon, without being too harsh.


Final Project Proposal
Exploring the Limitations and Affordances of Digital and Physical Environments  

The book project was, with out a doubt, my favourite project of the semester, and the animation project, is the one one that I would most like to revisit. I think this final project would be an excellent opportunity to create a generative book that has a digital, animation twin. I have a great appreciation for environments design, even though I have chosen the communication design path. I believe I have an opportunity here to study the affordances and limitations of the physical and digital interpretations of a single design.

In my animation, I used a sine wave for the motion of my letters. The motion was really pleasing, and gave character to the type. In my book, I used basil.js to change the offset and type size of repetitive text, some of them sinusoidally, and some of them linearly. The book had the affordance of hidden images due to the physical french folds. I would like to do some more explorations on the translations of motion and typography.


A compilation of some of our experimenting throughout the week. This includes playing with the sequencer, place two oscillators one after another, and also our generative melodies.


This is the view from Audition, from when we were mixing our soundcloud track together.

15139327_10211257399539860_552601983_n This is the visualizer that we used to help our debugging process. The top bar being the melody, and the bottom being the base line.

Here are some of the little bit arrangements we used.



This is our computer which is connected to the mp3 piece. The music is then manipulated through a filter and a delay, then played out the speaker which is connect to a splitter. One branch of the splitter goes to the headphones, and the other to the microphone, which is also attached to the computer. The tracks were first recorded with Audacity, then mixed with Audition. fullsizerender-1

Little Bits pieces

  • power
  • oscillator
  • mp3 out
  • midi in/out
  • synth speaker
  • filter
  • delay
  • envelope
  • keyboard
  • pulse
  • noise
  • sequencer

Initial Concept
We both immediately got excited over the Korg synth Little Bits pieces, and knew that we wanted to see how far we could push the affordances of the hardware. At the beginning we thought of only creating music collaboratively, one on the keyboard piece, and one manipulating the sound through playing with cutoffs, feedback loops, and attacks/delays. Our first instinct was to work with Makey Makey to use IFTTT. The general idea was to have a jamsesh and when we fell into a rhythm that we liked, we would hit the Makey Makey to begin recording, then hit it again to stop recording and to upload the track to Soundcloud. However, after some investigation, we realized the limitations of IFTTT and that we would rather spend time trying to learn new ways to create music, rather than to dwell over uploading issues.

2nd Iteration
Deciding to focus on the music, we discovered the mp3 Little Bits piece. This piece allowed create music through p5js, which we could then modify and manipulate the way we had been for the music generated with the Little Bits pieces. Our concept was that we could have a stream of melodies being generated through our program, and we could have a collaborative jamsesh between the coded music, and our own improvisations on the little bits pieces. After some brainstorming, we came up with an idea to translate strings, possibly scraped from places like Twitter or NYTimes, into melodies, but in a very meta way. The program would translate any letter from A-G into their corresponding note, if the character was not one of those letters, it would simply hold the previous note, or rest. If given a string such as “a ce melody“, our program would translate it into AAAACEEEEEEDD. This required us to also to lean about the p5 sound library, and also create our own scale using an array of midi numbers.

We wanted our music to have some depth so we figured we could also generate a baseline. If we were using the content of the article or the tweet as the melody, then the username or author’s name could be used for the baseline. This was when we had the pleasure of learning about Euclidean rhythms (Godfried Toussaint). Given two numbers, the algorithm can create a beat made by evenly distributing the smaller number into the larger number. Some of these patterns can be found in traditional music, such as E(3,8). “In Cuba it goes by the name of the tresillo and in the USA is often called the Habanera rhythm” [Toussaint]. We would then use the mp3 Little Bit to bring in the melody, and use the midi Little Bit for the baseline, which would enable us to manipulate the two pieces differently.


Unfortunately, because the melody was following patterns within the string, it wasn’t really following any rhythmic time at all. This made it difficult to align it to any baseline. Though we thoroughly enjoyed coding and learning about euclidean rhythms, we ended up not using this algorithm.

3rd Iteration
Once we had finalized our melody code, we began to set up all of our pieces. We connected Krawleb’s computer with an aux cord to the mp3 little bits piece, to play our coded melodies into the little bit. We then attached a filter and a delay to the mp3 and connect them to the speaker. We used a splitter connected to the speaker, with one branch connected to a microphone that recorded into Antar’s computer, and the other branch connected to headphones. We were really excited to start manipulating the melodies and adding in our own improvised music, but we quickly discovered the limitations of the Little Bits. Unfortunately, the audio would have these sharp clips, that sounded like the speaker was blowing out. At first we thought one of the bits was broken, but after testing each piece individually, we realized that it was not a single piece that was causing this, but rather the quantity. When we added a 10th piece to our path, no matter which piece it was, we would have this error. Unfortunately to be able to do any sort of collaboration with our generative melody, we would need to have at least 10 pieces connected. We decided to then simply record our manipulated melody, then, separately, record us creating our own music.

Through the project we felt some other limitations of the Little Bits, such as overheating, weak power, sound compression, and a fatality (a delay blew out). We spent a ton of time making really interesting music, but failed to record most of it. In retrospect, we should have began recording earlier, and much more frequently, so as to have a larger library to mix with. We should have also incorporated a simple networked component.


I was first exposed to Hiroshi Ishii’s work last year thanks to Austin Lee, my studio professor at the time. As a professor for the environments track for the school of design, Austin showed us Hiroshi’s work as a way to help communicate what environments design means. His work helps create harmony between digital and physical interactions and environments.

Being able to see and meet Hiroshi Ishii after studying his work was a wonderful experience. After discovering his passionate, inspirational, and whimsical attitude towards education and design, his work brought on a new life. Hearing him speak helped me not only understand his work better, but also to look at new technology, art and design differently. I think we are often caught up in the technical power of a piece that we often dismiss work as a tech demo rather than a simple art piece.  For instance, with his Levitation piece, when I first saw it a year ago, I was in awe of the technology, but now after hearing Hiroshi talk, I see it in a new light. His work gives off the impression that it is magic, and I think this shows that we often take technology for granted.

Perhaps what resonated with me the most during his talk was when he argued about the boundaries between art, design, philosophy, and computer science. He told us not to label these disciplines, or ourselves, because labels tell the world what you are not, just as much as they say what you are. These fields live together and survive because of one another. I enjoyed how he used verbs to identify when to optimize each field: Envision (art and philosophy), embody (design and technology), and inspire (art and aesthetics).

Additionally, I really appreciated his comments on friendship and collaboration. I think that this is one of the greatest skills I have acquired from the school of design. My closest friends are the one who critique the hardest, push me the furthest, and challenge me the most. I also respect that even as successful as he is, he is still humble and takes a significant amount of time to recognize those who have helped him along the way. As the world, particularly in America at the moment, feels more divided than ever, I appreciate that Hiroshii emphasizes the importance of friendship and collaboration.


Of course the Critical Engineer manifesto starts counting at 0.

As a whole I think the manifesto is very similar to the unspoken oath we take as designers. We look to other disciplines and fields to learn and re-apply their methods. At CMU it is mandatory for all designers to take classes such as Intro to Psychology, Systems, Cultures, and Futures. We are constantly taught to think about how design works with the user, the people included in the production of the design, and the society and culture it will live in. We are taught to think of unintended uses and unpredicted malicious affordances. We are always looking past the shiny and pretty, and looking for true innovation and disruption. I think I really resonated withe piece and that with a bit of change in language, it could easily be the designer’s manifesto. I guess this piece really showed the that critical and engineer and the conscious designer are sisters in a sense.

The only piece that I felt a bit of confusion and that I needed to delve further into was the last. 10. The Critical Engineer considers the exploit to be the most desirable form of exposure.

After struggling to get past the word exploit, I looked it up to be sure I was interpreting it correctly.

  1. a bold or daring feat: the most heroic and secretive exploits of the war.
  2. a software tool designed to take advantage of a flaw in a computer system, typically for malicious purposes such as installing malware: if someone you don’t know tweets you a link, it’s either spam, an exploit, or probably both.

I just think that the two definitions give different, but equally interesting meanings to the final piece of the manifesto. The critical engineer finds that the greatest achievement or challenge is the most preferred way of being viewed. It could also be interpreted as the critical engineer the flaw or the bug the best way to objectively see the system. Is it our greatest flaw or our greatest achievement that will show off our truest self?

After showing the manifesto with my peer, an electrical computer engineer major, I asked for his opinion. He thought the piece was elegant and incredibly accurate, and mentioned that he thought that all engineers should be required to read it. I asked which was his favourite, and he too picked the 10th tenant. He provided an alternative, and probably more accurate, interpretation. He explained that getting hacked would be the greatest form of flattery. If your work is getting hacked then it suggests that the work is big enough or important enough for someone else to spend time trying to break it. In essence, the engineer believes that if their work is being exploited, this means their work is good enough to be worth trying to exploit.





I first looked at the data of healthyridespgh but wasn’t really interesting in other people’s biking habits. The only thing that did intrigue me was that I had all this information about street names, and I began to get curious abut that data. If you look at a city like NYC, which is mostly streets and avenues, its data would appear very different from a city like Pittsburgh. I then decided to swap out the healthyridepgh data for the actual list of every street in Pittsburgh. With over 7000 streets, I was able to sort the data into this d3 graph.


  1. Copy all the street names from this list into a txt file
    1. pittsburgh.txt
  2. Create a python file to convert the txt to a csv
    2. pittsburgh.csv
  3. Create a python file that has a dictionary of all possible street types, then sorts through the csv and counts how many of each type there are, then sort through the dictionary and determine the corresponding percentage value for each street type, then export the dictionary with percentage values as a JSON file
    2. pittsburghData.json
  4. Substitute a bar graph block with my json data
    1. index.html

The most beautiful bar graph I’ve ever made. I say this because I spent a very, very long time trying to make this force cluster visualization work. I thought I had lowered my bar enough in terms of what I was asking of from d3. Currently the colour category of the clusters are evenly distributed. After attempting to understand d3 enough to just change even distribution to uneven distribution. screen-shot-2016-11-04-at-9-21-10-am




Chris Harrison

Bible Cross-References & Biblical Social Network (People and Places)

This week I looked at the work of Chris Harrison, a CMU professor for Human-Computer Interactions. I took one of his intro classes last semester and really enjoyed learning more about the history of computer science and how both hardware and software have evolved. While I’ve always understood him to be an impressive researcher and a highly regarded computer science professor, I never knew that he worked in art and design. Of his work, I was particularly intrigued by his work with the Bible. Once I began to look into this piece, I began to understand the dimensionality of professor Harrison.

Created in collaboration with Christoph Römhild, a Lutheran Pastor, the work illustrates the range and complexity of the connected network of information in the Bible. The first piece shows a rainbow of connected verses, where the colour of the arc is determined by the distance between the two chapters. With 63,779 cross reference, the piece is fairly illegible, but communicated the detail of the Bible superbly. I admire Harrison and Römhild for taking the artistic and aesthetic route to data visualization rather than the practical. While religion, and specifically Christianity and the Bible have lead art through the centuries, I think that this piece creates an interesting tensions where the beauty has to due purely with the quantity of the information, and has little religious connotations. While the western christian idealism has been brainwashing the art world for centuries, it has begun to reach the point of being boring and overdone. Yet this work is a refreshing reminder that the Bible can be appreciated for its power, even if you don’t agree with its message or its messengers.

The second piece, Biblical Social Network (People and Places) is equally fascinating and impressive. The graph contains over 10,000 connections and handles the quantity elegantly with the appropriate line weight and opacity. This piece offers for more legibility than the last and can be served to some degree as an information tool. However, the usability is still limited, with only about a couple dozen names legible without zooming in. I think the most interesting part of this was the fact that “Jesus” was so small. While I was surprised at first that “Israel” was the largest, it is perfectly logical.  I also enjoyed the play in figure and ground based on the font/background colour. There’s a luminosity to the information web that taps a bit more into the religious/christian aesthetic.

I think there’s also a quiet elegance to this work that is seen anytime technology is used to create religious art. I believe there’s something interesting to be said about humanity after the fact that we can take this book that is thousands of years old, and translate it in our modern ways to be completely reinterpreted. Even more, this reinterpretation repurposes the Bible from being used as a preaching tool of conversion, to a display of a vast quantity of information. It allows for a new appreciation of just how big the Big Book is. Since the work is largely artistic rather than practical, it doesn’t seek to even inform the reader of the information in the Bible. It simply displays the levels of vastness, complexity and detail for what they are.




  • A French fold book with typography wallpapers, with 70’s porn between the pages
  • The content is from a random selection of the 100 most recent tweets that contained the phrase “okay babe”
  • The tweets were then cleaned up to only contain the text that was proper English. I also took out the URLs, @mentions, acronyms, sounds and also the phrase “okay babe” itself.
  • Each page contains one of the cleaned tweets, rendered with a basil.js script
  • There were three scripts:
    • Growth: each character of the tweet grows in point size linearly
    • Sine: each character of the tweet grows in point size sinusoidally
    • DoubleSine: the same as sine, but additionally the baseline shift of each character grows sinusoidally
  • Scanned pages from Playboy’s March 1970 issue are the inside page images

Here’s a video of Professor Levin flipping through my OKAY BABE book:

I have been taking this class as an opportunity to explore my own style and creative voice, and this project was a particularly fun way to do some discovering. At the beginning of sophomore year, I conceived the phrase OKAY BABE, and it has since made appearances in my work, and has also become my signature on my Instagram. I use OKAY BABE as a filler text, it’s my lorum ipsum, that can carry very different typographic voices depending on the visual context that it is in.

I wanted to use this project to see how other people use “okay babe”, and what voices they are using.  I also wanted to have a very type heavy book and explore the power of basil.js. I first thought of going to NPR or NYT to search for articles that contained “okay babe”. This was, probably obviously, pretty unsuccessful. The phrase is so casual and colloquial that it wasn’t really used in more formal conversations that happen during NPR stations or articles in the Times. This is when I decided to turn to twitter, where I had a new, opposite, challenge. The language of twitter can be so causal that some tweets only contained phrases like, “@Tayatyy hahahahah yaa wtvr okay babe!!!”. I still wanted my content to be sophisticated language, but said in a casual context.

As a communication designer I really felt in my realm here. I love book design and typography, and just learned how to bind books by hand. In terms of a visual context I wanted to use this program to make adjustments to type that wouldn’t be really possible by hand. A lot of my work plays with repetition and pattern, so I saw this as an opportunity to mix this with my love for type. However, pages of repetitive patterns are great, but they are repetitive. I wanted to incorporate images without obstructing the type patterns. After learning about book binding this semester in my communications studio, I thought that this project would be a great opportunity to use french fold perfect binding. This is where the outside edge of the pages are not cut, allowing the reader to peak in between two pages. This is where I thought that I could create a nice narrative for the book: While the pages look like repetitive (perhaps dull) wallpapers, between the pages (behind the walls), reveals risqué images. This allowed for the perfect opportunity to borrow my friend’s vintage 1970’s March issue of Playboy magazine. In the 70’s the pornography industry was significantly more conservative than it is now. The girls are almost never completely nude, and most of the time they are fairly covered.

screen-shot-2016-10-31-at-12-47-14-pmscreen-shot-2016-10-31-at-12-47-43-pmscreen-shot-2016-10-31-at-12-49-36-pmscreen-shot-2016-10-31-at-12-50-04-pmscreen-shot-2016-10-31-at-12-50-44-pmscreen-shot-2016-10-31-at-12-50-54-pmscreen-shot-2016-10-31-at-12-51-02-pmscreen-shot-2016-10-31-at-12-45-00-pmscreen-shot-2016-10-31-at-12-45-14-pm screen-shot-2016-10-31-at-12-45-37-pm

screen-shot-2016-10-31-at-12-41-59-pm screen-shot-2016-10-31-at-12-42-18-pm screen-shot-2016-10-31-at-12-42-26-pm screen-shot-2016-10-31-at-12-42-37-pm screen-shot-2016-10-31-at-12-43-37-pm




Creator: Derek Arnold. More info: Medium.

When working on a content-generating bot, there is a point where what you intend for the project to be gives way to what the art wants to be.

Runner Ups for this assignment:

  1. @GIFsofWiki
  2. @pomological
  3. @dronesweetie
  4. @autocompletejok

After looking through many Twitter bots, I really thought this security camera one was the most fascinating. This bot will post random stills from a list of unsecured webcams. According to the Twitter profile, all images are CC0 licensed, and the Quartz article I read explains that the bot will not post photos from particularly invasive cameras, or will try to crop out anything that will show too much information.

I think a signifying detail of good generative art is that it surprises even the owner. Even when the piece is complete, it stays unfinished.

The artist uses the invasiveness of security cameras as the constant, every photo feels like you’re spying on a space, hidden from view—a voyeur. Once you overcome the sense of intrusion, you can focus on the majesty of being able able to see the candid day to day of an enormous array of unknown locations. Looking through these photos brought me back to a story I read last spring from The New Yorker. At the time I felt uncomfortable when reading the story of The Voyeur’s Motel, but after exploring Arnold’s work, I think I can understand it a bit better now. There’s something transfixing about being the fly on the wall, looking out from where no one suspects there to be eyes. Arnold’s piece allows one to have that experience without the guilt. However, in The Voyeur’s Motel, you can begin to understand the adrenalin of seeing what you shouldn’t and nearly being caught.

[@FFD8FFDB is an] attempt to profit on the curiosities of casual voyeurs, piquing the curiosity of people that normally wouldn’t be a peeping tom.

In terms of creating @FFD8FFDB Arnold explains that he pulls the stills from a smaller list of his known camera’s, excluding any that are private. He will crop, colour adjust, and use Wordnik to caption the tweets with characters and graphics (just for effect).

This bot–rather, piece, social statement, expression, exploration, study– really struck me. It was the only one that really felt like the creator was trying to share something meaningful through social media and a programmed bot. I haven’t used Twitter in years but I think I may come back to this one every now and again, if not simply just to use the photos in projects.

screen-shot-2016-10-15-at-1-02-09-pm screen-shot-2016-10-15-at-1-01-25-pm screen-shot-2016-10-15-at-1-01-16-pm


The Avocado Experience


During the Weird Reality show, I had the great pleasure to work the untitled avocado virtual reality experience by Scott Andrew and the Institute for New Feeling. During my five hour shift I got to explore the piece fairly deeply, and had the great opportunity of seeing how so many people interpreted and reacted to the work differently.

The experience began in a warehouse with a few bins of interested objects around the perimeter. If the user picked up an object, it would likely say that the object was out of stock. However, if the user picked up an avocado, the user was transported to a fantasy world. In this world the used embarked on a truck journey, one which the user was much more limited in movement, and if the user let go of the avocado, they would be brought back to the warehouse. Each time the user returned to the fantasy world they were brought back to the beginning of the truck journey. Through out the journey, the user was able to tap on an “add to cart” button with their available hand. While the user had no visual response whether or not they had successfully added the avocado to cart, in the browser on the computer it was possible to see the number of avocados in the cart. After the experience is over, the user was able to purchase the avocados on Amazon. When on the truck journey, the user was driving around a long curve through an avocado farm, and could see Aztec pyramids in the horizon. When driving through the farm, there were billboards throughout with statements about drought, or photos of models. After the user reached the end of the curve, they were able to see the destination of the truck. This destination was a large house with the fourth wall missing, allowing the truck to drive right into the living room. There was a TV on the far wall, with a sports game playing. On either side of the TV was a portrait of Vladimir Putin, and a portrait of a german shepherd. Once at the house the user was able to hear George Bush Jr. and his wife speaking. Once the user had been in the house for a moment, they were transported back to the warehouse.

For some users, the truck journey was long and a bit of a let down. After being transported back to the warehouse, they would take off the Vive and ask, “That’s it?”, while others would laugh in delight. Some users never got to the house because they were having too much fun picking up, throwing, juggling and playing with the avocados. Others, however, rarely picked up an avocado, and enjoyed the challenge of trying to grab things that were out of reach or inaccessible.

At the end of the night (2am), I was able to fully explore the experience for myself, and I took the luxury to read the rather long artist statement that existed above the avocado bin in the virtual warehouse. This is where I got the chance to learn fascinating information such as, “Avocado” is from Nahuatl word “ahuacatl”, which means “testicle”, which helped make the fruit sound more exotic than its original name “Alligator-Pear”. The statement followed the fruit’s rise to popularity through the late 20th century. A lot of people put a lot of time and money in to advertising and branding the avocado. The fruit was supposed to be a symbol for the California dream – the fruit of the healthy and happy. While on the truck journey, the user sees all the billboards that explain key moments in the history of the fruit, including a promotion which included winning a “Mrs Ripe” contest to be on Baywatch. It also included the Tom Selleck scandal. The Bush’s voices are present due to the choking incident in 2002. In essence this long and anticlimactic ride on a truck is a representation of the capitalistic efforts to bring rise to a fruit named after male gentiles.


Happy Orbs


The goal for this week was to become familiar with FaceOSC, but also using P3D. In particular I wanted to learn more about lighting and camera angles. I wanted to have a simple but delightful interaction with some floating orbs that would respond to your face and your energy.

Read the code here.

In terms of what the orbs are responding to and how they are responding, there are a few different criteria.

  • The close you are to the camera, the more red the orbs glow
  • The further away you are, the more blue the orbs glow
    • Based on how far your left temple is from your right
  • The orbs bounce more excitedly the bigger you smile
    • Based on the distance from the left corner of your mouth to the right
  • The close your chin is to your chest, the smaller the orbs
    • Based on the distance from your nose to your chin
  • The camera will follow your nose
    • Based on your nose x,y coordinates

Keep your head high, smile, look straight, and stay close and engaged. The following will result in excited, large, red, orbs.

closered farblue


Hairy Beans


Some initial doodles and process by hand

This week was all about learning about bezier curves, creating classes properly in Processing, understanding push/pop matrices, and how on earth do you make hairy beans drawn by a plotter look like they were drawn by hand. While needed a fairly heavy amount of help, I’m very pleased with the outcome of these beans. The greatest challenge was by far trying to achieve an organic, bean shape. A realization I had was how the easiest thing for a human to make, was the hardest for the computer, as well as vice versa. It’s very hard for a human to freehand a perfect circle, but takes no time at all to make a asymmetricimg_1869 blob with random short lines in all directions. However, in code it takes one line to draw a perfect circle, and it takes much more math and logic to create the organic blobs and the appropriate amount of hairs.

The biggest goal for this week was to create a generative art piece that would be nearly impossible to determine that a machine had drawn. Throughout this semester I want to make my digital art feel as close to my personal illustration style. These hairy beans were a great step in that direction. The organic blobs and small hairs came out just how I wanted them to and I’m quite pleased with the final plot. Using the acrylic paint markers on the translucent vellum paper gave a great dimension to the piece. I also enjoyed playing with line weight, colour, and materials, and how these could really transform the plotted piece from the generated pdf.



PDF of what the plotter traces




Placing the vellum on top of different surfaces

img_1865 img_1851

Plotting in the process

Code for work



Memo Akten

After briefly discussing Memo Akten’s work in class, I was immediately hooked on his work Forms he created in collaboration with Quayola. I was astonished by the elegant representation of the movement of athletes performing their art. I believe I’m also particularly fond of this work having been a semi-pro athlete myself. There had always been conflict for me, seeing as most artists aren’t usually athletic, and most athletes I’ve met aren’t often artistic. Additionally, rugby in particular is not seen as an artistic sport, the way that gymnastics, figure skating, or equestrian could be. However, I’ve always thought there was something beautiful about athletes that required intense power for their sport. As ad viewer, one often only sees aggression and brute force when watching a rugby game. That force and power comes from hours of delicate and well refined practice, making sure ever muscle is pulled and pushed exactly correctly, making sure every movement is agile and precise. I think that Akten’s work in Forms illustrates this perfectly.

“…it explores techniques of extrapolation to sculpt abstract forms, visualizing unseen relationships – power, balance, grace and conflict..”

After watching Forms many times, I grew more curious of the process, and I was delighted to find that Akten had published a video on his process work. Each athlete clip has the screen divided into five sections, the top left being the original video of the athlete, the top right shows the completed generative pice, and three are the individual measurement components that make up the final piece. From what I can determine, the bottom middle section shows the points of the body and follows the athletes movements closely, the bottom right is similar, but it leaves a trail of where each point has been, leaving long trails of movement. The bottom left shows the forces from the body, as if the athlete were covered in paint or water, and droplets were flung by the movement. To create the final piece Akten takes these three interpretations of movement and visualizes each piece differently in a way that is aesthetically appropriate for the sport.


Akten is clearly passionate about representing the body, kinetic motion, and human skill and art, in unique visual experiences. While this is clear in his interpretation of athletes in Forms, he has also done many works with choreographers and dancers. One of his earlier works with dancers was back in 2009 when he created using Computer Vision and openframeworks, Reincarnation. In this mesmerizing work, a dancer’s movement is reimagined as flame and smoke. Only when the dancer slows down or pauses can you see the human form, other than that, the dancer is completely transformed into fire.




Béatrice Lartigue

Béatrice Lartigue is a designer and artist who works in the area of interactivity and the relationship between space and time. Her interest in this area stemmed from her childhood love of comic books, where she first began to draw the lines between how each panel was a visual representation of space and time.

She is also a member of Lab 212 collective, a group of friends who graduated from the School of Visual Art les Gobelins in Paris, and studied Interactive Design. The interdisciplinary art collective works on pushing the boundaries on what can be defined as a visualization in our daily lives.

I am attracted to Latrigue’s elegant interactions and sophisticated visualizations, especially in her work related to light and sound. Additionally, I believe her style of dark surroundings filled with crisp blue light is very similar to the aesthetic that I have been working towards for some time.

Lartigue is also passionate about the realtime visualization of sound and music. In her work Portée/ she worked with her colleagues from Lab 212 to create a minimalist music interaction. When the audience plucks a string, it plays the corresponding note on the connected piano. This work reminds me of previous project I’ve discovered this semester, particularly along the theme of the necessity of collaboration. Much like 21 Balançoires , while one could simply swing, or in the instance of Portée/, pluck, alone and create a beautiful note, the true magic occurs when many come together to participate. In order to create the art you need others around you. Whether they are strangers or friends is irrelevant, because in that moment you are all simply a note, coming together to create a melody.

I also adore her work as a VR art director in Notes on Blindness: Into Darkness. In this interpretation of the audio-diary cassettes of John Hull, the user can only see what the user can here. Nothing is visible until sound touches it, which is exactly how Hull describes the world around him. His description or rain is breathtaking, as he describes that only when it rains can he truly see an environment, rather than pieces, here and there. He wishes that it could rain indoors, so that he could see his home the way he can see trees, pavement, and gutters. In Latrigue’s work the user truly feels deep empathy for Hull, and his world that is entirely dependent on sound. After watching the original film Notes on Blindness, I felt that this interpretation fell short, and that the VR expression is much more elegant in its method of visualization and storytelling.

While reading All the Light we Cannot See by Anthony Doerr (read: my favourite book), I was completely invested in his description of how a little blind girl “saw” the world around her in the 1940’s. I feel that Doerr and Latrigue both do an exceptional job at describing a world for someone one had, but has now lost their vision. In Doerr’s work the girl’s story is told in parallel of that of a little boy’s (with normal vision). The two childrens’ paths cross very briefly, but they have a significant impact on each other. I think that the VR experience that Latrigue created would be a fascinating way to tell Doerr’s story, in particular I would be interested to see how the little boy’s world would differ from the girl’s, and what would happen when they meet.



The clock project was an excellent opportunity for me to both explore Perlin Noise and how to use it, as well to begin translating my personal style to my digital work. There were some aesthetics that we’re not where I wanted them to be, but I was aware that they needed fixing. For instance the jumping around of the branches every second–I realized too late in the game that my structure didn’t permit for that flexibility because of having to refresh the background.

I read the article that Tega Brain suggested and I thought it was fascinating. I’ve always been loosely interested in cryptography but never really took the time to read more about it (watching Morten Tyldum’s film adaptation of Andrew Hodges’ book, The Imitation Game is about the most learning I’ve done on the topic). In design we are taught that everything should have a meaning. Almost nothing should be placed, coloured, or used arbitrarily, and if it is, there should be a strong defense for it. However, I’ve never enforced this mentality on my illustrations, since their sole purposed has always been personal amusement. After reading the article Tega suggested, “How to Make Anything Signify Anything”, it made me rethink my illustrations. To almost anyone, my illustrations could continue to looks simply like illustrations, but if I were to apply Bacon’s cipher system to my illustrations, it would force me to think more critically about placement, and pattern. I enjoy mixing type and illustration together anyway, so this could really add a new depth to my work. Thank you Tega Brain for opening my eyes to different methods of applying meaning to my work!

It was very encouraging to read Laurent McCarthy’s feedback! I completely agree that I could work on more technically simple but aesthetically sophisticated work. I think taking a more “slow but steady” approach to the technical work will be more beneficial for me in the long run. I think it will also help me to think more creatively, therefor my work will really help me push my creative skills while also learning some interesting coding techniques that I can handle.

All of my peers said generally the same things:

  • The current aesthetic is good but it would be great if I could realize my illustration aesthetic
  • The animation is too jarring and the piece would be significantly stronger if there were smoother transitions.

I completely agree with my peers and I think I would like to eventually get my skills up to point were I can achieve these goals. In fact, I think my skills have already improved quite a bit since I coded the clock, and could probably get the animation to be smother, but I would have to continue to work to get the aesthetic style there. I think it would be interesting for my capstone project to include Tega’s reference to Bacon’s cipher system, my illustration aesthetic, and sophisticated animation.


img_0005A vine hangs from above. On the vine small branches dance along it. Each branch grows cherry blossoms.

There is one vine per hour (12 hour system), one branch on each vine for each minute, and one blossom on each branch for each second. The branches change position every second, and their colour loosely changes with time.

In the sketch I’ve illustrated the time 4:08:12 – 4 plants, each plant has 8 leaves, each leaf has 12 veins.

My clock is a bit of a literal interpretation that it takes time to grow. As time passes more vines grow, more branches reach out and more blossoms bloom. The motion isn’t as fluid as I would have liked it to be but I definitely learnt a lot about perlin noise and how to integrate time into my code. In retrospect making three nested for loops was probably a poor choice. As I learn more about P5 I might come back to this project and try and get it to feel more like my personal illustration style. As youimg_0006 can see, my sketch and my program look nothing alike, so it would be another goal as my coding skills improve to get my program up to my illustration. A personal goal for this semester is to develop a cohesive and strong personal aesthetic and style.



Cherry Blossom Clock


Symphonie Cinétique – The Poetry of Motion (2013), Joachim Sauter (ART+COM) X Ólafur Arnalds

Symphonie Cinétique is a collaborative piece created by Joachim Sauter and ART+COM, with Icelandic composer and pianist Ólafur Arnalds. The group of artists, designers, engineers and programmers that is Berlin’s ART+COM built five large responsive pieces to create a kinetic composition that translates music into mechanical motion.  It took this large interdisciplinary team over five years to create the pieces, which were exhibited at MADE in 2013.

This one one of the first pieces of responsive art that completely captured my interest and made me determined to learn how to create responsive and interactive work. Seeing the designers, and engineers work with the musician to create an instillation over five years is an inspirational moment for interdisciplinary collaboration. I always understood interaction to be “if I kick my work, it should kick me back”, but this piece helped me understand interaction is more than simply action and reaction. The musician and the pieces are creating poetry together, and while both are independently beautiful pieces of art, they create a surreal experience when in harmony.

From what I understand, almost everything ART+COM creates is in house, and for 20 years I believe they would be considered First Word art. Since 1995 ART+COM has been working to visualize concepts that are seem intangible. This is simply another iteration at an attempt to create a physical piece to visualize something we cannot see. While Arnalds has composed for many dances, which one could say the human visual interpretation of music, he has never been able to truly see his music. I imagine both Arnalds and Sauter were inspired by other interpretations of music visualizes and interactive mechanics.



Maria Scileppi

Maria Scillepi

Maria Scileppi is a the founder of the creative agency 72U, focussing primarily on the crossroads between creating narratives between art and technology. However, her true skill is in being comfortable with being uncomfortable. Scileppi is a fearless experimenter and thrives on multidisciplinary collaborations.

Maria attended The School of the Art Institute of Chicago, then went on to become an associate professor at Chicago Portfolio School, before venturing to Venice, California where she is now based.

Within listening to the first few minutes of Scileppi’s 2015 Eyeo presentation, I was completely hooked. She is a patient, ambitious, and exciting creative – a truly inspirational woman that I know I could learn a great deal from.

During this talk Scileppi I really tried to pay attention to her tone, and I noticed that she crafter her speech very effectively. Her overarching themes were collaboration and experimenting, and she tells the story of how these tools are incredibly powerful by telling smaller stories, similar to chapters. While listening to the talk, it’s clear that she is a seasoned story teller, even from the tone of her voice. She speaks slowly and always explains her vocabulary, even if it may seem self-explanatory.

Her stories about life at 72U shed light on the incredible benefits of working collaboratively, and what it takes to do so. She notes that it may not be applicable to every project or every person. It works best when there’s high emotional intelligence, and an openness to fail and learn. The idea of teamwork will make a lot of people cringe, but Scileppi beautifully explains how much potential there can be (and backs it up with a project about a chef and a sword-swallower).

“When you collaborate with another human, you extend your reach as a create. Because the first thing two collaborators make is this third space, and this third space is where the magic happens.”

She also discusses the idea of process and being human. In design, professors, clients, and recruiters are often far more interested in seeing the process than the final product. Were the creative decisions arbitrary or intentional? Was the road to this product bumpy or successful? What was the first idea and is any part of it in the final product? What did you learn about yourself and about your work? These are the types of questions that can be answered through reflection and process documentation.

“Since then a light went on inside of me. And I switched from being a maker focussed on an object or an end result, to a maker focused on the process of making, and I really like this space because it feels really human.”

Maria Scileppi is a creative that now has a permanent spot on my radar. I’ve already looked into the applications for spending 12 weeks at 72U. Being uncomfortable and vulnerable is hard to do in any circumstance, it can be even harder professionally. In your personal life, you’re putting yourself and your emotions on the line. In the professional world you’re putting not only your reputation, but also the time and money of others. Maria explains that so long as you can learn from your mistakes, grow as a creative, and continue to collaborate and experiment, then there’s nothing to fear.



  • Wolfgang Weingart
  • Vivienne Westwood
  • Saul Bass
  • Univers (typeface)
  • Coca Cola
  • Weiden + Kennedy (agency)

As a designer I have been taught that time is the greatest challenge to overcome. If your work can survive some, then you’ve succeeded. Carnegie Mellon is an exceptional place to learn design, where traditional design studios co-exist in an environment that thrives on experimentation and pushing the boundaries. To create long lasting work there has to be a solid foundation. Why are you producing this, and why does it matter? Who will it affect, and how will it affect them? These are the questions we should ask ourselves when trying to create more than simply “cool shit”.

While reading this article, I couldn’t help but think of my own list of subjects that I believe are both First Word and Last Word. I think these artists both helped define their area, and also set the bar that has stood the test of time. As mentioned in the article, working in the First Word helps provide learning and future artists with the tools to possibly become Last Word artists. New technologies also help improve the longevity of older technology. For instance, Netflix has helped television and film persevere, while also providing more freedom for producers. With less constraints producers have been given the chance to include more vulgar, uncomfortable and controversial content that have been used to create dialogues about society.

I also believe the culture of Gen Z has helped influence the direction of technology. I think the members of Gen Z tend to be impatient, self-motivated, and independent. It’s a culture that fuels First Word thinking by allowing the youth to break the grid and follow their own experimental path.