General UX - Kitchen Sink
General UX

Kitchen Sink

What Problem Does This Solve? Showcase all conceivable functions and data in one page. Why Use This Pattern? The Kitchen Sink approach, sometimes also referred to as Swiss Army Knife app or data portal, is useful for demo applications which showcase all (or almost all) of the features and is a great way to introduce […]

Read More
Choropleth Map
Visualizing Data

Choropleth Map

What Problem Does This Solve? Visualize how a measurement varies across a geographic area. Why Use This Pattern? Choropleth maps provide an easy way to visualize how a measurement varies across a geographic area or show the level of variability within a region. When to Use This Pattern Choropleth maps are important to support analysis […]

Read More
Introduction

Getting Started

The best way to introduce you to the Map UI Pattern library is by relating it to Atomic Design, which many of you are probably familiar with, and which is the basis of most Design Systems. Map patterns (Navigating the Map,  Orienting Yourself, Visualizing Data, and Views) and Content patterns (Interacting with Content, Exploring Spatial […]

Read More
Floor Selector
Navigating the Map

Floor Selector

What Problem Does This Solve? User needs to select a floor/level in a 2-dimensional indoor map. Why Use This Pattern? Indoor maps are inherently 3-dimensional in that they usually include multiple floors or levels. When displaying a planar (2D) map users do not know which level they are looking at or how to select a […]

Read More
Small Multiples
Exploring Spatial Content

Small Multiples

What Problem Does This Solve? Comparing changes, patterns or differences in data is difficult to impossible with interactive controls on a single map view. Why Use This Pattern? Small Multiples is sometimes also called trellis maps or tile maps. It is a series of similar maps using the same size and scale, allowing them to […]

Read More
Offline Maps
Special Workflows

Offline Maps

What Problem Does This Solve? User needs access to data in areas where internet is slow, mobile data is expensive, or user cannot get online. When to Use This Pattern Offline Maps is a great method for providing a means of navigation and getting driving directions while offline or in a foreign country. Limitations of […]

Read More
Layer List
Interacting with Content

Layer List

What Problem Does This Solve? Users need to show or hide map content When to Use This Pattern The best use of the Layer List is to empower users to “opt-in” showing additional information like traffic data, parcel boundaries, or elevation models and tweak the map display until the desired amount and level of content […]

Read More
Introduction

Why Map UI Patterns?

This site provides a language for planning and building map applications. It discusses principles, components of varying complexity, and features that all together inform design decisions for your next project. The elements of this language are entities called user interface (UI) patterns. Each pattern describes a solution to an observed and recurring problem. It explains […]

Read More
Search & Edit
Special Workflows

Search & Edit

What Problem Does This Solve? Users need to quickly update or modify an existing record. When to Use This Pattern Use to assist editors in finding the feature, object, or record that needs to be updated. Editors may be operators receiving phone calls from customers or subscribers requesting updates to their accounts, or field crews […]

Read More
List & Details
Special Workflows

List & Details

What Problem Does This Solve? User needs to see the details for an item selected from a list. Why Use This Pattern? A list is a form of data table that presents data for a large set of items. This is a common need for enterprise applications to show lists of clients, assets, activities with […]

Read More