Category: SectionE

Project 04: Diagonal Sine Curve

sketch

//Name: Hari Vardhan Sampath
//Section: E
// Diagonal Sine Curves

var numLines = 45; //number of strings drawn

function setup() {
    createCanvas(400, 300);
    background(0);

    // red strings
    line(0, 0, 10, 150);
    line(50, 200, 150, 150);

    dx1 = (10-0)/numLines;
    dy1 = (150-0)/numLines;
    dx2 = (150-50)/numLines;
    dy2 = (150-200)/numLines;

    // yellow strings
    line(250, 100, 150, 150);
    line(400, 300, 390, 150);

    dx3 = (150-250)/numLines;
    dy3 = (150-100)/numLines;
    dx4 = (390-400)/numLines;
    dy4 = (150-300)/numLines;

    // purple strings
    line(150, 250, 150, 150);
    line(400, 300, 250, 290);

    dx5 = (150-150)/numLines;
    dy5 = (150-250)/numLines;
    dx6 = (250-400)/numLines;
    dy6 = (290-300)/numLines;

    // blue strings
    line(100, 10, 0, 0);
    line(150, 150, 150, 50);

    dx7 = (0-100)/numLines;
    dy7 = (0-10)/numLines;
    dx8 = (150-150)/numLines;
    dy8 = (50-150)/numLines;
}

function draw() {
    // red strings
    var x1 = 0;
    var y1 = 0;
    var x2 = 50;
    var y2 = 200;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(192, 57, 43);
        line(x1, y1, x2, y2);
        x1 += dx1;
        y1 += dy1;
        x2 += dx2;
        y2 += dy2;
    }
    // yellow strings
    var x3 = 250;
    var y3 = 100;
    var x4 = 400;
    var y4 = 300;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(244, 208, 63);
        line(x3, y3, x4, y4);
        x3 += dx3;
        y3 += dy3;
        x4 += dx4;
        y4 += dy4;
    }
    // purple strings
    var x5 = 150;
    var y5 = 250;
    var x6 = 400;
    var y6 = 300;
    for (var i = 0; i <= numLines; i += 1) {
        stroke('purple');
        line(x5, y5, x6, y6);
        x5 += dx5;
        y5 += dy5;
        x6 += dx6;
        y6 += dy6;
    }
    var x7 = 100;
    var y7 = 10;
    var x8 = 150;
    var y8 = 150;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(84, 153, 199);
        line(x7, y7, x8, y8);
        x7 += dx7;
        y7 += dy7;
        x8 += dx8;
        y8 += dy8;
    }

    noLoop();
}

In this project, I tried to explore the continuity of string art to form a sine curve, starting from the top left corner of the canvas until the diagonal bottom.

Project 4: String Art

Good luck four leaf clover with abstract land and sky

sketch
// Ana Furtado 
// Section E
// Project 4 -- String Art

//Q1
var dx1;
var dy1;
var dx2;
var dy2;
var numLines = 40;
//Q2
var bx1;
var by1;
var bx2;
var by2;
//Q3
var ax1;
var ay1;
var ax2;
var ay2;
//Q4
var cx1;
var cy1;
var cx2;
var cy2;
//Right
var ex1;
var ey1;
var ex2;
var ey2;
//Left
var fx1;
var fy1;
var fx2;
var fy2;

function setup() {
    createCanvas(400, 300);
    background(255); // white background with abstract land and sky
    strokeWeight(2);
    

    //Sky
    //Q1 lines
    stroke(179,243,255); //light blue
    line(0, 50, 350, 0);
    line(0, 250, 50, 0);
    dx1 = (350-0)/numLines;
    dy1 = (0-50)/numLines;
    dx2 = (50-0)/numLines;
    dy2 = (0-250)/numLines;

    //Q2 lines
    stroke(179,243,255); //light blue
    line(350, 0, 400, 250);
    line(50, 0, 400, 50);
    bx1 = (400-350)/numLines;
    by1 = (250-0)/numLines
    bx2 = (400-50)/numLines
    by2 = (50-0)/numLines
    
    //Land
    //Q3 lines
    stroke(192,255,135); //light green
    line(350, 300, 400, 50);
    line(50, 300, 400, 250);
    ax1 = (400-350)/numLines;
    ay1 = (50-300)/numLines
    ax2 = (400-50)/numLines
    ay2 = (250-300)/numLines

    //Q4 lines
    stroke(192,255,135); //light green
    line(350, 300, 0, 250); 
    line(50, 300, 0, 50);
    cx1 = (0-350)/numLines;
    cy1 = (250-300)/numLines
    cx2 = (0-50)/numLines
    cy2 = (50-300)/numLines


    //Center (4 leaf clover)
    //Right
    strokeWeight(1.25);
    stroke(92,255,92); //green
    line(210, 75, 190, 225); 
    line(275, 140, 125, 160); 
    ex1 = (190-210)/numLines;
    ey1 = (225-75)/numLines
    ex2 = (125-275)/numLines
    ey2 = (160-140)/numLines

    //Left
    stroke(92,255,92); //green
    line(210, 225, 190, 75); 
    line(275, 160, 125, 140); 
    fx1 = (190-210)/numLines;
    fy1 = (75-225)/numLines
    fx2 = (125-275)/numLines
    fy2 = (140-160)/numLines

}

function draw() {
    //Sky
    //Q1 -- upper left sky
    strokeWeight(1);
    var x1 = 0;
    var y1 = 50;
    var x2 = 0;
    var y2 = 250;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(179,243,255); //light blue
        line(x1, y1, x2, y2);
        x1 += dx1;
        y1 += dy1;
        x2 += dx2;
        y2 += dy2;
    }

    //Q2 -- upper right sky
    var x1 = 350;
    var y1 = 0;
    var x2 = 50;
    var y2 = 0;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(179,243,255); //light blue
        line(x1, y1, x2, y2);
        x1 += bx1;
        y1 += by1;
        x2 += bx2;
        y2 += by2;
    }

    //Land
    // Q3 -- bottom right land
    var x1 = 350;
    var y1 = 300;
    var x2 = 50;
    var y2 = 300;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(192,255,135); //light green
        line(x1, y1, x2, y2);
        x1 += ax1;
        y1 += ay1;
        x2 += ax2;
        y2 += ay2;
    }

    //Q4 -- bottom left land
    var x1 = 350;
    var y1 = 300;
    var x2 = 50;
    var y2 = 300;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(192,255,135); //light green
        line(x1, y1, x2, y2);
        x1 += cx1;
        y1 += cy1;
        x2 += cx2;
        y2 += cy2;
    }

    //Green Center (4 leaf clover)
    //Right
    strokeWeight(1.25);
    var x1 = 210;
    var y1 = 75;
    var x2 = 275;
    var y2 = 140;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(92,255,92); //green
        line(x1, y1, x2, y2);
        x1 += ex1;
        y1 += ey1;
        x2 += ex2;
        y2 += ey2;
    }

    //Left
    var x1 = 210;
    var y1 = 225;
    var x2 = 275;
    var y2 = 160;
    for (var i = 0; i <= numLines; i += 1) {
        stroke(92,255,92); //green
        line(x1, y1, x2, y2);
        x1 += fx1;
        y1 += fy1;
        x2 += fx2;
        y2 += fy2;
    }

    //Stem
    strokeWeight(3);
    stroke(92,255,92); //green
    line(200,150, 200, 270)

    noLoop();
    

}

The most challenging part of this project was keeping track of which variables were being used and if the coordinates were right.

Looking Outwards – 04

I researched the project Supersynthesis by Amay Kataria in 2022 that was presented at Mu Gallery in Chicago. I like how the project emulates a wave of light and sound and how it allows the viewers to become users by digitally controlling the exhibit. The user can control how the exhibit shows light and sound in real time. It allows for community building and potentially performances by artists and/or musicians by controlling the exhibit. According to the artists the project is reminiscent of Olafur Eliasson’s Weather Project in 2003, which is alos about interacting with the community. The shape of the structure and interactivity of the project are manifestations of the artist’s interests. However, I wish the project had physical changes that respond to the user besides light movement and sound change. Perhaps something like raising and lowering of the bars when it lights up and emits sound or perhaps it could change colors.

Light & Sound Synthesis: In Conversation with Amay Kataria – CreativeApplications.Net

LO 4

By MycoLyco

The cellular activity of the fungi used in this person’s videos produces a bioelectrical current which is translated into noise. The
hardware used is called Eurorack Module SCION from Instruō. The noises produced have an interesting sound to them as far as generated
music goes. They sound intentional, almost as though the artist tried creating the most stereotypically alien noises by himself. It was
to the point where I was suspicious of their claims that these were sounds generated by the mushrooms. The presentation of the mushrooms
in the videos, with their fluorescent lighting makes me think that the them being excessively alien is the point.

Looking Outwards 04 – Sound Art

Material Sequence – Physical materiality of sound
Mo H Zareei
19/11/2021

material sequencer (aluminium)
material sequencer (copper)
material sequencer (steel)

The project I’ve chosen is the “Material Sequencer: Physical materiality of sound” by Mo H Zareei. The sequencer itself is quite simple, composed mainly of 4 parts: 1, control switches; 2, onboard dial; 3, actuator/solenoid; 4, material block. The control switches inform the beat pattern within a 8 step rhythmic sequence in which the solenoid strikes the material block; the onboard dial controls the tempo of the sequence; while the material block determines the timbre of the sounds generated. By just watching it operate, the functions of each component are easily discernible, laying out the process of conversion from input to electrical to kinetic to output via sound in a clear and easily digestible manner, demystifying an otherwise ‘black box’ process. I admire the simplicity of the material artifact and the elegance with which it incorporates exploration of the sound profile of various materials. Zareei positions this work as being “a reductionist celebration of unadorned raw material through rigorous functionalism” that takes “the sequencing process outside the black box and into the acoustic realm, flaunting its materiality and physicality.”

material sequencer (wood)

From my understanding, each switch has a individual hard coded behavior(ie. only firing once every 5, 7, 10, etc. seconds), so toggling different switches at the same time allows for various combinations of beat patterns as a result of mixing different behaviors. The creator’s artistic sensibilities are inflected in the final sonic output via the choices of materials, switch combination, choice of the solenoid, and interaction with the tempo dial such that the output is able to manipulated according the user’s preferences.

Links:
https://www.creativeapplications.net/sound/material-sequencer-physical-materiality-of-sound/

LO 04: VOLUME by SOFTlab, NY 2017

Volume, as described by the author is an interactive cube of responsive mirrors that redirect light and sound responsive to the surrounding movement. The installation commissioned by HP consists of a square grid of 100 mirrored panels with individually addressable LED lights sandwiched along the vertical sides. These panels are mounted on posts with rotating motors. The installation comes to life when the panels rotate and align to human movement, where the human becomes the attractor point for the mirrors to align and face. The sound transmission is also controlled tracing the attractor point and the light in turn react to the sound produced by the panels. This interconnected network of reactive movement and sound fills the atmosphere around the installation. To trace the human motion, array of depth camera is used and identify them as points. Much like the mouseX and mouseY used to locate the mouse pointer. The position tracking uses 6 Kinetic V2 cameras to identify blobs and depth image is retrieved using KineticPV2 library.

Volume UI from SOFTlab on Vimeo.

Project 04: String Art

sketch
sketch

 

in this project, I tried to use different colors and combinations of strings to compose a gradually changing geometry that goes from edge to the center.

 

    var dx1;
    var dy1;
    var dx2;
    var dy2;
    var dx3;
    var dy3;
    var dx4;
    var dy4;
    var numLines = 50;
    var c;


function setup() {
    createCanvas(400, 300);
    background(0);
    
    //base set of lines #1
    /*line(width/4,0,0,height/3);
    line(0,height/3,width/2,height/3);*/

    /*line(1,300,2,1);
    line(2,1,200,150);
    line(200,150,398,299);
    line(398,299,399,1);*/

    dx1=(2-1)/numLines;
    dy1=(1-300)/numLines;
    dx2=(200-2)/numLines;
    dy2=(150-1)/numLines;
    dx3=(398-200)/numLines;
    dy3=(299-150)/numLines;
    dx4=(399-398)/numLines;
    dy4=(1-299)/numLines;

    //define the change of x, y variables
    /*dx1 = (0-width/4)/numLines;
    dy1 = (height/3-0)/numLines;
    dx2 = (width/2-0)/numLines;
    dy2 = (height/3-height/3)/numLines;*/
}
    
    //draw first set of strings
function draw() {

        var x1 = 1;
        var y1 = 300;
        var x2 = 2;
        var y2 = 1;
        var x3 = 200;
        var y3 = 150;
        var x4 = 398;
        var y4 = 299;

        stroke(0,255,0);
        //in a for loop, when a increases, x1+= a*dx1)
        //for(var e=0;e<=5;e+=1){
            //dx2=e*dx2;
            /*x1 += e*dx1;
            y1 += e*dy1;
            x2 += e*dx2;
            y2 += e*dy2;
            x3 += e*dx3;
            y3 += e*dy3;
            x4 += e*dx4;
            y4 += e*dy4;*/
        
            for (var i = 0; i <= numLines; i += 1) {
                line(x1, y1, x2, y2);
                line(x3,y3,x4,y4);
                x1 += dx1;
                y1 += dy1;
                x2 += dx2;
                y2 += dy2;
                x3 += dx3;
                y3 += dy3;
                x4 += dx4;
                y4 += dy4;
}
                
                string02();
                string03();
                string04();
                noLoop();
}
        //second set of strings
    function string02(){


        var x5 = 2;
        var y5 = 1;
        var x6 = 399;
        var y6 = 50;
        var x7 = 1;
        var y7 = 250;
        var x8 = 399;
        var y8 = 300;

        stroke(255);
       
            for (var e =0; e <= 20; e += 1) {
                line(x5, y5, x6, y6);
                line(x7,y7,x8,y8);
                x5 += dx1;
                y5 -= dy1;
                x6 += dx2;
                y6 -= dy2;
                x7 -= dx3;
                y7 += dy3;
                x8 -= dx4;
                y8 += dy4;
    }
    }

    //third set of strings
    function string03(){

        var x9 = 2;
        var y9 = 1;
        var x10 = 399;
        var y10 = 100;
        var x11 = 1;
        var y11 = 200;
        var x12 = 399;
        var y12 = 300;

        stroke(195,255,195);
       
            for (var l =0; l <= 25; l += 1) {
                line(x9, y9, x10, y10);
                line(x11,y11,x12,y12);
                x9 += dx1;
                y9 -= dy1;
                x10 += dx2;
                y10 -= dy2;
                x11 -= dx3;
                y11 += dy3;
                x12 -= dx4;
                y12 += dy4;
    }  
    }

    //fourth set of strings
    function string04(){

        var a = 2;
        var b = 1;
        var c = 399;
        var d = 200;
        var e = 1;
        var f = 100;
        var g = 399;
        var h = 300;

        stroke(90,255,90);
       
            for (var l =0; l <= 28; l += 1) {
                line(a, b, c, d);
                line(e,f,g,h);
                a += dx1;
                b -= dy1;
                c += dx2;
                d -= dy2;
                e -= dx3;
                f += dy3;
                g -= dx4;
                h += dy4;
    }  
    }
    //}
       //noLoop();



    //devide the lines
    //connect different parts on each line
    //define a function for different lines and variable

LO4: Sound Art

The artwork that i’m interested is Senseless Drawing Bot by So Kanno & Takahiro Yamaguchi. The robot is a 4-wheeled graffiti machine, with a pendulum arm, arduino and spray cans to create random strokes as it moves up and down the gallery space. The movements of the pendulum arm creates drawings that are free and random, so that audiences can’t really expect what comes next. This randomness makes the artwork very interesting.
Moreover, this combination of technology and art creates a lot of possibilities in the future, combining AI with art and a lot of other creative aspects.
Thinking of the algorithm, I think the settings makes use of the physical characteristics of free arm pendulum, which goes through random movements while it starts rotating. So the program sets when the robot starts drawing, when it starts rotating the arm and what the storkeweight is.

link here

Project 4

String Art!

sketch
var numlines =18;
var dx = (240/2)/numlines;
var dy = (240/2)/numlines;

function setup() {
    createCanvas(300,400);
    background(150);
}

function draw() {
    strokeWeight(0.5);
    var x1 = 30;
    var y1 = 200;
    var x2 = 150;
    var y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    line(30,200,270,200);
    line(150,80,150,320);
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 += dx;
        y2 -= dy;
    }
    x1 = 270;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 -= dx;
        y2 -= dy;
    }
    x1 = 30;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 += dx;
        y2 += dy;
    }
    x1 = 270;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 -= dx;
        y2 += dy;
    }
    translate(0,200)
    var x1 = 30;
    var y1 = 200;
    var x2 = 150;
    var y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    line(30,200,270,200);
    line(150,80,150,320);
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 += dx;
        y2 -= dy;
    }
    x1 = 270;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 -= dx;
        y2 -= dy;
    }
    x1 = 30;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 += dx;
        y2 += dy;
    }
    x1 = 270;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 -= dx;
        y2 += dy;
    }
    translate(0,-400)
    var x1 = 30;
    var y1 = 200;
    var x2 = 150;
    var y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    line(30,200,270,200);
    line(150,80,150,320);
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 += dx;
        y2 -= dy;
    }
    x1 = 270;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 -= dx;
        y2 -= dy;
    }
    x1 = 30;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 += dx;
        y2 += dy;
    }
    x1 = 270;
    y1 = 200;
    x2 = 150;
    y2 = 200;
    var r = 255;
    var g = 192;
    var b = 203;
    for (var i = 0; i <= numlines; i += 1) {
        r -= i*3;
        g -= i*10;
        b -= i*6;
        stroke(r,g,b);
        line(x1,y1,x2,y2);
        x1 -= dx;
        y2 += dy;
    }
}