Within 3D computer graphics there are many different applications and possible uses for the various modeling programs that are used to create them. One person who works in 3D computer graphics is Mike Winkelmann, also known as “beeple”. Beeple is a digital artist who works with many different programs to create 3D images as well as drawing 3D images himself. He has been a digital artist for over 20 years and has done projects like “Everydays” since. Specifically, these “everydays” are digital art pieces in which he forces himself to create a new one everyday. I admire these projects because they’re all so different and oftentimes very bizarre. The algorithms that he uses are in programs like ‘Blender’ or ‘Toon Boom’. These programs are so powerful and allow him to model very precise things and produce high quality renderings at the end. He’s a very unique and outgoing artist and these sensibilities really manifest themselves in the crazy ideas that he creates. This specific image is one of those everydays that I like most.
I really admire the bold color choices in this piece of artwork. In my work so far in class, it’s been difficult to use bold colors with them looking tacky. This piece has a very smooth, continuous feel to it, which makes me wonder what code they used to generate the curves and shapes. I’m particularly curious about what was used to depict the lines separating apart from the multicolored curves. The almost gradient of the colors and the lack of sharp edges or corners help create the smooth and continuous feeling.
I would guess that there’s randomness components are used to generate the locations of spheres and the curves of the multicolored lines. There might also be randomness in the spacing apart of the lines at the locations they come apart at.
The image I found was not animated, but this piece would be fascinating to look at as an animation. If the code could use non linear movement (sine or cosine curves? Spherical movement?) to have the multicolored lines warp and shift, I would imagine that it would produce quite a mesmerizing effect.
I love Japanese paper wallpapers from the 1920’s and 1930’s, so I chose them as my particular inspiration for this work. I love the inspiration from nature while keeping with a more geometric feel, consistent with traditional Japanese art. Something about them feels timeless and elegant, but not boring. In particular, these two wallpapers inspired me:
Panel wallpaper with floating circular designsPanel wallpaper alternating between ornate rectangular strips and simple floating circular designs
The sketch I drew out before approaching the code was as follows:
Simple sketch of overall layout, as well as potential circle fills
I also decided to include color in my design. I’m personally attracted to a lot of primary color schemes, but didn’t want to play too far into that for fear of my wallpaper looking too discordant from my Japanese inspiration. So, I settled on a dark red and a warm blue.
I had the great opportunity to meet a senior designer here at CMU who did very interesting 3D computer graphics. Specifically for the Lunar Gala Collectiva show, Danny Cho created a series of computer generated 3D graphics to become dynamic backgrounds for advertisement and each fashion line. I really admire the attention to color and detail in each of these backgrounds. They were truly thoughtfully designed to fit each and every line, and they feel so immersive and polished. Each asset was carefully rendered in Cinema4D and then spliced together by a team that worked under Danny. I think that the final product is a testament to not only Danny’s work, but work of the entire team, as well as a celebration of the Lunar Gala Designers.
function setup() {
createCanvas(400, 400);
background(204, 229, 255);
}
function draw() {
//criss cross line background
for (y = 0; y < height + 25; y += 50) {
for (x = 0; x < width + 25; x += 50) {
var llength = 25;
strokeWeight(4);
stroke(102, 178, 255);
line(x - llength, y - llength, x + llength, y + llength);
line(x - llength, y + llength, x + llength, y - llength);
}
}
//ice cream cones
noStroke();
for(var a = 25; a < width; a += 50) {
for(var b = 25; b < width; b += 100) {
drawcone(a, b);
}
}
//rasberry ice cream scoops
for(var c = 25; c < width; c += 50) {
for(var d = 30; d < height; d += 100) {
rasberryscoop(c,d);
}
//chocolate ice cream scoops
for(var e = 75; e < width; e += 100) {
for(var f = 30; f < height; f += 100) {
chocolatescoop(e,f);
}
}
//white dots
for (var y = 0; y < 6; y++) {
for (var x = 0; x < 6; x++) {
fill(255);
circle(x * 100 + 50, y *100 + 50, 7);
noLoop();
}
}
}
}
function drawcone(a, b) {
fill(255, 204, 153);
triangle(a - 7, b + 10, a, b + 30, a + 7, b + 10);
}
function rasberryscoop(c, d) {
fill(255, 102, 178);
circle(c, d, 18);
}
function chocolatescoop(e, f) {
fill(102, 51, 0);
circle(e, f, 18);
}
When I began thinking of a design to create, I was pretty hungry so naturally I had my main pattern be a dessert. Originally my background was going to be vertical straight lines but I ended up making them diagonal to create a criss-cross look. I knew I wanted to incorporate alternating color scoops, and since we have had a good amount of practice with this it wasn’t hard to code. I thought having dots at some of the intersections of the blue lines would be nice, so I added that.
//Catherine Liu
//jianingl
//Section D
var catList = [1, 2, 3]; //keeps track of cat for genration of wallpaper
function setup() {
createCanvas(600, 600);
background(230,230,250);
}
function draw() {
for (var y = 30; y <= 600; y += 100) {
for (var x = 50; x <= 550; x += 150) {
var cat = random(catList); //randomly generates a cat at that position
if (cat == 1) {
CatStand(x,y);
} else if (cat == 2) {
CatFront(x,y);
} else if (cat == 3) {
CatSit(x,y);
}
}
}
noLoop()
}
function CatStand (x, y) {
strokeWeight(2);
push();
noFill();
strokeWeight(5);
stroke(233,150,122);
arc(x + 60, y-20, 50, 50, 0, HALF_PI); //tail
pop();
stroke(139,69,19)
fill(233,150,122);
ellipse(x+60, y + 40, 5, 20); // back left leg
ellipse(x+10, y + 40, 5, 20); // left front leg
ellipse(x + 40, y + 20, 80, 50); //body
triangle(x + 15, y - 15, x + 30, y - 25, x + 25, y - 5); // right ear
triangle(x - 15, y - 15, x - 30, y - 25, x - 25, y - 5); // left ear
ellipse(x, y, 50, 40); //head
ellipse(x+70, y + 42, 5, 20); //back right leg
ellipse(x+18, y + 43, 5, 20); // right front leg
fill(100,107,47);
ellipse(x-15, y, 10, 5); //left eye
ellipse(x+5, y, 10, 5); //right eye
fill(205,92,92);
ellipse(x-7, y+5, 5, 3); //nose
stroke(0,100,0);
fill(50,205,50);
circle(x-20, y+50, 10);
push();
noFill();
arc(x -65, y+45, 50, 50, 0, HALF_PI);
pop();
circle(x-35, y +50, 15);
push();
noFill();
arc(x + 83, y-20, 50, 50, 0, HALF_PI);
pop();
circle(x+ 85, y+3, 8);
}
function CatFront (x, y) {
strokeWeight(2);
push();
noFill();
strokeWeight(5);
stroke(139,69,19);
arc(x + 45, y-20, 50, 50, 0, HALF_PI); //tail
pop();
stroke(139,69,19)
fill(255,218,185);
ellipse(x+10, y+10, 90, 70); //body
triangle(x + 15, y - 15, x + 30, y - 25, x + 25, y - 5); // right ear
triangle(x - 15, y - 15, x - 30, y - 25, x - 25, y - 5); // left ear
ellipse(x, y, 50, 40); //head
fill(119,136,153);
ellipse(x-15, y, 10, 5); //left eye
ellipse(x+5, y, 10, 5); //right eye
fill(244,164,96);
ellipse(x-7, y+5, 5, 3); //nose
fill(255,218,185);
ellipse(x + 35, y + 40, 20, 10); // right leg
ellipse(x - 10, y + 40, 20, 10); // left leg
stroke(70,130,180);
push();
noFill();
arc(x -60, y+45, 50, 50, 0, HALF_PI);
arc(x + 80, y+15, 50, 50, 0, HALF_PI)
pop();
fill(135,206,235);
circle(x-30, y+45, 10);
circle(x+80, y+45, 15);
}
function CatSit (x, y) {
strokeWeight(2);
push();
noFill();
strokeWeight(5);
stroke(119,136,153);
arc(x + 60, y-10, 50, 50, 0, HALF_PI); //tail
pop();
stroke(139,69,19);
fill(119,136,153);
ellipse(x+5, y+50, 10, 20); //front right leg
ellipse(x+30, y+30, 70, 60); //body
ellipse(x+45, y+50, 30, 20); //back leg
ellipse(x+15, y+50, 10, 20); //front left leg
triangle(x + 15, y - 15, x + 30, y - 25, x + 25, y - 5); // right ear
triangle(x - 15, y - 15, x - 30, y - 25, x - 25, y - 5); // left ear
ellipse(x, y, 50, 40); //head
fill(0,100,0)
ellipse(x, y, 10, 5); //left eye
ellipse(x-15, y, 10, 5); //right eye
fill(40,26,13)
ellipse(x-7, y+5, 5, 3); //nose
stroke(75,0,130);
fill(147,112,219);
circle(x+60, y-15, 15);
circle(x+75, y-15, 15);
ellipse(x+75, y-5, 10, 5);
ellipse(x+60, y-5, 10, 5);
push();
strokeWeight(3)
line(x+67, y-15,x+67, y-5);
pop();
push();
noFill();
arc(x -65, y+45, 50, 50, 0, HALF_PI);
pop();
circle(x-35, y +50, 15);
}
Before creating this wallpaper, one of my friends from home called me and showed me pictures of her cats. In the spur of the moment, I thought that it’d be cute to create a wallpaper full of cats. I also thought it would be cool if the wallpaper could generate different versions of itself. For this, I created 3 different cats and had the draw function choose a random cat to draw each time it ran through the 2 for loops. For each cat, I drew up a quick sketch of what I wanted each cat to look like and added some decorative yarn and butterflies to make them look more like wallpaper:
For this week’s project, I chose a project is the 2009 sci-movie called Avatar by James Cameron. I chose this project because I am really astonished by the hyperrealistic yet magical graphics present in this project. For example, the facial graphics of Avatars, the ‘Pandora’ environment, the majestical animals present in this said environment etc. All these amazing photorealistic graphics present in the movie are computer generated using technologies like motion capture animation, which were developed with a lot of effort and thought. The facial expressions of the Avatars were created by designing customized skull caps for each individual actor which different small scaled technological objects embedded in these caps, which collect data and transmit it to the computers. Elements like the environmental lighting for ‘Pandora’ and highlights and shadows etc. are made using new systems that were developed using computational algorithms and motion and performance capture tech.
I admire how the project allows Grimes to have a digital version of herself because I feel like the virtual world is the exact place where people can be who they “truly are” without the confinements of real world expectations or circumstances. Though the character is kind of scary, I admire how genuinely eerie the 3D baby looks because it aligns well with the grim messages it speaks (in some videos, WarNymph talks of the end of the world). I know that Kowalski did the 3D sculpting partly on his “home desktop” and with ZBrush (digital sculpting application), but I can’t find much else on the algorithms or mechanisms that generated the work. Kowalski’s artistic focus lies in making incredibly detailed 3D characters, which is clearly exemplified by the baby’s intricate wings and leg tattoo, which accurately matches Grimes’ tattoo.
// Yash Mittal
// Section D
var x = 95;
var y = 95;
function setup() {
createCanvas(600, 600);
background (232, 217, 203);
noLoop();
}
function draw() {
for (var col = 0.95; col <= 10; col = col + 2) {
for (var row = 1.3; row <= 9; row = row + 2) {
lion (x * 0.8 * col, y * row);
}
}
}
function lion (x, y) {
noStroke();
fill (250, 68, 9);
ellipse (x - 35, y + 35, 50, 50); // mane circle 1
ellipse (x - 55, y + 2, 43, 45); // mane circle 2
ellipse (x - 43, y - 39, 55, 50); // mane circle 3
ellipse (x - 10, y - 63, 53, 53); // mane circle 4
ellipse (x + 32, y - 50, 53, 53); // mane circle 5
ellipse (x + 52, y - 10, 50, 50); // mane cirlce 6
ellipse (x + 40, y + 30, 50, 50); // mane circle 7
ellipse (x + 5, y + 50, 55, 55); // mane circle 8
fill (254, 146, 9); // orange face
ellipse (x, y, 96, 90); // background of face
fill (59, 23, 9); // dark brown
ellipse (x - 25, y, 8, 12); // left eye
ellipse (x + 25, y, 8, 12); // right eye
fill (255, 209, 53);
ellipse (x, y + 5, 16, 35); // nose highlight
fill (255);
ellipse (x, y + 20, 33, 22); // mouse background
fill (53, 22, 3);
ellipse (x, y + 13, 20, 8); // nose
rect (x - 1, y + 13, 1, 9); // line from nose to mouth
strokeWeight (1);
stroke (53, 22, 3);
line (x - 6, y + 23, x + 6, y + 21); // mouth smile
fill (255);
noStroke ();
ellipse (x - 26.5, y - 3, 3, 5); // left eye highlight
ellipse (x + 23.5, y - 3, 3, 5); // right eye highlight
fill (255, 170, 187);
ellipse (x - 25, y + 15, 12, 12); // left cheek highlights
ellipse (x + 25, y + 15, 12, 12); // right cheek highlights
fill (254, 146, 9);
ellipse (x - 30, y - 40, 18, 18); // left ear base
ellipse (x + 30, y - 40, 18, 18); // right ear base
fill (255, 209, 53);
ellipse (x - 30, y - 40, 10, 10); // left ear highlight
ellipse (x + 30, y - 40, 10, 10); // right ear highlight
}
I made a lion wallpaper for this project. I started off with drawing my ideas out and then I started making the different elements of the face. Next, I created the loops to repeat the pattern, which took a little bit of time because I got confused with the numbers.
The project I am looking at this week is called “Momoplanet | Inner Peace Animation” by Zigor Samaniego and his team in 2018.
I really admire this project specifically because I think it is so well crafted. Part of the part of this project was to incorporate many styles into one animation seamlessly and it not only is well done but it also elevated the story it conveyed.
Because of the many styles, the animation must of been created with multiple programs to effectively combine every medium. The team used not only 3D graphics but also “retro-futurism, illustration, stop motion, hand-drawn illustration in 3D-graphics…” So, to bring all the styles together the team must’ve used an animation software to piece together each scene.
Overall between the level of craft and certain style you can tell this work was influenced by Samaniego.
![[OLD SEMESTER] 15-104 • Introduction to Computing for Creative Practice](../../../../wp-content/uploads/2023/09/stop-banner.png)
