Locate me

WHAT

The locate me pattern helps users quickly find their current location in the map. It is a crucial mechanism for providing meaningful context about the user’s location and surroundings.

WHY

Users on mobile devices are focused on their immediate area and tend to have a narrow center of interest or activity. They are usually on a small-screen device and may be in a rush with little time to handle  complicated data input or map navigation. Having a simple way to identify and locate a user’s real-world geographic location saves them time and enhances their experience with the app.

WHEN

Locate me is a common mechanism on mobile devices to find the user’s current position. Sometimes referred to as geolocation, the estimated geographic position is determined via mechanisms such as GPS, Indoor Positioning Systems (IPS), or services that use network routing addresses. Mobile apps use locate me for route finding or directing people to nearby places such as tourist attractions or available parking spots. Store locator apps use locate me to identify nearby stores or locations.

HOW

Provide a button that triggers a process to determine the latitude and longitude coordinates of the user’s geographic position. Label the button Locate Me or Near Me, or simply show the locate me icon that  looks like a target symbol. Place the button in a corner of the map — a good place on mobile devices is near the bottom where users can easily access it with their thumbs.

After invoking the locate me action, zoom and center that map at the user’s current position and show a blue dot. Zoom to a map scale that shows enough context and minimizes the need for further navigation. The actual extent will depend on the task and the data — for instance, a parcel finder may zoom straight to the parcel at a very large scale, whereas a store locator probably wants to include some stores around that location and therefore decides to zoom to a medium scale.

Although the app is centered on the user’s location, the Locate Me button may be hidden if it doesn’t affect other buttons shifting into its vacant space. Once the user starts panning the map and their current location isn’t centered anymore, the Locate Me button reappears so users can re-center on their location again. Alternatively, the icon may change from showing a target icon with a dot in the center while  centered to using the same icon without a dot otherwise.

As an alternative to the Locate Me button, a link may be used. This approach is especially useful when more verbose labels such as Find a Hospital Near Me or Local Deals Tonight are needed. Place the link near a location finder or search and consider adding the Locate Me icon adornment for clarity.

Users should always understand why the app is asking for their location. Provide context for its purpose and, if possible, hint at how this information will be used.

EXAMPLE

Dubai Electricity and Water Authority (DEWA) developed the solar calculator, a mobile responsive web app that encourages citizens of the United Arab Emirates to adopt a more sustainable way of generating electricity and reduce their carbon footprint. The app offers two ways to find a location. One way involves typing an address, place, parcel, or makani, the official geographic addressing system in Dubai, into the location finder. The other way is to click the Locate Me button. The button is positioned in the bottom right corner of the interface so that the thumb can reach it easily. After clicking it, the browser may ask for permission to access the device’s location and then zoom the map to the user’s current location. A blue dot shows the identified location. Because the focus of this app is to visualize solar potential, the zoom level is large enough to display building roofs. The different shades of yellow indicate suitability for solar panels on the specific roof surfaces. Tapping on a roof reveals additional information about the solar potential.

MORE