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.

Video and Sound Final

For my Final Project I’ve been grouped with Nai-chen Yand and Carrie Zhang .

After couple hours of shooting, we end up with our final video.

During this process, we changed style of the video at least twice. In our first version we used just one song, playing constantly throughout the whole video also, we kept colors.  Finally, in the final one we decided to remove colors and changed the music, adding a silent pause in the middle of the video.

Here’s our final effect:

That was a very nice and entertaining experience. I’ve learned a lot both in terms of using Adobe Premiere and … acting.

Pin Clock

For my final project I paired up with Jesse. After long brainstorm we finally decided on creating a digital pin clock. We were inspired by a pin toy.

IMG_5125

Our first idea was to create a ‘topographic mirror’ image using 3D pin sculpture and some sort of sensors to detect what was in front of the ‘mirror’.  Because of the mechanical intricacies required to move each pin individually, and because of the cost of linear actuators we would probably have to use, we dropped that idea and came up with the clock concept.

IMG_5119

The clock would work similar as a pin toy does. Just for the design we’d need 3 sheets of flat acrylic ( 2 for board, one to attach mechanism) many acrylic rods and multi colored LED lights.

IMG_5127

Two sheets would hold the pins in place, and the third sheet would house the mechanism, which would actuate the pins forward and back to display time. Moreover, we decided on fitting multi-colored LEDs inside the pegs, so that they enhance the visual effect and the clarity of the time display.

We’ve already made our first small prototype, laser cutting wholes in 2 acrylic sheets and cutting few rods to mock up the clock dimensions. We still need to estimate the grid dimensions, the spacing between holes and the amount of holes in each row.

IMG_5123 IMG_5122 IMG_5121 IMG_5120 IMG_5118 IMG_5117 IMG_5116

Our next step will be to decide how big the grid should be, we’ll have to determine peg spacing between holes.

Here’s how our initial schedule looks like:

WEEK 1:

  • finalize our concept;
  • prototype chassis;
  • determine peg spacing;
  • determine amounts of pegs;
  • research solenoids;
  • get them to work;
  • determine power needs;
  • work with the code;

WEEK 2:

  • work withe the code;
  • work with the code ( LEDs part only);
  • order rest of materials;
  • finalize the sizing;

WEEK 3:

  • cutting the rods;
  • fabrications;
  • preparing to assemble;
  • coding – tests with servos;

WEEK 4:

  • debugging,
  • fabrications;
  • etc.

WEEK 5:

  • final assembly,
  • preparing presentation

Hopefully, everything’s gonna work well and we end up having a new, gorgeous clock for ITP.

‘Dandi’ – pComp Midterm Project

Firstly, my Partner Anne and I considered making a physical object – a box of grass that moved as if being blown by the wind when people walked past. Then, after a brainstorm we both agreed to move the project to the screen.

It was a challenging task in terms of programming. That was the first time I had to use particle system.

I started with drawing a dandelion piece in Adobe Illustrator and saving it as a svg file. Then, I tried to loop it in few circles, just to create dandelion shape.

DANDIThen, after consultation with Moon, we decided to form dandelion pieces in one spiral.Screen Shot 2015-11-04 at 1.48.27 PM Screen Shot 2015-11-04 at 1.47.41 PM

While I was working on design and programming, Anne figured out a lot about the sensors.

At first, we purchased a PIR motion sensor, but it turned out to be way to sensitive. Then, we discovered the Distance Measuring Sensor which seemed perfect for our task, though we did not need to measure distance, because we were able to adjust the level of sensitivity.

She did a great job by getting sensors to work.

Also, I laser cut and etched the lid for our ‘sensor box’.

IMG_4838 IMG_4846

Finally, we connected both out works, and ended up with a beautiful final effect.

Screen Shot 2015-11-04 at 2.06.20 PM

Sound Visualization – Final Project Idea

For my final project, I’d like to make Sound Visualization. The software I’d like to use is Processing. I’m considering creating 3D pattern, based on one single sine wave.

I’d like to keep ‘outer-space style’, I feel really inspired by TRON the Legacy:

I found plenty cool stuff on the internet and made a general mood board of the style I’d like to implement to my project.

moodboard

To display music I wanna use single element, like a sine wave, and multiply it once music changes:

audio_wave-4 18myedxaumwzdjpg still_2729 4043554107

Also, I really enjoyed watching this:

DANDI – pComp midterm (Draft post)

For midterm project, I was paired with Anne Goodfriend.

Screen Shot 2015-10-29 at 3.22.08 AM

We called our project ‘Dandi’. The idea was to show Dandelion blown by wind, created by person, that passes 2 motion sensors.

IMG_4846 2

Laser etched dandelions on a box

The order of on which sensor was triggered first, indicated the directions, the dandelion pieces were blown.

IMG_4866 2 IMG_4847 2

IMG_4840

I have no idea why this video loads upside down….

Video Capture

Screen Shot 2015-10-28 at 12.09.10 AM

This week I’ve been playing with video capture and sound.

Finally, I started with creating the grid. Initially, I planned to fill my screen with squares, but finally I ended up with ellipses. The idea was to calculate the average of R, G and B values from the pixels inside each circle and fill that circle with the new ‘average’ color.

Once I finally figured out how to make it, I came up with the idea of expanding the grid according to the mouse position. The circles grow when mouse goes to the left part of the screen.

Video Capture from Marcela Nowak on Vimeo.

Screen Shot 2015-10-28 at 12.09.18 AM Screen Shot 2015-10-28 at 12.09.35 AM

The hardest part was to map the video size to the bigger Canvas.

I had to map not only the video, but also ellipsis sizes and their positions.

You can check it out HERE

 

Planets

 

SPACE

This week’s assignment, was to create a sketch using data. At first, I wanted to use xml file, but it seemed to be still a little bit buggy. I didn’t manage to get rid of error even after posting the problem to our ICM group, and emailing Dan Shiffman.

So, I tried with json. After struggling with that case it finally worked out.

Screen Shot 2015-10-21 at 2.42.29 AM

My idea was to create a simplified solar system visualization. Sadly, the sun turns out to be too big in comparison to the planets, so eventually I just marked it as a small spot in the center of our solar system… To create my animation, I used real planets’ data, such as: their distance from the sun, velocity, diameter and speed. I couldn’t find any good database, so I ended up creating it myself.

Screen Shot 2015-10-21 at 7.44.21 AM

By dividing it and adjusting to my canvas I was able to fit most of the planets on the screen. At the end I also used scale(); function.

Once you click on the planets’ buttons, placed in the top left corner, you’ll get information about planets.

Screen Shot 2015-10-21 at 7.32.40 AM

Link to sketch: PLANETS