06/04/2018 - Last lecture and Inspirations

Hello, 

In this last lecture/tutorial, we saw a few new sources on maps and generative art, as requested from us.

This was really useful and inspirational and we really cracked in the work thank to those sources.

We abandoned the idea of using Crypto for our project, in order to include each member of the group equally, as Cryptos are not everyone's interest.

We had many projects in mind but as we saw the function called Perlin noise we had fallen in love with the idea of using that as our final project. 

"In many of the programs we build with p5.js, from video games to generative art to interactive applications, we sometimes like to have a bit of randomness to create unexpected and dynamic behavior. Many times though, the random() function is too random -- sometimes we want a function that wanders around but remains smooth and organic."

( http://genekogan.com/code/p5js-perlin-noise/ )

So the main idea was to link is some way the noise function to a certain API, trying also to transmit something valuable to the public.

This is how the first draft looks like.



The numbers on the right-hand side are the index of the population of each of the five countries on the given date.

Here the sketches I did before the code:

Byee,
Eleonora

Following you will find the code already edited by me, it shows how we started, simply linking the API we wanted to the radius of the ellipse, and dividing this number for a certain other number. Though this just represents the UK, it has not been easy for me to do this (ha ha). (Note that is not the code represented, it is the stage before).

var t;
var uk_population;

function setup() {
  createCanvas(1000, 1000);
  loadJSON('http://api.population.io/1.0/population/United%20Kingdom/2018-04-09/?format=json', gotData);
  background(255);
  stroke(0, 15);
  noFill();
  t = 0;
}

function gotData(data) {
     //println(data);
    uk_population = data;
    if (uk_population){
        uk_population = uk_population[total_population].population;
        console.log(ukPopulation);
}
}

    
function draw() {
  translate(width/2, height/2);
  beginShape();
  for (var i = 0; i < 200; i++) {
    var ang = map(i, 0, 200, 0, TWO_PI);
    var rad = ukPopulation/100000 * noise(i * 0.01, t * 0.005);
    var x = rad * cos(ang);
    var y = rad * sin(ang);
    curveVertex(x, y);
  }
    

  endShape(CLOSE);

  t += 1;

  // clear the background every 600 frames using mod (%) operator
  if (frameCount % 600 == 0) {
background(255);
  }

}