coding

Optical Illusions

For my final project, I decided to explore the topic of Op art and an optical illusion. I wanted to find out, if we can achieve similar effect, by coding art that is moving, and by coding art that is a still image, but gives the viewer the impression of movement.

Typically, Op artists used only black and white in order to produce the greatest contrast in their designs, since this contrast causes the greatest confusion for the eye, which struggles to discern which element of the composition is in the foreground and which in the background.

riu-kiu-c

But color was also a focus of attention at times, as in Vasarely’s Plastic Alphabet series (1960-1980). The ways in which color suggests space, and the ways colors contrast with one another, proved fertile areas for experiment.

Vasarely-Gestalt-4 vasarley_89044_3

Feeling inspired, I decided to code my own op-arts.

I divided them to 3 groups:

  • animated ones:


wavespiralblack spiral shock palindrome gif2 gif circles2 gif33

rainbow3wavy

LINK TO GIFS

  • static ones:

dots_linescircles_b_w

triangle spiral_snail

  • colorful

 

rainbooowrainbow3reddy

rainbow2

spiralrainbow

 

Nature of Code Final Proposal

Screen Shot 2016-04-13 at 8.46.03 AM

For my Nature of Code final project, I decided to try my hands at Unity 3D.

I want to create a Coral Reef Scenery, full of abundant variety of living creatures fish, turtles, crabs, sharks etc. I’d like to implement some Nature of Code to the project, by creating different school of fish ( flocking systems), current and random movers ( single fish/ sharks).

I think this is a great opportunity to practice both coding, as visual skills.

I find it a bit challenging, since I haven’t been using Unity a lot, and am not familiar with C#, but with a little help of tutorials I’m sure I will be able to figure something out. So far, I’ve created several flocking systems and some caustic effects. Still working on Sun shafts.

This is what I have so far:

First flocking system:

gif_flock

Flocking system without collider:

no_collider

First Collider Attempt:

gif_1

Collider test with a wall

overview collider_test

Finally, creating a reef

insta_lapse

caustic effect:

caustic

scenery:

overview2 scene

and here’s what I have so far:

scene2

Screen Shot 2016-04-13 at 8.46.03 AM

Screen Shot 2016-04-13 at 8.45.40 AM Screen Shot 2016-04-13 at 9.00.11 AM

Nature of Code Midterm

For my midterm project, I decided to explore relations between attractors & movers in the code. Fortunately, I had zillion ideas, unfortunately, also had way too less skills to achieve the result what I wanted.

Tried to play with fractals, processing and three.js,

1

Not everything was successful, but I definitely learned a lot

Untitled-2

Finally, I decided to focus on the ‘attractor’ example and modify it to make a nice visual effect.

My goal was have a system of movers, flying randomly  on the screen. Then, slowly, they were supposed to create a hidden image.

To make it happen, I prepared a few png & jpg files, that were about to be presented by movers. After importing them into p5, I wrote a nested loop, that iterates through each pixel of the image. Each one, having the RGB value bigger than 0 and smaller than 254 was meant to attract elements of the particle.

Screen Shot 2016-03-23 at 8.54.34 AM Screen Shot 2016-03-23 at 8.54.38 AM

Screen Shot 2016-03-23 at 8.54.45 AM

Once it finally worked, I decided to add some functions to the mouse and keyboard. I just wanted to totally mess up the drawing and redraw it again when the mouse is pressed.

[gif here]

The key changes the image to another one from the array. Once we reach the last one, we go back to the 1st one.


feel free to play

HERE

Random Walker & Perlin Noise

For our first week assignment, I decided to practice Random Walker and Noise.

Here’s what I came up with :

Noise:

noise

Screen Shot 2016-02-03 at 5.41.56 AM Screen Shot 2016-02-03 at 5.42.00 AM Screen Shot 2016-02-03 at 5.42.05 AM

Later,I tried to experiment with steering walker toward different directions using mouseX and mouseY. Also, to add another feature i set up ‘keyPressed()’ to help centralize random walker in the middle of the screen again.

via GIPHY

Screen Shot 2016-02-03 at 5.20.28 AMScreen Shot 2016-02-03 at 5.20.49 AM At the end, I decided to show ‘fear’ using noise:

bee

 

ICM Final Project – Sound & Vision

For my final project I decided to combine visual effects and sound. At first I wanted to make an audio visualizer, focusing on objects in 3D space. I started working in p5, but quickly realized that the 3D possibilities of the program aren’t fully developed yet.

That fact led me to try my luck in Processing. Despite my lack of previous programming experience, switching from javaScript to Java wasn’t very hard, so I continued working on my project in that software.

Screen Shot 2015-12-01 at 10.55.49 PM Screen Shot 2015-12-01 at 10.55.01 PM

During this time, I came across an incredibly satisfying video(click), which depicted a connection between a piece of music and its visualization. This inspired me to slightly change my general idea.

Screen Shot 2015-12-02 at 12.39.45 AM

Because of my industrial design background I was drawn to play with sketches in 3 dimensions.

My goal was to mimic the collisions in the video, replicating the way the audio responded to these collisions in my own way.

Screen Shot 2015-12-01 at 10.56.32 PM Screen Shot 2015-12-01 at 10.58.19 PM

Although I was attracted to the flat design of this video I preferred to continue developing my 3D skills.

While the project was progressing I kept stumbling across more inspiration. Each piece seemed to feature shaders and different addons, which steered me to switch to OpenFrameworks.

After struggling with installing Xcode, I converted my Java sketch to C ++.

I have to admit that was a pretty challenging task for me, both in creative, and programming way.

I spend a lot of time struggling with shaders and addons, that didn’t want to run on the newest version of Xcode, so I decided to downgrade my program to 8.4 version.

That made my life easier in terms of addons, but made it harder in terms of functions, which sometimes weren’t compatible with the ones on of reference website.

Firstly, I created a spiraling wave made out of turquoise spheres. Then, decided to draw another set of sphere (white ones) floating around the wave. My goal was to give them random speeds and positions, so that they could touch turquoise line at its different parts and moments. The moment when two sets touch each other triggers random note, so that the can create some sort of music.

Screen Shot 2015-12-01 at 5.20.58 AM

Later on, I focused on details, such as color change, particle system ‘exploding’ from the sphere that touches the line, and finally my favorite – blur and glow effect.

Here’s the final effect:

less blurry version:

I’ve learned a lot from this project . I’m amused that in such period of time I could learn so much. I feel very satisfied with the effect of my work, although I have many ideas of how I could improve my code if I have more time. Hopefully, I’ll be able to play with it really soon.