A smoother, more powerful editing experience in Studio

Guest

Guest

August 28, 2023

A smoother, more powerful editing experience in Studio

Guest

Guest

August 28, 2023

We’ve made a series of feature changes in Mapbox Studio that will make your interactions more intuitive, efficient and delightful.

Simpler Two-tab Layout

We heard your feedback around the inconvenience of constantly switching between the “Layers” and “Components” tabs while editing a style. To address this, we've simplified our original three-tab layout (Components, Layers, 3D) to a cleaner, more efficient two-tab structure (Global, Layers). This approach allows you to manage all map layers within one tab, avoiding the need to switch back and forth - enhancing efficiency and making your editing process smoother.

Three tab layout
Simpler two tab layout

The New Global Tab

Previously, our “3D” tab housed certain root-level properties such as Projection, Light, 3D Terrain, and Atmosphere, which didn't cater to the majority of use-cases. We've now rebranded this as “Global”, expanding its role to include other global properties such as 'Typography' and 'Color.' This reorganization aims to provide a more intuitive location for style-wide global properties, setting a solid foundation for future configuration options.

The new global tab

Introducing a New Context Menu

With Studio becoming more powerful and our layers action bar becoming overcrowded, we've introduced a right-click context menu. This upgrade gives us the additional real estate needed for new features, making them more accessible and extending layer actions' capabilities.

More Real Estate for Components

We heard your feedback about the limited visibility of component properties in the previous popup view. We've now enabled components to use the full height of the screen, allowing you to see all properties at once, providing a more consistent UX between layers and components.

Before
After

Frictionless Overrides, Fewer Accidental Ejections

We understand that making slight changes to a component’s layer default, also known as an 'override,' involves unnecessary steps - including unlocking the layer before changing its properties. We’ve now eliminated this friction for a smoother editing experience.

Ejecting a component can be a harmful action as it prevents you from receiving future component updates. To mitigate unintended actions, we've now placed this feature behind a context-menu, making it more of a power user action and less prone to unintended clicks.

Ejection action behind context menu

Simpler Map Selector UI

We've revamped the map selector UI to make it easier for you to understand and use. Now, when you click any point on the map, a UI will display all the underlying layers and components at that point, clarifying the association between layers and components and enhancing your UX.

Before: no underlying layers displayed. After: underlying layers displayed when you click on the map.

Easier Editing of Component Typography and Color Values

Component typography and color values were previously read-only, which made editing a value a bit of a hassle. Component typography and color values are now editable directly, so no more needless section hopping.

Finally, Copy-paste!

Your much-awaited feature is here! Now, you can copy and paste properties between layers, and even copy a layer's json to use outside of Studio.

These updates will make your Studio experience more enjoyable and productive. While they were made to generally improve the UI and UX for users of all styles, we're particularly excited for how they will enhance the editing experience of our new Mapbox Standard style. Standard is currently in beta and will be available in Studio when we release to general availability.

We can't wait to see what you'll create next!

Heading 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Heading 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

response = requests.get(

  "https://api.mapbox.com/v4/mapbox.temperature-raster-tileset/tilequery/40,-105.json",

    params={

        "layers": "temperature,wind_speed",

        "bands": "1708304400,1708311600",

    },

Optional caption
"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque euismod maximus porta. Pellentesque vitae augue elit. Nam semper eros leo, nec hendrerit nunc aliquet quis. Morbi ac sapien tortor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Curabitur porta imperdiet lorem, ut aliquet orci pellentesque quis. Donec magna augue, molestie aliquam enim eu, auctor feugiat metus."

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

No items found.
No items found.

Related articles