dmsc_spring2021

Week 5

Today:

Next week:

Fun with Vectors

Vector example

Code examples from Dan Shiffman, The Nature of Code chapter 3

Vectors require special vector math function, not simple addition/subtraction.

function setup(){
  var v1 = createVector(40, 50);
  var v2 = createVector(40, 50);

  ellipse(v1.x, v1.y, 50, 50);
  ellipse(v2.x, v2.y, 50, 50);
  v1.add(v2);
  ellipse(v1.x, v1.y, 50, 50);
}

Vector basic example

P5JS Vector class in the reference, and in the Web Editor.

Bouncing ball example with vectors

Remember how to program a bouncing ball? There is x and y location, as well as its xspeed and yspeed to control its motion.

example bouncing ball - no vectors

How can we re-make this example using vectors?

// Example 1-2: Bouncing Ball, with p5.Vector!
let position;
let velocity;

function setup() {
  createCanvas(640, 360);
  background(255);
  position = createVector(100, 100);
  velocity = createVector(2.5, 5);
}

function draw() {
  background(255);

  // Add the current speed to the position.
  position.add(velocity);

  if ((position.x > width) || (position.x < 0)) {
    velocity.x = velocity.x * -1;
  }
  if ((position.y > height) || (position.y < 0)) {
    velocity.y = velocity.y * -1;
  }

  // Display circle at x position
  stroke(0);
  strokeWeight(2);
  fill(127);
  ellipse(position.x, position.y, 48, 48);
}

bouncing ball with vectors

This is a single ball example. But what if we need to control a dozen balls, or hundreds. What if instead of a bouncing ball this was a type of creature with its own roaming behavior? You guessed it, we need classes!

Let’s remake the bouncing ball with vectors as a class that can create individual ball object instances.

First, let’s reduce our setup and main event loop. Then we’ll go and add the actual Ball class.

// Example 1-2: Bouncing Ball, with p5.Vector!

let b; //we declare an individual b which will become an instance of the Ball class

function setup() {
  createCanvas(640, 360);
  b = new Ball(); //we create our b instance of Ball
}

function draw() {
  background(255);
  b.update();
  b.display();
}


//our Ball class

class Ball {
  constructor() {
    this.position = new createVector(100, 100);
    this.velocity = new createVector(2.5, 5);
  }

  update() {
    // Add the current speed to the position.
    this.position.add(this.velocity);
    if ((this.position.x > width) || (this.position.x < 0)) {
      this.velocity.x = this.velocity.x * -1;
    }
    if ((this.position.y > height) || (this.position.y < 0)) {
      this.velocity.y = this.velocity.y * -1;
    }
  }
  display() {
    // Display circle at x position
    stroke(0);
    fill(175);
    ellipse(this.position.x, this.position.y, 48, 48);
  }
}

Bouncing ball with vectors and Ball class example

Array of balls with Ball class and vectors

Programming our Mover class with Vectors

An object has a location where it is at that given moment as well as a velocity which is instructions for how it should move from one moment to the next. Velocity is added to location.

location.add(velocity);

Then we draw the object at the location

ellipse(location.x, location.y, 50, 50);

What info does a Mover object have?

  1. It moves
  2. It gets shown (drawn to screen)
  update() {
     location.add(velocity); //The Mover moves
   }

  display() {
     stroke(0);
     fill(175);

     ellipse(location.x,location.y,16,16); // The Mover is displayed.
  }

}

We also need the object constructor, which is invoked let m = new Mover();

To start, we’ll give random location and velocity to each Mover instance

class Mover {
  constructor(){
    this.position = createVector(random(width), random(height));
    this.velocity = createVector(random(-2, 2), random(-2, 2));
  }

Acceleration

Acceleration is the rate of change of velocity. Velocity is the rate of change of location. Acceleration affects velocity and then velocity affects location.

In code:

velocity.add(acceleration);
location.add(velocity);

We can update our Mover constructor and update function to incorporate acceleration. Everything else will remain the same.

class Mover{
  constructor(){
    this.position = createVector(width/2,height/2);
    this.velocity = createVector();
    this.acceleration = createVector(-0.001, 0.01);
    this.topspeed = 10;
  }

  update() {
    this.velocity.add(this.acceleration);
    this.velocity.limit(this.topspeed);
    this.position.add(this.velocity);
  }

full example code for Mover with constant acceleration

Random acceleration

If we want a randomized acceleration, we need to use random2D() in our update function, to create a random vector. random2d() in reference.

update() {
  this.acceleration = p5.Vector.random2D();
  this.velocity.add(this.acceleration);
  this.velocity.limit(this.topspeed);
  this.position.add(this.velocity);
}

full code example

Resources

Artificial Life: Virtual Creatures and other Machines

More on automatons

Early explorations of artificial life are the automatons of the 1700s. One of the earliest is the Digesting Duck created by Jacques de Vaucanson in 1739. The mechanical duck appeared to have the ability to eat kernels of grain, and to metabolize and defecate them.

digesting Duck

As Simon Norfolk observes, the duck provoked a philosophical crisis:

“If it could perform so many functions that were like life and yet it was a machine, then it begged the question what exactly is life? For the first time with any clarity it raised the important question ‘in what way do humans essentially differ from very complicated machines?’

Of course it was later revealed that the duck did not actually metabolize but was preloaded with ducky dung. Decades later the Mechanical Turk automaton - a chess playing robot that appeared to be able to win against very skilled human players, provoked a related question of human versus machine intelligence.

Mechanical Turk

Yet once again it was found to be a fraud. Wolfgang von Kempelen, had designed it with a secret compartment inside, where he would pay retired grand master chess players to hide and play against opponents, controlling pieces using levers. Amazon has very cynically named their online labor service MTurk in reference to this.

Science fiction is full of intelligent artificial life forms which embody out hopes, dreams and anxieties for the technologies we build. These characters pose questions of control, agency and what it means to be human.

Frank

Cybernetics and emergence

The interdisciplinary field of cybernetics that emerged after WW2 also explores these questions. Of note, are the cybernetic experiments of Dr. Grey Walter an English neurologist and roboticist. In 1949 Walter built reactive autonomous robots without the aid of computer processors or micro-controllers, these could wander about and avoid obstacles. Most famous were his turtles Elmer and Elsie which he thought of as electronic ‘brains’.

turtles
*Turtles, video

Walter’s turtles were a proposition that intelligence is not a higher level property and rather is, situated, emergent and pre-cognitive. They are still widely cited in cybernetic literature today.

A more recent example of an artist exploring of these theme’s today, is the early work of Heather Dewey Hagborg. In this video she describes some key concepts of her work Bugs, and artificial life such as emergence, bottom up models for intelligence and the irreducibility of complex systems.

Bugs
Bugs, by Heather Dewey-Hagborg - video

Artificial Life in Media Art

Media art history is packed with examples of artificial lifeforms that consider the cultural, aesthetic and political implications of the promise of technology, what it means to be think, be alive, or have intelligence. Mitchell Whitelaw gives a solid review of the field in MetaCreation..

Some key examples of artificial life artworks are:

Senstor

Typewriter

We could also consider the non-art realm, such as General Dynamics’ Big Dog.

Other ecosystems

Connected Worlds is a work at New York Hall of Science, by Design I/O with Columbia’s Center for International Earth Science Information Network, Yale’s Cognitive Science Department, NYU’s Games for Learning Institute, artist Zach Gage, and Big Show Construction Management

Connected Worlds
video

While interacting with Connected Worlds, visitors explore the interconnectedness of different environments, strategize to keep systems in balance and experience how individual and collective actions can have widespread impact. As visitors explore and play, their actions – gestures, movements, decisions – have both short and long-term effects on the digital environments. These effects are based on core concepts of sustainability science including feedback loops, equilibrium in a dynamic environment, and casual links and influences.

Artist Ian Cheng describes his work as simulations. They explore mutations, human behaviors, and chaotic emergent behavior.

Ian Cheng’s Bad Corgi

Bad Corgi

Another, Emissary In The Squat of the Gods, one of a trio of works that were presented together at PS1 in 2017.

Emissary

Brent Watanabe’s Deer Cam

San Andreas Deer Cam is a live video stream from a computer running a hacked modded version of Grand Theft Auto V, hosted on Twitch.tv. The mod creates a deer and follows it as it wanders throughout the 100 square miles of San Andreas, a fictional state in GTA V based on California. The deer has been programmed to control itself and make its own decisions, with no one actually playing the video game.

San Andream Animal Cams

Theo Trian’s work is created in the Unity game engine. Characters or elements have behaviors in a closed ecosystem. This is prometheus, which features a pigeon pursuing (pecking) a pretzel.

Theo Tran - Prometheus

Homework

Read / Watch

Create A-life

Artificial Life section originally adapted from Tega Brain