### 1. Gather Data
Data & Participatory Practice
Citizens as sensors: the world of volunteered geography
Volunteer GIS
OpenStreet Map

Participatory Sensing: Build a large human network of sensors
- collecting data for open community
- using mobile phones it can be a geo-tagged data
- Open Data Kit: free participatory sensing tool

Opportunistic Sensing: Data can be accessed whether you like it or not
esssseesbqqchiucuknfnvniovnfn geetha sucks

Seed Drawings
Clement Valla – Draw a line

jammy!!!
geetaaaaaarrrrrr(d)!!!
sleep time
zzzz

### 2. Process Data
System Esthetics – Jack Burnham, 1968
- aim to reduce gap btwn science and artist
- blur boundaries btwn something utilitarian and scientific Yeaaaa!

eyes – good for recognizing patterns
ears – good for recognizing time, continuum: good at TEMPORAL (time) RESOLUTION –> SPATIAL RESOLUTION

We have a super accurate temporal resolution in our brains. We can hear auditory spacing with much more distinction than with visual
- eg. Amanda cox: alpine skiing

chordal structure – very good at knowing when two things happen at once. In visual form, it’s much harder to separate, but auditorily? we can do it with ease
- eg. Brain blues

dangers of sonification – easy to make things seem like a pattern when there isn’t. You need to make sure you’re playing something from the data and not just fromt he musical scale
- eg. ToneMatrix

Flocking
- “neu” examples
- optimization

Cellular Automata
- What
- Wolfram 1D
Class 1-4
- Game of life 2D
2D array
OOP?
- Eduges
- Variations
– hexagonal
– probabilistic
– continuous
– historical
– moving?

### ALIGNMENT
- average velocity
###COHESION

- Average Location
Calculate the center of everyone and apply force

PVector cohesion (ArrayList boids) {
PVector sum = newPVector(0,0);
or(Boid b: boids) {
sum.add(b.loc);
}
sum.div(boids.size());
PVector force = seek(sum);
return force;
}

Interesting to consider, Boids that had eyes and had periphery. Map out it’s peripheral view and maybe have it move or attract accordingly.

Collision: Can make the computational part overwhelming and frame rate will plummet.
How can we make it more effecient?

1. ArrayList to keep track of every element ONCE
2. ArrayList of a grid of screen?
-or-
1. Each “thing” register in grid
2. Check for intersection

CHECK INTERSECTION SLOW vs INTERSECTION

Random suggestion:
Making a sin/cos look up table
- useful if you need more speed (less computational work)

###CELLULAR AUTOMATA
Definition:
- grid of cells 1D, 2D, 3D…?
- each cell has a finite number of states
– 0 or 1 ([on/off??] encoding & expression/genotype & phenotype)
– a state can drive the behavior of an object
- each cell has a neighborhood
– in flocking, the state has a lot to do with what’s happening w/ neighbor and neighborhood
___ eg. one member in flock dies, surrounding dies, etc. States change from 1 to 0 or whatever.
___ eg. water coloring sketch. Center pixel has color, but surrounding cells fade out to imitate the spread of color (a lot you can do with pixels based on CA rules)
- good reading: game of life

WOLFRAM’S SYSTEM
Have to have at least 1 dimension
Does the neighborhood include itself? Yes
1. 8 combinations of 3 digits of zeros and ones: 2^3 = 8
2. 8 combinations of 2 digits of zeros and ones 2^8 = 256 total combinations

These combinations can be divided into 4 classes:
class 1 – homogenous
class 2 – oscillating (“pattern”)
class 3 – random (“chaotic”)
class 4 – 2&3 together (“complexity”)
Though this really really basic process of 1s & 0s, we can generate patterns of randomness.
mathworld.wolfram.com/ElementaryCellularAutomaton.html

“Digital Physics” – can all of our world be descibed in a series of zeros and ones.
- there’s a book about it that starts with a Z.

EDGES: They may not have neighbors. What to do?
Common Options:
1. Treat them as a constant
2. Create an edge rule set
3. Wrap around **most common solution**

Why relevant to projects we may do:

1D CA vs 2D CA
1D – look to your neighbors left & right: 3 cells total
2D – look up, down, left, right (all around): 9 cells total

1- (0 or 1)
0 – (1 or 0)

3 real possible outcomes.
Birth
Death
Stasis

2D array
array [][]

Reads the old array, writes a new array, then re-writes to the original
int[][] old_board, new_board;
-or-
OOP
Cell[][] grid;

- You can explore a hexagonal pattern
- Or a probabilistic approach. Having a 90% chance of dying instead of just dying. They dont’ have to be so precise and accurate
- maybe determine things based on it’s history. How long it’s been around etc. If it’s been alive for 50 frames in a row, maybe it’s brighter etc.

3D – 27 neighbors!!
- just a lot more coding to do

FRACTAL – shape that when broken into parts, parts, approximate the whole
- when broken into small parts, is identical to whole

Fractal Broccoli

- natural forms that cannot be described Euclidian geometry
- self-similar structure
- defined with a recursive function (code friendly)
- fine structures at small scales
– when you zoom into fractal the pattern repeats itself

Production rule
1. line segment
2. cut into 4 lines
3. each of those segments are then cut into 4 lines again… and repeat

Koch Curve -or- Koch Snowflake

Theoretically, INFINITE lines being created in a limited space – may explain why this pattern appears so often in nature. Evolutions, tends towards it…blood vessels, leopard spots, ferns…
Because of this parado of infinite growth in limited space sometimes called Koch Monster

CONTINUATION OF TREE DATA/LISTSERV VIZ:
Fractal tree: has to control, but in combination with ArrayLists, to draw leaves/ellipses at the ends of the branches

LSYSTEM

“Strangely foreshadowing… cellular automata…au-tah-mah-tah? auto-mah-tah? *mumbles away*”

1. Get Lat and Long
2. Find an image you want to display info on top of
3. Make sure points are where u want
4. Plot

Static data – data is always the same
Dynamic data – every time you ask for it it’s different (eg. itp listserv)
Giant dynamic data – Large of amount of dynamic data (eg. itp listserv)

Range of techniques to deal with GIANT DYNAMIC DATA:
Mongo
+ you don’t have to know exactly what your data will look like in the end
+ you can put whatever data you want into it
-

1. Install Mongo
a. get MacPorts
b. sudo port install mongodb
2. Import Data
a. Make a database: type ‘use my Database’ and it will make it for you
b. use mongoimport to import CSV

Mongo –JSON -BSON
Spits out whatever it is you want
even if not all categories have the same tags

{name:”Bob” age:”17″ gender: “M”}
Ask for whatever you want.
If you want height, it’ll get height from categories that have it

mongoimport –host localhost –db foo –collection bar –type csv –file temp.csv –headline

3. Connect Mongo to Processing

Geospatial/temporal programs

TileMill/MapBox
+ relatively easy to create map experiences

Google Fusion Tables
+ Allows you to take 1 or more tables of data, merge them, and create visualization of those things
~ it’ll go through your tables, go through things that look like cities, and assign a lat and long to it
~ http://maps.google.com/maps/geo?output=json&key=abcdefg&q=brooklyn
~ you can change out the stuff in bold
– limited to 20 per day
– if you do it in a spreadsheet, you can have it automatically fill it in the lat/long/confidence for you

Finding LAT/LONG in a GOOGLE SPREADSHEET
Google Doc

Processing – to be emailed over

Aaron Koblin – Flight Patterns
+ Super simple

Eric Fischer – The Geotagger’s World Atlas
~ takes speed of picture taking on a map
~ the black is slower
~ red means you’re moving faster
~ more ppl tag photos not at home, on coasts
~ red = tourists
~ blue = nykers
~ makes something from nothing

Pedro Cruz – Lisbon’s Blood Vessels
~ traffic data
~ many iterations

Ways to Map out GEOSPATIAL DATA
{LatLon} –>Projection Formula–> Cartesian Coordinates

Mercator Projection (Gerardus Mercator)
link
- Won’t work because it’s not equal grid
- But you can run it through a mercator formula and it’ll put it out properly

Winkel Tripel (Oswald Winkel)
link

Dymaxian Projection(Buckminster Fuller)
link

Sphere
- Don’t deal with a projection at all, just plot everything on a SPHERE in processing
- how do i turn lat and long into spherical coordinates and vice versa????
- half of it is hidden at any given time (issue) which makes data not as easy to look at at once
- only time you’d want to use a sphere is when you want to show continuity on globe (no “end of the map”)
Good morning – Jer
- 3 layers. Map, City lights, clouds

1. Use known marker points
2. Tweak origin, x/y scale to match
3. 0,0 (off coast of Africa)
Hawaii
Tokyo
London

Next week. Sound and Data

Steering
- seek/arrive (pursue?)
- wander
- flow field
- path following
– DOT PRODUCT

Groups
- complex systems?
- self-ogranizing?
- flocking

CA
- wolfram
- GOL

Complex system
- non-linear
- parallel
- “emergent”

*nesting
*adaptive
- “memory”
- genetic algorith
*cooperation & competition

##STEERING
SEEK/ARRIVE
1. What is my target?
*2. What is my “desired” velocity?

Craig Reynolds: www.red3d.com/cwr/steer

class Vehicle {
loc, vel, accel (vectors)
maxspeed (float)
maxforce(float)
steer(PVector target, boolean slowdown) (steer target true, slow down, steer target false, go fast)

}

STEERING = DESIRED – VELOCITY
- when you’re moving in one direction and want to change directions, you need to steer to compensate for the direction change

WANDER
You can use two points on a circle. The target is somewhere on the circle, the vehicle is on another side, and as the angle of where the target sits on the circle changes, the vehicle’s direction changes.
steering: change in velocity
turning: change in direction

FLOW FIELD
A grid of cells, in which each cell has an arrow in it that represents a velocity
No target in this case, just desired velocity
The desired velocity is really the cell it is going to be in, rather than the cell it is in?????
One reason to use a flow field: fluid simulation eg. flow of blood throughout the body or a birds-eye stampede…
Maps out a 2D space (could be 3D too)

PATH FOLLOWING
- not path finding (in AI)
- path needs a radius

The black dot is the future spot


- find the shortest distance between a point and the line (path)
You need:
1. The future location
2. The normal location
3. And the future location on the path

DOT PRODUCT

The 2nd equation is the simpler and more useful one.
- angle between processing
a = ______________
b = ______________
b.normalize();
float length = a.dot(b);
b.mult(length) ***

How do we know which line to find the shortest distance between?
- there are an array of points and it normalizes all the points
If you really really do need to use a curve, you can always find the tangent (highest point of a curve) as the “normal” point.

1. Vehicles can see other vehicles
2. Combining & Weighting behaviors
3. Complex systems

Flocking – “Boid”
Alignment – move with our neighbors
Cohesion – stay with your neighbors
Separation – stay away from your neighbors

Now’s the time to start reading chapter 15-19 of the book with planes on it?

“Nice guy…he looks like a nice guy. I’ve never met him, but I’ve emailed him once… it was pretty exciting” -Shiffman on Craig Reynolds
“Words are just words. They can’t hurt me.”

Golan Levin – The secret lives of numbers
- example of how even the most trivial data set can be interesting
Picture
Check it out

Steve Varga – Pennant
- Design heavy exploratory tool (clickable nodes to go into things) (possibly the future of data viz)
- Able to go into granular detail with the data. Eg: Pick a date, find a team, find a player, how many home runs that player made.
Video

Fernanda Viega – PostHistory
- Had a viz lab at google
- allows them to visualize their email database

Moritz Stefaner – Relational Browser
- Relational data set Eg. Ppl in switzerland speek swiss, what other countries speak swiss
- Demo

Fizz – Bloom.io
- a company that creates exploratory tools
- Most exploratory data is not share-able
- This visualizer twitter feeds
- critique: good feel/physics, but no real thematic clustering
– it’d be nice with a time slider to see when topics burst
– the way these clusters are arranged doesn’t tell a story about what you’re showing
— if you compare two clusters what differences/similarities can you see? (as of now you can’t tell)
link

Mitchell Whitelaw – commonsExplorer
- it allows you explore the database of photos on flicker that are creative commons
link

Karsten Schmidt – Social Collider
- Visualizes twitter as a particle acceleration
- wrote the toxiclib library
link
- we can see ppl are very “bursty” with tweets and that’s true with human behavior in general
thought: data viz game? A game stage set by data??

Question: Is there code that can be applied across many sets of data
- pros: good for things like linguistics, networks, yes. Also very useful to have it apply to many things
- cons: if you want to get specific data from each of these data sets, then you lose that granularity

Matthew Bloch, Shan Carter & Alan McLean – Mapping America (NYTimes)
- asking tons upon tons of people to look at a single data set and see what stories come out of it
– asks to share on facebook
link

Gary Blight & Sheila Pulham – Arab Spring (The Guardian)
- interactive exploratory visualization
link

We have tools that allow us to:
change focus
shift perspective
follow connection (twitter trail guy)
leverage collaboration

exploration
- manual
- automatic
- assisted – here are your results, here are some related results that can drive you down other avenues

Data
- forms a landscape
- fitness: best idea is most fit
- big jumps, then smaller jumps to find the best places

make

ideas: data rep as game
more interactive interesting news feeds

www.mongodb.org

bit.ly.itpdemo1

Spring Break Homework:
Produce a dataset
- more than 200 datapoints stored in a Google Spreadsheet everyone must contribute equally
- eg. feltron report stuff: distance traveled, sleeping hours, number of drinks consumed
- what kind of question would you want to answer with this data?
- check out datum
- download iphone app

Group:
andi, dave, marko, myself

code – update key string
input

hex:
unhex:
When inputting color: FFFF9900 (ARGB)
(alpha ff)

while loop – easy to get stuck in an infinite loop

**double check the sketch for accurate code:
group = 4 || sc = 16 (something like that… if group = 4 unless last group then 16 is OK.

The first thing I did in minecraft, was get myself OFF THE FLOOR. I’ve watched someone play the game before, and I was terrified of nightfall & zombies. It turned into this fear-driven game of building a road mid-air.




Box2D
- Joints
- Filter group Index
- multi shapes
- moving “manually”
- Contact Listener & Interface!

Toxiclibs
- vs. Box2D
- using inhabitance
-what is verlet physics
- connected systems
- force directed graphs

Complex Systems
- simple units
- parallel
- emergence

Autonomous Agent
- limited perception of environment (predict future)
- process & calculate action
- no commands from leader??

Vehicle
- Action/Selection
- Path Determination
- Locomotion

Goals/Strategy
- week
- flee
- hug wall
- follow path
- braitenby??
##BOX2D
Review:
World (contains) Body (contains) Shapes

JOINT: Connects 2 bodies (not shape)
Joint definitions:
- distance joint
— imagine an inflexible steel rod
— NOT a shape. No substance
— can be springy
- revolute joint
— for turning stuff
— like the revolutionary point in transformice
- mouse joint*
— DJDO: Distance Joint Def Object
jd.body1=__________
jd.body2=__________

Filtering collisions
sd.filter.groupIndex = 1-8
If snowman & snow are both 8, they’ll collide with each other
-8 and 8 = Do not collide with each other

How to build more complex shapes in box2d
[] setAsBox();
O CircleDef

What if you wanted to make a O=||<< (person sideways)
1. Define the shape
- set properties: local position
2. Define the body
- set properties
3. Attach shape to body
- n times
To attach many shapes to body.
Define shape multiple times & attach to body
4. However: Every single shape is going to be attached at the center unless you set the 'local position' of the shape

MANUAL MOVEMENT
paddle.x = mouse.x (CANNOT DO)
How to move paddle with mouse?

Set an object's location
paddle.setXForm(mouseX,Y,angle 0) (TELEPORTATION)
Convert X/Y to WORLD coordinates
EVEN SO
- If you don't, BOX2D will think of things as teleportation.
- It cannot figure out the physics for it, so just jumps it

You need to connect a joint from the paddle to the mouse. So when you pull the mouse it pull the paddle.

In BOX2D, the "ground" is not the bottom of the screen. It's a Plane, so it's actually 'itself' or what we see.

Attach paddle to Mouse AND Ground. One to anchor it?
MouseJointDef mjd = ____
mjd.body1 = box.body;
mjd.body2 = box2d.getGroundBody(); <--
MouseJoint m; = _____
mj.setTarget(___,___); <--

INTERFACE

The only way BOX2D can tell processing when a collision is happening you have to conform to its standard and add required functions:
void add(){}
void persist(){}
void remove(){}
void results(){}

You don't have to have anything in it, but you have to write all of them!

MyListener ml;
box2d.add(ml);

voidAdd(ContactPoint cp) {
}

To make a particle turn red
Contact point btwn shape 1 & shape 2 --> bodies –> particle object
body –> particle
getUserData

box & particle
shape 1 & shape 2

filter vs ContactListener
grouping particles vs. collision of specific particles

##TOXICLIBS: A giant collection of libaries
BOX2D
World, Body, Shape, Joint
TOXICLIBS – Verlet physics packet
Verlet physics, V. Particle, X (no shape. Does not too collision), – V. Spring
— 3 kinds of springs:
– Verlet Spring
– constitutional????
– min distance
- Has it’s own vector class: Vec2D, Vec3D
- You can lock(); a particle
- boundaries in toxiclibs is the “background” in processing
-

Toxiclibs PRO:
+ 3D – has 3D capabilities. Box2d…2d only
+ Designed for Processing
+ Good documentation
+ Uses pixel coordinates (no headache conversions)
+ Faster (because it doesn’t do collisions?)
+ Connected systems (Genevieve’s string on balloon)
+ Inheritance – Toxiclibs has a nice big library we can use and we EXTENDS it.

Coding it up: //elegant processign coding
class Particle extends Verlet Particle {
void display(){
ellipse(x,y,10,10);
}
}

## COMPLEX SYSTEMS
- examples stock market
- many small parts moving to get a group composition
- no LEADER not controlled

Our “Vehicle” has locomotion, a path, and actions that we creatively use, but the key is it needs to have GOALS (seek, flee etc.)

Craig Reynolds: seek, flee, water, flow field, path crowd path, float. (Maker of these behaviors in movies, games etc.)

1. Competition: Up to you to make a combination of competing behaviors of the above drives
2. Make up stuff

Back to Craig: STEERING BEHAVIOR

Steering force = Desire – Velocity
An embeded “perception of the environment” meaning there’s a sense the object understand and interacts around/with environment. Eg. Obstacle avoidance = obvious ‘perception of envi’

Desire Vector = Target Vector – Loc Vector
Desired velocity want to hit max velocity. (there has to be an acceleration and directional change)

maximum force: determines steerablility to garget

float maxspeed;
float maxforce;

##TARGET SEEKING – basic seekign behavior

Books: Casey Reeves – Vehicles (emotional drives rather than hug wall etc.)
Turbles termites & traffic jams

“Animal a, new animal…we are so amazing, we can make an animal.” (mumbled 2nd half)

“How this scenario is giogn to pan out…i’ve already rehearesd this in my head…”
“We really shouldn’t do this but i can’t resist”
“This looks kind of right, but clearly not at all.” (box2d physics. body&image incongruent)
“That class was a big time energy suck…in a good way” (Big screens)

“And say you want the snow to bounce off the snowman… I don’t know if that really makes sense, but pretend you want the snow to bounce off the snow man”

“Lollipop…what was it thhe lollipop….gang?”
“guild”

NYTimes Article Search API: www.blpnt.com/source/nytimes.zip
1. Times engine –> 2. TimesArticleSearch –> 3.NYTArticleSearch API –> 4. TimesArticleSearchResult –[ 5. times results object/timesfacetobject

2. TimesArticleSearch
addQueries("search,terms")
addFacets("facet1,facet2") <- indicate what facets you want back (eg. geo_facet/ per_facet/ org_facet/ des_facet etc)
addExtra("extra","value") <- could add a begin/end date. listed on developer side of api. Not used too often
addFacetQuery("facet","value") <- use facet as query. (eg. if i only want publications for the month of feb, put in "month_pub" for "facet" and value "1?" not sure why.

2-4. doSearch()

4. TimesArticleSearchResult
int total (what's the total number from my search?)
[TimesResultsObject] results (contains object results/actual results)
getFacetList(“facet”) –> [TunesFacetObject] (contains facet results)

5. TimesResultObject: these are the things that’ll be inside. You can filter for whatever you actually want.
_abstract
body
byline
date
lead_paragraph
title
url

5b. TimesFacetObject
count (how many times counted)
term (what is the term: eg. Libya etc.)

______

import blprnt.nytimes.*;
String aKey ="ebb930bb67d57dfdd2892a6c5af4c51b:19:54875063";

void setup() {
  size(700,500);
  background(255);
  smooth();

  TimesEngine.init(this, aKey); //initialize and reference 'this' application
  TimesArticleSearch mySearch = new TimesArticleSearch();
  mySearch.addFacetQuery("geo_facet","RWANDA");
  mySearch.addFacetQuery("publication_year","1994");
  mySearch.addFacets("publication_month");
  TimesArticleSearchResult r3 = mySearch.doSearch();

  TimesFacetObject[] months =r3.getFacetList("publication_month");
  println("Rwanda:" + r3.total);
  println("January results:" + months[0].count);

  for (int i=0; i<12; i++) {
    fill(random(150,255),0,0);
    float w =width/12;
    rect(int(months[i].term) * w,height,w,-months[i].count*3);
  }
}

void draw() {
}

getFacet = won’t work if you haven’t done addFacet
geo_facet = terms you get out are facet NAMES not # unlike with publication_month

© 2012 ITPeed Suffusion theme by Sayontan Sinha