Project-03-Dynamic-Drawing

-The triangles rotate clockwise when mouse moving to the right, and counterclockwise when moving to the left

-The color become lighter when mouse moving to the bottom right, and darker when moving to the top left

-The triangle and change distance as mouse moving left, and it do the opposite when moving right.

– The smile faces shrink as mouse moves.

sketchDownload
/* Jiayi Chen
   jiayiche    Section A */
function setup() {
     createCanvas(600, 450);
     rectMode(CENTER);
}

function draw() {
    print('mouseX='+ mouseX +'mouseY'+mouseY)
    //change background
    backgroundchange();

    // smile face background
    for (var a=5;a<600;a=a+35){
        for (var b=0;b<450;b=b+35){
        push();
        translate(a,b);
        smileface();
        //change size
        var mx =constrain(mouseX,0,450)
        var my =constrain(mouseY,0,300)
            if(dist(mx,my,a,b)<= 150){ 
                d=30* dist(mx,my,a,b)/150;
            }
        pop();
        } 
    }
    //floating triangle and rectangle
    translate(constrain(mx,0,575),constrain(my,0,425));
    push();
    noStroke()
    cr=mx/450*255
    fill(cr,cr,cr,200)
    rect(0,0,50,50);
    var ang=mouseX/600*360
    //6 triangles
    push();
    scale(3*constrain(my,0,450)/450*3)
    push();
    triDist=100*constrain(mx,0,600)/600
    rotate(radians(ang));
    translate(triDist,0);
    triangle(0, 30, 30, 30, 15, 15);
    pop();
    push();
    rotate(radians(ang+60));
    translate(triDist,0);
    triangle(0, 30, 30, 30, 15, 15);
    pop();
    push();
    rotate(radians(ang+120));
    translate(triDist,0);
    triangle(0, 30, 30, 30, 15, 15);
    pop();
    push();
    rotate(radians(ang+180));
    translate(triDist,0);
    triangle(0, 30, 30, 30, 15, 15);
    pop();
    push();
    rotate(radians(ang+240));
    translate(triDist,0);
    triangle(0, 30, 30, 30, 15, 15);
    pop();
    push();
    rotate(radians(ang+300));
    translate(triDist,0);
    triangle(0, 30, 30, 30, 15, 15);
    pop();
    pop();
    pop();
}



var x=16
var y=16
var d=30



//single simle face
function smileface(){
    push();
    fill('yellow')
    //head
    ellipse(x,y,d); 
    //mouth
    arc(x, y+d*1/7, d/2, d/2, 0, PI); 
    //eye
    fill(0)
    ellipse(x+d*1/5,y-d*1/5,d/6);
    ellipse(x-d*1/5,y-d*1/5,d/6);
    pop();
}


   //change in background
function backgroundchange(){
    var r = mouseX/600*255
    var g = mouseX/600*255
    var b = mouseY/600*255
    background(r,g,b)
}

Project 3

sketch
//Paul Li
//Section A



var backR = 10;
var backG = 10;
var backB = 10;
var w = 30;
var h = 20;
var triR = 30;
var triG = 40;
var x = 1;


function setup() {
    createCanvas(600,450);
    rectMode(CENTER);
}

function draw() {

    //background & color
    //background color changes based on mouse
        backR = max(min(mouseY/2,255),0);
        backG = max(min(mouseX/2.2,255),0);
        backB = max(min(mouseX,255),0);
        background(backR,backG,backB,mouseY/60)
    //shape & shape movement
    // stroke weight and width and height of the ellipse is determined by mouse position
    // 
        w = min(mouseY,width - 30);
        h = min(mouseX,height - 30);
        strokeWeight(mouseX/100+mouseY/100);
        stroke(backG,backR,backB);
        fill(backG,backR,backB);
        ellipse(width/2,height/2, w, h);
//triangles rotate and move according to mouse cordinates in inverse and direct relationships
        push();
        rotate(radians(min(mouseX,width)));
        fill(backB,backR,backB);
        triangle(
            constrain(mouseX/(mouseY/30),0,width),mouseY,
            constrain(mouseY/(mouseX/30),0,width-50),mouseY,
            mouseX,mouseY
            );
        pop();
// chnaging color by mouse position.
        push();
        triR = constrain(mouseX,0,width);
        triG = constrain(mouseY, 0, height);
        translate(width/2,height/2);
        rotate(radians(min(mouseY,height)));
        fill(triR,triG,0);
        triangle(
            constrain(mouseY/(mouseX/10),0,width),mouseY,
            constrain(mouseX/(mouseY/10),0,width-100),mouseY,
            mouseX,mouseY
            );
       
        pop();


// square in the center & moving squares.
        fill(0,0,0,60);
        stroke(backG/2,backR,backB)
        square(width/2,height/2,height/min(mouseX/100,mouseY/30));
        push();
        translate(50,50);
        rotate(radians(x));
        x+= 4;
        fill(255);
        rect(width/2,height/2,constrain(mouseX,0,100),constrain(mouseY,0,50));
        pop();

        push();
        translate(width,50);
        rotate(radians(x));
        x+=4;
        fill(255);
        rect(width/2,height/2,constrain(mouseX,0,50),constrain(mouseY,0,20));
        pop();

        strokeWeight(2);
        stroke(255-backG/2,255-backR,255-backB)
        line(mouseX,mouseY,width/2,height/2);



        //frameRate(400);


    //scaling

      //  }
   // }
}
 

blog 3

Paul Li 
Section A


Arabesque Wall (2014/2015)

This project is very similar to my selection from last week, the Subdivide Column by Michael Hansmeyer. In fact, it was a project by Benjamin Dillenburger in collaboration with Hansmeyer. I just found their work so limitless and inspiring. I think the mixture of the ornamentation that is reminiscent of historical decoration and the sci-fi aspect of the forms and curves really pushes ideas of architectural concepts and forms I’ve been taught. The algorithm behind the creation was based on actual arabesque ornament examples, which are very mathematical and geometric in nature. By dividing and repositioning surfaces, tiles are altered into microscopic to large pieces that are folded and in the end composes a very complex geometry. I also really admire the amount of details of these structures, while being grand in size as well. The artistic aspect of these projects is that there is unlimited potential and every one of them can be adjusted with generative controls that ensures the uniqueness of each piece while being able to reach a certain desirable form.



https://benjamin-dillenburger.com/arabesque-wall/

LO 3 – Computational Fabrication

The reason why I so admire the Voronoi architecture statue made by June Lee is that I am really impressed by the organic form in architecture. The Voronoi diagram is a type of partition created by segmenting midpoints of distances of different points. To make this random geometric two-dimensional diagram look smooth and organic, the creator smoothened the shape of each Voronoi cell in grasshopper, then using the negative space created by smaller smoothened cells and the square border of the cube, the creator made a wall with organic Voronoi shaped holes. One great thing about using the grasshopper algorithm to generate shapes is that it allows the creator to easily tweak and manipulate every aspect of the geometry. For example, in this project, June Lee is able to change the size of the cube, how big the holes are, and even how smooth those holes are, without remaking the whole shape.

Voronoi Cube by June Lee

source

Project 03: Dynamic Drawing

  1. Size of large circle changes
  2. Shade of large circle changes
  3. Rotation of smaller circle changes
  4. Stroke of smaller circles changes

var uniX = 0;
var uniY = 0;


function setup() {
    createCanvas(600, 450);
    background(0);
}

function draw() {
    uniX = mouseX;
    uniY = mouseY;
    background(0);
    push();
    fill(255);
    ellipse (uniX,uniY,200);
    pop();
    for (let i = 25; i <= 575; i+=50)
    {
        for (let j = 25; j <= 425; j+=50)
        {
            circleChange(i,j);
        }
    }
}

function circleChange(Cx,Cy) {
    distanceO = Math.sqrt((uniX-Cx)*(uniX-Cx) + (uniY-Cy)*(uniY-Cy));
    distance = constrain(distanceO, 10, 200);
    var diameter = distance/4;
    var angle = Math.atan2((uniY-Cy),(uniX-Cx));
    push();
    strokeWeight(1);
    stroke(0,0,255,255);
    noFill();
    arc(Cx, Cy, diameter, diameter, -0.25*PI, 0.75*PI);
    pop();
    push();
    strokeWeight(1);
    stroke(255,0,0,255);
    arc(Cx, Cy, diameter, diameter, 0.75*PI, 1.75*PI);
    pop();

    push();
    strokeWeight(0);
    fill(distance/200*255);
    ellipse (Cx,Cy,diameter-2);
    pop();

    fill(255);
    strokeWeight(distanceO/60);
    ellipse((Cx+diameter*Math.cos(angle)/3),(Cy+diameter*Math.sin(angle)/3),diameter/3);

}

Looking Outward Blog #3 TREDDY 

TREDDY by F.A.T Lab

The project I admired most is the TREDDY, which is a free software to customize rubber stamps with any artistic ideas. The part TREDDY inspired me the most was its usefulness in daily life. Although other Parametric 3D Project might be artistically pleasant, but most of them have little to do with real life. Maybe in term of stimulations other Projects are useful too, but TREDDY is the most user friendly one that’s open to the public. We can use TREDDY to improve our quality of life by making our rubber stamps visually pleasant to us, and it’s also a great way to create toys for kids.

TEDDY allows us to 3D print through CAD files. In terms of the algorithms, I think that it puts a set of variables into the parametric equations to create shapes on the rubber stamps and the rubber stamps itself. The final form of creator’s artistic sensibilities was demonstrated through the drawing created by of rubber stamps when stained with ink and the rubber stamps itself.

The link to software (found on the blog, but it not working)

TREDDY by Free Art and Technology (F.A.T.) Lab, 2013-: https://fffff.at/wheels

Video: https://vimeo.com/golanlevin/treddy

Caption- The video explaining what TREDDY achieves by Golan Levin.

LookingOutwards-03

The project I’m choosing is called “Grotto” by Benjamin Aranda and Chris Lasch. I enjoy how this project looks because it has a fascinating premise. The project is based on the work of Wilson Bentley who worked for 45 years to prove that no two snowflakes are alike. He documented 5,381 individual crystals to notice patterns that are key inspirations behind the logic of “Grotto.” Though each snowflake is different, they follow certain rules, especially the rule of six, that not only constitute the number of sides a snowflake has but also describes the molecular relationship. This concept is used in the project, where only one simple rule is followed to maintain consistency between geometries, but it is demonstrated that possibilities generated from varying how such a rule repeats prove endless. I think that the algorithm is produced in a similar logic; one simple rule, for example, limiting the number of sides that each component can have, is kept, and then different functions loop in order to seemingly endlessly generate the shape to produce different conglomerations. In the final form, I can see much artistic sensibility, as it seems that inspirations from nature were taken to create these forms. For example, in some generated patterns, the result resembles a clump of snowflakes, as a form of direct inspiration from Bentley’s work, and in others, the product looks more like a flower.

“Grotto” proposal

“Blooming” Fibonacci Zoetrope Sculptures by John Edmark

Alexia Forsyth

15104

09/13/22

“Blooming” Fibonacci Zoetrope Sculptures by John Edmark

John Edmark’s “Blooming” Fibonacci is a beautiful floral display of 3D fabrication.  His series is beautiful and inspiring. The amount of detail is truly spectacular to see in a 3D fabrication. Edmark has several pieces similar to the one below, each magical and awe-inspiring. According to the artist, the piece was inspired by the golden angle: everything is synchronized explicitly to the rate as the sculpture turns 137.5 degrees. Every petal is placed at a particular length from the center. It gives the appearance of petals moving: shifting outwards and shrinking at the corners. The 3D model spins at 550 RPMs and is videotaped at 24-frames-per-second. This creates a repeating optical effect. His artwork is special because it mimics phyllotaxis, the geometric arrangement of leaves on a plant stem.

Bloom

Looking Outward-02

I was inspired by Frederik Vanhoutte’s generative art. I’m someone who really loves color and lights so I love how his art incorporates in an illusion of “light” through the use of colors. I think I’m drawn to it because it is interesting how light is really just the use of contrasting colors and also certain shades or colors. He also makes the circle look spherical through the use of perspective even though the shape is really 2D on my computer.

I specifically looked at piece 653 from this archive:
https://winterbloed.be/instagram-archive-2021-part-ii/#&gid=1&pid=653

I don’t know the algorithm that generated the work. However, I suppose he used many thin arcs to create that spherical effect. He also knew how to color the different lines to give it that effect of light. His artistic knowledge is shown in this through that use of persepecitve and the colors he chooses.

This is what the piece looks like

Frederik Vanhoutte, 2021

Looking Outwards _02

Nervous System combines research, computer graphics, and math to produce product design. The things that excites this company are “natural processes that produce complex forms from simple rule sets.” Something I admire about this artists work is the complexity of it while it being somewhat simple. With the repetitive patterns and forms, they’ve been able to take these designs to actual products including rings, metalsmith, and generative art. The rings honestly inspire me because it uses fuse art, science, and technology showing us the real life uses of using generative art. They use a mixture of computation, 3D-Printing and traditional metalsmithing. Further, they also make their jewelry come to life through their complex forms which a lot of the time include forms based on the nervous system of animals, humans. The founder, Jessica Rosenkrantz is also inspiring for her history and background in computing design, architecture, teaching and being a professor at MIT, and programming.

https://n-e-r-v-o-u-s.com/projects/