MAPart: Designing maps with a part of the complete map data

[rasagy]

Hey @mapschool/infdpg16! Now that we’ve played a bit with Cartogram and started seeing how Mapbox Studio works, let’s take a deep dive into the data that powers Mapbox maps, and the amount of customizability that we can get in Mapbox Studio.

We’ll split the class so each person will work on one of the layers in Mapbox Streets Source and work on creating multiple styles with that tileset.

Here are some inspiring projects that focus on a part of a map:

• Morphology by Geraldine Sarmiento (Mapzen)
• Emoji map by Katy DeCorah (Mapbox)
• Interchange Choreography by Nicholas Rougeux (Also his Subway projects on tracks & colors)
• Typographic maps on the Axis Maps store
• Mumbai landuse map by Akshay Kore (IDC, IIT Bombay)

[rasagy]

Let’s get started! Here’s what each student picked up to work on:

1. Landuse + Landcover — Barsha
2. Waterway + water — Vinod
3. Aeroway — Aromal
4. Building — Reetika
5. Road — Faaiza
6. Country, State, Place — Jasleen
7. PoI Labels — Prasanta
8. Road Labels — Rajshree

Get started by making a new map style using the Basic template. You can hide the other layers and only focus on the layer you’ve picked, and explore different ways to style the layer, breaking the layer into multiple layers using Filters, and using property functions to vary styles within a layer.

To know more about the layer, make sure you go through the Layer Reference for Mapbox Streets Source, as well as other styles (like Streets, Light, Outdoors) to learn how these are usually broken/styled.

For icons, feel free to use Maki Icons Editor for styling the icons, or use any free to use icon library like Noun Project and customize them in Illustrators. For patterns, look for resources like Hero Patterns that have .svg patterns for downloading (Unfortunately, .png/.jpg won’t work).

If you’re using any artwork under the CC license, don’t forget to credit the creator (in your comment+in any final poster you create!)

For more custom map design inspiration, do play with some of these styles created by Designers at Mapbox!

[rasagy]

Here are some of my explorations in case you’re looking for more ideas:

Roads colored based on the class:

3D Buildings colored by height data:

Map with Road labels

[vinodxyz]

Waterway + water

Rivers in India

Rivers resembling nerves (unknown place)

[BarshaP14]

WIP version of Landcover + Landuse

Hillside with Contours

Green Landcover

[jasleen20]

Countries, states and cities Style 2

[iamreetika]

Buildings in Paris

Lego city

Concrete jungle

~

New York | If buildings were trees

[faaizasaeed]

ferry rides in mumbai

[holy-devil]

Font Explorations ( low legibility 😞 )

Font Explorations ( better legibility 😄 )

[aromalram]

Aeroways

Delhi Indira Gandhi International Airport

Mumbai Chatrapati Shivaji International Airport

Compilations

[pkd2512]

Working with POI (Restaurants, Pubs, Cafes, Desserts etc.) in the Indiranagar region of Bangalore.

Created a minimal style, keeping only the required elements.

Modified it to hold only the icons (modified)

Also, switched to a dark theme to keep the icons (POI) on the foreground.

Demonstration of the region and the density of the places.

[faaizasaeed]

road connectivity in india WIP

[rasagy]

Great work, and thanks for updating your comments with more examples & compilations (especially @aromalram!)

With this exploration, I’m hoping each student in the class will feel comfortable with the layer they work on — if someone else gets stuck when styling a particular layer, you know who to ask amongst your class for help! 😉

Closing this, feel free to continue updating your comments with compilations or final posters etc. if you want.