Maki is a simple and clean set of ‘point of interest’ icons licensed under BSD - free for use by anyone, for anything, and on any map. This new 2.0 release, coming more than two years since the first Maki set, is a complete redesign. I have literally re-concepted every symbol from the ground up, based on our internal needs to add context and display data points on our maps.
This is part of our effort to grow the creative map making space for users who want to make their own custom base map from OpeStreetMap with TileMill and OSM Bright and for those who just want to use the new global MapBox base maps (also designed on OpenStreetMap) that we will be releasing later this month. While there are a lot of global base maps out there with point of interest icons, Google is the only map provider that we really felt took the time to make a nice, refined set. But these icons are all closed source and only can be used with Google maps. We wanted to not only make Maki as unified and comprehensive as Google’s set but also have it be totally customizable and freely available as people design maps in TileMill.
Anatomy of a Maki icon
Before laying down a single bezier curve, we started by defining these design parameters:
First and foremost, each icon should be simple, clear, and have a unique silhouette.
Maki icons are unified stylistically through subtle rounded corners, minimal negative space, and consistent line weights.
Each icon is a single color, with no transparency except for a 30% opaque 1px white outline. The outline lets Maki icons stand out against dark and complex backgrounds.
Each icon is drawn separately at three different sizes - 24px, 18px, and 12px - in order to preserve crispness and clarity at each size.
The 24px icon should be able to scale up to any size and still look good.
The icons must look as similar as possible at all sizes so transitions between zoom levels are smooth.
Easy to customize and use
Maki was designed in the open source vector editor Inkscape, and we’ve included the .SVG source in the download. In Inkscape you can can recolor, modify, or add new icons to suite your map, and we’ve given each icon a unique ID so batch exporting .PNG’s with descriptive names is easy. Just select every icon (or just the ones you want), choose “Export Bitmap” from the “File” menu, check the “Batch Export” toggle, and export.
For more information on Maki, including download links and a symbol search, check out mapbox.com/maki.
Saman Bemel Benrud
is a designer at Mapbox. He is involved with the entire lifecycle of our products, from providing strategy and initial concept to consistently polishing the way our applications look and feel.
Follow @samanbb on Twitter