Mini-Project: Kinetic Type

Dit mini project leek makkelijk maar bleek toch moeilijker dan we dachten, je wilt alles natuurlijk netjes hebben en mooi, het animeren was te lastig dus helaas hebben we dat stukje niet gedaan, desondanks vinden wij ons resultaat heel erg mooi geworden.

De opdracht: Kinetic type

Het eindproduct!

De link met de code!

let bee,fly,honey,bok
var speech

function setup() {
  createCanvas(400, 370);
 bee =  loadImage("bee.png")
  fly = loadImage("fly.png")
  honey = loadImage("honey.png")
  bok = loadImage("bok.png")
  sound = loadSound("Ali.mp3")

}

function draw() {
  if (mouseIsPressed) {
    noLoop()
   sound.play()
    background(0);
  
  image(fly, 210,-25)
  
  fill(252, 219, 3)
  textFont("Bebas Neue");
  textSize(80);
  text("STING", 120, 190);
  
  textFont("Beau Rivage")
  textSize(50);
  text("butterfly", 225, 100);
  
  textFont("Beau Rivage")
  textSize(50);
  text("float", 65, 80);
  
  textFont("Lora")
  textSize(30);
  text("like a ", 140, 90);
  
  textFont("Lora")
  textSize(30);
  text("like a ", 140, 90);
  
  textFont("Lora")
  textSize(30);
  text("like a ", 60, 240);

  fill(252, 219, 3)
  textFont("Rubik Bubbles")
  textSize(60);
  text("BEE ", 160, 310);
  
  bee.resize(180,350)
  image(bee, 225,58)
  
  honey.resize(100,180)
  image(honey,45,207)
  
  bok.resize(100,100)
  image(bok,-10,90)
}    
  else {
     background(252, 219, 3);
  
  image(fly, 210,-25)
  
  textFont("Bebas Neue");
  textSize(80);
  text("STING", 120, 190);
  
  textFont("Beau Rivage")
  textSize(50);
  text("butterfly", 225, 100);
  
  textFont("Beau Rivage")
  textSize(50);
  text("float", 65, 80);
  
  textFont("Lora")
  textSize(30);
  text("like a ", 140, 90);
  
  textFont("Lora")
  textSize(30);
  text("like a ", 140, 90);
  
  textFont("Lora")
  textSize(30);
  text("like a ", 60, 240);

  fill(0)
  textFont("Rubik Bubbles")
  textSize(60);
  text("BEE ", 160, 310);
  
  bee.resize(180,350)
  image(bee, 225,58)
  
  honey.resize(100,180)
  image(honey,45,207)
  
  bok.resize(100,100)
  image(bok,-10,90)
} 
  }