portfolio of
Cris Stringfellow

superfastnoise

superfastnoise

3d Bus Tops Submisison 2 TreeWorld

http://bus-tops.com is deploying art to minds on the street. Disrupt the local thought pattern of the London populous by speaking your art.

A tree is growing somewhere in the universe. You can watch it.

3d `cleaner version` Bus Tops
Submission 1 AspektWorld

http://bus-tops.com is deploying art on the ground in a non-stop LED campaign to playfully disrupt commuter distraction and turn it into something like inspiration, humor, or love-of-processing.

Another world sketch for alien techology.

3d Aspekt World Blue

More blue than the first.

Click - to 8 different animations.

You can also move around

w,a,s,d,c and space.

m - to freeze/unfreeze.

3d Aspekt World

Click to start.
Click to cycle through 8 views.
Get closer with w (forward), a (backward), s(left), r(right), c (down) space (up).
Look around with mouse.

Browse code here
http://bitbucket.org/kinkudi/aspekt-world/src/
Watch video here
http://tinyurl.com/ballvid

3d LittleTree 1002

Right-click to get started.

Iteration 2 for a partial (focus+context) layout strategy, aimed at trees.

Controls
======

space,c,w,a,s,d - move
v - toggle vertices
mouselook - toggle on/off with another right click
right-click - to get it all started

Using
====

Rename all files with classes to {class name}.java, and put everything into a sketch folder called AspektWorld

3d interactive Monster 1001

Right-click to get started. 1000 nodes, 4000 edges. A big universe of graph.

space,c,w,a,s,d - move ( in either direction along each of the 3 cardinal axis )
mouselook - toggle on/off with another right click
right-click - to get it all started
e - to toggle edges
v - to toggle vertices

Using
====

Rename all files with classes to {class name}.java, and put everything into a sketch folder called AspektWorld

Basic 3D World

Template for building a 3D navigable world. Includes a grid, and key and mouselook controls.

Controls
======
W,A,S,D,c,space - move forward,leftward,backward,rightward,downward,and upward.
right click - toggles mouselook.
double click - resets.

Using
====

1.Changes files with classes to <class name>.java.
2.Put in sketch folder AspektWorld.
3.Open AspektWorld in processing.

Binary Multiplication

A small app demonstrating multiplying numbers in binary.

Controls
======

Drag the sliders, x is across, y is down, to change the values.

The horizontal values get shifted (multiplied) to the left by larger bits in the green column. Summing (mod 2) down the red columns and carrying to the left gives the product (in blue).

3d Aspekt First Version

A retro-look at the first version of Aspekt. Performs spectral embedding using a minimum distance matrix on a random graph of 300 vertices with average degree of Ln(300). Interaction courtesy of PeasyCam.

Controls
======

SPACE - lays it out.
Mouse - plays with graph, right-drag to zoom.
e/v - toggles edges,vertices
r - makes a new random graph.

Simple Drawing Sketch

Hover to cycle through 360 hues. Move the mouse to activate new pixels.

AspektWorld LightShow *NEW VERSION
2/2/12*

-=Summary=-
Deconstructs a graph into its connected cycles.

-=Control Summary=-
Click the app to warm it up.
Press 3 to toggle between random and connected layouts.
Press p to toggle animation on and off.
Press v to toggle vertices on or off.
Press ~ to toggle mousefreelook.~
Controls:
-----------
Animation
========
P toggles faster mode.
p toggles play/pause.
[ step one frame back.
] step one frame forward.

Layout
======
3 - toggles between 'random' and 'designed' layouts.

Player movement
=============
W,A,S,D steps forward, leftward, backward etc...

Aspekt Vista

[e] toggles edges. mouseclick makes a new graph. Deconstruct a random graph into its 4-,3-,2- and 1-cycles. [3] toggles this layout. e/v toggles edges and vertices. wasd,c,space moves around. ~ toggles mouselook.

GraphRain 2

Rain triangles, squares or snow small graphs. n cycles between them. space,c,WASD moves around. ~ toggles mouselook. `

GraphRain

Raining small graphs. n resets. ~ toggles mouselook. WASD moves around.

Demo 1 DomeGraph

Random degree-2 graph embedded on a dome rotating above the plane.
Hover a node to highlight out edge.
r toggles rotations.
e/v toggles edges and vertices.
w,a,s,d,c,space moves forward,leftward,backward,rightward,downward and upward.
~ toggles mouselook.
n makes new.

OpenData V 3.1

Eigenprojection layout in 5 dimensions(x,y,z,color,size).
mouseover a node to highlight its out edges.

3 - cycles through 5 different matrices.
-- The M's are 0:adjacency,1:degree,2:laplacian,3:min distance,4:commute time.

[,] - increase or decrease the 5 eigenvectors we use for the embedding.

n - makes a new random graph.

r - turns off rotations.

w,a,s,d - moves around.

~ - toggles mouselook.

e,v - toggles edges and vertices.

t - toggles text.

OpenData V 3 Options

'3' re-embeds. WASD moves around. ~ toggles mouselook. r toggles rotations. t toggles text. Classic eigenprojection using a minimum distance matrix made from a degree normalized Laplacian. [,] goes forward and backward through the eigenvectors. o,p does something mysterious. n makes a new random graph.

OpenData V 3 Classic

Classic eigenprojection using the minimum distance matrix.
3 re-embeds.
[,] moves through eigenvectors.
~ toggles mouselook. WASD,c,SPACE moves around.
r toggles rotations.
n makes a new random graph.

DataHause V 4.3 BETA TheSteppe

Mouselook toggle - ~. WASD moves. 3 scrolls layout. m reloads from twitter.

DataHause V 4.2 BETA

Added colors. Shiny metallic effect.

~ toggles mouselook. WASD moves. 3 scrolls layouts.

DataHause V 4.1 BETA

Modifying so as to spread nodes throughout space. FPS controls. M reloads. Graph is links between words from twitter. 3 scrolls layouts.

DataHause V 4 BETA

Simpler, cleaner. 3 scrolls through layouts. M reloads from twitter. Mainly shows off a weird lighting effect.

DataHause V 3

Latest release. m - reloads from Twitter. f - toggles the two main layout styles. x - toggles complexity. e/v toggles edges and vertices. 1,2,3,4 cycle through 4 classes of layout. t,y,u,i - re-embeds using the existing layout as a metric. m - reloads from twitter. holding b/n pulls through two styles of summarization.

DataHause BETA 2

And how the touchpads are supposed to behave.

DataHaus _Looks Cool_ BETA

More humorous results from trying to line up boxes. But actually looks pretty cool, even though it's a mistake / not-correct use case behavior.

Controls
Press ~ to toggle mouselook
Use standard FPS controls to navigage (w,a,s,d,space,c)
Use mouse to look around.
Press x to toggle between "lifted" and "city" style layout.


The columns are words from twitter tweets arranged in a markov network based on the 1 order context they occurred in, then they are arranged in space using using spectral distance embedding.

In English : We find links between words in tweets, and put the most

DataExMachina V 20 - broken due to
applet signing

Collects latest tweet feed from twitter and displays words and contexts as a city. 1,2,3,4 Cycles through different layouts. x toggles lifting the data to its original graph form. Holding b/n cycle through 2 types of filters.

DataExMachina V 19

Build a city from data. x lifts or drops the city to its 3d graph representation. 1,2,3,4 cycles through some layout styles. You can fly around with W,A,S,D and mouselook (toggle with ~). Holding b or n cycles through two different meanings of complexity.

DataExMachina V 18

1,2,3,4 - cycles through different layouts. t,y,u,i - Re-embeds with a layout made from the current distances. ~ toggles mouselook. WASD moves around. B/n cycle through two types of summarization. x toggles complexity mode.

DataExMachina V 17

Pre-release version. <br/>1,2,3,4 cycles through 4 styles of city layout, each emphasizing different patterns. <br/> g toggles the grid. <br/> x toggles detailed connections view. <br/> e/v toggles edges and vertices. <br/> ~ toggles mouselook. <br/> W,A,S,D - go forward, backward, left, right. <br/> SPACE,C - go straight up, down.

DataHaus V 1

Cities can be created out of data. 1,2,3,4 cycles through 4 types of building plans. e/v toggles edges and vertices.

DataHaus BETA

Every city starts with a plan, right? Not really, but in this case we're starting with a flat one. 1,2,3,4 cycles through 4 classes of layout. FPS controls. c is straight down. Holding b/B cycles through through different filters.

AspektWorld WelcomeToTheSuck

Hold down b/B to suck the graph down to its simpler representations. Successive summarization. Use 1,2,3,4 to cycle through 4 different classes of layouts. Navigate with standard FPS controls. SPACE/c is jump/crouch. `/~ Toggles mouselook. R re-embeds with same style.

AspektWorld B&W

Black and white version

AspektWorld TheGrid

Standard FPS controls. `/~ toggles mouselook. 1,2,3,4 cycle through 4 types of layouts. (Basic,Projected,Eigen,Combination). New feature: b/B - lays everything out in a grid. More connected nodes are embedded in a larger bigger grid.

AspektWorld Chunky

`/~ - toggle mouse look.
Standard FPS controls.
W,A,S,D - steps forward, leftward, backward or rightward.
Space - soar, c - dive.
Mouse - looks/highlights.
E/V - toggle edges/vertices.
1,2,3,4 - cycle through 4 types of layouts.

AspektWorld BETA p.2

Getting better.

AspektWorld BETA

Humorous. Trying to get rollPads to align with boxes in 3d. 1,2,3,4 cycles through 4 classes of layout styles.

AspektWorld 3.1416

~ Toggle mouselook. 1,2,3,4 - cycle through 4 different kinds of layouts. [,] - changes some sample offsets. R- relayout using same layout.

AspekWorld 1.618

Standard FPS controls, plus:
`/~ - Toggle mouselook.
1 - Cycle through basic styles.
2 - Cycle through basic projected styles.
3 - Cycle through Eigenvector layouts.
4 - Cycle through random styles.

AspektWorld 0.61803

Standard FPS controls.

AspektWorld V 0.6180

Standard FPS controls. Next iteration.

AspektWorld V 0.618

Click bottom-panel to get more options.

Launch off the plane inside a graph. Travel through space in a data cage. FPS style controls and click help to see graph layout controls. Triple-click to reset view.

Aspekt Sprawl

Welcome to DataVille. First-person spatial layout for data. Walk around or fly over it.

Triple-click to reset.
Controls : Mouse (look)
Forward: W
Backward: S
Leftward : A
Rightward : D
Upward : Space
Downward : Control

Aspekt

Mouse right-drag or wheel to zoom.
Click node to select it.
b boxes everything.
h to toggle highlight mode.
p to select all paths between selected point and hover.
d to toggle directed edges.
a to select all paths reachable under hover.

Left tab is matrices. Right tab is eigenvectors.

Spectral layout, coloring and sizing for graphs and XML files. To explore XML files, download the source.

Controls (for more click the help tab atop)

Mouse : zoom, rotate, drag, click to select and make paths
Keys: e (toggle edges), v (toggle vertices), h (toggle highlight mode)