寻宝风格导航地图 Treasure 诞生记 | Mapbox 地图设计思路

Designing the Treasure map style

不久前，我们为大家介绍了霓虹灯风格地图 80‘s 8-bit 的设计思路，这篇文章我们继续分享一个有趣的地图设计 —— 寻宝风格地图 Treasure。

这张地图来自 Mapbox 官方地图设计师 Madison Draper，在艺术化的表达和阐述中，也着重突出了导航功能点，结合了 Mapbox Standard 的和 Mapbox North Star 两种风格，融合汽车导航和航海导航功能为一体，并且借助字体的变化营造一种寻宝的感觉。

灵感来源

如前所述，下面两张地图风格就是 Treasure 的最初灵感来源了。

而 Treasure 在原风格上添加了手写体 —— Homemade Apple Regular，便营造出来一种寻宝地图的韵味。

借助洋流，纬度圈以及独特的海洋标记，Treasure 的导航功能性得以体现.

这张地图不仅仅是用来看的，更是需要拿来用的。 —— Madison Draper

突出之处 —— 纹理

纹理为地图带来了立体感，将屏幕中的平面图变得似乎可以触摸和感受一般。

Treasure 涉及到两种类型的纹理：重复和非重复。

• 非重复图标，通常用于点数据的单个图标，比如海洋标签背后的船只。您可以到 Maki Icon Editor 中创建属于自己的非重复图标。

• 重复图标，创建了一种从端到端的无缝连接模式，这些图案用于填充多边形或线条。 Mapbox 的瓦片尺寸是 512px * 512px，这意味着重复纹理尺寸需要完美地划分 512 以使图标无缝连接。举个例子，Treasure 使用了两种图标，一种用于水（water64），一种用于土地（urban64）。两种图标均为 64px * 64px，512px * 512px 瓦片可以完美被填充。

制作重复图案时，需要确保整个画布上都填充图案，并且边缘相互兼容。如果你觉得有兴趣，可以看看这个例子，了解具体如何在 Mapbox Studio 添加 SVG 图案。

添加字体

设计地图的难点之一是将弯弯曲曲的手写字体与直来直去的线条（道路和纬度圈）进行结合，并保证易读性。应该怎么做比较好呢？为了确保线条不会影响易读性，可以尝试在文本中添加一个光晕，类似于文本和线条之间 2 px 的缓冲区，让光晕与背景层保持相同的颜色，就不会分散设计的注意力。

如何开始设计

点击链接登入 studio.mapbox.com，即可使用 Treasure 寻宝地图模版，在此基础上开展您的设计！

还可以尝试将 Treasure 与 Navigation SDK 相结合，参考之前的导航 App 制作教程，做一个真正可以用来寻宝的地图吧！

如果您设计出了自己的作品，欢迎发送邮件至 [email protected] 并附上简单的设计思路，即可获得中文全彩《地图设计指南》一本。