Week 03

Animation, Variables, Interaction

1. Variable

number

var s = 90; 

string

var name = "don"

object

https://editor.p5js.org/kdoodoo/sketches/S1eJIVpdQ

var circle = {
    radius: 13,
    x: 60,
    y: 100
};


circle.radius 
circle.x
circle.y

array

var num = [1, 2, 3];


num[0]
num[1]
num[2]

2. Let and Variable

let allows you to declare variables that are limited in scope to the block, statement, or expression on which it is used. This is unlike the var keyword, which defines a variable globally, or locally to an entire function regardless of block scope.

let x = 1;

https://editor.p5js.org/kdoodoo/sketches/rJ1s90hdm

3. console.log()

4. Animation

What is animation? Either something that moves by the intention of the user or something that moves automatically for the better interaction in functionality and emotions.

https://jsfiddle.net/kdoodoo/c0esafg4/

https://editor.p5js.org/kdoodoo/sketches/Hy1BtR3u7

random()

// random in number
random(50); // range in 0 to 50
random(-50, 50); // range in -50 to 50 


//random in  string
var words = ['a', 'b', 'c', 'd'];
var word = random(words); // select a random word from a,b,c,d

https://editor.p5js.org/kdoodoo/sketches/HJlfT03um

mouseX, mouseY

https://jsfiddle.net/kdoodoo/53graLpd/

  ellipse(mouseX, mouseY, 24, 24);
  ellipse(mouseX, mouseY,mouseX, mouseY);

map()

https://editor.p5js.org/kdoodoo/sketches/H1gGsETOQ

map(which value had current range,currentMin,currentMax,newMin,newMax)

mousePressed()

https://editor.p5js.org/kdoodoo/sketches/ByYWeS6uX

function mousePressed() {
};

5. Assignment

Make any project that interacts with the user.

Submit here: https://goo.gl/forms/zlr9n5bNbT0iPTyJ2

Always submit link as an editor view from now on.

이상은	https://jsfiddle.net/53graLpd/30/#
이의진	https://editor.p5js.org/full/ByYWeS6uX
이가하	https://editor.p5js.org/full/Byj_iMRdQ
이다영	https://editor.p5js.org/full/rJPBA0Vu7
Celso Urroz	https://editor.p5js.org/celso/sketches/rJmulVLY7
Lukas Merten	https://editor.p5js.org/[email protected]/sketches/BybhwppY7
Alexis Sechoir	https://editor.p5js.org/full/Syd2KgCF7
이재은	https://editor.p5js.org/[email protected]/sketches/rJQLTH15Q
김다인	https://editor.p5js.org/dain5832/sketches/BJWoBskcQ
김지원	https://editor.p5js.org/dion/sketches/rk8zWLCKQ