NACIS 2024: The Past, Present, and Future of Stamen Maps

A decade ago, Stamen Design launched the Toner, Terrain, and Watercolor map styles built on OpenStreetMap data, which soon became an essential part of the open source mapping ecosystem. Last year we partnered with Stadia Maps to create all new versions of the Toner and Terrain maps, based on a modern mapping stack of vector tiles to keep them running for the next generation. In this presentation, we will discuss the opportunities and challenges of redesigning familiar map styles using a totally new set of tools, while still staying true to the well-loved aesthetics of the original maps.

Links from the presentation:

https://subdued.social/@alan
https://vis.social/@stamen
https://en.osm.town/@stadiamaps

“Our Brilliant Friend: Stamen and OpenStreetMap through the years” https://sta.mn/q7s

Luke Seelenbinder at SotM EU: “Stadia x Stamen: A New Era for Stamen Map Tiles” https://sta.mn/kdc

"The Many Lives of Null Island" https://sta.mn/p64

“Familiar maps, brand new data” https://sta.mn/z4q

"Terrain behind the scenes" https://sta.mn/q2c

“Helvetica is more than a font, it’s a state of mind” https://sta.mn/dgc

Developing an Open-Source Cartography Toolkit” https://sta.mn/hbj

“Harnessing modern vector cartography” https://sta.mn/f3j

Client-side language switching demo: https://etymology.dsantini.it

“The end of the road for Stamen’s legacy map tiles” https://sta.mn/hh4

“Watercolor process” https://sta.mn/qn4

”Watercolor map tiles now in the Smithsonian’s permanent collection” https://sta.mn/x4q

Transcript

1. _sta.mn / tj3 Rebuilding Stamen’s map styles with Stadia Maps #SOTMUS2024 sta.mn / qwc Alan McConchie Lead Cartographer Stamen Design subdued.social/@alan vis.social/@stamen en.osm.town/@stadiamaps NACIS Annual Meeting Tacoma, October 18, 2024 Slides: _sta.mn / tj3_ The Past, Present, and Future of Stamen Maps
2. _sta.mn / tj3 1. A brief history 2. Rebuilding the styles 3. The results
3. _sta.mn / tj3 1. A brief history
4. _sta.mn / tj3 About Stamen Design • Interactive visualization design firm focused on data & cartography • Founded in 2001 4
5. _sta.mn / tj3 Origins of the map styles • Three raster map styles: Toner, Terrain, and Watercolor. • Funded by the Knight Foundation • maps.stamen.com launched in 2012 • Freely available to all, used by millions 5 “Our Brilliant Friend: Stamen and OpenStreetMap through the years” _sta.mn / q7s_
6. _sta.mn / tj3 Times have changed • Missing tiles • Old data • High cost • Unsupported 6
7. _sta.mn / tj3 Does it still spark joy? It really ties the room together! 7 Attitudes of Stamen staff after ten years:
8. _sta.mn / tj3 2. Rebuilding the styles
9. _sta.mn / tj3 Enter Stadia Maps • Location APIs for developers • Private, affordable, supported • Founded in 2016 9 Luke Seelenbinder at SotM EU: “Stadia x Stamen: A New Era for Stamen Map Tiles” _sta.mn / kdc_
10. _sta.mn / tj3 Technical Challenges • People really like these tilesets: lots of traffic. • The “3” tilesets are really 10+ separate styles. • The old tilesets were spread across multiple domains for secure and insecure traffic. • Terrain needs a lot of data inputs: Natural Earth, OpenMapTiles, EU Global Landcover, Elevation 10
11. _sta.mn / tj3 Whimsical challenges 11 “The Many Lives of Null Island” _sta.mn / p64_ maps.stamen.com/toner/#18/0/0
12. _sta.mn / tj3 Cartographic challenges How do we re-create the look and feel of the old raster style, using all new data, new design tools, and a completely different rendering stack? 12 before after “Familiar maps, brand new data” _sta.mn / z4q_
13. _sta.mn / tj3 Cover the land, ruin the map? Using multiple, divergent sources of landcover is tricky, but necessary! Blending data at different scales and resolutions requires different blur effects in a vector style, as compared to the original raster. 13 early draft final original raster “Terrain behind the scenes” _sta.mn / q2c_
14. _sta.mn / tj3 early draft final original raster 14
15. _sta.mn / tj3 Typographic details Stamen is famous for loving the Helvetica typeface, but surprisingly the legacy raster style had been using Arial all this time! One of these uses Helvetica, the other uses Inter. Can you tell which is which? 15 “Helvetica is more than a font, it’s a state of mind” _sta.mn / dgc_ Instead of using the proprietary Helvetica font for the updated map, we opted for the open-licensed alternative “Inter”
16. _sta.mn / tj3 Sharpening our tools Building vectorized versions of our basemaps helped us continue to refine our internal map design tools: • Maperture, a side-by-side viewer and debugging tool • Chartographer for visualizing stylesheets in chart form • Our style diff tool for viewing stylesheet changes during development • Figmasset for building map icons • Our build system for generating a set of related stylesheets based on shared templates • and more… 16 “Developing an Open-Source Cartography Toolkit” _sta.mn / hbj_ Maperture in action
17. _sta.mn / tj3 3. The results
18. _sta.mn / tj3 Benefits of vector tiles 18 “Harnessing modern vector cartography” _sta.mn / f3j_
19. _sta.mn / tj3 Benefits of vector tiles 19 Client-side language switching demo: _etymology.dsantini.it_
20. _sta.mn / tj3 Making the transition 20 “The end of the road for Stamen’s legacy map tiles” _sta.mn / hh4_
21. _sta.mn / tj3 21 Before / After
22. _sta.mn / tj3 22 Before / After
23. _sta.mn / tj3 23 Before / After
24. _sta.mn / tj3 Use the styles: Rasterized versions available as a drop-in update for Leaflet, or switch to the vector styles with MapLibre. API key required, but with a generous free tier for non-commercial users. Styles are licensed under CC BY-NC-SA 4.0 (or for commercial use when used with Stadia’s platform) Get started at stadiamaps.com/stamen 24
25. _sta.mn / tj3 But what about Watercolor? The original codebase was even older than Toner and Terrain (which had at least been updated in 2016). It uses extremely customized Mapnik code, and depends on lots of raster image processing operations. Hard to recreate with vector cartography! For now, the archived Watercolor raster tiles are available from Stadia, but no vector version (yet?) 25 Blog post from 2012: “Watercolor process” _sta.mn / qn4_
26. _sta.mn / tj3 Museum-hosted map tiles! In 2021, Watercolor tiles and code entered the collection of the Cooper Hewitt, the Smithsonian Design Museum. Go see it in New York now through September 2, 2024! Access the Watercolor tiles from the Smithsonian’s servers: github.com/CooperHewittCollection/watercolor_examples 26 ”Watercolor map tiles now in the Smithsonian’s permanent collection” _sta.mn / x4q
27. _sta.mn / tj3 Where next? • Further technical and cartographic optimization of the redesigns. • More refinement of our custom tools we used to build these styles. • Improvement of classification of the input data schema. • Re-create Watercolor using vector tooling!? What would you like to see next? Let us know! info@stamen.com vis.social/@stamen en.osm.town/@stadiamaps subdued.social/@alan 27
28. _sta.mn / tj3 Rebuilding Stamen’s map styles with Stadia Maps #SOTMUS2024 sta.mn / qwc Bonus: More before & after images 28
29. _sta.mn / tj3 before after 29
30. _sta.mn / tj3 before / after 30
31. _sta.mn / tj3 before / after 31
32. _sta.mn / tj3 before / after 32