Interactive fluid _draft



Only CG and jumping frames don't really show the sound interaction so I decided to mix with the graphics from script.
Numbers and simple circle animation with lines look more dynamic.
And I am going to try more CG animation apparently.


Still, noise and echo problem..I used smoothing and speaker adjusting but same.


Real time sound interactive visualization from koosi_lab on Vimeo.



To solve echo noise problem, i used 2 computers.
And I didn't like the sound so I used VST plugin.



sound visualization _bubble from koosi_lab on Vimeo.



sound visualization _fluid from koosi_lab on Vimeo.




_
Action Script code

_
import flash.events.ActivityEvent;
import flash.events.StatusEvent;
import flash.media.Microphone;

this.addEventListener(Event.ENTER_FRAME, showScene);

function showScene(event:Event) {
    trace(mic.activityLevel);
    //show current frame in text
    var cframe=mc.totalFrames/100*mic.activityLevel*2;
    lev.text=String(cframe);
    lev2.text=String(mic.activityLevel);

    //movieclip show - frame controlled by sound level
    mc.gotoAndPlay(cframe);
    mc.alpha=mic.activityLevel;//movieclip opacity - no input no image
}

addEventListener(Event.ENTER_FRAME,dot_make);
function dot_make(event:Event) {

  
    var count=0;

    var dot_mc:Dot= new Dot();

    dot_mc.alpha=mic.activityLevel;
    dot_mc.x=Math.ceil(Math.random()*1204);
    dot_mc.y=Math.ceil(Math.random()*384);

    var line:Shape = new Shape();

    line.graphics.lineStyle(1, 0xffffff, mic.activityLevel/10);
    line.graphics.moveTo(dot_mc.x,dot_mc.y);
    line.graphics.lineTo(lev2.x, lev2.y);

    this.addChild(line);
    this.addChild(dot_mc);

    var updateInterval:int=mic.activityLevel*3+300;
    var myTimer:Timer=new Timer(updateInterval,0);
    myTimer.start();
  
    myTimer.addEventListener(TimerEvent.TIMER,dot_remove);
    function dot_remove(event:TimerEvent) {

        removeEventListener(TimerEvent.TIMER,dot_make);
        removeChild(dot_mc);
        removeChild(line);
        line=null;
        dot_mc=null;
        myTimer.stop();

    }

}

var deviceArray:Array=Microphone.names;
trace("Available sound input devices:");
for (var i:int = 0; i < deviceArray.length; i++) {
    trace(" " + deviceArray[i]);
}

var mic:Microphone=Microphone.getMicrophone();
mic.gain=50;// volume controls, default=50
mic.rate=11;//speed kHz
mic.setUseEchoSuppression(true);//remove noise
mic.setLoopBack(true);// speaker out
mic.setSilenceLevel(0, 1000);//(minimum input sound, delay time)

mic.addEventListener(ActivityEvent.ACTIVITY, this.onMicActivity);
mic.addEventListener(StatusEvent.STATUS, this.onMicStatus);

var micDetails:String="Sound input device name: "+mic.name+'\n';
micDetails+="Gain: "+mic.gain+'\n';
micDetails+="Rate: "+mic.rate+" kHz"+'\n';
micDetails+="Muted: "+mic.muted+'\n';
micDetails+="Silence level: "+mic.silenceLevel+'\n';
micDetails+="Silence timeout: "+mic.silenceTimeout+'\n';
micDetails+="Echo suppression: "+mic.useEchoSuppression+'\n';
trace(micDetails);

function onMicActivity(event:ActivityEvent):void {
    trace("activating=" + event.activating + ", activityLevel=" +
            mic.activityLevel);
}

function onMicStatus(event:StatusEvent):void {
    trace("status: level=" + event.level + ", code=" + event.code);
}

_
in symbol

this.smoothing = true;

addEventListener(Event.ENTER_FRAME,myFunction);
function myFunction(event:Event) {
    if (currentFrame%5==0) {
        this.stop();
    }
}

Ongoing process

_
Test movie


Sound visualization _fluid from koosi_lab on Vimeo.

There are still some issues about noise echo and getting sound input.
The input only works when the sound really loud but loud sound gives noise echo.
it's like looping problem.
And i don't know why the video get noises when it gets high level.
Plus, I think the movie should be more dynamic(rotation maybe?) and bigger.


_
Concept

Melting / Fluid / Flexible

this is an experimental test for the concept
I made a fluid movie in Maya and time displacement(slit scanning) effect in After effect.


fluid from koosi_lab on Vimeo.


_
Process







I made a movie in Maya.
I used sphere surface and lattice to make a distortion which gives a feeling of melting or fluid.
then, appied a texture has transparency that shows backside which has more depth.
I can change the pattern whatever i want.

I don't know why the time displacement didn't work well in this video so i didn't use it. Maybe it's because of color..?


_
Interaction

Sound level controls the frames and opacity.


Because I couldn't know about Quartz composer well, I couldn't control images as much as I want.
so I decided to change into Flash and movie.

First of all, I need to connect to sound and Flash,

Microphone in Flash
http://help.adobe.com/ko_KR/AS3LCR/Flash_10.0/flash/media/Microphone.html

_
Action Script

import flash.events.ActivityEvent;
import flash.events.StatusEvent;
import flash.media.Microphone;
this.addEventListener(Event.ENTER_FRAME, showScene);
function showScene(event:Event) {
 trace(mic.activityLevel);
 //show current frame in text
 var cframe=mc.totalFrames/100*mic.activityLevel;
 lev.text=String(cframe);
 lev.x=850+int(Math.random()*100); //shaking text
 lev.y=50;

 //movieclip show - frame controlled by sound level
 mc.gotoAndPlay(cframe);
 mc.alpha=mic.activityLevel; //movieclip opacity - no input no image
}

var deviceArray:Array=Microphone.names;
trace("Available sound input devices:");
for (var i:int = 0; i < deviceArray.length; i++) {
 trace(" " + deviceArray[i]);
}
var mic:Microphone=Microphone.getMicrophone();
mic.gain=50;// volume controls, default=50
mic.rate=11; //speed kHz
mic.setUseEchoSuppression(true); //remove noise
mic.setLoopBack(true); // speaker out
mic.setSilenceLevel(0, 1000); //(minimum input sound, delay time)
mic.addEventListener(ActivityEvent.ACTIVITY, this.onMicActivity);
mic.addEventListener(StatusEvent.STATUS, this.onMicStatus);
var micDetails:String="Sound input device name: "+mic.name+'\n';
micDetails+="Gain: "+mic.gain+'\n';
micDetails+="Rate: "+mic.rate+" kHz"+'\n';
micDetails+="Muted: "+mic.muted+'\n';
micDetails+="Silence level: "+mic.silenceLevel+'\n';
micDetails+="Silence timeout: "+mic.silenceTimeout+'\n';
micDetails+="Echo suppression: "+mic.useEchoSuppression+'\n';
trace(micDetails);
function onMicActivity(event:ActivityEvent):void {
 trace("activating=" + event.activating + ", activityLevel=" +
         mic.activityLevel);
}
function onMicStatus(event:StatusEvent):void {
 trace("status: level=" + event.level + ", code=" + event.code);
}

Real time sound visualization _testing

I used Quartz Composer.



I wanted to visualize melting image but it is difficult to make it.
so i choosed wavy effect.
When there is no sound, it just show text(volume information) and when there is sound, images are distorted.Actually i found some old tv effect source and modified it.
now I just put some simple paint dropping video but I want to make mine.


no sound - only text
because i am not familiar with this tool, it is difficult to put this kind of dynamic text.
I don't know how to change the numbers short.



sound - distort