natural system studio by hawping yap

A C T

QVM CONT+ INTER

YAP HAW PING 575513 NATURAL SYSTEM STUDIO

R AND OM W AL KER

Theory

The network has been recognised as the basic pattern of organisation in all living systems.Ecosystems in nature are essentially networks of organisms. As Fritjof Capra points out, organisms themselves are networks of cells, and cells networks of molecules. An ecosystem is a flexible, responsive, ever-fluctuating network. Its flexibility is a consequence of multiple dynamic sense-and-respond feedback loops that keep the system in a state of dynamic balance. No single variable is max imised; all variables fluctuate in concert around a collective optimum.Ecosystems in human nature are essentially networks of communication, social networks of relationships and business ecosystems of partnerships. People are empowered by being connected to the network, where the success of the whole community depends on the success of each member and vice versa. Empowerment of individuals empowers the network; likewise empowerment of the community empowers the individuals.

Precedent

So often in today's business and social paradigm, we perceive the world as parts, as mechanical, as inputs and outputs, linear chains and hierarchies; whereas life is actually about networks and interconnecting relationships. Manuel Lima talks of a mental shift to network thinking where hierarchical thinking is no longer adequate for 3 the inter-connected complexity of today's world. Alan Moore points to adapting in a non-linear world, where â&#x20AC;&#x2DC; companies become clubs or user groups of co-evolved customers. In his book, No Straight Lines, Alan Moore explores the law of the ecosystem where mutuality is what encourages a healthy, resilient ecosystem. He points to the Japanese mobile industry and its iMode ecosystem, Apples iTunes/iOS and Googles Android platform as ecosystems that thrive based on 4 principles of mutuality within content and service provision. He also explores how playfulness/experimentation and participatory/sharing cultures greatly help the emergence of healthy, thriving ecosystems; re-balancing our focus on metrics and output with more focus on experimenting and learning together. source : http://thenatureofbusiness. org/2012/08/30/hierarchies-to-networks/

source code

World world; ArrayList<Mover> pop = new ArrayList<Mover>(); //Mover global properties int numMovers = 5000; int searchRad = 5; float maxSpeed =2;

void applyForce(PVector force) { PVector f = PVector.div(force,mass); acceleration.add(f); }

world = new World(“ density.png” );

R AND OM

WALKER

World(String toImg){ loadedImage=loadImage(toImg); //load the source image loadedImage.resize(width,height); loadedImage.loadPixels(); //load the pixel array w = loadedImage.width; h = loadedImage.height; vals = new float[w][h];

if (location.x > width) { location.x = 0; } else if (location.x < 0) { location.x = width; }

void setup(){ size(800,800); smooth();

void draw(){ background(255); world.drawImage(); world.fade(); //run the pop for (Mover m:pop){ m.run(); } }

PImage loadedImage; // image to store float[][] vals; int w,h;

//check the edge of the screen void checkEdges() {

//world global properties float fadeSpeed = 1;

//populate the sketch for (int i = 0; i<numMovers;i++){ Mover m = new Mover(new PVector(random(width), random(height)), new PVector(random(-maxSpeed,maxSpeed), random(-maxSpeed,maxSpeed)), 1); pop.add(m); } }

class World {

loadVals(); //loadBlank(); }

if (location.y > height) { location.y = 0; } else if (location.y < 0) { location.y = height; }

void loadVals(){ //fill up the brightness values array for (int i = 0;i<w;i++){ for (int j = 0;j<h;j++){ vals[i][j]=brightness(loadedImage.pixels[(j*w)+i]); } } }

} //check the environment around the object void checkWorld(){ PVector toBest = new PVector(); //create a temp vector to keep track of the direction of the best condition float maxV = 0;

void loadBlank(){ for (int i = 0;i<w;i++){ for (int j = 0;j<h;j++){ vals[i][j]=0; } } }

//loop through pixels for (int i = -searchRad; i<=searchRad;i++){ for (int j = -searchRad; j<=searchRad;j++){ if(!(i==0 && j==0)){ //checks for edges int x = floor(location.x)+i; x = constrain(x,0,width-1); int y = floor(location.y)+j; y = constrain(y,0,height-1);

void keyPressed(){ if(key==’s’ ){ saveFrame(hour()+minute()+second()+ “ .png” ); } }

//get a value from the image float getAt(int x, int y){ return vals[x][y]; }

//check to see if this is the smallest current value //scale by the distance to the value float v = world.getAt(x,y); PVector toV = new PVector(i,j);

class Mover { PVector location; PVector velocity; PVector acceleration; PVector lastPos; float mass; int c;

//fade the image void fade(){ for (int i = 0;i<w;i++){ for (int j = 0;j<h;j++){ if(vals[i][j]>fadeSpeed) vals[i][j]=vals[i][j]-fadeSpeed; } } }

//limit the angle of vision if(PVector.angleBetween(toV,velocity)<PI/2){ //check to see if the current value is larger than //the current best if((v)>maxV){

Mover(PVector _loc, PVector _vel, float _m) { mass = _m; location = _loc; velocity = _vel; acceleration = new PVector(0, 0); lastPos = _loc; c =0; }

//write a new value to the image void setAt(int x, int y, float v){ v = constrain(v,0,255); vals[x][y]=v; }

//reset all our variables that keep track of the best option float d = toV.mag(); toV.mult(1/d); toBest = toV; maxV = v; }

void modAt(int x, int y, float v){ float mod = constrain(vals[x][y]+v,0,255); vals[x][y]=mod; }

} }

void run(){

} }

update(); checkEdges(); checkWorld(); modWorld(); // display();

void drawImage(){ loadPixels(); for (int i = 0;i<w;i++){ for (int j = 0;j<h;j++){ float b= constrain(vals[i][j],0,255); pixels[(j*w)+i] = color(b); } } updatePixels(); }

//only effect if finding something above a tolerance if(maxV>20){ applyForce(toBest); } }

} //move the object void update() { velocity.add(acceleration); velocity.limit(maxSpeed); location.add(velocity); acceleration.mult(0); if (c % searchRad ==0) lastPos = new PVector(location.x,location.y,location.z); } //draw the object void display() { ellipse(location.x, location.y, 2, 2); } void applyForce(PVector force) { PVector f = PVector.div(force,mass); acceleration.add(f); }

void modWorld(){ //checks for edges if(lastPos.x<width-1 && lastPos.y<height-1 && lastPos.x>0 && lastPos.y >0) world.modAt(floor(lastPos.x),floor(lastPos.y),50); } }

}

SYSTEM

ARTI CLE

P ARTI CLE

SYSTEM

source : Edward Hall (1966 :113) 1. initial stage sprawling agents 2. Agents started to interact with each others 3. Agents interact through attraction and repulsion. 4. Agents form a network 5. Continue to react. 6. Particles form a network in a closed loop.

There are four types of space: intimate, personal, social, and public. When our social space is violated we have a negative limbic reaction. We immediately distance ourselves away or turn towards tahe person and let them know that they are getting close.

Theory : Designed of a mover object and create a particle system where the particles respond to each other via forces.

Further extension of the sketch by Claus Rytter Bruun de Neergaard . http://www.openprocessing.org/sketch/6008

source code

int CheckpointNumber = 50; // Number of checkpoints int PersonNumber = 200; // Number of person(s) float CheckpointX; // Distance among checkpoints (in X-axis) ArrayList Checkpoint; ArrayList Person; void setup() { size(720, 480); background(255); smooth(); ellipseMode(RADIUS); Checkpoint = new ArrayList(); for(int i = 0; i < CheckpointNumber; i++) { CheckpointX += width/CheckpointNumber; // Make a checkpoint every [CheckpointX] pixels Checkpoint.add(new Checkpoint(CheckpointX, noise(CheckpointX) * height)); // Add checkpoints and randomize the height of the checkpoints }

BuildPath(); // Build the paths for the person(s)

ARTI CLE 1

} void draw() { background(0); stroke(255, 0); DrawLines(); // Display the paths

int CurrentCP; boolean bAtCheckpoint; Person() { Speed = random(0.5, 2.0); CurrentCP = int(random(CheckpointNumber)); // Choose a starting CP Checkpoint CP = (Checkpoint) Checkpoint.get(CurrentCP); X = CP.X; Y = CP.Y; /** Choose a destination checkpoint */ ChooseCP(); CP = (Checkpoint) Checkpoint.get(CurrentCP); /** Calculate the destination direction in which the person will be moving */ DX = CP.X - X; DY = CP.Y - Y; Angle = atan2(DY, DX); } void Update() { if(bAtDestination() == true) // If arrived at a checkpoint, choose another checkpoint and calculate the direction in which the person should be moving. { ChooseCP(); Checkpoint CP = (Checkpoint) Checkpoint.get(CurrentCP); DX = CP.X - X; DY = CP.Y - Y; Angle = atan2(DY, DX); }

class Checkpoint { float X, Y;

for(int i = 0; i < Person.size(); i++) { Person P = (Person) Person.get(i); P.Update(); P.Display(); }

int[] OpenCP; int OpenCPNumber;

X += Speed * cos(Angle); Y += Speed * sin(Angle);

Checkpoint(float X_, float Y_) { X = X_; Y = Y_;

} void keyPressed(){ if(key==’s’ ){ saveFrame(hour()+minute()+second()+ “ .png” ); } }

class Person { float X, Y; float DX, DY; float Speed; float Angle;

} void DrawLines() { for(int i = 0; i < CheckpointNumber; i++) { Checkpoint CP = (Checkpoint) Checkpoint.get(i); for(int j = 0; j < CP.OpenCPNumber; j++) { Checkpoint OCP = (Checkpoint) Checkpoint.get(CP.OpenCP[j]); line(CP.X, CP.Y, OCP.X, OCP.Y); } } }

Person = new ArrayList(); for(int i = 0; i < PersonNumber; i++) { Person.add(new Person()); }

SYSTEM

// Create paths between the checkpoints void BuildPath() { boolean bIsInRange; for(int i = 0; i < CheckpointNumber; i++) { Checkpoint CP = (Checkpoint) Checkpoint.get(i); for(int j = 0; j < CheckpointNumber; j++) { Checkpoint OCP = (Checkpoint) Checkpoint.get(j); bIsInRange = dist(CP.X, CP.Y, OCP.X, OCP.Y) > 0 && dist(CP.X, CP.Y, OCP.X, OCP.Y) < 150; if(bIsInRange == true) // Make paths with checkpoints within range { CP.OpenCP[CP.OpenCPNumber] = j; CP.OpenCPNumber += 1; } } }

} void ChooseCP() // Choose a checkpoint to go to { Checkpoint CP = (Checkpoint) Checkpoint.get(CurrentCP); int Random = int(random(CP.OpenCPNumber-1)); CurrentCP = CP.OpenCP[Random]; }

OpenCP = new int[CheckpointNumber]; } }

boolean bAtDestination() // Check whether the person has arrived at destination checkpoint or not { Checkpoint CP = (Checkpoint) Checkpoint.get(CurrentCP); if(dist(X, Y, CP.X, CP.Y) < 1) { return true; } else { return false; } } void Display() { pushMatrix(); translate(X, Y); fill(255); ellipse(0, 0, 2, 2); popMatrix(); } }

Sources : further extension practise of sketches from http://www.openprocessing. org/sketch/11193 Theory : Incorporated the concept of forces into the environment by affecting the acceleration and then create a formula for calculating a dynamic acceleration. I also intend to weight the force to simulate speed of the particles.

A C T

QVM CONT+ INTER

1. http://www.margaritaslavkova.com/body-language-needfor-space.html 2. site plan of Queen Victoria Market 3. Ergonomic of human activity

Proxemics

A C T

QVM CONT+ INTER

Precedent

1 Exposing Contact Patterns 2 Author(s): Wouter Van den Broeck, Ciro Cattuto, Alain Barrat, Ciro Cattuto, Vittoria Colizza, Daniela Paolotti, JeanFrancois Pinton, Wouter Van den Broeck, and Alessandro Vespignani Institution: SocioPatterns.org Year: 2008 URL: http://www.sociopatterns.org/2008/06/exposing-contact-patterns/ Project Description: SocioPatterns.org aims to shed light on patterns in social dynamics and coordinated human activity. A case in point is the study of contact patterns, which deals with such patterns in contacts among people. To date, little is known about these patterns. Although models can help in learning more, measuring realworld dynamics is indispensable for obtaining a complete picture. Fortunately, emerging technologies such as active RFID devices offer previously unfeasible means for collecting this much needed data. The following images are part of a video that gives an impression of a first contact patterns experiment and visualization being developed by researchers at SocioPatterns.org. The authors did a medium-sized test deployment of this experiment during the workshop "Sociophysics: status and perspectives" in Villa Gualino, in Turin, Italy, in May 2008. They asked volunteers to wear small tags with integrated active RFID technology, henceforth called the beacons. These beacons continuously broadcast small data packets while the participants lingered in the Bar during breaks, had lunch in the Cafeteria or attended presentations at the main workshop room. These packets were received by a number of stations and relayed through a local network to a server for further processing. The main visualization represents the beacons, the stations, and their relations of proximity as measured by the system. The beacons are shown as simple discs, which are optionally labeled. Two beacons are connected by a link if the system detected that they are close to each other. The length, thickness and transparency of a link are a function of the strength of the link: short, thick and more opaque links represent strong proximity; thin, transparent links indicate weak proximity. The size of the discs representing the beacons depends on the number and proximity of other beacons, and specifically is a function of the sum of link weights to other beacons.

Morphology Author(s):Michael Chang Institution:UCLA D|MA Year:2005 URL:http://users.design.ucla.edu/~mflux/morphology/index.htm Project Description: About 3.5 billion years ago the first multi-cellular life-forms emerged. Individual cells that once competed directly against one another formed alliances. This allowed cells to specialize creating highly complex mechanisms such as neural networks and muscle fibers. From this point on evolution gave life a phenomenal diversity of designs. Some perform better than others, and thus are allowed to give offspring. This selection process is also known as Darwin's Theory of Evolution. Can we take advantage of this same process to design mechanical forms? After all, nature has been doing so for billions of years and we are living proof of its profound effect: the emergence of properties not suggested by their constituents. The process of evolution has "designed" mechanisms that could swim, hop, camouflage, and sense. It even allowed a regular three pound chunk of matter properties of self-awareness. Morphology aims to explore the concepts of artificial evolution in detail, and on a broader scope the concept of emergence. It is an independent study developed in UCLA D|MA by Michael Chang under the supervision of Prof. Casey Reas. The entire project was researched and executed over a ten-week stretch. All programming elements were written and compiled with Processing. http://www.visualcomplexity.com/vc/project.cfm?id=258

1 1

Flight Patterns Author(s): Aaron Koblin Institution: Design|Media Arts - UCLA Year: 2005 URL: http://www.aaronkoblin.com/work/faa/index.html Project Description: These images illustrate flight pattern visualizations as the result of experiments leading to the project Celestial Mechanics by Scott Hessels and Gabriel Dunne. FAA (Federal Aviation Administration) data was parsed and plotted using the Processing programming environment. The frames were composited with Adobe After Effects and/or Maya and the final piece was highlighted at SIGGRAPH 2005 in the NVIDIA Immersive Dome Experience. source: http://www.visualcomplexity.com/vc/project. cfm?id=210

3 Invisible Cities Author(s): Christian Marc Schmidt, Liangjie Xia Institution: (unknown) Year: 2010

A day of Muni Author(s): Eric Fischer Institution: (unknown) Year: 2010 Eric Fischer took publicly available data from the Muni ? San Francisco Municipal Transportation Agency ? showing the geographic coordinates of their vehicles to create this map showing average transit speeds over a 24-hour period. Muni is one of America?s oldest public transit agencies and today carries over 200 million customers per year in 80 routes throughout the city and county of San Francisco. Black lines represent very slow movement under 7 mph. Red are less than 19 mph. Blue are less than 43 mph. Green lines depict faster speeds above 43 mph.

Invisible Cities maps information from one realm - online social networks - to another: an immersive, three dimensional space. It displays geocoded activity from online services such as Twitter and Flickr, both in real-time and in aggregate. Real-time activity is represented as individual nodes that appear whenever a message or image is posted. Aggregate activity is reflected in the underlying terrain: over time, the landscape warps as data is accrued, creating hills and valleys representing areas with high and low densities of data. The interplay between the aggregate and the real-time recreates the kind of dynamics present within the physical world, where the city is both a vessel for and a product of human activity. Nodes are connected by narrative threads, based on themes emerging from the overlaid information. These pathways create dense meta-networks of meaning, blanketing the terrain and connecting disparate areas of the city.

source : http://www.visualcomplexity.com/vc/project_details. cfm?id=730&index=730&domain=

Precedent

source : http://www.visualcomplexity.com/vc/project_details. cfm?id=733&index=733&domain=

Interactive Activation Author(s): Axel Cleeremans Institution: Cognitive Science Research Unit - Universite Libre de Bruxelles Year: 2004 URL: http://srsc.ulb.ac.be/pdp/IAC/IAC.html Project Description: This Java applet (build with Processing) is a demonstration of "Interactive Activation and Competition" neural networks, as first described by J.L. McClelland in the following paper: McClelland, J.L. (1981). Retrieving general and specific information from stored knowledge of specifics. Proceedings of the Third Annual Meeting of the Cognitive Science Society, 170-172. The model was a landmark illustration of how simple networks of interconnected elements (artificial neurons, so to speak) can be organized so as to form a memory system that exhibits several crucial properties of human memory. In this demo and in the original article, the model captures what someone might know about characters inspired from the 1961 musical "West Side Story", in which two gangs (the "Jets" and the "Sharks") fight for territory and overall dominance. Units, the activation level of which represents the fact that the feature they stand for is true to some degree, are organized in separate groups, each corresponding to the different possible values of a single feature, such as the name of an individual, his age, his education level, his marital status, his occupation, or the gang to which he belongs.

NETWORK STUDY

Diagram

-different colours represent different programs. -number represent level of proxemics needed for people to interact.

A C T

QVM CONT+ INTER

Theory : Implement an environment and study about a realistic precedent which is the Queen Vic Market and analyse itâ&#x20AC;&#x2122;s performance using flocking, attraction and repulsion. Dynamism implemented to diversify the behaviour of the agents.

Bytost alfa[]; Bytost global,vzorek; int num = 500; boolean blurring = false; float counter[][] = new float[8][8]; float counterG[][] = new float[8][8]; Recorder r; boolean rec = false; void setup(){

size(640,480,P3D);

for(int Y = 0;Y<8;Y++){ for(int X = 0;X<8;X++){ counter[X][Y] = 0; counterG[X][Y] = 0; } }

alfa = new Bytost[num];

global = new Bytost(536,10,true); //vzorek = new Bytost(width-28,54,false);

class Bytost{

void draw(){

Genome[] col; float x,y,tx,ty,r,g,b,a,velikost = 0,radius = 0; float speed = 40; int kadence; float mmn = 3; float mmx = 80; float blink; boolean fixed = false; boolean glob = false;

int att = 14; int mut = 0;

float bizarreKoeficient,bizSUM = 0;

boolean deviant = false;

Bytost(){

if(random(100)<95) deviant = true;

col = new Genome[8];

for(int i =0;i<alfa.length;i++) alfa[i] = new Bytost();

for(int i = 0 ;i<col.length;i++){ col[i] = new Genome(8);

}

//println(PFont.list()); textFont(loadFont(“ NimbusSanL-Bold-10.vlw” )); //createFont(“ DejaVu Sans” ,9)); textMode(SCREEN);

//println(col[i].getDna()+” = “ +unbinary(col[i].getDna()));

x = tx = map(rowInt(0),0,255,0,width); y = ty = map(rowInt(1),0,255,20,height);

kadence = (int)random(3,2000);//rowInt(3)+1;

r = colInt(0); g = colInt(1); b = colInt(2); a = rowInt(6);

blink = revdiagInt(6)/4.0; //g = random(255); //b = random(255); //a = random(255);

noCursor();

if(rec) }

r = new Recorder(“ rec”,” genomeWar.mp4” );

void draw(){ background(0); for(int i =0;i<alfa.length;i++){ alfa[i].draw(); for(int Y = 0;Y<8;Y++){ for(int X = 0;X<8;X++){ if( alfa[i].col[Y].dna. charAt(X) == ‘1’ ) counterG[X][Y] += (1-counterG[X][Y])/(num+0.0); else

class Recorder{ String dir,name; int cntr = 0;

compute();

noStroke(); //fill(lerpColor(color(r,g,b),0xFFFFFFFF,(sin(frameCount/ blink)+1)/2.0),a); stroke(r,g,b,constrain(a/12.0+((sin(frameCount/ (blink*.1))+1)*40.0),0,255)); noFill(); //ellipse(x,y,map(radius,0,255,16,20),map(radius,0,255,16,20));

//ellipse(x,y,map(radius,0,255,16,30),map(radius,0,255,16,30));

ellipse(x,y,map(radius,0,255,16,40),map(radius,0,255,16,40)); //rect(x-8,y-8,16,16);

noStroke(); //drawText(); drawHex();

}

boolean over(){

if((dist(mouseX,mouseY,x,y)<map(radius,0,255,16,190))&&!fix ed){ for(int Y = 0;Y<8;Y++){ for(int X = 0;X<8;X++){ if( col[Y].dna.charAt(X) == ‘1’ ) counter[X] [Y] += (1-counter[X][Y])/(40.0); else counter[X] [Y] += (-counter[X][Y])/(40.0);

Recorder(String _dir,String _name){ dir = _dir; name= _name; //btrt = _btrt; } void add(){ save(dir+” /screen” +nf(cntr,4)+” .png” ); cntr++; } void finish(){ String Path = sketchPath+”/” +dir; try{ String bitrate=” 8000k” ;//+(((int)(50*25*width*height)/256)*2); Runtime.getRuntime().exec(“ xterm -e png2vid “ +Path+” “ +name+” “+width+”x” +height+” “ +bitrate); println(“ finishing” ); } catch(java.io.IOException e){ println(e); } } }

source : further extension practise of http://www.openprocessing.org/sketch/7626

The social relationship between people is defined by using different colour code. At first the movement is being played by using flocking and the people are spread all over the place. The behaviour started to change where each colour attract to the desired colour and the distance between the particle determined the social relationship between themselves. The overall study of the complex adaptive system allows me to understand how people behave,contact and interact with each other within a site which is the Queen Victoria Market in Melbourne.

//col[3].setDna(120); } Bytost(float _x,float _y){

Thank You