Timing and Pacing

By jhclaura in Blog, Coding for Emotional Impact, Spring 2014 1 Comment

For this week’s subject Timing and Pacing, I chose “No Safe-House” in the soundtrack of The Grand Budapest Hotel to decode.

timing

 

effect I intend to achieve

–> emotion accumulation, cheerful and narrative.

notes

  • library I used for camera in 3D –>  http://mrfeinberg.com/peasycam/#about
  • using PShape to store the tetrahedron I made and set their movements with trigonometry functions, noise, hsl, and hard-coding frameCount!!!(see how long and tedious my codes are :P)
  • issues to work on, since I used frameCount, it’s different all the time, depending how fast my computer run. need to use millis() next time!
  • next step will be using library Minim to generate the patterns directly from the analysis of sound file.

codes 

Continue reading

tweaking mini_arc of Mimi

By jhclaura in Blog, Coding for Emotional Impact, Spring 2014 0 Comment

Tweaking Mimi’s codes(go to youtube page to link to the amazing original codes of Mimi)!

–> the image of cat makes me laugh and realize the relationship of it with curve above better.

 

–> Feeling calm and a little be enchanted, just staring it to finish the pattern you expect in mind.

 

–> the change of speed, size, and color makes this feeling-soft-at-the-first-glance video more lively.

 

And I chose to watch the Cat footage for 10s, 30s, 2 minutes, 5 minutes, and 10 minutes….. what do I feel? NAUSEOUS. Apparently. It starts as interesting and fun, but after long time staring it, it became boring and made me dizzy.

emotion visualization {Tranquil}

By jhclaura in Blog, Coding for Emotional Impact, Spring 2014 0 Comment

Before I start, let me document one thing first… I FORGOT the format of Processing. Proof as below.

Screen Shot 2014-02-07 at 7.41.33 PM

And also, I found a music video programming in Openframeworks. Pure Astonishing.

 

OK. Let’s begin.

{Tranquil}

For creating 3 studies of the emotion with ratios of space, rations of color, and ratios of time, I got Tranquil from Kate, and l first pictured the situation I’ll have this feeling in, and then tried to convey them through coding.

<em>Situation</em>: sparkling dust floating in dark, hair floating with wind, immerse in music in crowd environment, look into sky, unfocus eyesight, repeat pattern

Study 1: calm(look into sky, unfocus eyesight, repeat pattern)

Study 2: free from disturbance(immerse in music in crowd environment)

Study 3: free(sparkling dust floating in dark, hair floating with wind)

Triangulation!

By jhclaura in Blog, ICM_Processing 2 Comments

Triangulation.. Finally! Want it so bad for a semester. Luckily having a winter break to do it. Have a lot of rooms for improvement but still, one step further!

*UPDATE*(in the middle of writing this post UGH)

New version. Normal speed!

In the middle of documentation, the ill performance, both low speed running and wrong color picking bothered me a lot, so I went through the whole codes again and making adjustment around. And then I found out what the problem is! It’s the random plotting of points for triangles! It not only slows down the process, but also causes the ill performance of choosing the right color for the triangle. OH YEAH SO HAPPY. It’s the similar “bitter yet sweet moment” I usually will have when coding… I think I’m ready for the new semester!

Old version. x3 speed! Slow and chaos.

Old Line version. Slow but it seems to have better outcome with the random plotting points methods!!

 

Image Gallery

colorV20252line544outcome06 outcome01 outcome04 outcome02 outcome03 outcome05 outcome07

 

Basic idea of code

  1. capture image from webcam and save as PImage source
  2. iterate through source, pick up every pixel, compare either a) colors or b) brightness difference(I found comparing by colors will be more accurate).
  3. if the difference is bigger than certain threshold, plant a point in class Voronoi. Voronoi does all the calculation to transform points into triangles.
  4. for each triangle gotten out from Voronoi, using getCentroid() to pickup the color to fill the triangle built up with beginShape(), endShape() and vertex().
  5. wipe out Voronoi and build a new one every 10 frames to speed up the performance.

 

References

  • from Robbie Tilton. ITP alumnus! This is where my base came from! Clear description made me not afraid of trying the code out! From him, I got the idea of using Cols and Rows to boost up the performance, and plotting points for triangles with a random deviation of 5 pixels to make it look less grid-like(BUT randomness is not good for picking color, and it also slows down the performance).
  • from Jan Vantomme. Very well documentation! From him, I learned the difference between getCentroid() and getSites(), and also learned that, since getCentroid() and getSites() don’t return the voronoi regions and points in same order, to fill the right color for right position it has to be looped to iterate through, picking and filling up the color at the same time.

 

Inspiration & Further

 

Code, as below: Continue reading

ICM_Glitchtchtchitch

By jhclaura in Blog, ICM_Processing 0 Comment

ICM Final– Glitchtchtchitch.

Manipulation and surveillance visualization.

Featured in ITP Winter Show 2013(See all the pics!).

Glitchtchtchitch is a live interactive installation showing multiple short-lived fault in a system. By bringing out the imperfection of technology with massive pixels manipulation, sound distortion, and multiple screens display, Glitchtchtchitch visualize the transient fault and the incapability of communication. Although mainly sending serious messages, with the effect of headless illusions, heads displacement, and delay, it leaves audience undergoing an experience without too much pressure.

Glitchtchtchitch is presented by running more than 10 Processing sketches at the same time, and using 2-3 projectors to increase the amount of screen, the variety, and increase the level of distortion.

 

Main idea –>  In order to cubify heads, instead of just altering pixels, I made an object “Cube” to get, restore, alter, and display the pixels of specific range. Also to achieve the headless effect, besides the library OpenCV, I took a background image beforehand, and display its pixels within certain ranges, once detecting a face. ALL THE SOURCE CODES

 

Notes

  • Speed issue has room for improvement.
  • Different scale presentation style(projectors included) looks nice.
  • From user test and presentation feedback, people love headless and delay effect the most. Because they’re the most bizarre, unrealistic, and uncommon visual impact.

Problems with solutions

  • OutOfBounds —> constrain(xxx, 0, numPixels-1)
  • flip horizontal —> video.width-fx-1
  • can’t cover image with pixels[ ] —> solved by using pixels for both
  • improve the sketch speed —> P2D, PFrame,
  • connect to webcam? PS eye? —> camera list, example

References

  • scale PImage http://stackoverflow.com/questions/17705781/video-delay-buffer-in-processing-2-0
  • Minim noise http://code.compartmental.net/tools/minim/manual-noise/
  • hide menu http://processing.org/discourse/beta/num_1224367967.html

Original proposal –> Here.

http://jhclaura.com/Glitchtchtchlitch_proposal/Glitchtchtchlitch_proposal.pdf

ICM_Video_Let’s have Fun!

By jhclaura in Blog, Fun, Fungus Among Us, ICM_Processing 0 Comment

OpenCV Library

OpenCV_mushroom

Mushroom

Just tweaking around Daniel Shiffman’s LiveFaceDetect example with OpenCV library. Photoshopped off the face of Mushroom. And I’m proud that I mapped the position and the scale well! So FIT hahaha. Below is my mushroom hat mapping code.

if (faces != null) {
    for (int i = 0; i < faces.length; i++) {
      // image size: 500
      // maps image size with face scale
      float w = map(img.width, 200, 1, 1, faces[i].width);
      float h = map(img.height, 200, 1, 1, faces[i].height);

      image(img, faces[i].x+faces[i].width/2-(w)/2, faces[i].y-(h)/2, w, h);
    }
  }

And here’s the video for it. Fun!