Koi Trout

I must say I’m really missing my trusty Flash Player and AS3. Up until now I’ve had to resist the temptation to run back to Eclipse or FDT to dive back into the familiar and warm waters of the Graphics API. Flash does a lot of the heavy lifting when managing visual display elements.

Things I miss from Flash:

1. A display list!!!
2. Blend mode support! thing.blendmode = “multiply”;
3. Strong types
4. Font Support: Letterspacing, etc.

Things I love about Processing:

1. It’s superlightweight & free!
2. exit(); great for running log generative processes.
3. super easy save function – save(“myimage.png”);
4. all the other “close to the metal” features.

In hindsight this project may not be a perfect fit for Processing. Most people use Processing to draws millions of  tiny lines based on data of some kind. My work usually has some hand drawn elements and complex masks and blend modes. This has been a fun process so far, I hope to use Processing for Data Viz in the very near future.

As for the fish; I’d like to pull in some generative elements into the patterns in, but I may abandon the project before it gets that far.

Trout from the White River

A bit about the inspiration: I grew up fishing in a creek. We would pull out an occasional catfish or bass, but we caught more Bluegill / Sunfish than anything else. Stumbling upon a school of bluegill meant a fun-filled afternoon of catching fish. Even a small bluegill usually put up a pretty good fight.

Just a couple years ago I went on my first Trout adventure (live bait). Trout is a much different fish, and a whole different kind of fun. Trout have some very distinctive sub-groups; cut-throat, rainbow, brown, etc. From an art and design perspective I’ve really come to love those fish species illustrations. They look like this;

Rainbow Trout Illustration

So let’s create some new kinds of fish! Right now the plan is to borrow from the color sets found on Adobe’s kuler website. I’ll use the information to generate a new kind of fish based on the body base of a trout;

• colors, from the eyes to the stripes, spots, base color and everything in between.
• spotting: big, little, muli-colored, etc.
• how the scales are illustrated
• stripes, cut-throat, and other unique marks.
• fin size, placement and rotation.

Photoshop CS5 brush test

My talk was on Adobe Edge for Flash Designers.

I actually built a lot of my presentation in Edge. CHECK IT OUT.

We also did a little demo with this LOOPING ANIMATION.

Here are some frames from the presentation.

Adobe has left a lot of software orphans in the dust, but I’m hoping this one sticks around. Go EDGE!!

These images were pulled from a set that spans years 1902-2000.

I can’t tell you how much I’ve wrestled with calling this “done”. You can see how this project changed over time. My most recent intent for the image was to create a data-driven graphic. I wanted to create shapes that were somehow linked to bison population and the value of coins.

Then I started reading more Tufte and realized that what I was creating was information graphic heresy.  Total info-junk. I debated changing tracks again to create a readable information graphic poster. Something more quantitative! I needed more science!!! Maybe I would make it interactive? Maybe HTML5 Canvas??!! I had a new version with more readable data all sketched out. It would be great!

After the initial buzz wore off, I returned to the thought that I really just wanted something I thought looked good and could hang on the wall. So I kept it simple.

We’ve done some things with this image that totally violate it’s use for quantitative data and understanding. Here is a marked up version that explains where some of the data is coming from.

So, we have some quantitative problems here:

1. It’s unreadable, there is no legend! The shapes have no meaning w/out my chicken scratch.
2. You don’t measure qty over time by using a pie chart!! (although you can find examples) and you certainly don’t overlap them!
3. I’m ignoring the fact that this data set is incomplete. There are footnotes missing from the data, double strikes, years where there was no information, herd notes, etc. I’m just ignoring this stuff.
4. I’m capping the height of extreme values. There are a few edge cases that would create arcs that would scale off the charts and out side the bounds. I’m bending the information to create a more pleasing aesthetic over the whole data set.

So, this image doesn’t mean anything. Maybe it’s pretty, maybe not. But I made rules in a compter and created it. The amount of bison sitting on the plains in Yellowstone in 1916 and the value of the bison nickel in the same year is what creates the image. That is somehow exciting to me.

From a design standpoint I have to mention that this landed really close to some of Mark Weaver’s work. He has some work with bison and the colors are very similar. I really adore Mark’s work and I can’t say that I wasn’t inspired by him. But hopefully the variations in my iterations and my extensive research here is proof that I’m not ripping anybody off.

This project has taken a long and meandering path. This has been a very messy inefficient way to get to a solution. The agency model is;

Sell > Discover > Design > Build > Deploy.

My process was more like;

Discover, Discover, Design, Build, Discover, Build, Design, Discover, etc.…

I also switched software several times along the path which was a huge waste of time. The software cycle looked like this.

Flash > HTML5 Canvas >  Processing > Flash

So much thought and effort involved in created something so simple.

Usually I subscribe to the idea of less talking and more doing, but the writing process of this experience has been very cathardic. It helped organise my ideas and helped keep me accountable even if I’m only writing for the search engine crawlers. In the end, this process was a little backwards. I started with an image and worked backwards to find data to support it. But I have to say I’m happy to have the experience and some bison art to hang on the wall.

So…on to the next thing.

The cool thing here (at least to me) is that old worn out pieces of US currency and dead buffalo which once roamed the plains of the north are what is driving the shapes in these images.

This was a similar experience to the relationship I now have with the American Buffalo. The book changed my perception of the Bison just like Graceland changed my perception of Elvis.

This gets to my original intent of this whole project:

If my perception of the Bison was open, why can’t I help define what it is? (If only for myself) If my mental model of the bison is no longer the James Earle Fraser version, what does it look like for me?

MY version of the bison is something that is beautiful, tragic, ghost-like, and complex. So I began to experiment with building images that matched that;

1. Faux Fur

I started with a series of sketches that looked like this.

Using found images of Bison I built faux fur and pulled pixel information from the images to create a recreation made entirely of fur.

The fur sketches had a nice ghost-like quality to them. I then moved away from the fur and focused on trying to replicate the coin. That led me to thinking about laser-cutting…

2. Actual Nickels — Laser-Cut Silhouettes 

This is a concept that I fooled around with for a short while. I wanted to create an actual coin…dynamic bison silhouettes laser cut from steel. I sliced up torsos, behinds, feet and heads of buffalo images to randomly create a franken-bison shape. It would have been a real nickel you could hold in your hand!! I abandoned this one because it was really difficult to get the seams to match up for all the different body parts.

3. Infographic (sort of)

My next (and hopefully final) attempt is to build an image that is controlled by data that relates to the Bison. I’ve collected data of herd populations in Yellowstone as well as the value of the Buffalo Nickel coin. The information drives the output in a way that becomes a kind of incomprehensible data visualization.

But more about that in the next post when we talk about inspiration and the dos and don’ts of data visualization.

The book got me thinking about the symbol of the American Bison. The bison has a complex and tragic back story that most Americans are familiar with; They once roamed the plains in great numbers, but were driven to near extinction by mass killings during westward expansion. We also know some Native American tribes had a special connection with the creature.

The Bison has developed into an icon that represents early, unsettled America…a ghost of the plains.

Specifically, two things stuck with me after reading this book;

1. Bison are big dumb animals — This rich symbol of early America is one dumb-ass animal. They are fast and strong, but NOT smart. Bison would slide off cliffs into the Mississippi like lemmings. It would not be uncommon to see their drowned carcasses floating down the river.
2. The model for the nickel was a tortured zoo animal — “Black Diamond” lived under tortuous conditions at the Central Park Zoo in New York and is considered by many to be the model for the bison nickel. This animal stood for hours in a cramped cage and developed an unnatural posture because of it. The animal which was supposed to represent the idea of wide open spaces and hope for the future, actually lived a caged and miserable life.

Those two things stuck in my mind. Was the bison really this majestic iconic animal? Or was it really just a big dumb animal destined for extinction? The symbol of this animal is important to our history. But it’s not what I thought. Maybe I can create my own symbol of what the animal is?

I’ll leave you with a quote from the designer of the coin;

I felt I wanted to do something totally American—a coin that could not be mistaken for any other country’s coin. It occurred to me that the buffalo, as part of our western background, was 100% American
— James Earle Fraser, The designer of the coin in a 1947 radio interview.

Next time we’ll talk about artistic inspiration and generative code.

Before I walked away he said,

“What’s up with all the Bison stuff? I don’t get it. Is it a design thing?”

To which I replied,

“Yes… A design thing… Um, It’s hard to explain.”

And that was the end of it. This has come up several times and I’ve always struggled to explain in person this “thing” that I’m working on. So… let’s me try to explain why I’ve been piddling around with Bison pictures on and off for the last year.

I’ve been a little reluctant to share some of my thoughts out here in the open. This is the internet ya know? You can’t just go sharing all your half baked ideas with the whole world, can you?!  What if they all point and laugh at me?

In the next couple posts I will go over my intent and inspiration for this project, and hopefully post the final series of rendered images so I can move on with my life, or at least the next wacky thing I have planned:)

a few more at flickr http://www.flickr.com/photos/hebchop/5689874489/in/photostream