The Sushi Bar Train

For my project I decided to create a restaurant on a train that serves japanese food via a conveyer belt. The dishes include: sashimi, tuna sushi, matcha, miso soup, ramen, and salmon. In the window of the train booth, you can watch as you travel through a bright city at night.

Sushi Bar TrainDownload

// SRISHTY BHAVSAR 
// 15104 SECTION C
//PROJECT 11

var buildings = [];

var fd = [] // 

// food items
var ramen; // https://imgur.com/H2R30Wg
var miso; // https://imgur.com/J5EhmuM
var salmon; // https://imgur.com/p6YrdLv
var sashimi;  // https://imgur.com/mJjnmVD
var matcha; // https://imgur.com/SErtIMf
var tunasushi; // https://imgur.com/HCUsYNh
var maki; // https://imgur.com/UI5eghR

var food = 
["https://i.imgur.com/H2R30Wg.png", "https://i.imgur.com/J5EhmuM.png", 
 "https://i.imgur.com/p6YrdLv.png", "https://i.imgur.com/mJjnmVD.png", 
 "https://i.imgur.com/SErtIMf.png" , "https://i.imgur.com/HCUsYNh.png", 
 "https://i.imgur.com/UI5eghR.png"]; // food contains the images of ramen,miso,salmon,etc.


function preload() {

    seats = loadImage("https://i.imgur.com/UEAssld.png");


    ramen = loadImage(food[0]); //ramen
    miso = loadImage(food[1]); //miso
    salmon = loadImage(food[2]); // salmon
    sashimi = loadImage(food[3]); //sashimi
    matcha = loadImage(food[4]); //matcha
    tunasushi = loadImage(food[5]); //tunasushi
    maki = loadImage(food[6]); //maki



    bg = loadImage("https://i.imgur.com/2zjN6qS.png");

}

function setup() {
    createCanvas(480, 480);
    background(220);
    imageMode(CENTER);
    frameRate(17);

    // create an initial collection of buildings
    for (var i = 0; i < 20; i++) {
        var rx = random(width);
        buildings[i] = makeBuilding(rx);
        
    }


    // collection of dishes
    var dist = 0;
    for (var i = 0; i <500; i++) {
        fd[i] = makeFood(dist);
        dist += 150; //distance between dishes
    }
    print(fd);

}

function draw() {
    createCanvas(480, 480);
    background(25,25,112);


    //buildings
    push();
    translate(0,-120);
    updateAndDisplayBuildings();
    removeBuildingsThatHaveSlippedOutOfView();
    addNewBuildingsWithSomeRandomProbability(); 
    pop();

    //bg
    image(bg, 266.4269, 240, 532.8539, 480);

    showFood();

    //seats
    image(seats,240,408.3845,480,143.231);




}


function makeFood(xloc){
    var fd = { x: xloc,
                speedx: 1.5,
                move: foodMove, 
                food : random([ramen, miso, salmon, sashimi, matcha, tunasushi, maki]),
                display: foodDisplay,
                }
    return fd;
}


function foodDisplay(){

    /*the width heights and y location are respective to the 
    ones mapped out on adobe illustrator. thats why they are typed manually */
    //xloc is the speed times 500 and the dist
    if (this.food == ramen){
        image(ramen,this.x -750*20, 310, 148, 108 );  // ramen
    }
    if (this.food == miso){
        image(miso,this.x  -750*20, 310, 119, 115 ); // miso
    }
    if (this.food == salmon){
        image(salmon,this.x -750*20, 318, 174, 126 ); // salmon
    }
    if (this.food == sashimi){
        image(sashimi,this.x -750*20, 309, 203, 147 ); //sashimi
    }
    if (this.food == matcha){
        image(matcha,this.x - 750*20, 324, 119, 86 ); // matcha
    }
    if (this.food == tunasushi){
        image(tunasushi,this.x  -750*20, 318, 164, 119); //tuna
    }
    if (this.food == maki){
        image(maki,this.x  -750*20, 294, 247, 179 ); //maki
    }
}

//speed of moving food
function foodMove() {
    this.x += this.speedx;  
}

//calling show and move function of dishes
function showFood(){
    for( var i = 0; i < fd.length; i++ ) {
        fd[i].display();
        fd[i].move();
        if ( i == fd.length){
            textSize(15);
            text('Sushi Bar closed. No more food for today!', 100, 200);
        }
    }

}



function makeBuilding(birthLocationX) {
    var bldg = {x: birthLocationX,
                breadth: 30,
                speed: -1.0,
                nFloors: round(random(2,8)),
                move: buildingMove,
                color: color(random(255),random(255), random(255), 80), // random color buildings with low opacity to look distant
                display: buildingDisplay
            } 
    return bldg;
}


function updateAndDisplayBuildings(){
    // Update the building's positions, and display them.
    for (var i = 0; i < buildings.length; i++){
        buildings[i].move();
        buildings[i].display();
    }
}


function removeBuildingsThatHaveSlippedOutOfView(){

    var buildingsToKeep = [];
    for (var i = 0; i < buildings.length; i++){
        if (buildings[i].x + buildings[i].breadth > 0) {
            buildingsToKeep.push(buildings[i]);
        }
    }
    buildings = buildingsToKeep; // remember the surviving buildings
}


function addNewBuildingsWithSomeRandomProbability() {
    // With a very tiny probability, add a new building to the end.
    var newBuildingLikelihood = 0.007; 
    if (random(0,1) < newBuildingLikelihood) {
        buildings.push(makeBuilding(width));
    }
}


// method to update position of building every frame
function buildingMove() {
    this.x += this.speed;
}
    

// draw the building and some windows
function buildingDisplay() {
    var floorHeight = 20;
    var bHeight = this.nFloors * floorHeight; 
    fill(this.color); 
    push();
    translate(this.x, height - 40);
    strokeWeight(0);
    rect(0, -bHeight, this.breadth, bHeight);
    for (var i = 0; i < this.nFloors; i++) {
        rect(5, -15 - (i * floorHeight), this.breadth - 10, 10);
    }
    pop();
}

In Anna Gruaber’s “Women in Media Arts: Does AI think like a (white) man?” Gruaber features different artist/activists and their projects related to AI and feminism. Artificial intelligence is becoming a very important topic in regards to diversity and ethics. Activists have started pointing out problematic prejudices and distortions of supposedly objective algorithms. While there is a low proportion of women in IT professions, the real problem are the biased data sets used in AI and Machine learning.

Joy Buolamwini and Timnit Gebru are activists who investigate the prejudice of AI recognition systems. In this project, “Gender Shades,” the error rate is significantly higher among women; especially those with darker skin. Information about skin color is extremely important in the context of medical applications. 

Mary Flanagan’s project “help me know the truth,” shows that a discriminating algorithm does not come from the sexist or racist nature of the machine, but from the systemically racist structure of our society. “Help me know the truth” creates a perfect stereotype from a digital self portrait based on findings of cognitive neuroscience. 

Caroline Sinders wants to counterset bias. Her project, “Feminist Data Set,” is a multi-year art project that combines lectures and workshops to create interventions in the field of machine learning. Sinders wants to collect feminist data through them. The feminist data inclides artworks, essays, interviews, and books on feminism. The data attempts to introduce data collection as a feminist practice.

https://ars.electronica.art/aeblog/en/2020/04/10/women-in-media-arts-ai/

The article I selected is “Finding Inspiration for Art in the Betrayal of Privacy” by Jenna Wortham in the New York Times. The article focuses on an exhibition in a gallery in Lower Manhattan put on by a Berlin group called the Tactical Technology Collective. The exhibition looked at the impact of technology and how it observes us on the daily through an artistic lens. One example that they used which I found interesting was how step and activity data may be used in the future to determine insurance costs. This would cause people to “hack” their devices in order to make it seem like they moved more in order to lower their insurance costs. They also experimented with a facial-recognition software called “Churchix” to create an immersive experiment for gallery goers. The way the Tactical Technology Collective subverted technology that we use day to day lives, causes us to rethink our own relationship with technology and the way we “buy into” our own surveillance on the daily.

I made a simple story about a girl (me) who goes on a walk to the park. During her time there as she walks by, she sees tom and jerry start chasing each other all over the park and she starts laughing. The background d elements and all elements other than tom and jerry were done on illustrator and imported to imgur. My 4 characters are the cloud making the wind sound, the tom making the meow sound, the girl laughing, and the bird chirping.

sketch

// SRISHTY BHAVSAR
//SECTION C
//PROJECT 10
/*
I made a simple story about a girl (me) who goes on a walk to the park. During her time there as she walks by, 
she sees tom and jerry start chasing each other all over the park and
she starts laughing. The background d elements and all elements other than tom and jerry were done on illustrator
and imported to imgur. My 4 characters are the cloud making the wind sound, the tom making the meow sound, the girl 
laughing, and the bird chirping.
*/



// call global variables

//background image
var bgPhoto

//CHARACTERS
// cloud
    var cloudX = 0;

    // bird
    var birdImage = [];
    var birdX = 500;
    var birditem = 0;
    var birdwidth = 80

    // srishty (me)
    var srishtyImage;
    var srishtyx =500;

    // cloud
    var cloudImage;
    var cloudx = 300

    // tom and jerry
    var tomandjerry = [];
    var tomandjerryx = 70;
    var tomandjerryitem = 0;
    var tjdy = 1
    var tjdx = 1

// frame counter initializer
var count = 0; 




//load images to imgur
function preload() {
    bgPhoto = loadImage("https://i.imgur.com/75aDbMe.png");
    // images
    birdImage[0] = loadImage("https://i.imgur.com/o1P0pBO.png"); // first image in the bird list
    birdImage[1] = loadImage("https://i.imgur.com/48woLcm.png"); // first image in the bird list
    srishtyImage = loadImage("https://i.imgur.com/b5N2LzO.png"); // srishty image
    cloudImage = loadImage("https://i.imgur.com/xG8RjYF.png"); // cloud image
    tomandjerry[0] =loadImage("https://i.imgur.com/8nNCYkE.png");
    tomandjerry[1] =loadImage("https://i.imgur.com/cDSNU65.png");
    tomandjerry[2] =loadImage("https://i.imgur.com/LcYpbag.png");
    tomandjerry[3] =loadImage("https://i.imgur.com/wYhvMJo.png"); 

    //sounds
    wind = loadSound("https://courses.ideate.cmu.edu/15-104/f2022/wp-content/uploads/2022/11/wind.wav");
    meow = loadSound("https://courses.ideate.cmu.edu/15-104/f2022/wp-content/uploads/2022/11/meow.wav");
    laugh = loadSound("https://courses.ideate.cmu.edu/15-104/f2022/wp-content/uploads/2022/11/laugh.wav");    
    chirp = loadSound("https://courses.ideate.cmu.edu/15-104/f2022/wp-content/uploads/2022/11/chirp.wav");  
}


function soundSetup(){
    wind.setVolume(.1);
    meow.setVolume(2);
    chirp.setVolume(.1);
    laugh.setVolume(2);
}

function setup() {
    createCanvas(400, 400);
    //frameRate(5);
    imageMode(CENTER);
    useSound();

}

function draw() {
    count++; // add one frame to draw function
    //background image
    image(bgPhoto, width/2, height/2, width, height);



    wind.play();
    chirp.play();



    //call characters
    drawCloud();
    drawbird();
    drawTandJ()
    drawSrishty();
  
    if (count == 450 || count == 750) {
        meow.play();
    }
    if (count == 500 || count ==800) {
        laugh.play();
    }
}

// function for bird flapping

function drawbird() {

    image(birdImage[birditem], birdX, 104, birdwidth,30); 
    // if the frame counter is odd have the bird's item be the first one, if even have it be the second one 
    //fkapping affect 
    if (count % 2 === 0 ) { // bird frame 1
        birditem = 1;
        birdwidth = 100
        birdX -= .5; // bird flies to left
    }
    if (count % 2 === 1 ) {    // bird frame 0
        birditem = 0;
        birdwidth = 80;
        birdX -= .5; // bird flies to left
    }

}

function drawSrishty() {
    var heightcount = .5
    if (count >= 30) { // srishty walks in 30 frames after bird

        // staggering heights so it looks like walking rather than glide
        if (count % 2 === 0 ) { //odd
            image(srishtyImage, srishtyx - heightcount, 325, 66.2218, 205.4745); 
            srishtyx -= .3; // srishty walks to left

        }
        if (count % 2 === 1 ) { //even
            image(srishtyImage, srishtyx, 325 + heightcount, 66.2218, 205.4745); 
            srishtyx -= .3; // srishty walks to left

        }
    }

}

function drawCloud() { // draw cloud
    image(cloudImage, cloudx, 69, 130.2123 , 46.6313 );
    cloudx -= 0.09; //cloud moves very slowly
}

function drawTandJ() { // tom and jerry frames chasing eachother

        if (count >= 0 & count <= 400 ) { 
            image(tomandjerry[tomandjerryitem], tomandjerryx, 300, 216.9349, 162.7012);
            tomandjerryitem = 0
        }

        if (count >= 400 & count <= 500) { 
            image(tomandjerry[tomandjerryitem], (tomandjerryx + 100) + tjdx, 300, 216.9349, 162.7012);
            tomandjerryitem = 1
            tjdx += .5
        }

        if (count >= 500 & count <= 750) {
            image(tomandjerry[tomandjerryitem], (tomandjerryx + 300) -tjdx, 400 - tjdy, 220, 120.7012);
            tomandjerryitem = 2
            tjdy += .5;
            tjdx += .5
        }
        if (count >= 750 & count <= 2000 ) { 
            image(tomandjerry[tomandjerryitem], (tomandjerryx + 200)-tjdx, 400 - tjdy, 216.9349/2, 162.7012/2); 
            tomandjerryitem = 3
            tjdy += .5;
            tjdx += 2;

        }

}
 

Caroline is a UI/UX designer, machine learning design researcher and artist concerned about consent in technology. She is the founder of convocation design and research agency which focuses on machine learning and ux design that is for public good. As a ux designer and ux researcher she worked with Intel, IBM Watson, Wikimedia Foundation, Amnesty Foundation, and more. She additionally has partnered with Harvard Kennedy School and the Mozilla Foundation.

What I admire about Caroline is that she is a UX/UI designer which is the job I aspire to have. Her work focusing on public good also inspires me to learn more about social issues related to technology rather than just aesthetics. In her project, “How to Explain a Hurricane to an Algorithm,” Caroline explains that when her grandmother’s home was destroyed in Hurricane Katrina, she found a bunch of personal and private objects that belong to the family. She spent her last 12 years photographing and looking at archives. Using an algorithm Caroline was able to represent a documentation of loss, anxiety, grief, and post trauma culture at home.

Website: https://carolinesinders.com/how-to-explain-a-hurricane-to-an-algorithm/

The piece if work I selected is “Body Sketches” by Molmol Kuo. Molmol Kuo is a Taiwanese artist and educator. Kuo works closely with NYU’s Tisch school of the Arts’ graduate student program consulting students on projects which combines the arts, augmented reality and technology. Kuo is also a partner at YesYesNo Studio, a multimedia design and arts studio. The work was at the Brooklyn Academy of Museum and uses computation and a screen to extend the user/observer’s body into a variety of dynamic costumes. The base of the project is three individuals projections, each of which then use the human form as a starting point and transform it through different geometric and physical changes.

For my image, I noticed that the background lights were blurry, and I wanted to implement that in the code with mousPressesed. So each time you use you press the mouse, a filter is applied to the whole canvas and the whole canvas gets a bit blurry. Additionally, I wanted there to be a difference in shapes for the background and the person.

Small Blur

No Blur

Medium Blur

Lots of Blur

Image

asuSketch

// Your name: Ashley Su
// Your andrew ID: ashleysu
// Your section (C):  


var img;
var stars = [" ★ ", " ☆ "," ✪ "," ✦ ", " ✧ "]
var faces = ['( ͡• ͜ʖ ͡•)', '( ͡ᵔ ͜ʖ ͡ᵔ)', '( ͡~ ͜ʖ ͡°)', '( ͡◡_⦣ ͡◡)']

function preload() {
    img = loadImage("https://i.imgur.com/spqIDsb.jpeg")
}

function setup() {
    createCanvas(480, 480);
    imageMode(CENTER);
    img.loadPixels();
    img.resize(480, 480);                              //resize image to canvas
    frameRate(50000);
    background(0);
}

function draw() {
    //pick random x and y
    var x = floor(random(img.width));
    var y = floor(random(img.height));
    
    //pull pixel color from that x and y
    var pixelColor = img.get(x, y);
    
    //fill using the pixel color
    fill(pixelColor);
    

    if (x>((width/2)-50) & x<((width/2)+50) && y>height/2 && y < height) {        //setting the faces smilies to be next where the actaul face is 
        strokeWeight(5);
        textSize(random(5, 20));                    // smaller near face
        text(random(faces), x, y);                  
      } else {
        textSize(random(5, 20)); 
        text(random(stars), x, y);                  //draws stars everywhere else 
    }

}


function mousePressed() {

        filter(BLUR,3);                   // when mouse is pressed, it blurs the layer 
}

For my portrait, I decided to do something similar to pointillism but instead of dots, I used words. I made a list of words that are about my passions/ideal career choices and then loaded a word randomly from the list to take place of each pixel in my image. Each word matches the color of the pixel in its respective x and y location. The words are all a pretty small font so they can pick up the details of the pixels well.

sketch

// SRISHTY BHAVSAR
// PROJECT 9
// SECTION C 15-104
/*
let img;
let smallPoint, largePoint;

function preload() {
  img = loadImage('nameofimage');
}

*/


var srishty;
var passions;

function preload() {
    srishty = loadImage("https://i.imgur.com/kczcnA1.jpg"); // image of me, srishty
    passions = ["designer", "artist", "UI","UX", "researcher", "HCI", "architecture", 
    "color", "painting", 'music', "running", "singing"]; // list of my passions and career interests
    print(passions);

}

function setup() {
    createCanvas(480,480);
    srishty.resize(480,480); // resizes the ima2ge upload to imgur to be 480 by 480
    background('white');
    imageMode(CENTER); // centers image
    srishty.loadPixels();
    //noLoop();

}


function draw() {
    var x = floor(random(srishty.width));
    var y = floor(random(srishty.height));
    var c = srishty.get(x,y); // identifies the color of each pixels
    fill(c,255);
    textSize(8);
    textFont('Helvetica')
    text(passions[Math.floor((Math.random() * passions.length))] , x, y); // takes a random word from the list of passions and places it to be in the position of the image pixel
}

Look, I’m a sucker for space exploration. Ariel Waldman is an art school graduate who pivoted to scientific communications & research, with an aim to make science & space exploration “disruptively accessible”. Spacehack.org is an online directory that she maintains of ‘citizen science’ projects, ways that anyone can participate in scientific research and projects relating to space exploration and space travel. As someone incredibly interested in this, but 1/2″ too short to be an astronaut and also a Drama major, this is super exciting and inspiring to me. I’ve taken up rocket launch photography in the past 2 years, which has been my way of documenting and exploring the vehicles that take people and things into orbit and beyond. The projects listed on SpaceHack generally ask you to donate either your time or your computer processing to further the research being done by professionals at a university or other institution.

http://eyeofestival.com/2018/speaker/ariel-waldman/

https://spacehack.org

The individual I selected is Catherine D’Ignazio. D’Ignazio is an associate professor of Urban Science and Planning at MIT. She is also the Director of the Data + Feminism Lab, also at MIT. Her work focuses on using data and computational methods to work towards gender and racial equality through the lense of urban design and architecture. She also authored the book Data Feminism that she published through MIT Press. A project of D’Ignazio’s that I was particularly interested in was her creation of the reproductive justice hackathon. The hackathon pushed individuals to come up with solutions to the issues that arise with finding a secure place to pump breast milk as well as finding better solutions to current pumping devices. Currently, a big focus of her work is discovering and elevating “hidden data.” This includes data such as how many women have died during childbirth in countries where that data is rarely recorded. D’Ignazio’s presentation style is very engaging and personable. She started her presentation with her own experience pumping in the MIT Media Lab as way to engage with her work and its importance.