面向 iOS 的地图设计

Mapbox Studio 可以让您创建完全自定义的地图样式。设计样式时, 请考虑样式在你应用中的应用场景。

有很多与移动用户体验和 iOS 相关的考虑, 特别是在网页使用 Mapbox Studio 设计您的风格时, 这些可能并不明显。地图本质上是图形用户界面元素, 因此在设计地图样式时, 用户界面设计中的许多相同问题也同样会产生。

颜色

当您的地图样式呈现时, 请确保应用程序的用户界面有足够的对比度。标准用户界面元素 (如工具栏、侧栏和工作表) 通常会将地图视图与半透明的、模糊的背景重叠, 因此请确保这些元素的内容在底部的地图视图中保持辨认度。

用户位置标注视图、属性按钮、吹出框视图中的任何按钮，以及导航栏中的任何项，都受应用程序着色(tint color)的影响, 因此请选择与您的地图样式能形成很好对比的颜色。如果你打算在光线昏暗的环境下使用你的风格, 要考虑到夜间模式(Night Shift)可能对你风格的颜色产生的影响。

排版和图形

选择适合 iOS 设备的字体和图标大小。iPhone 和 iPad 的屏幕比通常使用 Mapbox Studio 的浏览器窗口小, 尤其是在Studio中启用多任务时窗口会更大。用户的视觉距离可能比台式计算机的视觉距离短。

某些用户可能使用更大的动态类型(Larger Dynamic Type)和辅助文本(Accessibility Text)功能来增加设备上所有的文本大小。您可以使用运行时样式 API来相应地调整样式的字体和图标大小。

设计雪碧图, 并选择在标准分辨率和 Retina 屏幕中显示清晰的字体粗细。此 SDK 支持和 iOS 相同的解决方案。标准分辨率显示器仅适用于较旧设备, 您的应用是否支持具体取决于其最小的deployment target。

无论地图的方向(orientation)如何, 图标和文本标签都应该是可读的。默认情况下, 此 SDK 使用户可以轻松地使用触控手势旋转或倾斜地图。

如果您不打算设计来适应旋转和倾斜, 请分别使用 MGLMapView.rotateEnabledMGLMapView(py)rotateEnabled)和 MGLMapView pitchEnabledMGLMapView(py)pitchEnabled)属性，或通过 Interface Builder 中相应的 inspectable 来禁用这些手势。

交互

请注意你的风格元素是否是交互式的。

文本标签可能仅仅因为匹配了您应用程序的色调或默认的蓝色色调，看起来就像一个可按按钮。通过安装手势识别器并执行要素查询 (例如,-[MGLMapView visibleFeaturesAtPoint:]) 可以使图标或文本标签可交互，来获取所选要素的详细信息。

请确保您的用户可以轻松区分来自周围其他地图的交互式元素, 如指针、用户位置标注视图和路径。避免依赖悬停效果来显示交互式元素。在交互式元素之间留出足够的空间, 以容许不精准的触碰手势。

更多参考

有关用户界面设计的详细信息, 请参阅 Apple 的 iOS 人机界面指南。要了解有关设计移动设备地图的详细信息, 请参阅 Mapbox 地图设计指南的移动地图部分。