​

//http://blog.prossel.info/260-grands-canvas-avec-p5-js-editor/

​

function setup() {

  VideoRecorder.addButton();

  createCanvas(1080, 1920);

  colorMode(HSB, 1, 1, 1)

  frameRate(30);

​

​

​

  //CODE À AJOUTER pour réduire la Preview

  let scalePreview = 0.41;

  let cnv = document.getElementById('defaultCanvas0');

  cnv.style.width = round(width * scalePreview) + "px";

  cnv.style.height = round(height * scalePreview) + "px";

  //CODE À AJOUTER pour réduire la Preview

​

​

​

  fill('#ffd5d5');

  stroke('#ff4893');

  strokeWeight(5);

  textSize(280);

  textFont('DM Sans');

​

  createLoop({

    //gif: {

    //options: { quality: 5 },

    //fileName: "noiseLoop.gif",

    //startLoop: 1,

    //endLoop: 2

    //}

  })

​

​

  animLoop.noiseFrequency(0.02);

  background('white');//#fff1e9

​

}

​

​

​

function draw() {

​

  fill(animLoop.progress, 1.5, 1);

​

  translate(width / 5, height / 2);

  const x = cos(animLoop.theta) * width / 3;

  const y = animLoop.noise() * height / 3;

​

​

  push();

  textSize(40);

  rotate(PI / 3.0);

  fill('#45454d');

  noStroke();

  //rect(width - 480, 0,250,40);

  text('Workshop | 16-19/09/19', width - 480, 0);

  pop();

​

​

​

  push();

  textSize(40);

  rotate(PI / 7.0);

  fill('#45454d');

  noStroke();

  text('HEAD – Genève', width - 180, 460);

  pop();

​

​

  //push();

  //fill('255');

  //rect(x,y-220,950,240);

  //pop();

  text('Kinetic', x, y);

​

  text('Typo', x * 1.3, y + 140);

  text('graphy', x * 1.5, y + 290);

​

​

}