Month: September 2019

Kristine Kim – Project -05-Wallpaper

sketch

//Kristine Kim
//Section D
//younsook@andrew.cmu.edu
//Project-05- Wallpaper
var x1 = 100; //x of the rect
var y1 = 100; //y of the rect

function setup() {
    createCanvas(500, 600);
    noLoop();   
}

function draw() {
    background(150, 200, 150);

//circles in the background
    for (var y = 0; y < height; y += 2 ) {
        for (var x = 0; x < width; x += 2) {
            var rx = x1 + x *25
            var ry = y1 + y * 25
            noFill();
            strokeWeight(3);
            stroke(245);
            rect(rx-100, ry-100, 60, 60);
            fill(150, 143, 255);

        }
    }

// 1st row of the curves
    for (var x = 0; x < width/4-20; x = x + 1) {
        fill(245);
        point(x, 60 - 50 * sin(radians(x)) - 40);
        point(x + 135, 60 - 50 * sin(radians(x)) - 40);
        point(x + 265, 60 - 50 * sin(radians(x)) - 40);
        point(x + 390, 60 - 50 * sin(radians(x)) - 40);

        fill(255, 191, 241);
        point(x, 60 - 50 * cos(radians(x)) - 40);
        point(x + 135, 60 - 50 * cos(radians(x)) - 40);
        point(x + 265, 60 - 50 * cos(radians(x)) - 40);
        point(x + 390, 60 - 50 * cos(radians(x)) - 40);

// shadows for the 1st row
        strokeWeight(8);
        fill(110);
        point(x, 60 - 50 * sin(radians(x)) - 47);
        point(x, 60 - 50 * cos(radians(x)) -47);
        point(x + 135, 60 - 50 * sin(radians(x)) -47);
        point(x + 135, 60 - 50 * cos(radians(x)) -47);
        point(x + 265, 60 - 50 * sin(radians(x)) - 47);
        point(x + 265, 60 - 50 * cos(radians(x)) - 47);
        point(x + 390, 60 - 50 * sin(radians(x)) - 47);
        point(x + 390, 60 - 50 * cos(radians(x)) - 47);
 
 //2nd row
        fill(245);
        point(x, 60 - 50 * sin(radians(x)) + 50);
        point(x + 135, 60 - 50 * sin(radians(x)) + 50);
        point(x + 265, 60 - 50 * sin(radians(x)) + 50);
        point(x + 390, 60 - 50 * sin(radians(x)) + 50);

        fill(255, 191, 241);
        point(x, 60 - 50 * cos(radians(x)) + 50);
        point(x + 135, 60 - 50 * cos(radians(x)) + 50);
        point(x + 265, 60 - 50 * cos(radians(x)) + 50);
        point(x + 390, 60 - 50 * cos(radians(x)) + 50);

 //shadows for the 2nd row  
        strokeWeight(8)
        fill(110);
        point(x, 60 - 50 * sin(radians(x)) + 57);
        point(x, 60 - 50 * cos(radians(x)) + 57);
        point(x + 135, 60 - 50 * sin(radians(x)) + 57);
        point(x + 135, 60 - 50 * cos(radians(x)) + 57);
        point(x + 265, 60 - 50 * sin(radians(x)) + 57);
        point(x + 265, 60 - 50 * cos(radians(x)) + 57);
        point(x + 390, 60 - 50 * sin(radians(x)) + 57);
        point(x + 390, 60 - 50 * cos(radians(x)) + 57);

//3rd row
        fill(245);
        point(x, 60 - 50 * sin(radians(x)) + 150);
        point(x + 135, 60 - 50 * sin(radians(x)) + 150);
        point(x + 265, 60 - 50 * sin(radians(x)) + 150);
        point(x + 390, 60 - 50 * sin(radians(x)) + 150);

        fill(255, 191, 241);
        point(x, 60 - 50 * cos(radians(x)) + 150);
        point(x + 135, 60 - 50 * cos(radians(x)) + 150);
        point(x + 265, 60 - 50 * cos(radians(x)) + 150);
        point(x + 390, 60 - 50 * cos(radians(x)) + 150);

//shadows for 3rd row
        strokeWeight(8); 
        fill(100);
        point(x, 60 - 50 * sin(radians(x)) + 157);
        point(x, 60 - 50 * cos(radians(x)) + 157);
        point(x + 135, 60 - 50 * sin(radians(x)) + 157);
        point(x + 135, 60 - 50 * cos(radians(x)) + 157);
        point(x + 265, 60 - 50 * sin(radians(x)) + 157);
        point(x + 265, 60 - 50 * cos(radians(x)) + 157);
        point(x + 390, 60 - 50 * sin(radians(x)) + 157);
        point(x + 390, 60 - 50 * cos(radians(x)) + 157);


//4th row
       fill(245);
        point(x, 60 - 50 * sin(radians(x)) + 250);
        point(x + 135, 60 - 50 * sin(radians(x)) + 250);
        point(x + 265, 60 - 50 * sin(radians(x)) + 250);
        point(x + 390, 60 - 50 * sin(radians(x)) + 250);

        fill(255, 191, 241);
        point(x, 60 - 50 * cos(radians(x)) + 250);
        point(x + 135, 60 - 50 * cos(radians(x)) + 250);
        point(x + 265, 60 - 50 * cos(radians(x)) + 250);
        point(x + 390, 60 - 50 * cos(radians(x)) + 250);

//shadows for 4th row
        strokeWeight(8); 
        fill(100);
        point(x, 60 - 50 * sin(radians(x)) + 257);
        point(x, 60 - 50 * cos(radians(x)) + 257);
        point(x + 135, 60 - 50 * sin(radians(x)) + 257);
        point(x + 135, 60 - 50 * cos(radians(x)) + 257);
        point(x + 265, 60 - 50 * sin(radians(x)) + 257);
        point(x + 265, 60 - 50 * cos(radians(x)) + 257);
        point(x + 390, 60 - 50 * sin(radians(x)) + 257);
        point(x + 390, 60 - 50 * cos(radians(x)) + 257);


//5th row
        fill(245);
        point(x, 60 - 50 * sin(radians(x)) + 350);
        point(x + 135, 60 - 50 * sin(radians(x)) + 350);
        point(x + 265, 60 - 50 * sin(radians(x)) + 350);
        point(x + 390, 60 - 50 * sin(radians(x)) + 350);

        fill(255, 191, 241);
        point(x, 60 - 50 * cos(radians(x)) + 350);
        point(x + 135, 60 - 50 * cos(radians(x)) + 350);
        point(x + 265, 60 - 50 * cos(radians(x)) + 350);
        point(x + 390, 60 - 50 * cos(radians(x)) + 350);

//shadows for 5th row
        strokeWeight(8); 
        fill(100);
        point(x, 60 - 50 * sin(radians(x)) + 357);
        point(x, 60 - 50 * cos(radians(x)) + 357);
        point(x + 135, 60 - 50 * sin(radians(x)) + 357);
        point(x + 135, 60 - 50 * cos(radians(x)) + 357);
        point(x + 265, 60 - 50 * sin(radians(x)) + 357);
        point(x + 265, 60 - 50 * cos(radians(x)) + 357);
        point(x + 390, 60 - 50 * sin(radians(x)) + 357);
        point(x + 390, 60 - 50 * cos(radians(x)) + 357);

//6th row  
        fill(245);
        point(x, 60 - 50 * sin(radians(x)) + 450);
        point(x + 135, 60 - 50 * sin(radians(x)) + 450);
        point(x + 265, 60 - 50 * sin(radians(x)) + 450);
        point(x + 390, 60 - 50 * sin(radians(x)) + 450);

        fill(255, 191, 241);
        point(x, 60 - 50 * cos(radians(x)) + 450);
        point(x + 135, 60 - 50 * cos(radians(x)) + 450);
        point(x + 265, 60 - 50 * cos(radians(x)) + 450);
        point(x + 390, 60 - 50 * cos(radians(x)) + 450);

//shadows for 6th row
        strokeWeight(8); 
        fill(100);
        point(x, 60 - 50 * sin(radians(x)) + 457);
        point(x, 60 - 50 * cos(radians(x)) + 457);
        point(x + 135, 60 - 50 * sin(radians(x)) + 457);
        point(x + 135, 60 - 50 * cos(radians(x)) + 457);
        point(x + 265, 60 - 50 * sin(radians(x)) + 457);
        point(x + 265, 60 - 50 * cos(radians(x)) + 457);
        point(x + 390, 60 - 50 * sin(radians(x)) + 457);
        point(x + 390, 60 - 50 * cos(radians(x)) + 457);

//7th row
        fill(245);
        point(x, 60 - 50 * sin(radians(x)) + 550);
        point(x + 135, 60 - 50 * sin(radians(x)) + 550);
        point(x + 265, 60 - 50 * sin(radians(x)) + 550); 
        point(x + 390, 60 - 50 * sin(radians(x)) + 550);

       
        fill(255, 191, 241)
        point(x, 60 - 50 * cos(radians(x)) + 550);
        point(x + 135, 60 - 50 * cos(radians(x)) + 550);
        point(x + 265, 60 - 50 * cos(radians(x)) + 550);
        point(x + 390, 60 - 50 * cos(radians(x)) + 550);

//shadows for 7th row
        strokeWeight(8); 
        fill(100);
        point(x + 390, 60 - 50 * sin(radians(x)) + 557);
        point(x + 390, 60 - 50 * cos(radians(x)) + 557);
        point(x + 265, 60 - 50 * sin(radians(x)) + 557);
        point(x + 265, 60 - 50 * cos(radians(x)) + 557);
        point(x + 135, 60 - 50 * sin(radians(x)) + 557);
        point(x + 135, 60 - 50 * cos(radians(x)) + 557);
        point(x, 60 - 50 * sin(radians(x)) + 557);
        point(x, 60 - 50 * cos(radians(x)) + 557);
    }
}

For this project, I wanted to use curved lines instead of rigid geometric shapes so I used sin() and cos() to portray that. I also wanted to convey a little bit of depth and dimension, so I had shadows to the curves and circles in the background. The color of the circles are a couple of shades darker than the background color so that it could help portray more dimension.

index

Julia Nishizaki – Looking Outwards – 05

Gustavo Henrique – from his series, “Scenes #1,” some scenes he did for fun

The artist I chose to write about this week is Gustavo Henrique, a 3D artist and freelancer from Brazil. I really admire not only his use of color and how he frames his work, but also the playfulness and movement he captures. Through his use of a matte finish, his forms come off as organic, friendly, and fluffy, almost as if you could make them out of clay or reach into the illustration to squish them. Moreover, by blurring the edges and forms that aren’t the main focus, his creations look like they’re miniatures, as if you took a picture of them using a high aperture on your camera. Henrique uses Cinema 4D and Octane Render to create his illustrations.

Gustavo Henrique – another illustraion from his series, “Scenes #1,” some scenes he did for fun

Jacky’s LookingOutwards 05

Virtual Reality and Architecture

The Dawn of the Virtual Reality in Architecture | Gunita Kulikovska | TEDxRiga

With the advancement of technology, the field of architecture has revolutionized and buildings no longer need to be physically built in order for architects to experience the space. With the help of virtual reality, architects are able to design and feel the space in real time in three dimensional virtual world.

In the Ted Talk, Gunita Kulikovska shared her experience as well as he research in how the virtual reality technologies can be used in the fields of architecture. Coherently involved in both architecture and fostering technology startups, Gunita Kulikovska believes that it is an revolutionary mission. She envisions to break the constrains of knowledge and limits of communication between client and architect, with the help of straightforward visual support from virtual reality.

Claire Yoon-Project 05 -Wallpaper


sketch

It was fun to experiment with different shapes and lines and I got inspiration from the scaling on the turtle’s shell and further gave dimension by adding a gradient.

/* Claire Yoon
   claireyo@andrew.cmu.edu
   Section E
   Wall Paper */
    var pu;
    var pi;

    function setup() {
      createCanvas(640, 600);
      background(140,171,190);
      //gradient for lines
      pu = color(164, 168, 209);
      pi = color(187, 160, 178);
      setGradient(pu, pi);
    }
    function draw() {
      //vertical loop for pattern y
      for(var y = 20; y <= height; y += 50){
        //horizontal loop for pattern x
        for(var x = 20; x <= width; x += 50){
          //call pattern
          pattern (x,y);
        }
      }
      noLoop()
    }
    function pattern(x, y) {
      fill(209,242,255);
      strokeWeight(0);
      rect(x, y, 20, 20);

      noFill();
      stroke(194, 85, 100);
      strokeWeight(1.5);
      line(0, y - 15, width, y - 15);
      line(x - 15, 0, x - 15, height);
    }
    function setGradient(pu,pi) {
      //gradient for the background
      noFill();
      strokeWeight(1.5);
      for (var c = 0; c < height; c++ ) {
      var blend = map(c, 0, height, 0, 1)
      var m = lerpColor(pu, pi, blend);
      stroke(m);
      line(0, c, width, c);
    }
  }




//187,160,178
// stroke(164, 191, 235);
// strokeWeight(1);

Mari Kubota- Looking Outwards- 05

3DQ is a digital agency based in Barcelona founded in 2015 by Diego Querol that does Interior Design and Architecture Computer Generated Images (CGI). The purpose of 3DQ is to make photorealistic renderings of interior spaces and architecture in order to help people visualize a project.  The Coworking 2040, for example, was made using Corona Renderer, which makes design, composition, lighting and texturing and modelling. Corona Renderer can also edit the texture and lighting of a material real time with little rendering time. 

The Coworking 2040

The colorful and realistic renderings of the Coworking 2040 drew me to 3DQ. Being able to create a tool to visualize a space without actually creating it allows people to get a feel of the space without jeopardizing money or time. A lot of 3DQ’s projects are highly saturated and texturized, giving it an alluring and realistic glow.

Minjae Jeong-project-05

sketch

//Minjae Jeong
//Section B
//minjaej@andrew.cmu.edu
//Project-05



function setup() {
    createCanvas(350, 350);
    background(0);
    stroke(255);
}

function draw() {
    stroke(255);
    for (i = 0; i < 4; i++) { //Xs
        for (j = 0; j < 4; j++) {
            var x1 = 45 + i * 80;
            var x2 = 65 + i * 80;
            var y1 = 15 + j * 100;
            var y2 = 35 + j * 100;
            line(x1, y1, x2, y2);
            line(x2, y1, x1, y2);
        }
    }
    stroke("red");
    for (i = 0; i < 3; i++){ //circles
        for (j = 0; j < 3; j++){
            noFill();
            var x = 95 + i * 80;
            var y = 75 + j * 100;
            ellipse(x, y, 30, 30);
        }
    }
    // big X
    stroke('red');
    line(0, 0, 350, 350);
    line(350, 0, 0, 350);

    stroke('red');
    ellipse(175, 175, 165, 165);
    stroke('white');
    ellipse(175, 175, 255, 255);
}

For this project, I got my inspiration from crosshair of a firearm. When I thought of a crosshair, it was appropriate to use crosses and circles. With black background and red elements, it provides a feeling that no one is safe.

Jacky Tian’s Project 05

sketch

//Yinjie Tian
//Section D
//yinjiet@andrew.cmu.edu
//project-05

function setup() {
    createCanvas(600, 400);
    background(128, 128, 128);
    var tw = 60;
    var th = 60;
    var oy = 25;
    var ox = 5;

    for (var y = 0; y < 6; y++) {
        for (var x = 0; x < 10; x++) {
            var py = oy + y * th;
            var px = ox + x * tw;
           
            strokeWeight(0);
            fill(200, 190,  100)
            rect(px, py, 50, 50);
            strokeWeight(2);
            stroke(255);
            line(px,  py + 15,  px + 80,  py + 15);
            strokeWeight(4);
            stroke(65, 105, 225);
            line(px + 35, py, px + 35, py +  80)
            noStroke()
            fill(128, 0, 0);
            ellipse(px + 50, py + 50, 10, 10);
        }
    }
  noLoop();
    
    }

function draw() {
    // draw is not called due to noLoop() in setup()
}

EARLY SKETCH / CONCEPT SKETCH

From the early concept sketch, you can see that i was intrigued by grids combined with rectangles and dots. I was then inspired by the color scheme of the original Burberry pattern which also has the grids and rectangles.

Project 05 – Wallpaper


sketch

// Deklin Versace Section E
var patX = 120;
var patY = 120;

function setup() {
    createCanvas(900, 900);
    background(238, 195, 246);
    var xSpace = -30;
    var ySpace = 110;
    noStroke();

    for (var y = 0; y < 7; y++) {
      if (y % 2 === 0) {
        for (var x = 0; x < 12; x++) {
            var sety = ySpace + y * patY;
            var setx = xSpace + x * patX;
            drawHead1(setx, sety, random(1, 90));
        }
      } else {
          for (var x = 0; x < 11; x++) {
            var sety = ySpace + y * patY;
            var setx = xSpace + x * patX;
            drawHead1(setx + patX / 2, sety, random(1, 90));
          }
      }
    }
    noLoop();
}

function drawHead1(centerX, centerY, rotation) {
  fill(173, 60, 70);
  ellipseMode(CENTER);
  ellipse(centerX, centerY, patX, patY);
  ellipse(centerX, centerY - patY / 2, patX / 5, patY / 5);
  ellipse(centerX - patX / 7, centerY - patY / 2, patX / 6, patY / 6);
  ellipse(centerX + patX / 7, centerY - patY / 2, patX / 6, patY / 6);
  fill(89, 22, 22);
  triangle(centerX, centerY + patY / 3, centerX - patX / 4, centerY + patX / 6, centerX + patX / 4, centerY + patX / 6);
  fill(117, 40, 53);
  triangle(centerX, centerY - patY / 4, centerX - patX / 4, centerY + patX / 6, centerX + patX / 4, centerY + patX / 6);
  triangle(centerX, centerY + patY / 5, centerX - patX / 4, centerY + patX / 6, centerX + patX / 4, centerY + patX / 6);
  fill("white");
  ellipse(centerX - patX / 5, centerY - patY / 6, patX / 5, patY / 5);
  ellipse(centerX + patX / 5, centerY - patY / 6, patX / 5, patY / 5);
  fill("black");
  ellipse(centerX + patX / 5, centerY - patY / 6, patX / 8, patY / 8);
  ellipse(centerX - patX / 5, centerY - patY / 6, patX / 8, patY / 8);
}

Minjae Jeong-LO-5

https://www.pk3d.com/

The works by Piotr Kosinski attracted me more than other arts because I like cars. The artist produces many car projects, not only the exterior but also the interior of cars. At first when I looked at his works, I thought they were high quality photos of cars taken by professionals to promote the automobile. However, knowing that it is a work done with 3D computer graphics, I’m amazed how detailed it can be, and also how it perfectly represents the real vehicles. With such details, I’m sure the 3D computer graphics are useful in many ways for companies to promote and design their products.

Janet Peng-LookingOutwards-05

Miniature building stylized/inspired by games
Model/image before color is applied
Outline/build of model before any lighting/shading, depth, and texture is applied

I really like the style of this project. Gustavo Henrique, a 3D Artist, motion designer, and art director, creates many different small 3D models that are usually buildings and often “toy-like”. The color and texture of the 3D models make the images more believable and they feel more like real toys or blocks. I believe that this work was probably created in some 3D computer modeling software such as Blender, Maya, or Autodesk Fusion. These programs allow you to make 3D objects on the computer and then render them with different textures, materials, lighting, and camera angles. I think the creator’s love for muted and soft colors as well as his love for miniature forms really show in these works. As well, his minimalist style really shows in these works.