layout – Map UI Patterns

Kiosk map

WHAT Provide location-specific information through an interactive screen in a public area. WHY An electronic kiosk is a computer terminal that provides access to the features of an application while limiting access to other apps or system level functions, sometimes referred to as “kiosk mode”. It is important to understand that the kiosk is mostly […]

Focus on the subject

WHAT Focus on the subject is a pattern with many elements that fosters an interaction method allowing the user to switch their focus or center of interest or activity from a generic display to a specific, detailed, and focused screen. WHY Selecting the correct layout is a challenging design task. Each layout pattern has a […]

No map

WHAT The no map pattern does not use a map. It is used when the task doesn’t require a map but still uses the full power of geographic information systems (GIS) in other ways, such as through charts or a dashboard. WHY Of all the UI components, dynamic maps fall into the category of “difficult […]

Mobile map

WHAT Maps on mobile devices are often difficult to manipulate by touch and result in unexpected behavior. WHY Maps are difficult to navigate on touch devices and require special attention to the input capabilities of the users, sometimes referred to as the fat finger syndrome. Data visualizations and interactions created for desktop devices cannot be […]

Embedded map

WHAT In the embedded map pattern, the app requires an interactive map to perform a simple task, and the map is embedded as part of the page flow. Embedded map layouts are commonly used on multipage sites such as company websites, news sites, blogs, and magazines. They highlight locations, relationships between objects, or statistical data. […]

Reference map

WHAT In the reference map pattern, a small map is generally placed next to the other layout components. The map serves as an additional or auxiliary view and is mainly used for contextual purposes. WHY Geography is important for understanding everyday things. How is an object spatially related to another object or landmarks such as […]

Partial map

WHAT In the partial map layout, panels for workflow or content are side by side with the map. Map and content are equally important, and the app is often workflow driven. WHY As outlined in the task-oriented pattern, having clear and well-defined workflows is important for aligning content and features with the goals of users. […]

Full map

WHAT In the full map layout, the map is the focus of the app and large enough to fill the entire screen. The core value of the app is spatial information. WHY Spatial analysis allows people to get insights and discover relationships in geospatial data. The way this rich data is visualized directly impacts how […]