Anabelle – [OLD SEMESTER] 15-104 • Introduction to Computing for Creative Practice https://courses.ideate.cmu.edu/15-104/f2022 Professor Tom Cortina • Fall 2022 • Introduction to Computing for Creative Practice Sat, 19 Nov 2022 20:16:42 +0000 en-US hourly 1 https://wordpress.org/?v=6.0.8 anabelle’s blog 11 https://courses.ideate.cmu.edu/15-104/f2022/2022/11/19/anabelles-blog-11/ https://courses.ideate.cmu.edu/15-104/f2022/2022/11/19/anabelles-blog-11/#respond Sat, 19 Nov 2022 20:16:42 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=75838 Continue reading "anabelle’s blog 11"]]>

The article Beeple’s digital ‘artwork’ sold for more than any painting by Titian or Raphael,” discusses what the impacts the capitalization of art may have on the industry through the lens of NFTs. It highlights the auctioning of Beeple’s Everydays: The First 5000 Days for $69.3 million, one of the highest bids for art in history. The author criticizes how nonphysical, nontechnical, and nonbeautiful art has gripped the capitalist market by rebranding them as special NFTs, or digital property. He seems most turned off by how the two highest bidders were both founders of blockchain companies — blockchains are exactly how NFTs receive their value, so the entire event feels orchestrated in his opinion. I think NFTs can be respected as a type of commerce, but I hesitate to call each individual work art. Either way, new technology and new ways of creating goods for the market will always appear and resisting them can be pretty futile.

Citation:
Washington Post. “Perspective | Beeple’s Digital ‘Artwork’ Sold for More than Any Painting by Titian or Raphael. But as Art, It’s a Great Big Zero.” Accessed November 19, 2022. https://www.washingtonpost.com/entertainment/museums/beeple-digital-artwork-sale-perspective/2021/03/15/6afc1540-8369-11eb-81db-b02f0398f49a_story.html.

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/11/19/anabelles-blog-11/feed/ 0
anabelle’s blog 09 https://courses.ideate.cmu.edu/15-104/f2022/2022/11/03/anabelles-blog-09/ https://courses.ideate.cmu.edu/15-104/f2022/2022/11/03/anabelles-blog-09/#respond Fri, 04 Nov 2022 03:12:22 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=75033 Continue reading "anabelle’s blog 09"]]>

One work I find inspiring is Claudia Hart’s The Flower Matrix. Hart is one of the pioneers from the 80s XR emergence in art. She received her education in at and architecture from NYU and Columbia and now teaches as a professor at the Chicago Institute of Art. I think it’s particularly cool how she combines physical spaces with the VR space to create a magical, surreal space that raises the question on what is “natural” and “real.” The entire exhibit is a small, isolated room covered in matrices and flashing images, which effectively convey the “surreal” effect she wants. The fact that there is also a sound element to the exhibition just makes it more complex and cooler. The multiple elements she balances in this work reminds me of the object arrays we’ve been learning about in lecture, where the VR, physical, and audio are all objects in the flower matrix array.

One of the flashing images that covers the walls of the exhibits:

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/11/03/anabelles-blog-09/feed/ 0
anabelle’s blog 08 https://courses.ideate.cmu.edu/15-104/f2022/2022/10/29/anabelles-blog-08/ https://courses.ideate.cmu.edu/15-104/f2022/2022/10/29/anabelles-blog-08/#respond Sat, 29 Oct 2022 18:16:04 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=74850 Continue reading "anabelle’s blog 08"]]>

Jake Barton is the Founder and Chief Creative Officer at Local Projects (I’m a local projects fan, so I was pleasantly surprised to see him on the index of speakers). He received his Bachelor’s from Northwestern University for Performance Studies and his Masters’ from New York University in Interactive Technology. Barton has been a pioneer in immersive experience and HCI/UX since 2000. His firm, Local Projects, is a media design studio responsible for award winning projects like the 9/11 Memorial and Museum and the Eisenhower Presidential Memorial. One work that I particularly admire is Greenwood Rising, which is an exhibit on the 1921 Tulsa Race Massacre. It’s one of Local Project’s more recent works, so it’s cool to see how his 2015 lecture content has remained consistent to his original visions, yet also expanded with the introduction of new technology and tools in the present. In his 2015 Eyeo Festival presentation, he mainly spoke about the 9-11 Memorial Museum and the types of experiences and emotions he wanted to evoke through it. He discussed how to present, hold, and distirbute memories through museums and how he tried to involve the audience in the exhibit as well. You can see this in the Greenwood Rising exhibit, which uses XR technology to force the audience to become physically involved to reveal the story of the Tulsa Massacre. One thing I enjoyed about Barton’s presenting skills is how he manages to fly through numerous projects and concepts while still keeping things clear and linear. Even though he breaks from his lecture with an aside about memes, I could still tell that there was a purpose to the tangent and did not feel like the lecture’s flow was broken. His charisma and sociability compel the audience to sit through his 50 minute lecture painlessly, and demonstrates the importance of embedding your personality into your work to make others care about it.

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/10/29/anabelles-blog-08/feed/ 0
anabelle’s blog 07 https://courses.ideate.cmu.edu/15-104/f2022/2022/10/15/anabelles-blog-07/ https://courses.ideate.cmu.edu/15-104/f2022/2022/10/15/anabelles-blog-07/#respond Sun, 16 Oct 2022 01:18:40 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=74552 Continue reading "anabelle’s blog 07"]]>

http://manovich.net/index.php/exhibitions/on-broadway

One work I found inspiring was Lev Manovich’s “On Broadway.” It resonated with me for two reasons: one, I’m writing this blog while in NYC (hence, Broadway) and two, I appreciate the lack of numbers and traditional data in the project. Overall, I’m not too big on STEM and mathematics, so this feels like a unique approach that tries to broaden the statistical audience to the average math hating person. I also think this approach was generally successful — anyone who views this gains a comprehensive survey of Manhattan even without the physical data (I mean, I find that when I’m reading actual statistics, I generally gloss over the figures and take away the big idea more than anything else anyways). I also liked this project because I felt as if it was something even I could recreate (albeit on a smaller scale). It seems like a lot of data storage (and we’ve learned about NUMEROUS ways to represent and store data already) and visual representation (and this is a creative computing class!). It’s inspiring to think large projects like this are within my reach

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/10/15/anabelles-blog-07/feed/ 0
anabelle’s project 06 https://courses.ideate.cmu.edu/15-104/f2022/2022/10/08/anabelles-project-06/ https://courses.ideate.cmu.edu/15-104/f2022/2022/10/08/anabelles-project-06/#respond Sun, 09 Oct 2022 01:26:47 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=74039 Continue reading "anabelle’s project 06"]]>

we always think too much about how time passes by too quickly. don’t be obsessed with aging, and just think about the good that comes with your birthday!

the background indicates to minute (to some extent). at the start of the hour, the background will be pink. it will become increasingly bluer the greater the minute is.

the number of strawberries on the cake indicate the hour of the day in a 12-hour cycle. to distinguish am and pm, the fruit will turn into blueberries in the am and strawberries in the pm.

the number of candles indicates the month and the number of gifts indicates the day.

sketch

// kayla anabelle lee (kaylalee)
// kaylalee@andrew.cmu.edu
// section c
// project 6

// define variables
let redValue, blueValue, greenValue;
let strawberryFill;
let giftCounter;
let giftDraw;

function setup() {
    createCanvas(480, 480);
    let h = hour(); 
    let m = minute();
    let d = day();
    let mon = month();

    // initialize background color
    redValue = 248;
    blueValue = 226;
    greenValue = 226;

    giftCounter = 0;

}

function draw() {
    // every minute, the background changes by this increment
    let redMinute = 1.25;
    let blueMinute = 0.633;
    let greenMinute = 0.1167;

    // final color will be (173, 188, 219)
    background(redValue - (redMinute*minute()), blueValue - (blueMinute*minute()), greenValue - (greenMinute*minute())); // final color will be (173, 188, 219)

    // set color variables for helper functions
    let cakeColor = color(255, 214, 148);
    let icingColor = color(246, 158, 178);
    let tableColor = color(112, 77, 36);

    let candleColor = color(247, 200, 238);
    let outerFire = color(245, 154, 142);
    let innerFire = color(255, 202, 150);

    let giftColor = color(171, 156, 217);
    let ribbonColor = color(248, 239, 233);

    // draw table and cake
    table(150, height - 105, 275, 190, tableColor); // 4/3 ratio
    cakeBase(150, height - 160, 150, 75, cakeColor);
    cakeBase(150, height - 230, 100, 50, cakeColor);

    // the number of candles = month (12 candles total)
    for (i = 1; i <= month()%12; i++) {
        if (i <= 6) {
            candle(i*15 + 96, 205, 8, 32, candleColor); // (top row)

        } else {
            candle(i*20 - 45, 255, 10, 40, candleColor); // 2/3 ratio (bottom row)
        }
    }

    // the number of gifts = day (31 total)
    giftDraw = true;
    giftCounter = 0;
    for (i = 0; i < 7; i++) {
        for (j = 0; j < 5; j++) {
            if (giftCounter >= day()) {
                giftDraw = false;
            } gift(280 + 30*i, 470 - 30*j, 25, 25, giftColor, ribbonColor, giftDraw);   
            giftCounter += 1;
        }
    }

    print (giftCounter);

    // now working on strawberries
    // for PM, fill is BLUE. for AM, fill is PINK)
    if (hour() <= 12) {
        strawberryFill = color(73, 104, 152);
    } if (hour() > 12) {
        strawberryFill = color(231, 84, 128);
    }

    // the number of strawberries = hour of the day (12 strawberries total)
    for (i = 1; i <= hour()%12; i ++) {
        if (i <= 6) {
            strawberry(i*16 + 92, 220, 15, 25, strawberryFill); // (top row)

        } else {
            strawberry(i*22 - 60, 270, 15, 25, strawberryFill); // 2/3 ratio (bottom row)
        }
    }

    textSize(20);
    textAlign(CENTER);
    text('life is too short to worry about time. eat some cake!', 220, 180, 300, 200);

}

/*my functions*/

function cakeBase(x, y, w, h, color) { // draws the bread part of cake
    var r = (w / 6);
    noStroke();
    fill(color);

    // base rectangle
    rectMode(CENTER);
    rect(x, y, w, h);

    // left arc
    arc(x - w/2 + r/2, y - h/2, r, r, radians(180), radians(270));

    // right arc
    arc(x + w/2 - r/2, y - h/2, r, r, radians(270), radians(360));

    // connect arcs
    line(x - w/2 + r/2, y - 2*r, x + w/2 - r/2, y - 2*r);
    rect(x, y - 7*r/4, w - r, r/2);

}

function table(x, y, w, h, color) { // draws table
    fill(color);
    rectMode(CENTER);
    noStroke();

    // vertical slabs
    rect(x - 3*w/10, y + 3*h/10, w/12, h/2); // left
    rect(x + 3*w/10, y + 3*h/10, w/12, h/2); // right

    // horizontal slabs
    rect(x, y, (3*w)/4, (h/6)); // bottom
    rect(x, y - h/12, w, h/12); // top
}

function gift(x, y, w, h, boxColor, ribbonColor, draw) { // draws one present

    if (!draw) {
        return false;
    }

    rectMode(CENTER);
    noStroke();

    fill(boxColor) // use arrays to create different colors for each gift

    // rectangles
    rect(x, y, 4*w/5, 4*h/5); // bottom
    rect(x, y - 2*h/5, w, h/10); // top

    // bow
    stroke(ribbonColor);
    strokeWeight(w/10);
    noFill();
    circle(x - w/8, y - h/2, w/4);
    circle(x + w/8, y - h/2, w/4);

    // box ribbon
    fill(ribbonColor);
    noStroke();
    rectMode(CENTER);
    rect(x, y, w/5, 8*h/10);
}

function candle(x, y, w, h, color) { // the width to height should be a 1/4 ratio
    rectMode(CENTER);
    fill(color);
    strokeWeight(1);
    stroke(150);
    rect(x, y, w, 4*h/5);

    fill(255, 0, 0, 150); // outer flame
    noStroke();
    ellipse(x, y - 3*h/5, 4*w/5, 3*h/10);

    fill(255, 165, 0, 150);
    ellipse(x, y - 11*h/20, 3*w/5, h/5);
}

function strawberry(x, y, w, h, color) { // draws one strawberry
    fill(color);
    noStroke();

    arc(x, y, w, h, radians(180), radians(0));
    arc(x, y, w, h/10, radians(0), radians(180));

}

function icing(x, y, w, h, color) {
    push();
    translate(x, y);
    fill(color); 
    stroke(color);

    x += cos(radians(x));
    y += sin(radians(y));

    point(x, y);
    pop();
}
]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/10/08/anabelles-project-06/feed/ 0
anabelle’s blog 06 https://courses.ideate.cmu.edu/15-104/f2022/2022/10/08/anabelles-blog-06/ https://courses.ideate.cmu.edu/15-104/f2022/2022/10/08/anabelles-blog-06/#respond Sun, 09 Oct 2022 01:21:41 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=74035 Continue reading "anabelle’s blog 06"]]>

One work of random art that I enjoy is the infinite biome generation of Minecraft. Minecraft can create infinte, borderless worlds filled with a plethora of biomes, structures, and landforms. In my opinion, Minecraft’s unlimited ability to generate unique world after unique world is what keeps it at the top of the gaming market. From observation, I think Minecraft uses perlin noise/randomness to generate its biomes — none of the scenery changes feel jarring and the game has an overall organic, natural feeling to it. I just find it really cool that Minecraft is able to randomize SO many elements to bring together an organized, cohesive piece. For example, it doesn’t just randomize whether it’ll generate an ocean biome or desert biome; the biomes themselves have randomly generated elements so no two oceans are alike. Furthermore, Minecraft stores each generated “seed” or world so they can be reaccessed for whoever wants to explore a specific world. Minecraft never lets its audience become bored by constantly adding new, consistently creative randomized events that give the joy of open-world exploration with each play.

Some cool minecraft worlds: https://www.youtube.com/watch?v=gFHj4E_1o6E&ab_channel=Minecraft%26Chill

(Like, can you believe these seeds spawned naturally, rather than a player going in and building the biome themself? It’s so cool!)

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/10/08/anabelles-blog-06/feed/ 0
anabelle’s project 05 https://courses.ideate.cmu.edu/15-104/f2022/2022/10/04/anabelles-project-04-2/ https://courses.ideate.cmu.edu/15-104/f2022/2022/10/04/anabelles-project-04-2/#respond Tue, 04 Oct 2022 17:28:59 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=73779 Continue reading "anabelle’s project 05"]]>

here’s my project : D

sketch
// anabelle lee .-.
// section c
// kaylalee
// project 5

let firstSpiralX = [];
let firstSpiralY = [];

let secondSpiralX = [];
let secondSpiralY = [];

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

function draw() {
    background(185, 70, 44);

    leftHalf();
    rightHalf();

    push();
    translate(450, 0);
    leftHalf();
    rightHalf();
    pop();

    push();
    translate(450, 0);
    leftHalf();
    rightHalf();
    pop();

    // for bouquets
    setBouquet();
    setOtherBouquet();

    noLoop();

}

/* my functions */
function setBouquet(x, y) {
    for (var centerX = 145; centerX < (width + 50); centerX += 460) {
        for (var centerY = 175; centerY < height; centerY += 350) {
            push(); 
            bigGlaze(centerX, centerY);
            pop();
        }
    }
}

function setOtherBouquet() {
for (var centerX = 380; centerX < width + 50; centerX += 460) {
        for (var centerY = 20; centerY < height; centerY += 350) {
            push(); 
            bigGlaze(centerX, centerY);
            pop();
        }
    }
}

function leftHalf() {
    for (var theta = 0; theta < height + 50; theta += 10) {
        glazeBud(-20 + 80*cos(radians(theta)), theta) ;
    }

    for (var theta = 0; theta < height + 50; theta += 30) {
        push(); 
        glazeLily(60 + 60*cos(radians(theta)), theta);
        pop();
    }

    for (var theta = 0; theta < height + 50; theta += 80) {
        push(); 
        glazeLinesLoop(30 + 60*cos(radians(theta)), theta);
        pop();
    }
}

function rightHalf() {
    for (var theta = 0; theta < height; theta += 10) {
        glazeBud(330 + -80*cos(radians(theta)), theta) ;
    }

    for (var theta = 0; theta < height; theta += 30) {
        push(); 
        glazeLily(250 + -60*cos(radians(theta)), theta);
        pop();
    }

    for (var theta = 0; theta < height; theta += 80) {
        push(); 
        glazeLinesLoop(280 + -60*cos(radians(theta)), theta);
        pop();
    }
}

function glazeLily(x, y) {

    // large petals
    push();
    translate(x, y);
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(36 + i*-72));
        largePetal(7, 25);
        pop();
    }

    // small petals
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(i*-72));
        smallPetal(5, 12.5);
        pop();
    } 
    fill(239, 233, 193);
    noStroke();
    circle(0, 0, 12.5)

    pop();
}

function smallPetal(w, h) {

    fill(232, 234, 238);
    stroke(232, 234, 238);

    beginShape(); // left half of smaller petal
    vertex(0, -h);
    bezierVertex(0 - w/10, -9*h/10, -2*w, -h/2, -2*w/3, 0);
    endShape();

    beginShape(); // right half of smaller petal
    vertex(0, -h);
    bezierVertex(0 + w/10, -9*h/10, 2*w, -h/2, 2*w/3, 0);
    endShape();

    triangle(-0.65*w, 0, 0, -h, 0.65*w, 0); // fill the smaller petal
}

function largePetal(w, h) {

    fill(114, 181, 223);
    stroke(148, 162, 228);

    beginShape(); //left half
    vertex(0, -h);
    bezierVertex(0 - w/9, -9*h/10, -1.5*w, -h/2, -w/3, 0);
    endShape();

    beginShape(); // right half
    vertex(0, -h);
    bezierVertex(0 + w/9, -9*h/10, 1.5*w, -h/2, w/3, 0);
    endShape();

    triangle(-w/3, 0, 0, -h, w/3, 0); // fill the smaller petal
}

function glazeBud(x, y) { 
    push();
    translate(x, y);
    for(var i = 0; i < 5; i += 1) {
        push();
        rotate(radians(i*72));
        glazeFragment(7, 7);
        pop();
    } pop();
}

function glazeFragment(w, h) { // only draws 1/5th of glazeBud

    // big circle
    fill(148, 162, 228);
    stroke(148, 162, 228);
    point(0, 0);
    arc(0, 0, 2*w, -2*h, radians(225), radians(315));

    // point arcs
    // left
    stroke(201, 208, 231);
    noFill();
    beginShape();
    vertex(0, -2*h/3);
    bezierVertex(-w/50, -4*h/8, -w/10, -3*h/8, -w/4, -h/3);
    endShape();

    // right
    beginShape();
    vertex(0, -2*h/3);
    bezierVertex(w/50, -4*h/8, w/10, -3*h/8, w/4, -h/3);
    endShape();

    fill(201, 208, 231);
    arc(0, 0, 4*w/5, 4*w/5, radians(225), radians(315));
    triangle(w/9, -h/4, 0, -2*h/3, -w/9, -h/4);

    // stamen
    stroke(130, 150, 255);
    fill(148, 162, 228);
    circle(-2*w/5,-h/2, w/8);
    circle(2*w/5, -h/2, w/8);
    line(-2*w/5, -h/2, 0, 0);
    line(2*w/5, -h/2, 0, 0);
}

function glazeLinesLoop(x, y) {
    push();
    translate(x, y);
    for (var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(i*72));
        glazeLines(10, 25);
        pop();
    } pop();
}

function glazeLines(w, h) {
    noFill();
    stroke(248, 237, 122);

    beginShape(); // left half of smaller petal
    vertex(0, -h);
    bezierVertex(0 - w/10, -9*h/10, -2*w, -h/2, -2*w/3, 0);
    endShape();

    beginShape(); // right half of smaller petal
    vertex(0, -h);
    bezierVertex(0 + w/10, -9*h/10, 2*w, -h/2, 2*w/3, 0);
    endShape();
}

function bigGlaze(x, y) {

    // large petals
    push();
    translate(x, y);
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(36 + i*-72));
        bigLargePetal(30, 50);
        pop();
    }

    // small petals
    for(var i = 0; i <= 5; i += 1) {
        push();
        rotate(radians(i*-72));
        bigSmallPetal(15, 40);
        pop();
    } 

    fill(239, 233, 193);
    noStroke();
    circle(0, 0, 25)

    pop();
}

function bigSmallPetal(w, h) {

    fill(117, 162, 191);
    stroke(200, 190, 255);

    beginShape(); // left half of smaller petal
    vertex(-30, -h);
    bezierVertex(-30 - w/10, -9*h/10, -2*w, -h/2, -2*w/3, 0);
    endShape();

    beginShape(); // right half of smaller petal
    vertex(-30, -h);
    bezierVertex(-30 + w/10, -9*h/10, 2*w, -h/2, 2*w/3, 0);
    endShape();

    triangle(-0.65*w, 0, 0, -h, 0.65*w, 0); // fill the smaller petal
}

function bigLargePetal(w, h) {

    fill(47, 95, 138);
    stroke(0, 51, 102);

    beginShape(); //left half
    vertex(-20, -h);
    bezierVertex(-20 - w/9, -9*h/10, -1.5*w, -h/2, -w/3, 0);
    endShape();

    beginShape(); // right half
    vertex(-20, -h);
    bezierVertex(0 + w/9, -9*h/10, 1.5*w, -h/2, w/3, 0);
    endShape();

    triangle(-w/3, 0, 0, -h, w/3, 0); // fill the smaller petal
}
]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/10/04/anabelles-project-04-2/feed/ 0
anabelle’s blog 05 https://courses.ideate.cmu.edu/15-104/f2022/2022/09/30/anabelles-blog-05/ https://courses.ideate.cmu.edu/15-104/f2022/2022/09/30/anabelles-blog-05/#respond Fri, 30 Sep 2022 14:45:20 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=73263 Continue reading "anabelle’s blog 05"]]>

One 3D computer artist I find inspiring is @dedouze on Instagram. His works propose an interesting side of 3D art because his works look 2D! Actually, it can be hard to tell which works on his page are 3D models versus sketches sometimes because the visuals stay so consistent in a static image. The only time you can really differentiate the two is when he animates his 3D works. He uses blender for all his works (this is particularly inspiring to me, since I just learned how to use blender a week ago for another class. It’s like, ‘wow, this is what I can work up to?!’). I think his art also departs from the usual aesthetics we associate with 3D art — I’m thinking Pixar’s cartoony style or Hitman’s hyper realistic one. dedouze’s art is the only convincing example I’ve seen that makes me think that 2D animation can be improved with 3D. You know how sometimes a 2D show briefly switches to 3D and it’s really jarring and not visually pleasing? I feel like the studios in charge of those shows could learn from that it is possible to make smooth 2D and 3D transitions without removing the audience from the visual experience.

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/09/30/anabelles-blog-05/feed/ 0
anabelle’s project 04 https://courses.ideate.cmu.edu/15-104/f2022/2022/09/25/anabelles-project-04/ https://courses.ideate.cmu.edu/15-104/f2022/2022/09/25/anabelles-project-04/#respond Sun, 25 Sep 2022 20:23:51 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=73045 Continue reading "anabelle’s project 04"]]>
sketch

Here’s my project for the week — this has been the most painful one so far. It’s vaguely based off of Rainbow Road from Mario Kart, so enjoy <3

let numLines; 

let expandLeft;
let expandRight;

let moveX;
let moveY;

let lineExpand;

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

function draw() {
    background(0, 0, 56);

    stroke(255); // circle
    lineExpand = (constrain(mouseY, 10, 400));
    for(i = 0; i <= 100; i +=1 ) {
        push();
        translate(width/2, height/2);
        rotate(radians(10*i));
        line(0, lineExpand, 0, -lineExpand);
        pop();
    }

    stroke(188, 13, 88); // red
    crossHatch(0, 290, 150, 200, 170, 200, 200, 0, false);

    stroke(254, 161, 43); // orange
    crossHatch(5, 290, 170, 220, 190, 220, 200, 0, false);

    stroke(248, 243, 23); // yellow 
    crossHatch(10, 290, 190, 250, 210, 250, 200, 0, false);

    stroke(247, 89, 252); // purple 
    crossHatch(390, 290, 250, 200, 230, 200, 200, 0, false);

    stroke(79, 134, 239); // blue
    crossHatch(395, 290, 230, 220, 210, 220, 200, 0, false);

    stroke(118, 370, 153); // green
    crossHatch(400, 290, 210, 250, 190, 250, 200, 0, false);

    stroke('magenta');
    moveX = 100;
    moveY = 100;
    chadStar(0, 0);

    stroke('yellow');
    moveX = 300;
    moveY = 200;
    chadStar(0, 0);

    stroke('pink');
    moveX = 250;
    moveY = 50;
    chadStar(0, 0);

}



function crossHatch(firstx1, firsty1, firstx2, firsty2, secondx1, secondy1, secondx2, secondy2, showLines = true) {
    if (showLines){
        line(firstx1, firsty1, firstx2, firsty2);
        line(secondx1, secondy1, secondx2, secondy2);
    } 

    let numLines = constrain(mouseX, 100, 400)/10;


    let dx1 = (firstx2 - firstx1) / numLines;
    let dy1 = (firsty2 - firsty1) / numLines;
    let dx2 = (secondx2 - secondx1) / numLines;
    let dy2 = (secondy2 - secondy1) / numLines;


    for(var i = 0; i <= numLines; i += 1) {
        line(firstx1, firsty1, secondx1, secondy1);
        firstx1 += dx1;
        firsty1 += dy1;
        secondx1 += dx2;
        secondy1 += dy2;
    }
}

function chadStar(x, y) {
    expandLeft = constrain(mouseY, 0, 300) / 50;
    expandRight = constrain(mouseY, 0, 300) / 50;

    for(i = 0; i <= 6; i += 1) {
        push();
        translate(moveX, moveY);

        rotate(radians(i*60));
        line(x, y-10, x+10, y+10);
        line(x+10, y+10, x-10, y+10);
        line(x-10, y+10, x, y-10);

        pop();
        
        x += expandLeft;
        y += expandRight;
    }
}
]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/09/25/anabelles-project-04/feed/ 0
anabelle’s blog 04 https://courses.ideate.cmu.edu/15-104/f2022/2022/09/22/anabelles-blog-04/ https://courses.ideate.cmu.edu/15-104/f2022/2022/09/22/anabelles-blog-04/#respond Fri, 23 Sep 2022 03:21:26 +0000 https://courses.ideate.cmu.edu/15-104/f2022/?p=72592 Continue reading "anabelle’s blog 04"]]>

Since middle school, I’ve always been a huge Vocaloid fan. Vocaloid is a software used to simulate human singing and was originally created to help performers and producers add vocal music even if they did not have access to a real singer. However, Vocaloid expands beyond the software and includes “characters” for each voicebox/voicekit, with popular examples including Hatsune Miku and Kagamine Len&Rin. Initially released in 2004 in a project led by Kenmochi Hideki in Barcelona, the Vocaloid software continues to be updated and rereleased today, with numerous versions and iterations of the same character with new singing abilities. If popular enough, Vocaloids are also given 3D holograms that are capable of holding real-life concerts in real-life venues (with really great turnout). I think the algorithms to create Vocaloid are fairly simple — a commissioned singer records the base notes for a character, which can be modified and edited by producers. What I love about Vocaloid is how each character is given vocal “limitations” to produce their own unique sounds. For example, Teto is best used for soft, low energy ballads, and Kaito’s deeper range will sound distorted in higher ranges.

Here’s an example of a vocaloid concert — the turnout is actually crazy for these things:

Link to Vocaloid website (anyone can buy the software): https://www.vocaloid.com/en/

]]>
https://courses.ideate.cmu.edu/15-104/f2022/2022/09/22/anabelles-blog-04/feed/ 0