Maps & Directions
Last updated: September 14, 2015 at 20:38 pm

Define your company’s strategy for the use and consistent behavior of interactive geographical maps.


Visual example of the element:


What problem does this element or pattern solve?
With the proliferation of mobile devices, interactive location maps have become a mainstay of many applications. Although the basic functionality may be controlled by an external API, in most cases the number of activated interactions and visual styling are highly customizable.
It applies to these platforms:

Tablet Web, Smartphone Web

An example of this element or pattern in production:


Detailed specifications

Specifications To Consider

  • Brief information on the Map API provider, along with direct links to that providers support area so developers and designers can get additional information.
  • Multiple examples of approved map styling and interactions within the API. Origin points, target destinations, points of interest, route lines, keys, legends, zooming, panning, etc.
  • Visual affordances which trigger maps. This includes text, icons, and thumbnails. Do these affordances contain static or dynamic content?
  • How are maps shared or printed from within your interface?
  • Visual styling of map containers. This should include containers, borders, titles, location of print and share icons, etc.
  • Interactions which display maps. Can maps appear inside a modal only? Should they be presented in an accordion or other expandable area? What about small maps inside a tool tip?


Location of assets to build this element or pattern
Location of UX or visual design assets
Location of development code repository


Additional details
Information on research, user testing, or usability reports:

Not Applicable (Remember: no field should be blank!)

This element or pattern may also be known as:
directions, routes, points of interest
Related elements within this Style Framework:

Not Applicable (Remember: no field should be blank!)



Owners and governance
UX or design 0wner
John Designowner
Email: design.owner@yourcompany.com
Business or marketing owner
Mary Businessowner
Email: business.owner@yourcompany.com
Development owner
Mike Devowner
Email: development.owner@yourcompany.com


Other information
Please include any other relevant information about this element or pattern:
Not Applicable (Remember: no field should be blank!)


Comments & Questions