Unsplash on a Map
Every month, Unsplash holds a Makeday dedicated to building cool things, where we encourage everyone in our community to participate. Internally, Makedays are awesome opportunities to work on passion projects; anything that’s interesting and beneficial for Unsplashers, but non-critical.
Since I joined Unsplash a couple months ago, I’ve wanted to do something to expose the crazy amount of traffic that we receive. After some internal discussion, I paired up with Rails guru Aaron Klaassen to build a map that would highlight real-time Unsplash events across the world.
As one might expect, we r̶a̶n̶ ̶i̶n̶t̶o leapt over a number of hurdles, but overall I’m super pleased with the end result :)
Our map handles 4 different types of events: downloads, likes, add-to-collections, and submissions.
Caveats
As is often the case, we had to make some concessions due to the time-restricted nature of a Makeday.
Data
The first hurdle we encountered was data. Ideally we’d like to show the origin source of the events — when Jane Smith in Australia likes a photo taken by John Smith in Portugal, we should show the little heart icon in Australia. Sadly, though, we don’t have reliable data for where Jane Smith is, and so all of our location data is based on the photo’s EXIF data.
It’s interesting to note that only ~50% of all Unsplash photos have usable location EXIF data. That means that our actual activity is twice as busy as the one visualized!
Event Types
We also wanted to include viewed photo events, but there’s too many of them. Every minute, more than 20,000 photos are viewed (that’s over 3 views every millisecond!). Our infrastructure wouldn’t have been able to support streaming that many events without some tinkering, and it would have made for a very noisy map.
Of the events we do broadcast, downloads are king; other events are relatively rare. I believe that a big part of this is that many people aren’t registered for an account, and while downloads can be done anonymously, the other events can’t. We have some very cool stuff coming out really soon for our registered members, so hopefully that ratio begins to change!
Animations
On the front-end, performance was a recurring issue. Originally, the markers were done through ‘traditional’ browser nodes, superimposed over the map. With CSS animations, markers faded out gradually. This became too intensive for the browser to keep up with, though, so we switched to rendering the icons directly into the map’s Canvas. This performs better, but we lost the animations; events blink out of existence.
I think the biggest takeaway for me has been how geographically diverse the Unsplash community is. While there are certainly pockets of concentrated activity, I’ve seen photos get downloaded from all around the world. It’s fun to think that our photographers, collectively, have seen and captured so much of our planet.
Want to help us build Unsplash? We’re currently hiring for front-end development, back-end development, and designer positions. Learn more.
