During the study break

During the study break, i had found a tutorial that using processing gradient to make the whole visual came out,

Reference:
http://forum.processing.org/two/discussion/150/gradient-color-effect/p1

PImage gradientMap; // This PImage object will hold the gradient

float progress = 0; // The progress variable, a float from 0.0 to 1.0

 

// Initiate sketch

void setup() {

 

    // Set screen size and renderer

    size(200, 720, P2D);

    noStroke();

 

    // Define as much colors as you like

    color[] colors = new color[] { color(255, 0, 0), color(255, 255, 0), color(0, 255, 0), color(0, 0, 255) };

 

    // Create gradient map from the given colors

    gradientMap = createImage(1, colors.length, RGB);

    gradientMap.loadPixels();

    for(int n = 0; n < colors.length; n++)

    gradientMap.pixels[n] = colors[n];

    gradientMap.updatePixels();

 

}

 

// Render sketch

void draw() {

 

    // Fill background

    background(#d1d1d1);

 

    // Calculate progress

    progress += 0.002;

    if(progress > 1)

        progress = 1;

 

    // Calculate gradient position

    float y = height - height * progress;

    float u = gradientMap.height * progress;

 

    // Render gradient

    beginShape(QUADS);

    texture(gradientMap);

    vertex(70, y, 0, u);

    vertex(120, y, 1, u);

    vertex(120, height, 0, 0);

    vertex(70, height, 1, 0);

    endShape();

}







I decided to make my own gradient according the code above with different variation of color. therefore i come out with my own code and adjusting the color according the hue color code i get from photoshop




The gradient i had done with another .pde file that can linked with the open kinect to generate the color










 class Gradient { ArrayList colors; Gradient() { colors = new ArrayList(); } void addColor(color c) { colors.add(c); } color getGradient(float value) { if(colors.size() == 0) return #000000; if(value <= 0.0) return (color)(Integer) colors.get(0); if(value >= colors.size() - 1) return (color)(Integer) colors.get(colors.size() - 1); int color_index = (int)value; color c1 = (color)(Integer) colors.get(color_index); color c2 = (color)(Integer) colors.get(color_index + 1); return lerpColor(c1, c2, value - color_index); } }