Unlocking a new map-making paradigm for developers

Role: Product Design lead

Timeline: 6 months

Product: Mapbox Studio

Blog post: Mapbox Launch Announcement

Motivation

As Mapbox grew its target audience from expert cartographers to developers building maps, we realized that many customers had neither the expertise nor the time to design a map layer by layer.

Solution

Mapbox Standard was a company-wide project that gave developers a turn-key, high-performance map with 3D landmarks. On the Studio side, I created an entirely new web-based map creation paradigm that favored ease-of-use, minimal, and focused controls, while still retaining the value and flexibility for customers to bring their geo-spatial data.

Impact

Over 50% of all styles created now use the Standard Basemap. This streamlined entry-point makes it drastically easier for our developers and map designers to ship updates to a large portion of the customer base and for them to get an amazing map quickly.

A new default map-making experience

Simplified map design controls

Traditional Mapbox map styles needed to be designed layer by layer and property by property, which led to dense, complex interfaces that were only intelligible to geospatial experts.

The new focused, minimal controls were designed to remove friction while allowing for specific high-value customization that was accessible to mapping experts and novices alike.

Streamlined start

We added a simplified map creation flow that surfaced Mapbox Standard as the first option while keeping classic styles available.

Clicking “new style” creates a map style with the new Standard basemap.

Slots for custom data layers

Slots are structured points where custom layers can fit into the predefined map hierarchy. This gave users the power of a beautiful pre-built map, but still gave them the ability to bring their own data.

I used the analogy of a “bucket” when designing the interface, so that users could drag and drop layers into and out of these areas.

Revamped onboarding illustrations

Now users could enter Studio and be met with entirely different experiences - a simplified map-making experience through Standard and an advanced in-depth experience for classic styles.

The onboarding we had relied on screenshots of the product, but this wouldn't be accurate for all the new entry-points.

Given this, I created these new illustrations to introduce the key UI in a simplified way that would last through more product updates and resonate regardless of the experience users chose.

Process

Prototypes & Operational Planning

As a senior product designer and the sole designer on the Studio team, I led the design vision for this launch from operational planning. I worked closely with the Studio PM and the Head of Map Design to translate early ideas of an “easy to customize” map into tangible prototypes that helped sell the concept internally.

This new Standard “basemap” was an entirely new type of map style than Mapbox had created previously, which meant it was both a technical and design challenge. The work spanned multiple teams: map designers, a dedicated product team, and then a collaboration of the map and web development teams.

I created a diagram that communicated how speeding up the time for creating maps fit into the larger vision of improving the developer experience.

Over the years I've learned how important it is to get feedback early and often, so I often hook up quick task flows to get alignment. I still had a lot of open questions and this was the best way to get the conversations started cross-functionally.

This early workflow helped align several teams across the company on the vision of this new experience. Outside of Studio this helped raise questions of when and how we would allow access to customization in this new paradigm.

Driving new user-centric language

Internally, the shift away from deep customization toward a more opinionated, “ready-to-use” map sparked a lot of debate about who we were building for and whether we were leaving existing users behind. To help navigate that, I created a set of user archetypes that gave the team a shared way to talk about customer needs. One of those moments I still appreciate was hearing the CTO use those archetype names in a company-wide strategy meeting.

Internal testing & advocating for technical spec changes

During internal testing, we learned that users struggled to understand the new “slots” concept, which allowed them to place custom data layers at specific positions in the map’s layer stack.

I had included tooltips in early mockups to explain this, and while users found the tooltips helpful, engineers pointed out that the data describing the slots wasn’t yet available. I worked with an engineer on the Studio team to advocate for including this information in the technical spec owned by a different engineering team. This fix not only improved the Studio experience but also helped developers using the Mapbox Standard API directly.

Takeaways

Future-proof and extensible

I’m proud that the canvas I created for this new standard map workflow continues to hold up as new complex features are added to the product.

The new interactivity controls were simply slotted into this simple control panel.

Learning after launch

I always advocate for user research including discovery and user testing, but with complex business needs and strategic initiatives, that isn’t always possible. So it was important to set ourselves up to learn after launch. I did this by pairing with our engineers to make sure the new flow was instrumented in a way that we could get answers to the questions we’d have after the product launched. We also created a survey and ran follow-up interviews with early adopters. We then shared that with the corresponding teams that could improve the experience post-launch.

Flex beyond my role

At startups we often need to be scrappy, so as part of this launch I also wrote the onboarding tutorial for this product, which was a fun way to dog-food our product as well and make sure it was easy to use!

From the cutting room floor

I also spent some time thinking through more bespoke UI options for the time of day controls in the new basemap. These didn't ship for a few reasons but they were very fun to explore.