The store locator best practices every designer should know

by Niharika Sisodia
on Sep 19, 2018 8:53:52 AM

The top 4 store locator best practices

Customers increasingly research, review and purchase items online. Google report that every month people visit 1.5 billion destinations based on their Google search. An online store locator page can, therefore, be a useful tool to connect the virtual and physical world. An effective store finder page can:

  • Increase footfall in physical stores
  • Increase click and collect sales
  • Attract and attain new customers

An effective design is critical for your store finder page to get customers through the door. Here are 4 store locator best practices.

Simple design

Your store finder should be simple and easy to use. The below store locator has a clear search box with a bright green ‘find’ box, making it very easy to see. Results are listed in numerical order on the left-hand side, with corresponding map pins on the right. There is not too much information crowding the page.

store-finder

If a customer clicks on an option, the map highlights the corresponding pin. It also reveals further information, such as the address, telephone number and opening hours of the store.

store-locator-exampleStaggering the way information is revealed to the customer means that they are always seeing what is relevant to them as an individual consumer. This can add value to their shopping experience. The results also display the distance from the start location to the selected store. To simply this list even further, stores could also be displayed using travel time, instead of distance.

The example below shows M&S stores within 30 minutes of public transport from the centre of Leeds.

store-finder-best-practices

store-locator-travel-time-ux

On brand aesthetic

Designing your store finder in line with your brand can help customers recognise physical stores.

Barclays bank has designed their branch finder using their brand of blue on white. The store addresses in the list view are Barclays blue. Barclays has also used branded pins on their map view, helping the customer to recognise the colour and logo of their physical branch.

store-locator-best-practicesBarclays has also added an ATM icon. The map below shows the branches in Newcastle Upon Tyne and all the ATMs. The ATMs display a unique logo. Users who just need to withdraw cash have more options than those needing to visit a Barclays branch for banking services.

store-search-ux

Mobile compatibility

Customers on mobile tend to have different priorities and parameters than those searching on a desktop computer. Users will have a smaller screen and usually be on the move, so likely looking for a store near to their current location. A good store finder design should take these factors into account.  The intention to visit is often higher on mobile too.

The Argos desktop design uses the entire screen for a map view and continues to display shop departments and a separate Argos search box at the top of the screen.

store-finder-best-practices-argos

However, when searching on mobile, Argos have simplified the design to give the user all of the screens to view the map and the store search box.

The results page display on mobile has also been simplified to be more user friendly and account for the size of the screen.

store-finder-best-practices-mobile

 

 

 

 

 

 

 

 

 

 

 

 

The desktop view shows a map and a list on one page.

store-finder-best-practices-argos

The mobile version allows the user to click between map and list view.

store-finder-argosstore-finder-argos

Autocomplete

Another helpful feature can be autocomplete. The below example from H&M shows that as a user in Switzerland starts to type their search, the H&M page makes suggestions based on the selected country, Switzerland.

store-finder-best-practices-hmChanging the country to the United Arab Emirates, the store finder returns different suggestions.

store-finder-best-practices-h&mAnd in the United Kingdom, the suggestions change again to display options that are relevant to the user.

store-finder-best-practices-h&mOn mobile, you can use your phone’s location to automatically fill in your current location. For example, the mobile PostNL web page enables users to find their nearest postbox using the geolocation icon. This means people don’t need to spend time typing their address.

store-finder-postnl

 

 

 

 

 

 

 

 

 

 

Amenities filter

In addition to listing the location of your stores, a good store locator page will understand that customers have individual needs and guide users to individual amenities.

On the Morrison’s website, for example, once a user has clicked on a location from the results page, the site will list the details. This does not only include the address of the store but a summary of the amenities within the store.

store-finder

This allows customers to find what they are looking for and gives the retailer an opportunity to advertise services that the customer might be interested in using in the future.

store-locator-travel-time-ux

To create your own store locator page, take a look at our tutorial on how to build a store finder. To find out more about store locator best practices, visit our store locator resource page.

 

Related

How to make the perfect store locator website

Follow these tips to create a store locator page that will convert site visitors into customers at your physical store. Optimise your store locator website page to improve the user experience.

Niharika Sisodia Mar 25, 2019 10:00:00 AM
READ

Site search box design inspiration

Perfect your site search box design. Use these tips to make your site search box easy to use. Improve user experience by anticipating how users search. Place your site search box in the best location and add filters that will save your users time.

Niharika Sisodia Mar 20, 2019 3:35:25 PM
READ

6 ways to display a map on a website

Discover the best way to display a map on a website. Improve the user experience and encourage viewers to become customers with a clear and simple map display.

Niharika Sisodia Dec 10, 2018 3:06:44 PM
READ

The 10 best store locator pages | Mobile & Desktop examples

The 10 best store locator pages for driving footfall to locations. Get examples and compare search bars, map views and list views. An omnichannel must!

Louisa Bainbridge Aug 23, 2017 1:20:24 PM
READ

27 Site search solutions for search performance and functionality

27 site search solutions that will help boost eCommerce sales and conversions. Search data smartly and efficiently to return the optimal results.

Louisa Bainbridge Jun 7, 2017 4:03:15 PM
READ