Stamen alum Sha Hwang and I shared a stage last night at Arkitektura's Design Assembly in their lovely Soma showroom. Besides the obvious awesomeness of sharing a stage with Sha (whose work at Trulia is up there with the best), it's always fun to talk to an audience of designers; their focus on how things look and the kinds of questions they ask bring a certain kind of energy. I also feel like I can let my hair down a bit (what's left of it), talk about the cultural aspects of what the studio does and explore some new, not-entirely-fleshed out ideas.
One of the ways I've been tricking myself into thinking new thoughts is to look at writings about other forms of expression and substitute the medium that's being discussed—painting, photography, architecture etc.—and replacing that with "data visualization." So if you take a look at what Group f/64 (Ansel Adams' cohort) said about photography:
"The members of Group f/64 believe that photography, as an art form, must develop along lines defined by the actualities and limitations of the photographic medium, and must always remain independent of ideological conventions of art and aesthetics that are reminiscent of a period and culture antedating the growth of the medium itself."
and drop "data visualization" in there:
"The members of Stamen believe that data visualization, as medium, must develop along lines defined by the actualities and limitations of the data visualization medium, and must always remain independent of ideological conventions of art and aesthetics that are reminiscent of a period and culture antedating the growth of the medium itself."
you wind up with some things to consider that we can toss into the mix of data visualization manifestos and what all this work is "for." Who would take seriously a manifesto about what photography if "for" that was this restrictive now? It's a way to jump the conversation into a more interesting place and start to anticipate a world where these kinds of visualizations are as common as photographs are now; maybe more so.
Another fun one is "fashion." I've been talking about with Ben Cerveny and others for a while now about the idea that Stamen's approach to mapping and data visualization is more like that of a fashion house than like a graphic design studio or a web development shop. Fashion, far from being superficial fluff on top of real culture, in this view is is highly technical (the Gaultier show at the de Young convinced me of this), an endeavor where innovation and new material is key, and is deeply embedded in and often leading aspects of culture.
And then Paola Antonelli asked, on Twitter, where a phrase in the talk came from:
@enjalot @stamen: uh? intriguing statement! pls explain?... "Data visualization will be ephemeral, dangerous and unfair"— Paola Antonelli (@curiousoctopus) September 27, 2012
So here are the slides:
Looks like I'm going to need some more rings, and maybe some better shades...but I haven't seen Lagerfeld with a better cummerbund.
A new installment in our continuing study of Bay Area infrastructure is live, at http://stamen.com/zero1. Some early coverage of the project here and here.
We've mapped the Bay Area's crime and taxis before, but in each case a source of data was readily available for the taking. In this case, we decided to try something different: going out into the world and gathering the data ourselves. We hired bicycle messengers and others to follow the various buses that ferry tech workers from their homes in San Francisco to their campuses down in the Valley (an arrangement that inspires mixed feelings among city dwellers) and to count the people getting on and off them. We started with the locations for bus stops available on public sites like Foursquare, and used Field Papers, an open source paper/mapping project developed earlier this year with Caerus Associates, for the physical mapping.
The context of the Biennial, whose theme is "Seeking Silicon Valley," seemed like a good chance to address the question of how the relationship between the Valley and its surroundings is evolving. This latest cycle of tech investment is spread out more broadly than the last one, leading some people to the conclusion that "...the distinction between Silicon Valley and San Francisco has all but disappeared. It is us, and we are it." I think the relationship is more complicated and dynamic than that (and I've been thinking about this for some time now); my hope for this piece is that it serves as an object to think with about the relationship between these quite different kinds of urban spaces and how we want to see that develop.
The exhibition is up until December 8 at the Zero1 Garage in downtown San Jose, and we'll be hosting and participating in some events around it in the coming weeks. Stay tuned!
Fundamental shifts are underway in the relationship between San Francisco and Silicon Valley.
Historically, workers have lived in residential suburbs while commuting to work in the city. For Silicon Valley, however, the situation is reversed: many of the largest technology companies are based in suburbs, but look to recruit younger knowledge workers who are more likely to dwell in the city.
An alternate transportation network of private buses—fully equipped with wifi—thus threads daily through San Francisco, picking up workers at unmarked bus stops (though many coexist in digital space), carrying them southward via the commuter lanes of the 101 and 280 freeways, and eventually delivers them to their campuses.
What does this flow tell us about Silicon Valley, and the City it feeds?
Today we launched "Mapping the World's Friendships," a project visualizing the degree of interconnectedness between Facebook's hundreds of millions of members as part of Facebook's new Stories initiative.
Countries are sorted by a combination of how many Facebook friendships there are between countries, and the total number of Facebook friendships there are in that country. Turns out this number can tell you some pretty interesting things about not just where a country is now, but where it's been. The Marshall Islands shows strong results in the immediate geographic area—Guam, the Federated States of Micronesia, Fiji—but the number one result is to the United States, over 4600 miles away, since the islands were occupied by the United States until 1986:
The U.S. occupied the Marshall Islands from 1944 until 1986, and 10 percent of the islands' residents hail from the U.S. The top destination for Marshallese immigrants is the United States, where they mostly reside in Hawaii, Oregon, California and Arkansas.
Coloring the circles by the predominant language spoken there (the example above has them colored by which continent they're on, for clarity) provides another kind of insight. Clicking on Haiti makes it "easy to explore French colonization in this view, since you can see at a glance which countries speak primarily French."
We get a similar kind of grouping between Peru, Argentina and Spain, which of course makes sense because yum, paella:
The relationship between Angola and Portugal, on the other hand, needs a little more digging to make sense:
"With the economic downturn in Europe at the end of the first decade of the 2000s, Angola became Portugal's lead export market. As many Portuguese companies shifted operation centers, Angola saw a wave of of Portuguese immigration with more than 23,000 immigrants in 2009—a substantial change from just 156 Portuguese immigrants in 2006."
And the one that really jumped out at us as being much more about recent geopolitical events than any long-standing cultural or linguistic affinities was the tight link between Sweden and Iraq:
Sweden has taken in more Iraqi refugees than the United States. One town alone, Södertälje, dubbed "Little Baghdad", has accepted 6,000 Iraqis since 2003.
Since launching maps.stamen.com and making the maps available for purchase in select cities on 20x200 we've been lucky enough to receive a steady trickle of interest from people who want to print the maps themselves. For those unlucky enough to have missed the watercolor letterpress map that went out with Jason Kottke's marvelous Quarterly.co subscription service, we're pleased to announce the beta version of M2I, a service that lets you print out larger static versions of the maps on maps.stamen.com. Now you can generate those long images on pinterest, chop chop!
The maximum size you can currently generate is 2000x2000 pixels. This is to keep the servers happy; depending on how they run we'll likely increase these limits in the coming weeks.
Please let us know what you think; we're looking into ways that people can order physical products from the site, because watercolor blankets and toner scarves are where it's at this season (and should be available from Soft Cities this fall).
In 2008 we designed a hurricane tracker for MSNBC, right as Irene was "bearing down on Louisiana like a shotgun full of wind and rain." The project worked fine for several seasons of hurricanes and tropical storms, until Apple killed Flash in 2011 and the world of interactive mapping and data visualization turned its attention to HTML5 and mobile platforms.
Here's what I said about it at the time:
I'm really pleased with how this project's turned out; in particular I've not seen a map like this before that gives a sense of the relative speed that a storm moves at (take a look at how Gustav slows down as it passes over the southwest coast of Haiti). It's not something I've really ever thought about before, but now that I've seen it, I'll be looking for it in every other map like this I see—which is just how I like to change the world. Congratulations to Tom and Geraldine for pulling this one together.
This is the first time that we've released something this concrete. At dinner last night Lane told me that it was the first time he'd seen something that Stamen had done that was going to really matter to him in 72 hours. We've historically shied away from doing work that's overly predictive and analytical, preferring to focus on the lyrical and metaphorical aspects of visualization. This is the first time you can make a decision based on something we've built, and I'm glad we seem to have crossed that barrier without fretting too much about it. Just about every big decision I've ever made that's turned out well has been made in lightness and in haste; no sense stopping now!
Much of this carries through in the new version of the hurricane tracker that we released earlier this week. What I said about making important decisions in lightness and in haste still stands (if anything it's gotten worse), but there are a couple different things about this project worth drawing attention to:
- The client is the Weather Channel (previous work for them here), and we're working directly with meteorologists to ensure that the representations meet their standards.
- It's in HTML5, so you can view it on an iPad. Which is good!
- We've made some improvements to the interaction that I never got to take care of in the previous version. The entire histogram (chart at the top) is an active thing you can roll over, for example; the previous version only popped the rollover when you were over the lines.
- The histogram and the map have a much tighter relationship now. If the whole hurricane path is visible on the map, you'll see the whole thing on the histogram, and visey versey. Conversely, if you change the map so that 1/2 the hurricane is visible, you see 1/2 of it on the histogram. You can see this happening in the images below.
Every year around this time in San Francisco things start to feel a little rushed, and there's anticipation in the air as a whole slice of society hauls itself out to the middle of the Nevada desert for the annual Burning Man festival. I'm not going myself this year, but my good friend Zach Coffin has been working out of an office here at Stamen on his latest song in steel and stone, The Universe Revolves Around YOU and it's been great fun seeing it come together:
Given all the Burning Man energy in town, it's probably no coincidence that our latest exercise in pushing the boundaries of online mapping would tend towards the, well, combustible side of things. We've pulled together the latest in web browser capabilities and layered them on top of toner-lines from Citytracking, and it's called Burningmap.
Here's Black Rock City:
It works in New York as well:
And pretty much anywhere else in the world you'd like to point it. Enjoy!
This is a followup to yesterday's post on the visualization of a day's worth of trading data on the NASDAQ stock exchange. We've taken another look at the same dataset a bit more closely. In the examples that follow, each of which represents a single minute of trading, the image on the left uses a unique color to represent each trader, and the image on the right uses a unique color to represent each stock. So on the left hand (trader) side, a big grouping of the same color means that a single trader is buying or selling stocks. And on the right hand (stock) side, a big color block means a single stock being purchased in lots of different transactions.
In this first example, we see that a single trader (UBS, in this case) is responsible for the majority of the shares in this minute:
and that they're regularly trading a single stock at a single price at the same amounts (the yellow dots in a row):
Here we see that UBS buys a fixed amount of a stock at a fixed price, very steadily, stops abruptly, and then starts trading a different stock at a slightly lower price (the dark green and then blue dots on the right):
Here we see a single trader (the orangish square at left) perform a burst of concentrated activity within precisely deliniated margins, making small trades across a wide range of stocks (the kaleidosopic square on the right)
And here we see a similarly trader-centric burst (in blue, at left) spread across a multiplicity of small stock trades, just before the market closes for the day.
Earlier this year Zach Watson and I spent some time visualizing financial data. It's time to make that work public. The following images represent visualization of buy/sell data during a single day of NASDAQ trades.
We mapped a small subset of the variables for each transaction:
- time of the transaction, to the second
- whether it was buy or sell
- price of the transaction
- number of shares traded
Each of these variables is represented in the diagrams below. Each image represents a minute of time, and shows every trade that happens in that minute. Each trade is shown as a circle:
- Every vertical row is a second in time. So the left hand side of the screen is the beginning of the minute, the middle of the screen is 15 seconds in, and the right hand side of the screen is the end of the minute, with 60 seconds in between.
- Blue dots are buys, yellow dots are sells
- The vertical axis is the price of the transaction; the top of the screen is cheaper stocks and the bottom is more expensive stocks.
- The size of the dot is the number of shares traded; small dots are for a few shares and larger dots are for a larger number of shares.
NASDAQ opens for pre-trading hours at 7am, and for public trading at 9:30am.
The market opens. Fairly light activity in the first minute. Most of it is contained within the middle band.
Slightly more trades are happening, and they're for smaller amounts.
Someone seems to be buying shares at a low and high price, simultaneously - hence the lines at the top and bottom of the screen that match each other perfectly. We're not representing who's making these simultaneous buy/sell moves, but it would be easy to find that out or build it in.
This is about the pace we see for the next 2 hours, with the exception of a few bursts like this one right at 8:30am.
There's an incredible burst of activity just before public trading starts. It's completely unlike anything that comes before it. Our theory is that these are algorithms getting in one last set of tiny flurrying trades before the great unwashed masses come on board.
Right at launch, there's a giant burst of selling and trading, within seconds of the bell ringing.
And then the day starts:
Here's a video of what the data looks like when it's animated:
Untitled from Stamen on Vimeo.
There are literally thousands more where these came from. It's surprising us how much loveliness is in this financial data, which is generally perceived dry and boring, only interesting to bean counters.
What I like most about what's come out of this exercise is this idea that you can visually start to detect a difference between normal and anomalous data, even for what's normally considered data that lay people can't understand. If we could find a way to make it easier to understand what's happening in the markets, there's potential here for a kind of literacy in financial data that could help to offset some of the damage done by unscrupulous experts over the past few years.
We're pleased to announce our second collaboration with Jen Bekman's 20x200, releasing gorgeous prints of New York City today, and London shortly. There will be more cities coming over the next few months, so please stay tuned!
It was a nice sidestep to work with the maps at high resolution, and on paper. We also played around a little with the zoom and detail level for the various print sizes. It's dizzying how much information we can show on the 30x40 prints!
10x8 - SOLD OUT!
Eric gave a general overview of the changes we rolled out for Toner v2 in this post and this post. In my post I dig into the technical details. But first, pictures!
Visual changelog for Toner 2012:
Toner v2 (2012 and 2011) uses High Road for more sophisticated roads and tucks San Francisco's punky park mohock under the water.
There is now a "lite" version that is less high contrast, better for printing out analog style or overlaying polygons client-side.
We added reservoirs!
And better about showing walking and biking paths thru the meadows and woods:
Back in the urban grid, we've added subways and building footprints to help wayfind:
Speaking of buildings, big ones get added first, then all on the most detailed zooms:
We cleaned up labels so they don't overlap as much:
And added city labels world wide:
And now draw kanji and other non-Latin scripts right:
Easy-to-use tiles: Stamen now hosts easy to embed Toner tiles with CC license from maps.stamen.com, thanks to the Knight Foundation and our Citytracking.org grant! No server hardware or software setup needed, just start using the tiles in your favorite web mapping API client side. You can still roll your own tiles using the data and setup readme's in the Github repo. Read more »
More international: Plays better outside of the United States! Now displays local names in non-Latin writing scripts (like Japanese and Arabic) and better accent marks in Europe. We optimized the road symbology to more places world wide. Issue 30
More Toner flavors: Introduces specific flavors of Toner optimized for map sandwiches, easy to integrating with and promoting your custom map stories: toner-standard (toner), toner-hybrid-with-labels (toner-hybrid), toner-hybrid-only-lines (toner-lines), toner-hybrid-only-labels (toner-labels), toner-no-labels (toner-background). Issue 10.
Easy to read stylesheets: General stylesheet cleanup, consolidation. Restructured all the OSM roads using High Roads. Now uses Postgres views by zoom level, making it much easier to design what big, medium, and small roads should look like consistently between layers while abstracting the data part. Similar appraoch is taken for water bodies using Imposm tables. Issue 9
More content: Added reservoirs, state boundaries, and more. Map now zooms to 19+, important when you're inventory mapping stories at the city block level where locations along a street and buildings/venues are helpful. Before they stopped at zoom 18 but often when you're looking at street-level incidents (as in Dotspotting.org), you need more detail Issue 18. Along with that, the transition between bold black roads and cased white roads now starts at zoom 18 and carries thru to zoom 19+ (Issue 17). This preserves the strong contrast of Toner, but also allows better use as a background map visually at these zooms so your story points stay the focus (and consumes much less ink if you print the maps using a service like Stamen's Field Papers.
Urban wayfinding: At these most detailed zooms building footprints help us orient to the build landscape so we start adding those progressively in starting around zoom 14 (big airport terminals and convention center sized buildings) but most noticeably at zoom 16+. We also show metro (subway) stations now, helping navigate by landmarks in big cities like New York, London, and Tokyo. Issue 16, Issue 48, Issue 40.
Improved graphic styling of country boundary lines at zooms 8 and 9. Issue 27
Added state boundary lines at the city and regional zooms. Important for places like Washington DC where a metropolitan area sprawls across multiple admin-1 jurisdictions. Made sure they stack above the water and made upstream changes in OSM master data to allow for boudnaries in the water that aren't indicator level to be not shown in Toner when using newest OSM Issue 11, Issue 24, Issue 7, Issue 6, and Issue 50.
Added support for international Unicode (UTF-8) labels from OSM by re-authoring fonts. Primarily seen in street labels and park names. Issue 30
Removed map label overlap by manually adjusting the Dymo output around other map features like bodies of waters, country labels, and state labels. Issue 34, Issue 35. Version 3 will address remaining occational placement funk and overlap of marine labels.
Added in more city labels in zooms 9, 10, and 11 from Dymo Issue 15, Issue 1, Issue 51, Issue 29, Issue 27
Added new park labels progressively per the zoom. Issue 13, Issue 42.
Easier to read street labels at zooms 17+. Issue 25
Parks are now tucked under the water in the street-level maps. This is a OSM pecularity where some parks are mapped to the shoreline and others extend out into the water. As these are black-and-white maps, we take a shortcut by making a transparent pattern with the black stipples. When it's over the water, the black park is still drawn, but the water is also black so win-win. MapBox Streets uses a transparency on the polygon-color instead. Issue 12
Added reservoirs to the "inland water" aka "lakes" symbolization. Removed smaller lakes at zoms 8 to 12. Since the water is solid black, these tiny lakes attracted undue attention. Instead, they are now progressively added on each zoom in. This reduces the visual noise in the map. Issue 23, Issue 45, Issue 39
For lake labels, similar progressive approach but with a slight zoom delay. Issue 44
Similar approach to adding parks progressively. Added full set of "green areas" in OSM, this captures cemeteries such as Arlington National Cemetary in Washington, DC. Issue 42, Issue 43, Issue 45
Now uses High Roads for all OSM roads in the midzooms and street-level zooms. Issue 9, Issue 35
Now uses new Natural Earth 1.5 global roads in the world zooms. Issue 2, Issue 3 Issue 5, and Issue 6, Issue 52 Caveat, these are an early beta release from NE now.
Tunnel stret labels are now grey to match their grey linework. Issue 22
Where Tunnels pass under land, not just water, we introduce an additional grey outline as visual trim. Issue 21, Issue 49
Added airports! Symbolized and labeled using combination of Mile High Club and OSM. Issue 41
Added metro (subway) icons at zooms 18 and 19, helpful for city wayfinding. Issue 26
Added data import scripts to PostGIS, still rough.
Include explicate MML and MSS for the project, including label shapefiles, so it's immediately deployable Issue 38, Issue 37
Updated the Readme.md Issue 36
A beta version of Toner v2 was released in late 2011. The final release mostly focuses on airport icons and making map labels more legibile (less overlap).