Tag Archives: conference project

System: Beyond 184

It’s all been leading up to this. Beyond 184

Let’s have a little urban fantasy. You’re on top of a skyscraper. You look down, and you see the neon world below. It’s beautiful, it’s alive.

And I wanted to capture that.

To build a living place, just pretty neon buildings alone are not enough. After all, the buildings are nothing without the inhabitants. And so, the streets are full of life. They are filled with traffic, with people going around their lives. An entire system that simulates a small world is behind each pair of these headlights.

City in action

When I first found out about this class and interviewed for it, one of the examples of what I considered “Art from Code” was a beautiful video by baku89 that utilized cellular automata. I found it so fascinating that a mathematical model made out of a grid of cells – all using pretty simple rules that determine if a cell will be “filled” or “empty” in the next generation – could produce something so beautiful.

All the pieces ended up falling together in a way that pushed me to explore cellular automata further: this class’ final prompt being “systems”, and the discrete mathematics’ class’ exploration of logic.

Game of Life As this class progressed, I found myself exploring and implementing cellular automata rules, and even creating a few of my own, such as this automata, which generates a city grid, similar to Piet Mondrian’s Broadway Woogie Boogie: Broadway Walkie Talkie So, for my conference projects – both for Art from Code and Discrete Mathematics – I chose to work with cellular automata. Familiar

Having finally returned to New York City after spending a lot time living in suburban hell, Manhattan was all that I had on my mind.

I thought back to other generative projects I’ve seen – and one in particular stood out. Called Pixel City, this screensaver generated an entire city, full of unique buildings and even street traffic. But the traffic wasn’t really “alive”. And I wanted to fix that.

Pixel City

I decided to base my project on a cellular automata called Rule 184, expanding upon it to create a more interesting traffic simulation in two dimensions (hence, I called it “Beyond 184″). The Rule 184 cellular automata simulates vehicles moving on a one-dimensional road with a very simple set of rules:

  • If a cell is occupied, and the next (right) cell is empty, the cell becomes empty
  • If a cell is empty, and the previous (left) cell is occupied, the cell becomes occupied
  • If a cell is occupied, and the next cell is occupied, the cell stays occupied
  • If a cell is empty, and the previous cell is empty, the cell stays empty

I expanded upon these rules, adding a “cooldown” – that is, the ability of cells to stay in place for one or two generations before moving. This gave me the ability to have a city with “cars” that can move at different speeds. Along with that, I made it so that cells with a lower cooldown will not be able to come to a full stop immediately – simulating how actual vehicles in the real world will have different braking distances depending on how fast they are moving.

I brought this rule to two dimensions by creating a “source-destination” structure, which allowed for moving 1-D traffic cellular automata to two dimensions with minimal modifications. With this structure, as applied to the Rule 184 above, a “road” cell’s “source” and “destination” values dictate what a cell considers its “previous” and “next” cell. By requiring the cells to be connected to one another (that is, a cell’s destination value should be equal to the next cell’s source value for the chain to be complete), I gained the ability to control traffic flow.

I added a unique type of road cell that is called an intersection. This cell, instead of using a single “source” and “destination” value, has two of each, and with every generation, determines which values should be used, with the underlying logic attempting to move traffic from busier roads to less busy roads – after all, throwing more cars at a traffic jam doesn’t help anybody.

You can find more detailed information on how this cellular automaton was created in the paper I wrote for my Discrete Mathematics class, which, along with the source code for the simulation, are available at the GitHub repository.

Beyond 184

Believe it or not, that grid filled with squares is the very same simulation you saw at the beginning.

Doesn’t look that great, huh. That’s because it needs a home. It needs to live inside of a city.

Time to put the “art” into “Art from Code”.

The city motif was present in my creations since the very first thing I made for the class:

Scrolling city I ended up taking a more minimal approach, and before I brought the city and the traffic model together, this is what I ended up with: 3D test Once I brought the two together, it wasn’t just city-inspired creations that helped me with the process. Little bits of everything I’ve learned this semester all came together to create my neon city. Self-portrait The alternating colors that I used were obtained using the same method I used to create the random files and folders that I used for a part of my self-portrait. Continuing experimentsThe random buildings and the way I ended up having them use different colors was born from an experiment for one of my other projects – one that didn’t even make it into the final project. Yuki machi

One of the wallpapers I’ve made before gave me the idea to reduce my buildings to glowing blocks of neon.

With all that, I eventually ended up with my final result. A living neon city.

As seen from above And I think it’s pretty nice.

System: The Eisenberg

Screen Shot 2017-12-14 at 12.38.50 PM

Final form of the system while the background is gray

I knew going into this project that I wanted to try and create a map of a social network, based on Nicholas Christakis’ Ted Talk entitled “The hidden influence of social networks.” I decided to have a set 12 circles representing people for my map and to show the connections between people I would have them be different colors and then the circles of the same color would be connected. After some consideration of using a RGB color wheel, I decided to use a traditional red-yellow-blue color wheel for my colors because it seemed more natural, and I thought a user would be able to see what was happening with the colors more easily.
Screen Shot 2017-12-11 at 8.42.58 PM

System with plain gray background and no lines connecting the people

The most difficult part of this project was to get the pressing of the “a” and “s” keys to complicate and simplify the system. I had to figure out how to get the colors to change at the press of the key while simultaneously having the previous circle not show up and the lines continue to change. I had difficulty having the circles change color randomly while also having the draw and undraw line functions work correctly in conjunction with the button press.
Screen Shot 2017-12-11 at 8.42.45 PM

System in its initial state with the connections of the lines

To simplify and complicate are the main two rules of the system, and they are also the ones that the user can interact with. The other rule is to connect, which is done through the lines that connect the people of the same colors in the system. This part of writing my system was easier than I anticipated because I formed a loop that would find the color of each circle and draw a line to all other circles of the same color. The removal of the lines with each complication and change of the system was slightly more complicated but I set the lines so that they were a much higher stroke weight and were the color of the background when performing the undraw function.
Error screen of the system

Error screen of the system

I based the decision of what colors to make the backgrounds based on the reading I did by Josef Albers about the relation of colors to each other. When colors are placed on top of one another they react in such a way where sometimes one color can take away from the other, making the other color look different than it should based on the actual color value. I chose to make the “error” screen the same red of the red from my list of colors. I refer to this as the “error” screen because when the system has that color for the background the system cannot be simplified anymore. All of the circles on the error screen are also red, directly showing that the group of people cannot be simplified any more because they are all represented by the same color. With the white pattern on top of the background color, I wanted to see how the colors of the people interacted with the color of the background when the white pattern was in between. For the “error” screen, the red circles seem to look darker than the background, and I think that the circles in contrast with the white lines cause this effect.
The system when the colors have reached their most complicated and the background is yellow

The system when the colors have reached their most complicated and the background is yellow

I had a similar thought process for choosing the yellow for the other background. I would normally never use the color yellow that I picked because it’s too bright for the type of color palette I prefer. I chose this because I thought it would perhaps make the somewhat more subdued colors of the people look even more soft and also perhaps darker. This worked out somewhat, although the colors with yellow tints became somewhat more difficult to see or tell the difference between. I think also the background yellow looks more green-tinted in relation with the colors of the people.                                                               Screen Shot 2017-12-14 at 12.38.25 PM Screen Shot 2017-12-14 at 12.38.40 PM
The final version of the system with the circles slightly different sizes based on their color, changing through the different iterations and changes of the system

The final version of the system with the circles slightly different sizes based on their color, changing through the different iterations and changes of the system

I really enjoyed doing this project because this idea of the human social network is one that I think about often and have thought about since I first watched this Ted Talk two years ago. I am really intrigued by the idea of the idea of being influenced by people who are far away from me in terms of social connections, plus I really like seeing human relationships mapped out. Independent of this project I have considered drawing the relationships in my house as a map multiple times this semester. Making this piece has really been wonderful and I really enjoyed seeing this concept I’ve thought so much about come to life. I’m planning on researching force directed graphs so that I can possibly continue to make other pieces like this that are more complicated in the future.  

System: Polygons and Colors


Final – a series of separately colored polygons rotating as two flow across the screen in the front. Name: Polygons and Colors.

For this project, I did something very new—maybe not at this point because it feels like I have been repeating that statement a lot in this course… but at the time it still felt new! I began working on the polygon starter file with no real linear ideas attached to it. The most stable ideas I had included two goals: make something that could resemble deep space, and experiment with color. I also wanted to work with the snowflake sketch.js, but I left that out because I thought the piece was going in another direction and I could not find a way to fit in that felt right.

Starter Colors

Starter Colors

Starter Colors

Starter Colors

Before starting with the code, I found the starter colors. I call them starter colors because I did not end up using any of them and knew very well that I would not toward the end. A majority of the code works around what colored polygons I wanted to emphasize over the others. In a sense, I tricked myself into thinking I had found my colors and worked from there. The colors I used were very similar to the abstract clock assignment’s colors in their saturation, which, looking at them both now, is surprising. Over this semester, coding has helped me play with color theory. Just like with coding as I explored it, I learned it. But before then I did not like bright and saturated colors. They can easily over-stimulate me due to my sensory integration disorder. But in my system piece, I think I found brightness levels I am comfortable with.  
Grid and Lines and Polygons 3

Grid and Lines and Polygons 3

Grid and Lines and Polygons 2

Grid and Lines and Polygons 2

Grid and Polygon and Lines

Grid and Polygon and Lines

Lines and Polygons

Lines and Polygons

When I started out, I played with semi-randomized lines in the front to add more of the dimension that I originally sought. I also played with a turquoise grid and kept the polygons small. But it was so separate that I felt it was missing the point of the assignment and thought I had coded myself into a corner. As I worked with them, the lines, grid, and circles grew apart into their singular characterizations. The randomized lines in the front never connected to the polygons in the back or added enough depth and, to my frustration, became more out of place after each session and seemed to be the only ones that were evolving. The code itself was also set up as very separate, and toward the end of the project, I felt I had coded and colored myself into a corner. How would I get them to work together as a functioning system?
Une retrospective

Une retrospective

At first, staring at Molnar’s Une retrospective for inspiration felt counter-productive. It was still separate! Looking at it now, I know that the more I worked, the more the colors began to expand and almost blend until it arrived at the final result. And I know now that Molnar’s painting isn’t actually that divided. Or, one doesn’t have to look at it that way. In each work, she uses the implication of movement. From Lettres da ma mere (Letters from my Mother) to the one I showed above her lines and shapes always suggest that a change is occurring. I already had the polygons spinning and wanted to keep that but then I began experimenting with making them move in another way as well. The spinning along felt monotonous. Adding a loop, I made two of the cut-off and off-center polygons rotate across the screen in a recurring wrap to make it a little less expected and languid. I also changed the direction of some of the polygons, the opacity and, of course, the size. I think the turning point was when I got rid of the lines. Once I did the subtle changes were highlighted more and made room for adding smaller and less translucent polygons in the back. To conclude, I think I accomplished a lot with this piece. The process felt natural and I think the spinning sequences and imperfect interactions help to make it more entertaining to a curious audience. The colors are vibrant (for me) but do not overpower it (or myself). And the movement remained odd yet weirdly calming.   Thank you for the opportunity. Izzy Singer

System: Germination

In one of my other classes this semester, I am working on an experiment involving seed germination. In this project, we took fungi found on Andropogon seeds and reintroduced that fungi to a different set of Andropogon seeds. The intention was to then measure the germination rate of these seeds in comparison to a control in an attempt to see if the mystery fungi were pathogenic. However, nothing in this process went correctly.
Every single one of the petri dishes we were experimenting on became contaminated, including the controls. While this had negative effects for our experiment as a whole, it did end up looking extremely interesting. Our experiment became largely more complicated than expected in terms of usable data, but much more interesting as a person interested in fungal and bacterial growth.
My original plan for this system was to try and replicate the original experiment, including the ten Andropogon seeds and the mystery fungus. I spent perhaps too long trying to set up an easy and clean system for setting up the seeds. However, I decided it got too visually complicated. I realized it would become very easily unclear exactly which seeds had germinated and which had not. So I instead opted to go for a single large seed in the center of the dish. This would make understanding the system more feasible. While making this choice made some visual issues easier, it did set me back quite a bit and made much of the work I had done useless.
Once the seeds had been taken care of, I then started work on the actual contaminants themselves.
First I wanted to go with the black dots that covered the plates and surrounded the seeds.
Then, I wanted to replicate the odd beige rings that were found around many of the seeds. The second photo is not the most successful at actually capturing how they looked, but I was looking to replicate a series of being rings that surrounded the seeds individually, in nearly the same shape as the seed itself, only larger. Finally, I wanted to find a way to recreate the look of the hyphae, a network of fungus that took root in the material we used to grow the seeds.
Right now, this is how my system looks. It is still a work in progress, held back slightly by the time spent on the initial, unused idea.
wip_petri0 (2)
From here, I need to instate the system by which the seed germinates or not. I also hope to add another contaminant in, one based on the black spheres that grew in the plates shown below. I also hope to add more detail to the seed itself.

System: RosieRose



When I first set out to code a system, I was lacking in inspiration. I knew I wanted to create something that I could have an emotional connection with, but I was uncertain that I would be able to code a system with a narrative. As I considered the possibilities, I begin playing around with Angela’s afc_25_system_01_05. I found the simplicity of the system approachable. I appreciated the ellipses and the subtle movements of the particles. As I became familiar with the code, I found myself considering systems in relation to the Internet. I considered Wi-Fi in general, and then I considered my own Wi-Fi, “RosieRose”. It became clear to me then, I would create a visual representation of a Wi-Fi I have carried with me from one apartment to the next.

Inspiration 01

My Wi-Fi, “RosieRose”, is named after my recently deceased, beloved family dog, Rosie.  My Wi-Fi, and Rosie Rose herself, inspired my system of the same name. Rosie passed away one year ago, but I like to think she lives on through the waves of my Wi-Fi. I connect with her on a daily basis, I share her with others. My RosieRose Wi-Fi is a space I have carved out for the dog I loved, so she could live on through the waves of the internet. I have created a visual representation of this space through my system. As I began to code my system, I knew I wanted to utilize a similar color scheme to the ones that I had been implementing in my pieces throughout the course of the semester. I like to experiment with different shades of pink to create a visually appealing atmosphere.  I utilized three different shades of pale to rouge pink in my system, in the effort to evoke the detail of a pink rose. After determining my color scheme, I did some research to figure out how to portray a rose through simple shapes. I decided on a circular pattern of overlapping ellipses.  I was satisfied with the design, as it would allow for further experimentation with color by utilizing different degrees of transparency.
Inspiration 02

Inspiration 02

Initial Color Scheme

Initial Color Scheme and layout

  As I continued with my code, Angela suggested a wrap function would be more effective than the bounce function I had been utilizing initially. Switching from the bounce function to the wrap function allowed for my representation of falling petals to come across more effectively to the viewer. Out of all of the elements in my system, I am most pleased with the visual of the falling petals. I carefully set their speed and position to encourage a sense of density in the space. I wanted the smaller petals to fall slowly, the bigger falling faster, to give the viewer a better understanding of the environment and the delicate nature of the rose.   Throughout my experience of coding this system I experimented with utilizing visuals and text to communicate the narrative to the viewer. I considered using Rosie’s face as the center of the rose, utilizing photoshop to create a useable outline. I also considered inserting the Wi-Fi’s name into the system, but I found both of these approaches would be too obvious.
Images and Text

Images and Text

After some experimentation, I decided to incorporate Rosie’s image into just one of the falling petals.   I placed Rosie’s face inside the smallest petal to create a delicate visual, evoking the meaning of the piece. As the last petal to fall out off screen, I found this emphasized the emotion I was trying to convey.   I continue to struggle with making the code interactive. I have been trying to achieve incorporating the KeyPressed function into the system so the viewer can interact with the code, encouraging the space to be more spontaneous. I have not yet been able to successfully incorporate the KeyPressed function; I hope to get some input from my peers so that I may include this function in my final product.   Overall, I am very happy with this piece.  I am most satisfied with the color scheme and the movement.  I was initially uncertain if I would be able to capture the emotion I feel towards this intangible environment through coding, but I feel like I have accomplished just that.  My hopes for the final product would be to take it a step further with the KeyPressed function, but if I were not able to implement that function into my code, I would still be very happy with what I have created. I found the experience of coding this system, in honor of Rosie, to be very emotional, as I was finally able to create a visual representation of the space I had initially created to keep her with me.  RosieRose is a piece I thoroughly enjoyed creating and am very happy to have had the chance to do so.



System: Four Parameters

Current Realized version of "Four Parameters"

Current Realized version of “Four Parameters”

My conference ecosystem, Four Parameters, is inspired by Frieder Nake’s Matrix Multiplication, a series of mathematical solutions represented as computer art. My conference originally began with thinking about evolutionary art as I attempted to replicate the movements of ants in an art farm, but I found myself more and more compelled to follow in the footsteps of Nake and other artists who take mathematics and analytical data and find ways to transform this information into visual art. What strikes me about Nake’s work is his use of color, his ability to collage rudimentary shapes into a greater mosaic artwork, and his ability to create patterns in a digital space that appear almost woven or as if they were created from a textile. For my conference, I tried to create an ecosystem that, after being refreshed, or after input from the user, would change color and dynamism while still maintaining a sense of evolutionary similarity with the artwork prior.

Frieder Nake "Untitled"

Frieder Nake “Untitled”

Four Parameters replication of Nake "Untitled"

Four Parameters replication of Nake “Untitled”

Nake’s work is deceivingly complex; I know this firsthand after trying to code my own Matrix. Nake’s work cares a great deal about space and composition, and so I had to reflect on those aspects as well. What I struggled with the most in my conference was manipulating the canvas and figuring out exactly where my shapes would be drawn. In my sketchpad I had an infinite amount of room to plan and layout my design, but once I started coding loops that would draw multiple shapes, the interactions of their x and y coordinates became hard to locate. That was also part of the fun, because sometimes my errors would lead me to very interesting mistakes.

Errors can certainly be a roadblock, but other times my errors provided me an insight and a deeper, more profound understanding of the artist’ design, and helped to propel me forward down a new path of inspiration. Still just a beginner to art and coding, I had some assumptions about how the code prioritizes the overlapping of calls to draw shapes and translate without the use of push and pop to separate design elements in an object. I had to reconsider the placement of objects and the very order and outline of my code itself. I saw quickly that the more organized my code was, I was able to maintain and keep sigh of my goals in the distance. When my code became longer and more syntactically complex I found myself overwhelmed by the code I had just sat down and written. I had to be extra thorough when re-reading and trying to find errors in my code that would break my art.

Error leads to interesting patterns and inspiration

Error leads to interesting patterns and inspiration

Additionally, while working on conference I came to understand that there were multiple ways and approaches to reach my desired goal. I often had moments where I recognized the opportunity to just hard code a parameter, or make changing a variable accessible by input in the function parameters (for ex: function(x_asis,y_axis)). There were many ways I could go about my code, and finding the most effiecient solution wasn’t always apparent on the surface. I certainly gained a better respect for Nake as a pioneer of computer art at the intersection of mathematics. It was illuminating to work in his footsteps, and to consider that every process in art is intentional and mathematically understandable, and vice versa there are moments of artistic beauty in math as well.

Changes in the ecosystem

Changes in the ecosystem

My first several iterations I just worked with turning the basic shapes in objects that would be able to experience other forms of transformation (rotation, translation, change in scale). Even in the overlapping and multilayered chaos of Nake’s works, his choice of shape and specifically the color palette he chooses also the viewer to still distinguish and recognize individual shapes. Lines couldn’t be drawn on one another completely blocking out the lines below; I had to really pay attention to the opacity, saturation, and depth of field I was creating with my shapes, even if I assigned some parameters to move randomly within a given boundary.

Next came rotations and finding ways to slightly alter my ecosystem every time the user refreshes. One of the other reasons I really like working with an evolutionary system in the vain of Nake’s work is the very subtle white and gray backgrounds he frames his works on top of. While someone else may say that Nake’s backgrounds don’t lend much to his artwork, I would disagree and say that all of Nake’s colors and even the materials he prints on adds to the collective composition. I love thinking about the modernity of Frieder’s cubic design and palette at a time of few graphic designers or artists, but how his design already prefigures and predated the waves of graphic design that will follow after him.

Next, I changed the color scheme from the original blue, yellow, and red to rotating between several different pallets on refresh. When creating this evolutionary system and thinking about Nake’s work, I always wonder how a change in color can completely transform a work’s tone and atmosphere. Nake’s Matrix Multiplication and many of his other untitled works have a very deliberate color composition, and I wanted to follow is his footsteps.

Slightly changing rotation to achieve a new template

Slightly changing rotation to achieve a new template

Again, I struggled the most with translating and moving around the canvas, but my inspiration still burns and I have several more things to add! With additional time, I hope too the ability to take in user commands with the mouseX and mouseY values to rotate individual squares on their axes. I also want to elaborate my pattern more and on refresh and new pattern should be generated. With certain keystrokes or presses the user should also be able to change the size of some of the squares on the canvas.

Overall I think my ecosystem needs some tuning up and optimization, but I am very enthusiastic with more attention I can make a very interesting ecosystem like Nake’s work that explores gradualism, pattern, collage, and color in a mathmatic vein.

System: Molnar Lines

For my conference project, I am further exploring the works of Vera Molnar. She was a pioneer in computer based artwork, having first started by using a plotter. A lot of her works represent or came out of gradualism – modifying the form of something known in very slow ways until it turns into something very unknown, and interesting. I was hooked by her works in which Vera helps a viewer imagine what a plausibly different shape could be. I also appreciated how Vera abstracts away from known legible features in our world (such as handwriting) and studies it with rigor in order to extract the most visually fundamental qualities to handwriting. This is well represented in her 1987 work, Lettres de Ma Mere:
Lettres de ma Merre (1987)

Lettres de ma Merre (1987)

The piece of hers that has been my greatest inspiration in my conference work is Interruptions (1968):
Interruptions (1968)

Interruptions (1968)

It was easy to get a straight forward replication of Molnar’s work, disregarding the empty patches in her composition. It looked something like:
an early verison of Interruptions, with some color.

an early version of Interruptions, with some color. an even earlier draft was monochrome: a simple off-white/grey background and black lines

The lines in the given picture are actually all rotating. After meeting with Angela for conference in which we talked about an earlier version of my conference work, I learned that Vera Molnar’s style of work involves thinking of a simple rule and formalizing it. Angela made some simple suggestions that should theoretically have some powerful effects for the system. Thus came my first ‘formalized’ rule: adding random length to lines if they were shorter than a certain length: adding length to certain lines The next few rules I added modified the rotation of the lines and also the color of the lines. It took me a while to figure out how to randomly assign color to each of the lines independently. While doing this, I certainly learned about the weird quirks of Processing as a library. Even though it intuitively makes sense to color a shape when you create it, you actually have to tell Processing what color to use for this shape every frame. Processing is kind of like an artist who only holds one pen, but draws very very quickly, so it needs to swap pens to draw each line, each time it draws that line. So to fix this, you instead tell the shape to remember what color it should be, and have it set the stroke() color (tell Processing what color pen to pick up) on each iteration of .display(). For the first several implementations of my sketch with the introduction of the new rules, I had coded something so that the color for all the lines was randomly assigned. It took me a while to figure out that I had to tell Processing to change colors in the .display() function of the Line object. Finally I had something that looked like this:
randomly colored individual lines

randomly colored individual lines

After learning this, I think color really went right in my system. I was able to then modify the color with more control. This also addressed one of Angela’s criticism about my rules when she saw my work in open-studio: my rules were looking too random. The point of gradualism is for the viewers to get some intuitive sense that a systematic rule is at place. I was finally starting to get systems that look more like:
more controlled color

more controlled color

The way color is implemented is very special – it isn’t actually hard-coded into the system. Actually, the system decides for itself what colors to use for its lines (actually each line decides for itself, creating a complex system out of simple individual decisions) , and this part of the program is recursive. A line modifies its color based on the colors in the lines surrounding it. (Specifically, based on the color of the line previous to it in the array.) Before I talk about what went ‘easy’ or ‘right’ and what went ‘difficultly’ or ‘wrong,’ I want to comment on how there isn’t always a relationship between how easy or hard something is to conceive of, imagine, and see in your head, and how easy or hard it is to code.  Some things that sounded or looked simple in the conceptualizing stages were complicated to implement in code, and it also turned out to be simple to implement some seemingly complex concepts / behaviors. For example, It was very easy to populate an array with lines. It was also easy to create a line object. Probably one of my favorite things talked about in a discussion with conference with Angela was about the point or goal of our class, which is to enable students to see visual work and feel encouraged and confident to be able to replicate it in code, or to execute one of their own imagined ideas. For starters: I was not able to get as much visible interactivity in my system as I had hoped. In some ways, it still looks random. And in other ways, it does not look random enough. Some of this has to do with how many exact rules are turned on at a given time. Being able to set a randomSeed and to toggle the frameRate of my system have been very helpful, because it has allowed me to see what would happen to my system over time in more controlled settings. Even with all the rules turned on at once, it is easy to see with accelerated frameRate that my system seems to fall back into a mostly regular loop. That does not mean that it is not mesmerizing to look at – it definitely is, especially when you realize it is a simple system of only Line objects. Angela suggested writing my system with a randomSeed in place. This also turned out to be a lot easier than I expected or was familiar with from my previous coding experiences. For randomSeed, I had to learn that a random number generator essentially is “only random on the outside”: inside, it deterministically creates numbers based on the given seed. So the specific sequence of numbers that it will return from the seed ’99’ is always the exact same sequence, regardless of how many times we run it. That’s why it’s called the ‘seed': ALL of the randomness grows out of just that initial seed, like how an entire tree grows out of a seed. I will definitely continue to work on my sketch, specifically in trying to make interaction and gradualism more apparent.

Radical Games: Her Eyes Post-Mortem

Screen Shot 2017-05-03 at 8.25.13 PM Her Eyes is a game that has been through so many iterations and pivot it’s goal is almost entirely alien from the original idea. That being said, the look of the game has remained very consistent from my end and even though I’ve had to rethink over and over the way characters and the world worked, I always felt like I was working within the safe frame of the general world I had created and the art that expressed that world. Screen Shot 2017-05-03 at 8.26.26 PM As it stands, the game is roughly half done, maybe less. While the majority of the assets are made, a number are still planned out, and the larger meat of the game, that being encounters, has yet to be worked in. Building such meaningful encounters in the time I had is what I struggled with the most during this cycle and what I would’ve wanted to put more time and thought it. Screen Shot 2017-05-03 at 8.30.34 PMScreen Shot 2017-05-03 at 8.22.57 PM What surprised me was how easily I found the art to do. In other ventures towards the visual world, I always found myself getting hung up on the details of what I drew and how they didn’t look exactly right because I was rushed or just couldn’t eyeball something well enough. With pixel art, I found the amount of precision and abstraction allowed me to make pieces of art that I truly felt proud of. While I wouldn’t say the game had any strong influences artistically, I do think my most recent play throughs of games like LISA and Superbrothers: Sword and Sworcery did influence certain character designs, narrative themes, world building, and NPC interaction. Screen Shot 2017-05-03 at 8.32.05 PMScreen Shot 2017-05-03 at 8.31.37 PM Looking back, I feel that the two things I learned the most were exactly that. That meaningful encounters is the hard part, and art in this capacity is what I was strongest with. Know that earlier on would’ve helped me better allocate time and energy to maximize the potential of the product. Strangely, I never found the time to make music or sound for the game. The reason this is strange is that I’m a musician and one would think the music is what would come naturally. Pointing out then that I do not consider myself a visual artist, it is intriguing that the thing I found most uncomfortable at first (art) became the easiest and what I was more familiar (narrative, music) took longer and I was less pleased with the result. Screen Shot 2017-05-03 at 8.24.42 PM  Screen Shot 2017-05-03 at 7.13.25 PM  

Conference Project Post-Mortem: Swimming In the Void

  Screen Shot 2017-05-12 at 11.06.28 PM For my conference project, I made three animated kinetic text videos which featured narratives from people who spoke about their emotional -experiences of dealing with their mental illnesses. Initially, I wanted to mimic Oskar Fischinger’s ( a German-American abstract animator) style of shape animation to mimic the emotions highlighted in the narrative. In his videos, Oscar Fischinger uses simple shapes to move in co-ordination to classical and jazz musical compositions.However, a major feature of his animated shorts which made them so appealing was the syncing of his shape animation to a Litz composition, which  I lacked the technical expertise and time to emulate. Screen Shot 2017-05-12 at 11.09.05 PM   Instead, I used a variety of inspirations for different scenes in each video. For instance, in the video featuring my friend’s narrative encounter with depression, one of the first few scenes has been inspired by Saul Bass’s cinematography for the opening credits of Vertigo. In order to create that, I chose to transform my ellipse into a spiral , using the “twist” animation effect. My intention was for the rotating spiral to create a hallucinatory effect and make the viewer experience a sense of dread and feel that they were getting pulled into some sort of void (a symbolic interpretation of my title). The last scene, which features a gif of a girl with a tear rolling down her cheek, has been inspired by Mitski’s “Townie” music video, which is filled with a series of hand drawn gifs that express the self destructive and discontent nature of a young adult, which is quite similar to the narrative of the video I was creating. I attempted to re-create this hand sketched gif using Gimp and my Wacom tablet, however I felt that I used too few layers, which resulted in an animated gif that was too rushed up and had a rocky transition between the frames. For the BPD video, I was particularly inspired by Jim Goldberg’s short video for his photobook, “Raised By Wolves” which features teenage runaways in Hollywood Boulevard. The juxtaposition between the young, innocent faces of the subjects and the dreary nature of their narratives interested me and I attempted to re-create this effect in my own video, which featured a childhood photo of my cousin contrasted with lines from her narrative. Screen Shot 2017-05-12 at 11.11.05 PM While creating my videos, I discovered a variety of tools that complemented the nature of my narratives. For instance, I used a combination of “Bad TV” (warp, old and weak)  and “Set Channels” effects to create the damaged VCR effect with the static lines. The “Bad TV” effect was used to create the static lines while the “Set Channels” effect was used to create the glitch text at  the beginning. All three of the kinetic texts shared a common theme of the narrators describing themselves as feeling like ghosts and wishing to float away. The “Set Channels” effect proved to be a very efficient tool in helping to convey this in images and text. For instance, I created three layers of the same text and would modify the channel information in such a way that the colors in the images would get separated and created the effect of the person in the image “floating” away from herself (see picture above). I also heavily experimented around with the “Fractal Noise” effect which helped to create the jittery effect for the text and animated shapes in the video and created a sense of heightened anxiety. I was also interested in creating a zoom in affect where it feels like a camera is panning towards infinity. I tried to convey this in the first two videos which featured the narratives about depression and BPD. This was achieved by making the text 3-D and altering the key frames for  it’s orientation. For the backdrops, I decided to create visual representations of a galaxy and glowing tunnel; both of which convey a universal sense of infinity. Screen Shot 2017-05-12 at 11.12.28 PM   Screen Shot 2017-05-12 at 11.13.41 PM I wished I had a better understanding of key frames and transition between different scenes , as I felt that some scenes were too rushed to properly convey something impactful. I also wished I had more time to compose a musical composition for my videos, as that would have made the animations  more effective in manipulating the viewer’s emotions and would have been more engaging.

Conference Project Post-Mortem: IV

IMG_0224 (1) IV is a top down RPG that tries to model the American medical industry within a video game using mythic imagery. Currently I’m at a place in the dev cycle where most every art asset is in the game, however the actual coded mechanics don’t quite work yet. The project had some major surprises, notably the coding and character animation came remarkably quick but the terrain and tile maps came much slowly. This is probably due to me using a different program (photoshop) and technique for these tiles than I did on my last game The Strength Needed. Much of the design choices came from this place of experience/need for growth. I wanted to expand my artistic skill set this semester by making the terrain far prettier than last semester. The main character had much of the same sort of art style I had cultivated before, but used some more complex shading techniques that made them seem more dimensional. I think I surprised myself this time with how quickly the character designs came out. Initially I had many different full walk cycles for multiple different characters that didn’t make it into the final cut of the game, but I still might use these assets and the practice they afforded me in future projects. I discovered a sort of natural ability to design characters this semester which honestly surprised me as I’ve had plenty of doubts throughout the year about my ability to draw/make pixel art. I had a lot of artistic inspiration from the game Hyper Light Drifter and used much of the articles I read interviewing the developer Alex Preston as guides for making this game. In addition, the games Lisa, Undertale, and What Now? as models for some of the things I wanted to do with odd mechanics. I did definitely learn how to do tilesets better this semester, which overall has aided my skill set as an artist quite well. The extra practice on characters also undoubtedly will make future projects that much faster. In addition, I think my skills as a designer definitely saw some improvement. On previous projects I don’t think I would have done much to draft out a main mechanic. Really thinking about the internal logic of the game’s central mechanic became a rather good thought experiment and practice for the future. The whole process of making a mechanic that didn’t play by conventional game standards made me question how to defy typical mechanics even more. However, although I cultivated a better sense of art and design I will mention my coding still feels subpar. While I’m aware much of my strife came from a major setback in the dev cycle when my computer lost all its data and was out of commission for two weeks, the fact remains that coding takes me far more time than any other aspect of the project and I should leave more time for it on my next project. Although I thought I managed my time well, clearly I’ll have to get better at deadlines in the future. IMG_0227   Best, Chris Haehnel (Kit)

Conference Project Post-Mortem: ADHDRPG!

Gamepic My game this semester is ADHDRPG!, a semi-autobiographical depiction of what it’s like to have undiagnosed ADHD in middle school. The game as I envision it depicts a week in the life of a girl (named Claire, after myself) as she attempts to navigate home and school while dealing with her ADHD. At home, she must manage to get out the door in the morning with everything she needs, a challenge that increases in various ways as the game goes on. At school, she battles the various manifestations of her ADHD, such as homework and distractions. gamepic5 I am still fairly early on in the dev cycle for this project, unfortunately.  My artwork is very involved and detailed, and I’d say that’s the most advanced aspect of my project. There are many objects that I have created art assets for but not implemented or implemented without planned interactivity. As far as coding goes, I got so far as to implement basic enemies into the game and add a system for killing them. If the game were to become fully realized, I’d say that I’m probably a quarter of the way through. gamepic2 I was surprised by how easy the coding aspect of the game was. I have a small bit of experience with Javascript, and while much of the actual scripting was different, the logic carried over to a surprising degree. Most of my problems came from careless errors, which were annoying but ultimately easy to fix. The most surprisingly time consuming thing was the art — I never realized how much I could agonize over the placement of a few pixels. To my pleasant surprise, I was more talented at pixel art than I thought. However, this came with the unfortunate flip side of me often wanting to go back and redo older assets as my skill increased. gamepic3 Other than a skill with art, I’d say I definitely gained more confidence in my ability to write code. In a less quantifiable sense, I feel like I have a better eye for design than I did when I had started the semester with no education on visual design and little on game design. That’s my biggest concentration in the future — improving my game design skills. I want to be a designer and a writer, and while art assets and code can always be done for me by someone else, design is absolutely necessary if I’m to lead the creation of a game. I really learned the value of feedback from my classmates, so I’ll definitely take advantage of any playtesters I can get for future games. gamepic4 I was really inspired by all of the projects created by my classmates this semester. I feel like every game that each of us created had different strengths, and every creator stood out from the others in their own way. The sense of humor in David’s game, the beautiful art in Colin’s, the use of a small and detailed space to create compelling story in Chris’ are a few of the many standout examples of things that I take as inspiration for this and future games. gamepic6 My one regret is that my time management absolutely could have been better than it was. I was hesitant to implement functionality into my game before making the necessary art assets, so that contributed a lot to me not having as much code and interactivity in as I could have. I learned that I need to create a stricter dev cycle and really stick to it. This summer, I plan on trying to finish my game. If I can create that structure for myself I’ll be at a huge advantage over where I was. I also hope that someday working with others on a game can keep me to task.  

Systems Aesthetics: Corporate Bliss

George Washington - Mike Brondbjerg

George Washington – Mike Brondbjerg

Screen Shot 2017-05-12 at 12.02.43 PM

Thomas Jefferson – Mike Brondbjerg

Part 1 of the sketch

Part 1 of the sketch

Bliss with a quote by Robert McChesney

Bliss with a quote by Robert McChesney

The struggle of logos maximizing profit from the media and the Internet.

The struggle of logos maximizing profit from the media and the Internet.

Proposal: My Systems Aesthetic’s conference project has truly evolved. It began with some inspiration from Mike Brondbjerg, who created a project called Dead Presidents (http://www.kultur.design/portfolio/dead-presidents/) . He worked with portraits of old presidents and beautifully “distorted” their faces. In the beginning I didn’t really have an idea with what I wanted to do. Did I want to re-create Brondbjerg’s work? Upon our first conference project, Angela and I decided that I would need to convert original images into SVG images and then learn PShape. I created my first sketch with an SVG image of Homer Simpson and Friedrich Hayek. The Homer image was easy but the Hayek image was an actual portrait I wanted to use. I was inspired by Tim Wu’s book, The Attention Merchants. Tim Wu famously coined the term “net neutrality” which advocates free access of content to all Internet users. Within the depths and depths of content found on the Internet, such a stance is necessary. Tim Wu examines how private lives have been permeated by capitalism. The lack of space to breath from advertisements has encouraged people to stay less informed politically and diminished democratic participation. The evolution of the media of mass communications is primarily driven by technological innovation.Wu suggests that one of the first stages of grabbing attention came from newspapers, with the advertisements of Jules Chéret. Advertising brought me to my final project: company logos. I was also inspired by the television show Silicon Valley’s title sequence of Uber and Lyft struggling against each other.   Digital technology has allowed humans to advance their freedom; however, capitalism limits this freedom. Robert McChesney, author of Digital Disconnect: How Capitalism Is Turning The Internet Against Democracy, compliments Wu’s book by examining how companies control the Internet. Through lobbying, the government has allowed a few companies to control and regulate the Internet for profit. Advertising traffic is monitored and sold in order to commercialize the Internet. For example, Facebook likes are monetized for advertisers. A quote from McChesney’s book prompted me to choose these specific companies: Apple, Amazon, Facebook, Microsoft, and Google. However, 4 logos were not enough to take up a sketch. I looked up other corporate and media influencers and found: Twitter, Walmart, Snapchat, BP, and HP. These companies all have the power to influence public opinion.   After the election, I was extremely angry at the media – because I spend the night at the Javits Center expecting Hillary Clinton to win. As she was losing the monitors were showing some political talk show. A political elite, either Rachel Maddow or Nicholas Kristof, stated that average Americans would blame the media for Clinton’s loss. While there are many factors behind Trump’s election, that statement angered me greatly. Between the end of November and February I stopped checking my social media accounts and by association the news. I was completely unaware of Donald Trump’s antics, the latest memes, and shopping trends. It was a blissful time but inconvenient. I had no idea about the Russia scandal. I had little to no knowledge of the officials Trump was picking. People need to know what goes on and that means sacrificing attention to advertisements. The blending of factual content and advertising in the media makes it difficult to escape. The Internet is becoming a less regulated place, in which large companies can control traffic and dictate who can see what. It is best to be aware of it.   This project serves to show the world I think companies have the potential to take over our general day-to-day activities.   Post-Mortem:   I learned a new concept in Processing for this project: Bounce. I also learned how to upload images and logos into an array. The system behind my project is the rules behind allowing the logos to bounce off the sides of the sketch. I also played with frame count, which I had used a lot in Pre-Frontal. I added a quote by Robert McChesney because I thought it would mean something against Microsoft’s Bliss background. All of these companies are competing against one another to see who can influence people more, and then in turn gain profit. Furthermore, the beginning of the sketch contains the drag of the logos because I felt that it created a sort of a maze. Internet users are stuck between Facebook and Google and the conflict between who can grab your attention more.   Next semester, I do hope to learn how to take high definition screen shots of my sketches so that the movies made in MPEG Streamclip aren’t blurry. I am proud of this project because I feel that it conveys how I feel about corporations and the media. The title of this piece is “Corporate Mess”, which I think captures the struggle of companies to maximize profit from users of the Internet. 

Conference Project Post-Mortem: Liquid Light

fullsizeoutput_143e For my conference project, I combined a digital projection of various poems I had written with a liquid light show;  dishes filled with mineral oil, water, and food dye projected on an ELMO overhead projector. IMG_5566 A lot of my poetry aims to simply create another world in which the reader can enter. For my conference project, I aimed to take this experience farther by using the projection to visually create a space. I felt as though I certainly created a space through the projection, but perhaps not my words, as most people didn’t really take much time reading the poetry. IMG_5591 At first, I originally only used two dishes for the oil, water, and dye. However, I decide to try using a third vessel, a large flat-ish plastic box top. I felt as though this made a huge improvement on the quality of the liquid light show, as it allowed me to use more colors without them mixing. If I were to do this again in the future, I would try something other than food coloring, as it didn’t quite have the vibrancy I wanted. I would also invest in clear glass clock faces or something similar as opposed to what I used. It was shockingly difficult to find a clear plastic or glass dish that didn’t have a logo or something on the bottom. Finding materials was probably my biggest frustration. fullsizeoutput_1465 Overall, I was pleased with how this project turned out, as I felt it for the most part accomplished what I wanted it to. I will definitely be using both projection techniques for other projects in the future.

Conference Project Post-Mortem: Music and Motion

For my conference project, I intended to compose songs in GarageBand and create an animation to go along with them in After Effects. I had genres in mind for songs and I somewhat stuck to them, but varied slightly. I did make an electronic song, but the other song that I intended to be a classic band setup turned into more of a keyboard-oriented 70s disco piece. This is a result of where I happened to be at the time I made the songs: I was listening to other songs from the 70s which influenced my style. I planned on using markers, but I found another system that worked even better: in GarageBand the soundwaves of each instrument are visible in coordination with the time of the piece, which also includes time in the same way as After Effects (24 frames per second). So, I looked for the beats in the soundwaves in GarageBand, found the corresponding time, and animated to the beat. However, I had issues with memory which made playback difficult, especially for the first piece, which made it double-check my work. The first piece, which had more chaotic rhythmic elements, resulted in more abrasive animation at times so I aimed to make my second piece more organic and relaxed.
A screencap from my second video. I used the Kaleidescope and HexTiles effects often as I feel they have a 70s characteristic.

A screencap from my second video. I used the Kaleidescope and HexTiles effects often as I feel they have a 70s characteristic.

I think I succeeded at this. Going from the first project to the second project changed my overall conference because I learned from my first mistakes and tried to refine them for the second piece.
A screencap from my first video. The background shapes and their color schemes were my favorite part of this video.

A screencap from my first video. The background shapes and their color schemes were my favorite part of this video.

While my time management could have been better, I am surprised how well my projects turned out for being done at late hours. I believe my second piece does look good because the effects range from simple to complex but all still enjoyable to watch, while my first piece could use more refinement because some animations felt too rushed and some parts too static. In the end, my inspiration for the first video was late 1980s aesthetics and the second video was early 1970s aesthetics. I am satisfied with the work I have created and feel it reflects my artistic development over the semester accurately.

Conference Project Post-Mortem: Glitch

Glitchy Galaxy Flower - Copy doodle 11 PixelStaticStream   My conference project was making glitch art.  I took patterns that I made in GIMP, then I put them into Java with the software, Processing.  The first three images are the patterns that I made.  The last pattern was already glitched inside of photoshop, then it was put into processing.  The last three images are frames from the coded program.  The code turned out just the way I wanted it to.  Granted, I only have so much control over what the final product looks like because the code is semi-generative.  But, I am completely happy with how my programs turned out!  The colors all look great, and I like the way they change. The thing I am not happy with in my project is how the frames saved.  There is a lot of black that gets added into the images, which muddies the image and hides a lot of the detail.  I am not exactly sure why it happens, but it makes the project look less like how I want it too. A lot changed from when I started to what I ended up with.  I experimented a lot with different ways the glitch could be created and how it affected the image.  I made many small changes that either changed a lot in the way the code works or changed only a slight amount.  I took the three versions that I liked the most out of everything and then made more changes to those.  I added some coded patterns, which helped the code become less stagnant and change the color.  The patterns I created were easy to come up with; they took a little bit of maneuvering to get right, but they weren’t too difficult to incorporate.  The last glitch that I made (the last image) took a little more work to get the additional patterns included.  I struggled getting colors that I liked to match the glitch.  I wanted similar colors, but they either didn’t look quite right, or they didn’t stand out enough.  In the same glitch, I originally had a different base pattern that got glitched, but I ended changing it to the final version because I thought it looked better and I liked the colors better. I like how my work turned out overall.  I think it suits my style as an artist, and I think that if I were to do the same project over again, I would end up with a similar project.

Conference Project Post-Mortem: Bueno, Claro Que Si

Screenshot_01_molina My conference project is a reflection on my heritage as a Cuban-American. Bueno and Claro Que Si are two phrases that come up quite often when in conversation with Cubans. The project is comprised of three separate videos. The first video is more of a reflection of who I am and why I look the way I look. The second video is a reflection on working at a sneaker store where most of the customers only speak spanish and I can only communicate in Spanglish. In the third video I used footage of my grandmother describing parties in Cuba, translated it (for the most part), and used kinetic text to type it in english. Each video uses rotoscoping to include short animations relevant to the kinetic text. This was my mission when going into my conference project- to use kinetic text and short animation together. The short animations and text were all drawn out in advance in order to set up my animations with kinetic text first, make the small animations second. I tried using different effects, using shape motions to interweave text and animation, and using different colors. screenshot_02_molina In the first animation I wanted to use the colors of the cuban flag, which also happen to be the colors of the American flag. On of the longest rotoscoping animations I made can be previewed above. I simply took a video of myself holding an expresso cup and holding it up to my mouth as if I were drinking from it. I then took that footage, created different frames from it, and drew over the video to create a short and sweet animation. I started with hair, then body, the expresso cup, then the coloring on the cup. Although I do like the first video I am more proud of the second half than the first. screenshot_03_molina The second animation is a reflection of my time working at a sneaker store and working with customers who only speak and understand Spanish. I wanted to convey my frustration with customers, and the situation. In this projection I wanted to use a different color scheme than most of my projects in general and get away from using grey or white. I decided to use blue because it is a color involved with the company I work at. The video was planned with kinetic text and where I would insert short videos. I also played around with drawing simple circles and making them into borders. During my conference project work I also discovered the beautiful revelation that I could make my own images and videos into tiles using effects. I love the dangling feet with shoes in this animation and the idea is reprised again with a border of legs. screenshot_04 I had a hard time in the third animation because I am very bad at drawing faces, so I will often revise it over and over only to make the faces look even messier. I threw out another rotoscope section in the animation because I did not think it was well enough done. At the end of the video my grandmother plays the piano and I rotoscoped a piece. For this piece, I went in and erased the face, and although there is no face detail now I am still very much overall happy with how it came out. I used a photo my grandma has of Cuba hanging up in her kitchen throughout. This piece was definitely much more for me and my family than anything else. I have always been interested in the parties in Cuba, and the balls my grandmother would attend. The video footage was something I have had for quite some time, and used to help me write a screenplay I had been writing. I always intended to use the footage in this sort of manner and I am glad I finally was able to. I am very happy with how it came out. Over all, my project was very time consuming but worth it and something I am definitely proud of. I do wish the three videos looked a little more similar only to make it more clear that the video are indeed part of the same project and series. There is a part in the second video where the kinetic text goes incredibly faster then I wanted it to, but I think it works only to express how frustrating it is to work in retail and have several people speaking to you at once. I left it alone, only for this reason and hope it is conveyed in this manner. The first video too, I wish I had done something slightly different with the beginning. Working on the project I learned I work very slowly. I make mistakes, and immediately go back to perfect them. I had to learn to let go and not make every singly frame perfect. It was also a part of the look that I was going for. An artist I looked at was Julia Pott, a lot of her work looks a little messy but there is a sweet charm to it that I really like. I tried to copy this charm and I hope I got a least a little bit of it. I am very happy with how my project turned out!    

Conference Project Post-Mortem: Found Poetry

Screenshot 2017-05-05 at 7.45.50 AM My conference project is titled ‘Found Poetry’. It is an exploration of words found in the real world that form unexpected poetry, or that can be rearranged to make poetry. The two videos that I made were a song mashup and an animated refrigerator covered with word magnets, but the concept of found poetry could extend to interesting bumper stickers, street signs and license plates, graffiti, emails, notes – essentially any words that are found in the world and have a poetic aspect. When I originally started thinking about my conference work, my idea was to create an intricate animated wallpaper as either a video in After Effects or a series of GIFs. I liked the idea of taking a mundane surface found in houses and making it into a living background, so I envisioned a detailed wallpaper pattern with birds and flowers such as those designed by William Morris, in which the different parts of the pattern moved and appeared to come alive. After struggling to draw a decorative pattern that I was satisfied with, I switched my focus to kinetic text, which I found very rewarding. I learned that I work best in After Effects when I can take a long period of time (at least 6-8 hours) and focus on completing a section of video, because it takes a while to get into the flow of the work, and also because troubleshooting/learning new techniques can take a while. I also found that new ideas came to me in the process. Screenshot 2017-05-05 at 7.42.26 AM My conference video “Fridge Poetry” draws on my ideas about taking an everyday object and creating an animation that makes it appear alive or enchanted. The poems in this video are ones found on my real refrigerator at home, made from set of word magnets by my roommates and I. I picked some of my favorites and made word tiles for each one, as well as individual tiles for the consonants that occupied their own tiles. I then took a photo of my refrigerator and Photoshopped the background so that it created a blank slate to begin animating the poems. I tried to use varying speeds for each tile I animated to give the appearance that an invisible presence was thinking of what to write and then moving the tiles across the refrigerator. Overall, I think this tactic was successful, but I find the video more visually satisfying at the moments in which multiple tiles are moving at the same time. If I did this project over, I think that I would add a few more poems, make the tiles smaller, and make the pace at which the poems form slightly faster by increasing the number of times that multiple tiles move simultaneously. I found that the best way to create a random rhythm in the movement of the word tiles was to animate them without checking the time signature and avoid making changes at exact intervals.   There are two other elements to the video: GIFs and a list of imaginary chores. The imaginary chores ranged from ‘drain the swimming pool’ to ‘filter the potion’. I added this list at the end of the animation and made it appear to float down from above the fridge and then stick. It was fun to come up with the ‘chores,’ and I think it adds to the fantastical element of the video. chores I made GIFs of a flower, a hopping spotted green frog and a crescent moon in Photoshop, which I inserted into the video like living fridge magnets that move around the screen. This was the most difficult part of the project, because when I tried to add the GIFs to the animation their previously transparent backgrounds became white. I also needed to figure out how to loop the GIFs for the length of the video so that they would play continuously. After an absurd amount of googling (some forums claimed that trying to work with GIFs in After Effects was simply a bad idea) and about four or five hours of trial and error, I eventually figured out how to remove the white background and loop the GIFs, so that I could animate them. I’m happy I stuck with it, because I like the simplistic but satisfying effect of the repetitive motion of a GIF interacting with the environment of the video. frog     flower My other conference video is titled “My Never Sunshine,” and it is a kinetic text video inspired by and set to a mash-up of the songs “You Are My Sunshine” and “Ain’t No Sunshine When She’s Gone”. “You Are My Sunshine” was one of my favorite songs as a kid, because I had a wind-up teddy bear that played the melody. One day while thinking about ideas for kinetic text, I got both songs stuck in my head. I looked on YouTube and found a live recording of a mash-up that I liked: You are My Sunshine/Ain’t No Sunshine (Mash-Up) by Justin Sinclair & Jamey Geston. It became the basis for a lyric video of sorts, with the lyrics scrambled to create cognitive dissonance between the audio and the visual. Screenshot 2017-05-05 at 7.47.06 AMI liked the idea of these two songs together, both more or less sad love songs (depending on how they are played), both focusing on the idea of the presence or lack of sunshine. Instead of a visual focusing on the sun, what came to mind was a background of intricate clouds. Clouds are still sky-themed and denote the absence of sunshine, although my clouds are quite cheerful in appearance. I made a background image several times larger than the size of the video composition and then animated it to give the appearance of a camera panning across the sky. The clouds are a pattern with similar form and scale, but some variation in color and texture. The sound of the song is quite melancholy, but the bright blue of the sky and the simple visuals (a rainbow, sunbursts, flying bird silhouettes) create a cheerful and calming effect. Most of the visuals are individual GIFs which I then imported into After Effects and animated. I think this worked particularly well for the flying birds. sun 2birdsOne of the most difficult parts of creating this video was drawing the rainbow, birds and sun in Photoshop. I originally wanted more true-to-life representations, but I was faced with a lack of technical skill. I ended up returning to the simple lines that I used to draw with as a kid, and I actually ended up enjoying the final effect, which I think is imperfect but visually satisfying. Screenshot 2017-05-05 at 7.43.26 AM I like the layers of contrast in the piece, both between the song and the mismatched lyrics and between the melancholy tone of the words and music with the bright, happy visuals. I think this contrast adds interest and complexity to what would have otherwise been a fairly simple piece. It’s confusing, but in a good way.     

Conference Project Post Mortem: Interference

Screen Shot 2017-05-05 at 10.56.47 PM “Chromointerference”, as artist Carlos Cruz-Diez dubs it, is when colors are side by side and their unique wavelengths obstruct one another and produce a new color, a color that isn’t actually there but is only a perception of the eye due to wavelength interference and light. Through studying more about Diez and the work of op artist like Victor Vasarely, Bridget Riley, Josef Albers, as well as Anni Albers I became deeply inspired by what different visual perceptions can be created. carlos-cruz-diez-chromatic-induction-dual-frequency-permutation-5-800x800

Chromatic Induction Dual Frequency Permutation Lithograph by Carlos Cruz-Diez.


Serie Semana – Martes Lithograph by Carlos Cruz-Diez

CD and Dawn

Carlos himself in his “Chromosaturation” light installation at the University of Essex (he’s too cool!)

For my conference project, I created 10 animated gifs that focus on color, line, and viewer perception. I strived to manipulate viewer perception by creating movement/moire effects, as well as, an interference of colors. interference_101 This first gif is one that I wanted to be informative, as I am learning about color theory through this project and hope to teach someone else something new as well. The blue lines are above a moving gradient from orange to green. When the gradient passes through the blue lines the wavelength of the blue interferences with the gradient, producing a new gradient from pink to light blue. Blue + Orange = Pink Blue + Green = Cyan I didn’t want the lines to cover the entire canvas so that the viewer could understand what was really happening in this gif. interfering_quad This gif actually came from work I did in analog form. I had silkscreened a print that had the pink, yellow, and cyan interference and here I greatly expanded upon it and animated it! Though one of my more simpler gifs, I like this one the best. Maybe because I get to see my work translated from analog to digital form, which is cool. But I also like this one because it’s informative if you really study it and produces one of the most successful interferences (of my conference) in my opinion. I also noticed that black works best when creating color interferences. It defines the other colors more and makes them more pronounce. The next three gifs were created by overlapping different color tiles that I made. Though I only rotated between 4 different colored tiles (red, orange, green, and blue), dependent on which ones were used and the background, an large array of different effects and combinations were created. rasta_quilt This gif was created just by overlapping red and green. Who knew it would produce a yellow color?! It was best executed on a black background. I had made the same gif with a white background but the color interference wasn’t as strong. There are only two layers interfering and just in a horizontal direction but the constant motion makes it feel as if there is more dimension than is actually present. I was pleased that this gif (and the following two) had both interference and a moire effect. easter_morning I created this gif by placing a green and blue tile over a gradient of red to orange. This combination produced an entire array of colors that feel very 60’s to me but also remind me of Easter morning. Everything is moving at the same speed, but the way the tiles interact with each other feel as if some parts are moving faster or slower than others. Due to the order I overlaid the tiles, some interferences appear in disappear which is neat. pop This one, for me, is somehow offputting and striking at the same time. The colors are horrendous in my opinion, but there’s just so much visually going on! This is the culmination of all four tiles (red, orange, green, and blue) interacting with each other over a black background and moving in both the horizontal and vertical direction. hue Here in this gif the two outer boxes reveal what’s interacting in the center. I like this gif particularly because it switches between interferences making you perceive a color and you seeing that actual color. It’s also one of the more dynamic gifs I made that you don’t have to turn away from. To me, it’s quite soothing, though it was the most difficult to make. Each box is a separate gif that I made into that pattern. Some boxes cave in and some boxes push out. There’s variance without it being overbearing. sw Here I have rows of arrows crossing over a pattern. The interference here is created not by the colors crossing over another or just existing beside each other, but through the movement of the arrows over the pattern. The colors used were magenta, red-orange, and cyan. The best interference is in the middle where the arrow moves over all three colors. Though I will have to say that to see the best effect one should be standing a bit farther away in order to see the full interference. That’s the thing though I guess about the entire project. These interferences work best on a smaller scale. All of my gifs are parts of larger scale work I made that I scaled way down and multiplied! The funny part is the best stills of the gifs are my thumbnails. You really experience the full effect. quad_5 This gif kind of happened by accident and through the most trial and errors of any of the gifs I’ve made. I think I have 5 other versions of this gif. I liked this one best due to this particular moire effect. It reminds me of a kaleidoscope! It’s a combination of pieces of a gif I made that had a black tile over a pattern of blue, hot pink, green and black lines. prism When studying more about color theory and interferences I looked into the color additive model. When red, green, and blue (RGB) light intersect one another they produce white (the combination of all colors). I was then super determined to see if I could produce a white pattern and gif just by using RGB. I was sadly, but also thankfully mistaken. The geometric shape I made at the center of the gif consists of several layers of an RGB gif I made. I thought if I could get the lines minuscule enough it would produce the effect I wanted. Instead of white, it produced a rainbow spectrum (which in turn actually makes sense)! I juxtaposed the shape in front of a rotating background of black and white lines. Since the shape is in the foreground and the background is rotating so fast, the lines almost look like they’re producing their own moire effect even though they’re not interacting with any overlapping lines themselves or scaling in size. I expanded more on RGB with this next and final gif. I think it shows both the RGB pattern but also the rainbow interference that is produced due to the moire effect in this gif. rgb_moire This project was both wonderful and hard. It pushed me way out of my comfort zone. I was forced to use color! I don’t like to think I’m an artist or designer who is afraid of color, but there does seem to be a general black and white theme in my work across all forms. This project allowed me to learn about art history, color theory and produce an array of colors in my work, all things I never really did before. It was rewarding to be inspired by analog forms of art, especially as someone who prints and illustrates, and have that translate and breathe new life into my digital work.

Conference Project Proposal: Animate with Simple Elements

image4 (1)image5 (1)   I am taking Art and Perception class with Elizabeth.  From that class, I have learned artists such as Paul Klee and Wassily Kandinsky who were interested in flat paintings that are composed from simple elements.  I am inspired by how simple shapes can create complex and beautiful compositions. My another intention is to practice my skill of using after effect by animating paintings or a composition.  The process of giving a work the motion also challenge on my creativity.   Also, I want to animate something base on my previous work of abstract and simple shapes, inspired by Paul Klee and Wassily Kandinsky.  I believe that abstract shapes are much more compelling, natural, and sophisticated.  If time allows, I am also going to rework with my animation with interesting colors. For me, sometimes a better animation archives without too much design and plan at first.  I don’t want to set my mind on what exact design I will create.  I want to explore as much different effects as I want for my animation, just to experience different effects. The above pictures I took from my sketchbook was also my expression of lines and shapes in a repetitive pattern.  They are also going to be a source of my animation design.   1) first project: animating Kandinsky’s Blue: blue-1922.jpg!PinterestLarge Wassily Kandinsky, Blue, 1922 I am starting with expressing my imagination on different part of the drawing: the bull’s-eye like group of circles, the upheaving waves, the ladder-like line group etc.

Conference Project Proposal: Found Poetry

My conference project will consist of two videos which utilize kinetic text and animation. The central theme is found poetry, or words found in the world and transformed into something poetic. They also utilize animation of shapes and figures to add to their visual interest.

Still from ‘Fridge Poetry.’

The first video is titled ‘Fridge Poetry,’ and its inspiration is exactly that. I own a set of small fridge magnets, each with a single word printed on it, and my fridge is covered in odd poetic sentences created by my roommates and I. It always amazes me how limited words can combine to convey a new meaning. The video is intended to be a visual representation of a fantastical fridge, with the magnetic poetry as kinetic text being the focal point. I made around 80 individual word tiles, and I animated each one to appear as if someone was dragging it from its place lined up on the bottom of the fridge to form new poems. The pace of motion is varied, which I hope conveys the sense of an invisible someone thinking about what they want to write. To reenforce the fantastical element of a fridge that almost appears alive or slightly magical, I added a list of imaginary chores.

Imaginary chores.

I may also add ‘living’ magnets, such as a flower magnet that unfurls its petals or a frog that hops around. I’m still thinking through this idea. This video focuses more heavily on the words than the second one, and its background is a static image of a refrigerator (my refrigerator in fact, photoshopped to remove the real, boring chore list and to create a blank slate for the animated poems to form).  
sky video projection

‘My Never Sunshine’ projected onto a ceiling.

My second video, titled ‘My Never Sunshine,’ is a mashup of the songs “You Are My Sunshine” by Charles Mitchell and “Ain’t No Sunshine” by Bill Withers. I had this idea because one day I got both songs stuck in my head, and thought that a combination of the two would work well. Since I’m not a musician, I looked on YouTube and found that in fact two artists, Justin Sinclair and Jamey Geston, had recorded a live performance of a mashup of the two songs. (Watch it here.) The concept of the video is to juxtapose the lyrics in the form of kinetic text with the recorded song. I scrambled the lyrics of “You Are My Sunshine,” jumbling the words within the song to create a new poem of sorts, and interposed it with the lyrics of “Ain’t No Sunshine,” keeping each song separate. My hope is that this will create an interesting cognitive dissonance for the viewer as they are reading one thing and hearing another, with both the visual and auditory elements strongly resembling the original song but not matching it. I also used different font colors to emphasize the difference between the songs. My rationale behind using black for “Ain’t No Sunshine” and yellow for “You Are My Sunshine” was to denote the absence or presence of sunlight. Here is a brief excerpt to give an example: Ain’t no sunshine when she’s gone You are my grey, my only dear It’s not warm when she’s away You make me mistaken when skies are sunshine Ain’t no sunshine when she’s gone The idea of a lack of sunshine led me to a background of clouds, which the camera appears to pan over as the video progresses. I wanted to create the appearance of drifting slowly through a skyscape. The background utilizes pattern, with the clouds forming a somewhat repetitive pattern, and some of the individual clouds themselves being made up of patterns. At strong beats in the song, I will add new visuals, such as a rain cloud, a rainbow, a sunburst or a bird flying. Despite the melancholy tone of the song and the lyrics, the overall effect is somewhat cheerful due to the use of bright colors and crisp, clean lines.

Still from ‘My Never Sunshine.’

My motivation behind this conference project was to combine kinetic text with pattern, since they are the two parts of our course that spoke to me the most. Found poetry works well for me because I love words but struggle to create completely original creative content (I am more comfortable with writing essays than poems). I like that found poetry takes something already in the world and transforms it into something new and different but somewhat reminiscent of the original. I have also always enjoyed small pieces of found poetry in the real world, such as clever license plates, song mashups, bumper stickers, street signs and bathroom stall graffiti poetry. They have a surprising and whimsical effect that I hope to emulate with these videos.