 So hi, I'm Sean Allen. I'm the Interaction Director at Stamen Design. We're a 13-person group of misfits in San Francisco. I'm an art school dropout. I studied a little bit of computer science back in the day. I've been working on the web for about 13 years and we have architects, trained designers, all sorts of interesting people at Stamen, and it's a really fun place to work. I am here to talk about kind of two distinct phases in Stamen's lifetime as a design studio. The first is when we were using Flash for basically everything. I don't know if you guys are familiar with the timeline of Flash. It was originally, I think it was a sketch named product that then became Future Splash and then Macromedia bought it. This is all happening kind of in the early 2000s. There was a site that we used to open up on our computers all the time called Zombo.com. And there was just this ethereal voice in the background saying, you can do anything with Zombo.com. And to me, I don't know, it kind of, I feel like it embodied the spirit of the web at that point because, and it was definitely ironic, but it suggested a future of kind of weird, crazy things happening on the web that weren't possible in Java applets, which is really kind of the only way that you could get things moving on a screen before Flash came along. So, fast forward to 2003. Eric, my partner at Stamen and he's the CEO and creative director of the founder of Stamen, he worked with a photographer named Cassidy Curtis on this project called Graffiti Archaeology. There was a timeline along the bottom that allowed you to kind of scroll through time, looking at particular walls where there was graffiti and then people cleaning up graffiti and different things being replaced along the way. And the New York Times wrote about it. They said that the navigation tools turned what could have been a slideshow and a fascinating excavation. And a year later Richard Stalman was saying things like the use of Flash is a major problem for our community and I felt this tension in a lot of our work, but you know as a creative design agency, we needed Flash as a tool to do these things. There wasn't any other way for us to make things like mapper, which is the first interactive map of Flickr photos. We're looking at, these are photos tagged Route 66 and this is back when Flickr had no geolocation ability. People would just put tags in there and what we figured was we could sort out the photos and find tags that related to places, look them up with one of the earlier geocoders that I think Yahoo ran, and then place them on a map and show these new patterns in data. These are photos tagged postcards and they give you a really interesting view on what people were posting on Flickr. Fast forward to 2006 or so, and we were working with Dig. Do you guys remember Dig? At one point it was one of the most visited websites on the web and it was kind of a flash in the pan, but the idea was that we built the Dig Labs around a new almost real-time API that allowed you to get information about who was digging which stories, which stories were becoming popular and we used that API and showcased it in Dig Labs by building several visualizations. This one is Swarm. It was kind of a force-directed graph in which people were digging stories and the stories were getting bigger people were moving from story to story as they dug them. We built one called Big Spy. I always hated that name, but the idea was that it was this constantly scrolling list of things that people were digging. It was really hypnotic. Another called Stack was kind of a modern take on the bar chart. It was just consistently increasing in size and new things were pushing them to the left and that was fun to watch as well. Then we, there's kind of a long-sorted story behind a crime spotting, but I'm mostly going to talk about what we could do with Flash with this site. It was, and still is, a visualization, a map of crimes in Oakland, California. And it birthed an entire suite of tools, namely Modest Maps, which was first an ActionScript library for doing interactive maps. At the time we were frustrated because all of the other map interaction libraries, Googles, Yahoo's, they were all closed-source, so we couldn't get in there and tweak them and hack them the way that we wanted to, so we wrote our own because all of the math for tiling images on the screen was well understood at that point. This is the map. As you can see, there are some interesting custom UI elements. Down on the lower left we have what we call the Pi of Time, and this is a circular control that allows you to show and hide crimes that occurred at different times in the day, and there are links that take you to, you know, different ranges of time like day, night, swing shift, etc. There was a big custom date navigation system there, and then in the upper right-hand corner there's a list of checkboxes and icons that acts both as a legend and a way to toggle different crimes on and off, and as you roll over individual crimes, we mimicked what was, I think, at that point, new in OS X, the spotlight effect, and this, again, was only possible in Flash at that time because there were there was no way to draw a canvas and then blend it with a dark end mode at a certain opacity in HTML and JavaScript. We just couldn't do it. The next year we worked on a project with SOM. They're a really big architecture firm based in San Francisco, and they built up an entire 3D model of the city of San Francisco, and they use this model actually to calculate where sun and wind will fall on buildings that they're working on and how they'll affect certain projects of theirs, and so they have this giant 3D model, and what we were looking for was a way to experiment with grabbing pixels and using pixels as data in in different contexts, and we were playing with it for crime spotting as well, but here what we focused on was trying to find a way that you could encode pixel information and then overlay another view on that same data so that you could use the pixels as a mask, and so what I've done here is rolled over a particular block lot, and underneath all of this is actually an image that SOM also rendered which encodes each block lot's color as an RGB number, and it's the actual block lot number. There's no, you know, encoding or re-encoding that you have to do on client side, and that allows you to link directly to the SF planning site and just add it to the query string so that you can jump right from this into a document that tells you what's on that block lot. So we use this technique a lot, and right now in Canvas, still can't do this level of stuff with the speed that you could in Flash. This switching back and forth and finding pixels of a particular range, iterating over pixels in Canvas is hell. You either have to throw it on a separate thread with a web worker or find some way to chunk your image up, and it requires a lot of work that was not required to do these things in Flash. A couple years later, we made hurricane maps for MSNBC, and the big thing here was that we were able with Flash to style the underlying map entirely with bitmap effects. And this is actually possible now with CSS filters, which, you know, are kind of slowly being adopted by most of the major browsers, but you can't rely on them because a lot of people have browsers that don't support them, so this is a constant thread running through this thing. But the idea here was that we took Bing Maps imagery underneath, inverted it, grayscaled it, modified the darkness so that we could overlay data on top of it more clearly. And because it was MSNBC, they insisted on using Bing Maps, but there wasn't really anything that they offered that was easy enough to overlay data on top of that you could actually read it. So being able to modify the appearance of things that you can't change server side on the client is really, really important to what we do, and we love the ability to do that in Flash. I kind of threw this in at the last moment because I saw a couple of instances of what we refer to as the loop. It's that little lens. And so I wanted to talk about a project that we did call SFMOMA ArtScope. This is for the SFMOMA in San Francisco. And the idea was that this is a big map of their entire art collection, and we followed the same idea for tiled maps, using modest maps for action script, and we're able to generate large images that we could then recompose on the client side, and then stick those in a big map and throw a loop on top of that, and inside the loop what you do is you zoom the map in one more level and you mask it with a circle. And this type of stuff is totally possible on SVG right now, and I'm really excited to see people doing things like this on maps. You know, you could jump around from artwork to artwork. It was really solid. Tree's Cabs in Prime is a, well, it started as a weekend hack. There was a rainy day in, I think, 2008, when I had this idea that you could take three data sets and overlay them with subtractive blending in order to find the places where they intersected. And I wouldn't have thought of this if we hadn't had these three CSVs just sitting on our server waiting to be visualized. There was kind of a queue of things that we were waiting to work on. Tree's came from a group called Friends of the Urban Forest in San Francisco, and they're kind of the stewards of all of the street trees that you see in San Francisco. So that big gap that you're looking at in the upper left-hand corner is actually Golden Gate Park, and Friends of the Urban Forest doesn't have any control over the trees there. So what I did was I broke trees, cabs, and crimes into three different layers, gave them their respective colors. And then in Flash, all I had to do was set the blend mode on each of those layers to subtract, and you end up with subtractive blending. This is actually a feature that I've lobbied the W3C about because they're currently negotiating and thinking about the spec for compositing and blend modes and CSS. And I really think that it's important that I'm going to continue to push them to consider all of the Photoshop blend modes as ways that you should be able to do these things in CSS. I'm really interested in having designers be able to mimic the look of something that they've done in Photoshop on the web without the overhead of including all of those big raster images and stuff like that. And it gets really interesting when you start to intersect data that's at different scales and different formats, different granularities and stuff like that. So this is an image from a project that I'm going to show you in just a second, but I wanted to show you an instance of the CMYK subtractive blending that I thought was really cool. We've also done some really poppy social media visualization for MTV. The first thing that we did with them was a visualization who's being talked about the most during the MTV Video Music Awards in 2009. And this was, again, all in flash. We ran instantly into problems of being able to move a certain number of circles around to run the force-directed graph simulation in the same thread. You don't really have control over pushing operations like that and calculations like that off the frame that you're on in flash. And so these are the projects, actually, ironically, because they're so simple that we started to run into a lot of limitations of flash. Layout is one. You put this thing on a web browser and instantly you have to worry about basically implementing DOM layout and CSS DOM layout stuff in flash, which is a huge pain in the ass. So things are moving around on screen. This was on television for a brief moment. They actually, it's the first year that they had like a social media correspondent who kind of narrated the visualization as it was going. And I don't know if you guys remember this, but the Video Music Awards in 2009 was when Taylor Swift, who I think is about to enter the stage, won, I think, the best song award at the awards and was interrupted. I'm going to let you finish. I'm going to let you finish, but that was the best interruption of all time. It was amazing. Thank you, Doug. And there he is, right? Like, this to me, even though it's kind of boring social media stuff, was legendary because it actually manifested a social phenomenon in visual form by just applying simple kind of particle behaviors to images of people. And I think we're just on the cusp of being able to do a lot of this stuff online with open web technologies. So here's some other views. Moving into 2010, we actually completely changed the layout. The goal here with these projects was actually to start kind of componentizing and simplifying and almost templatizing the social media trackers so that MTV could deploy them in all sorts of different contexts. But what that meant is that we really had to simplify the form, but once you get it on a big screen in front of lots of people, just a big image on the screen doesn't seem so interesting. So they had these particles that are moving around and we just so quickly ran into all the limitations of being able to even just calculate the movement of random particles around on a screen and flash. And when it came to changing all the colors to this thing, we started running into all sorts of other issues because we're implementing the entire layout and flash. It's not just the colors. It's the fonts. It's the number of things that you're showing in the top three or four. And suddenly flash becomes a really bad option for templatizing anything that you can't just change the colors for. So now I'm going to show you the last project that we ever made of flash. This is, I think, at the end of 2011. And a large television company called VPRO in the Netherlands hired us to create a web experience that complimented their program called the Netherlands from Above. And this mimicked the style of Britain from Above. I don't know if you guys are familiar with that show as well. But they had lots of kind of close range aerial photography and videos and the website featured an interactive map that allowed you to find the intersections of three different data sets relative to these different topics. And so, I'm sorry, I clipped this video in a weird place, but the basic gist of this map was to find where the pancake restaurants are. And so what you're doing when you manipulate the map, I don't know if this is the blue thing or what, but as you manipulate the map, here you can see that you're actually adjusting the visibility and masking the data overlay using three different data sets. And I wish that I could just rewind this to show you that one last part, but I can't. I'm just going to play it again because it's fun. So the idea here was those three sliders on the right actually correspond to three different data sets. And the innovative thing that we were doing here was actually encoding all of that data into tiled images to do our regular old tiled map thing, which is the map that you're seeing. But the data tile is actually encoded three different data sets in the red, green, and blue channels. And Flash gave us the ability using shaders, which are GPU accelerated, OpenGL like, they use a form of GLSL. Using those shaders, we are actually able to then provide the min and max for each channel and threshold the resulting image and modify the output colors of it all in one go. And it's instantaneous. And I think the instant feedback of things like this is a really important component of all of our projects. You want to move the slider and you want to see the thing update immediately because the movement of certain objects is going to give you a clue as to whether you should be moving the slider left or right and so on. So our transition from Flash has been very interesting. We busted out on the scene in a pretty big way in, let's see, I think this was 2011 as well. So as we were finishing our last Flash project, Mike Bostock was, I hate to use the word intern, but he was an intern at Stamen. And we worked with him to create polymaps and go to polymaps.org, there are lots of examples. I came to think of polymaps and this is an SVG-driven mapping library that allows you to bring in both tiled images, GeoJSON data sources, and it provides really nice hooks for doing geo-visualization by allowing you to provide functions that determine the color of each feature and so on and so forth. So it kind of set the stage using proto-vis-like D3-like conventions for doing this type of visualization with big tile data sets that you could zoom into and out of. And there are lots of really good examples on the site. We used it, I think this is really the only time that we've ever used it on a commercial project. MTC is actually the overseeing authority. They're called the Metropolitan Transportation Commission in the Nine County Bay Area. And what they do is they coordinate transportation projects across the entire Bay Area to provide better transportation options to everyone and make sure that transportation is evenly distributed across the area. They maintain a transportation model, a transit model, that allows them to simulate how long it takes to get from any area in the Bay to any other area via different modes of transportation from a car with one person, a car with two people who can use the HIV lane, a bus, a bike, a walking. And another dimension of that matrix is time because as time changes from early a.m. to the morning commute, midday, p.m., commute and evening, bus schedules change, congestion changes on the freeways, all of that stuff. So this becomes an interface to using that center point to determine how long it should take you according to their simulation to get to any other point in the Bay. And then you can use these sliders to adjust the threshold of time. And then also I think most importantly the median home prices in those areas. So right now we're looking actually at the statement office and this is saying by public transit you can get to all of these places within 30 minutes. But that's in the morning at night. Things change because bus service is actually less common at night, which should be no surprise to anyone who's hung out in San Francisco before. If you're on a bike though, suddenly a lot more of the city becomes accessible, ignoring that there are giant hills in between some of these places. But where it gets really interesting then is when you try to cut down the median home prices. If you're using this as a way to determine whether your commute to work would be good or not. And if you only have 500K to spend on a house, there aren't very many options close to you in the mission. You're going to have to go out to Bernal Hill to the outlying areas or to Soma where nobody lives. No offense. So along our path of escaping the flash hole, we made a big push with MTV. I'm sorry, that was just really crude. We made a big push with MTV to actually redesign the entire look and feel of the Video Music Award visualizations. This was our first big JavaScript visualization. We used jQuery and Backbone. I'll be honest, this is a huge challenge for me because I hadn't built any actual applications in JavaScript. I have tons of JavaScript experience, but coming into actually building a big application that needed to work in all of these very subtle ways was a huge challenge for me and for my colleagues. So this is what we call the buzz view where you see who's being talked about the most. And this view actually manifested on the phone. We had a responsive layout that moved a list of the people below the visualization. And then there was even a version that we had fit into a triangle screen inside the venue that was showing in between sets for the musicians. And we could not have done this project without WebKit, without the debugger and the inspector. It would just have been impossible to figure out what was going on. So this for me really solidified the idea that the browser is just as much a tool as a target and ever since I have relied on the inspector for everything that I do. And I would encourage you to do the same. So at this point too we were thinking about obviously getting modest maps out of Flash and into JavaScript. And it was a relatively straightforward process. There were some bumps along the way, but when we arrived at a final product we had a really solid tiled mapping engine that was really bare bones. There was no vector rendering. We were just telling people to use polymaps with the caveat that it was really more of like a research and exploration tool than something you would actually want to build a website with. But modest maps we were building with a really solid core to just make tiled mapping and interaction solid and fast on the web. And it was actually loads faster in the DOM than it was ever in Flash. And that allowed us to do a project called Climate Central Surging Seas. And this is the first iteration of that. I'm going to show you the second in a bit. And the big innovation here was sprite tiles. And so you guys have used CSS sprites before, right? You take several images. Who has used CSS sprites before and knows what they are? Okay. So you take a multitude of images, pack them into a single image, and then you kind of scroll through them with a window to hone in on them and show them through a particular viewport. And we used that process to do sea level rise on the map. And so there was a lot of back end work to get these tiles rendered. But once we had them rendered and stitched together into these sprites, we could attach sea level rise to a slider and just move images through the respective DOM element. These were masked as CSS background images. So that worked really well. We're using jQuery for that too, but we're doing a lot less jQuery now that we're using D3 for everything. We did a project last year with Facebook to explore the spread of viral photos. And this was really our first WebGL project. The result was a video. And there are three of these, but I'll show you one. And so this was a giant particle simulation running in WebGL. It was being fed data from a giant CSV that you had to load in the browser beforehand. But I think that it resulted in a really amazing image. We brought this to a school in my neighborhood and showed them. And in a second you can see why one of the kids referred to it as pink panther pooping. So that was awesome. We were still working with MTV and still are at this point. And apologies if you can hear the boredom in my voice at these projects, but really I'm kind of getting bored honestly doing these social media visualizations and we're trying to make them interesting or push the work off to other people. But this was an interesting chance to experiment with responsive layouts. MTV really wanted these visualizations to shine on television. They typically put these on a plasma screen and had someone talking about them on live TV or they would go full screen with it. So the visualization on the left was SVG animated, full screen in Chrome. We had keyboard handlers to kind of move through different states in the visualizations so that you control it from the keyboard while it was on live television and have it change, which is really stressful. Waiting for numbers to change and there's a timeline along the bottom and you're hoping that it ticks over to zero when the show starts and these events are crazy. But then in order to target other browsers, because we wanted this angle look for what we called the high-fi version, we also needed to create a low-fi version and that turned into just divs with background images. And we followed this pattern for a lot of different MTV projects at this point but the idea is your high-fi version uses Canvas, S2G, WebGL, whatever you need to get it done. It works on modern web browsers for the desktop but as soon as we see that you're on a phone, a tablet, something that doesn't have WebGL or doesn't do hardware-accelerated Canvas compositing, there's a couple of other tests that we run. We present you with this really simple version that scales vertically, it squeezes easily horizontally and the form seems to fit for a lot of the work that we do, especially when you're just talking about big-ordered lists of things that are bigger than one another. And what came out of this is actually a library called IE that I wrote and the idea here is that if you include IE in IE 8 or IE 9, it will shim all of the stuff that is missing in those browsers with the exception of SVG and WebGL and Canvas and all that stuff but it provides all of the lower-level stuff like array prototype methods like map and filter and all that stuff. It provides W3C DOM event handlers on both the window and DOM elements so it makes the browser at least start to behave close to a standard's respectful thing and the big target of that was to make it work with D3 and so this project would not have been possible without IE because we still needed to use D3 to bind data to these rectangles and show those rectangles on a screen in IE 8. On the complete other end of the spectrum is some experimental work that we did with Nokia. You can go to here.statement.com and a WebGL-enabled browser and see crazy maps and along the way I thought this was interesting. We were using CSS filters. You can see the values that were plugging in the lower right there to change the colors and experiment with different colors and it actually sped up our rate of iteration on the design of these things to be able to tweak things right in the browser. You guys have probably experienced that with CSS and the inspector in general but the CSS filters in particular are a really interesting way to do things like re-shifting if you just want a completely different perspective on your data, on your color screen. We did kind of an Instagram-like view on this in which we were saturating and then providing contrast and sepia tinting and it turns out that it's really easy to actually get something close to an Instagram effect even for a big WebGL map and I just love that WebKit will happily apply those things to a canvas rendering a WebGL context. It's amazing. It's fantastic. So this is one of our most recent projects. We worked with the Chesapeake Bay Program to visualize the density of seagrasses in the Chesapeake Bay and this I thought was interesting for a couple of reasons because it has interactive maps. It has a timeline that changes what you're looking at. It has vector overlays. There are HTML and CSS visualizations and because it was for the Chesapeake Bay Authority and actually paid for by the EPA, it needed to work in IE8 and that's a huge thing for us when we work with government organizations, nonprofits. They need IE8 support and this goes back to why I created IE8 in the first place. But it's kind of incredible even with we needed to bring Raphael in there in order to do charts because VML is a huge pain in the ass and no one wants to use it. Just the Raphael for D3 binding. Does it work? Yeah. Okay. Yeah, I'm kind of curious because for me, I think D3 presents a really wonderful way of working with these things and if I can get it to draw a line chart without having to do all of my conditionals and code that say if this is an SVG-enabled browser do one thing and if it's not do the other, it will just streamline everything that we're doing. So if you guys have ideas about that, thoughts about that, let me know. You can share them on this Taman blog. This is what the visualization looks like. There are two sliders here on the bottom and I'm just going to show you the movement of one. The one on the top actually provides, I'm not sure if you can see this, the comparison year. So there's, my cursor's not visible. So there's a little kind of crosshatch pattern in there which is showing you a kind of transparent overlay of the Baygrass density in 2012. And so as you move through, you can compare that year with other years. You can click on each of the research segments or the areas that they define as kind of similar in biological terms. And these little charts down here are just HTML tables with cells that have different background colors. Really simple. The big version of those lives on each page. This is just a page with a query string. We load the same data model everywhere. It's just a JSON file. The entire site is static, really easy to work with. And we've been pushing toward doing everything static whenever possible. And this is where it comes to talking about, you know, the ability to modify things like server-generated tiles on the fly so that you can iterate and change those things without having to deploy big server resources to support your project. Which is exactly what we ended up doing for our second iteration of the Surging Seas project with Climate Central. So for this one, the goal was to create a much... Well, I hate to use the word sexy, but a much more beautiful map, a much more engaging map of where C-level rise and flood-level rise, they have this complicated model that actually tells... That simulates the height of water based not only on C-level rise, which is actually pretty small, but also on flood height. You guys have seen what Sandy has done. It's not hard to imagine then, you know, one, two, three, four, five. Even some places in New York and Red Hook had seven or eight-foot tides during Sandy. So this is what kind of East Oakland would look like with 10 feet of water on top of it. And the innovation here was... We built a system called Composer, initially, and then renamed it Sando. And Sando's available on GitHub. We can get to that in a second. But the idea here was that we needed to have two different map layers and remove the problem of having to compose these big sprite tiles on the server side so that Climate Central could add new flood levels when they wanted to show 11, 12, 20, 30 feet. And so what we did is we broke everything out into alpha channel masks where instead of having, you know, a display tile that has a transparency, kind of like the 1.0 that you saw, every map tile here loads a different alpha mask that allows you to then use the canvas compositing modes to do, you know, a destination out or a source-in operation in order to mask the cartography, the gray bit, with the water level. And so we wrote Sando, which I will skip back to, as a way to declaratively define how images should be composited together with a big stack. And some of this originated in a project called Tile Stash, which was something that my former colleague Mike Makerski wrote which rendered map tiles on the fly. And Tile Stash exposed this idea of a map sandwich that allows you to combine different map data sources together in different forms. So Sando works both client-side and server-side. I didn't have time to put together a little demo of the stuff that we're doing server-side, which we're going to be announcing soon. But the idea is that using Sando's way of expressing a map stack or an image stack as a string, we can actually make mapping interfaces and add a UI onto those that allows you to interactively composite things like aerial imagery and digital elevation models and streets and all of that stuff in all of the ways that Canvas is capable of doing. So we refer to a lot of our work as the next most obvious thing and Sando kind of seemed like the next most obvious thing when what we're thinking about is ways to composite images together, both client and server-side. And we're always looking for what's going on with each of these technologies so that we can use the kind of incremental improvements to our advantage and find new ways to implement them. Granted, they work in all the browsers that we need to target, which is obviously a challenge. So I want to do a quick roll call of the technologies that we use and just kind of give you an overview of what we think is going on with them. JavaScript is amazingly fast. It's just crazy fast. It's so much faster than ActionScript ever was. IE10's JavaScript interpreter, holy crap, it's amazing. All the debugging tools are really good and now with Node and Rhino, JavaScript runs everywhere and it's amazing. However, JavaScript is a huge, huge learning curve for a lot of people who kind of step into it or fall into it and that's something that we struggle with on a daily basis, people who don't have a lot of familiarity with JavaScript I usually send people to Python first before I have them into JavaScript because I find that it's pretty similar and it's only going to get more similar with ES6. So CSS2 is just, it's a given now, which is awesome. It's pretty much everywhere. The box model works. If you use box sizing, border box, anyone? Amazing. It's my favorite thing in CSS. What I think we're lacking, well, what Stamen is lacking, maybe what I'm lacking, is proper blending and compositing in CSS. I think this is where the type of stuff that we do is going to get really, really interesting when designers, when people who know CSS can change the way that things blend on the page and I think that it will do a lot for data visualization as well because it introduces new ways of combining different information. Imagine scatter plots with different colors. You could do subtractive blending on those, all sorts of interesting applications. SVG is just, Eon's more feature-ish than Flash could ever be as far as vectors go. Inspecting on the browser is a godsend. You can style it with CSS, which is fantastic. It's portable. Actually, Sean Carter wrote a tool to export SVG from the browser so that you could bring it statically into other sites. You can print it. It's just amazing. SVG has really become mature in the last couple of years thanks to browsers supporting it. Canvas works great in IE9+. What's really awesome to me is that compositing modes are actually GPU accelerated in Chrome. They're not in Safari, so that's something to watch out for if you want to use something like Sando and it's something that we definitely hit in Surging CS2. But, yeah, performance is laggy and pixel iteration is a huge pain in the butt. We've done some work using web workers to actually push pixel processing off into a separate thread, but then everything becomes asynchronous, so you kind of have to wait for user feedback and it's getting there. And I think JavaScript's getting faster. I'm not sure what else can be done to speed up iterating over millions of pixels in an image, but it's coming along. WebGL, it's amazing. It's super powerful. We're doing some really cool stuff with it that we're going to be showing soon. But, man, it's got a steep learning curve. It's just crazy. And for us, the big kicker is that it doesn't work in iOS period. And, yeah, it sounds like, you know, Apple is probably aiming to push it out eventually and I'm kind of imagining that they use iAds as a test bed for this, so they're probably collecting performance data. They've got it relegated to a thin strip of the screen so they can make sure that they don't lose phones, which is important. And it seems to me like that's really just an attempt to control WebGL until they're ready. And who knows when that's going to happen, because it's Apple. The other thing is that it doesn't play well with the DOM. And that's mostly, I see that mostly because of the CSS blend mode stuff, because I think there's awesome stuff that you can use in WebGL, but until you can composite it with other things it hasn't really reached its full potential. So my takeaways for this whole phase between 2011 and now, which seems like a really long time, but it's only a couple of years, the open Web is super squishy. It used to be that we could push all of our stuff into flash in a little black box. And that box would scale, and you can control the scale mode, and that's great and make sure that your layout is in the most part it was relegated to a box, and it couldn't affect anything else on the Web page. But now, there's this assumption, which is what I say to be wary of, especially when you're doing client work, that everything is just going to automatically work on the iPhone, on the iPad, particularly iOS devices. Clearly, there's a lot more adoption there, and I think a lot more perceived adoption by people who hire us. They just assume that it's going to work on iPad and they're freaked out. So, we actually, we have to deal with a lot of the responsive design concerns that Gabriel talked about that have been shown off here as well. And as with the MTV work, it really, for me, it says to embrace the lowest common denominator and know when to do things like canvas, SVG, collect information from your clients or from your users if you run a product so that you can find out which browsers they're using and use caniuse.com in order to find out if you can use those features. Something that we've really been focusing on not so much with the Chesapeake Bay but with the MTV type work is the idea of having lo-fi and high-fi versions of visualizations. And this can go in so many different directions everywhere from you only do the complicated D3 data binding in your high-fi version is a server-side-generated image. I'm really interested in the idea of having D3 create visualizations server-side so that you can bring those up to the client if they don't have that support client side. So choose your graceful degradation or progressive enhancement path carefully because if you commit yourself and get your client excited about something that's really high-fi, the low-fi version can be kind of a downer sometimes. But it is worth doing especially if you think that the accessibility of the thing that you're building is important because IEA is still really prevalent. We've actually started talking to our clients about an IEA premium to really mostly not to be snarky or mean, but just to let them know that this stuff is hard, that supporting old browsers requires time and patience and testing and all that stuff. It's really difficult. So I would suggest if you run a client services business start talking to your clients about maybe up in the rates if they're going to ask you to support older bad browsers. Yeah, sure. You done? Which I think leads on to my next suggestion is that it's really important to find seasoned web designers, especially in the data visualization field. I would say that on balance we're spending as much time building stuff on the web, building actual web pages as we are visualizing data these days. And for better or for worse that means that we have to do a lot more HTML, CSS, all the stuff that a lot of young passionate web designers come in and say, oh, I don't know how this works. And actually I can't remember who it was, but maybe it was Boaz who recommended learnlayout.com last night. Amazing, amazing resource. And if you have employees or colleagues who need to know how the web works or how layout, CSS layout works in the DOM, check out learnlayout.com. It's amazing. I have three minutes left. The other thing I recommend is getting involved in W3C because it's a really vibrant organization right now. There's lots of discussions happening about lots of different stuff, and they really, really need input from people who are building this stuff. It's really super important. Teaching, learning, and sharing this stuff also super important. I have found that using GitHub has totally changed the way that I think about code, the way that I write it, the way that I share it, the way that I commit my changes more frequently now, everything. micbossdocsblocks.org allows you to just post your visualizations and stuff you're working on in a nice presentable format instantaneously with a gist. Posted IE's like code pen, etc. Those are really awesome too. Great ways to show off simple principles to break your code up into smaller pieces and demonstrate how they work individually. That's it. So I have two minutes for questions. Yes. Yeah. Oh, really? Like it's not the RGB value that you would do it expectedly? That's crazy. I haven't encountered that. I mean, the Flash API I found really nice because it actually, I think there was a method called like getColorRect on a bitmap that actually gave you a bounding box and pixel coordinates of that RGB color. Amazing. And so that limits the number of pixels that you actually have to iterate over in order to draw a shape. I totally want that in HTML5 cameras. Anyone else? Yeah. For me, it's really the compositing and the blending stuff. I mean, yeah, I mean, sorry to harp on that so much, but I think that it's really going to open the door for a lot of really interesting stuff if you can give designers and technologists like all of the blending power that Photoshop offers, for instance. WebGL I also see is super interesting but requires so much boilerplate in order to get one thing on the screen that and I've been having this conversation with a couple of people individually. It seems like wrappers for this stuff are becoming more and more necessary. The more complicated technology gets, the more you have to have a high level abstraction to work with because you don't want to write 50 lines of boilerplate in order to put a texture on there and change the color. So yeah, I think that there's still quite a bit of work to be done but maybe, you know, maybe JavaScript in its ES5 form before it becomes ES6 and gets all pythonic and even more functional. I think it kind of does everything that it needs to do now. There are all the HTML5 kind of umbrella APIs. Those are wonderful but for the most part JavaScript is an amazing language. It's obviously applicable server and client side and I kind of think of it. I've been reading a book called The Beginning of Infinity by David Cage and he talks about you know, Turing computers the kind of universal computers and I see JavaScript as a much more kind of infinitely viable technology than Flash ever was because Flash was relegated to that box and now you can just see JavaScript breaking out of its browser chains and escaping off into all sorts of interesting corners of the web. It's fantastic. Anything else? Is that a hand? Thanks.