내 웹사이트에 매장 찾기 서비스(Store Locator)를 추가할 때: 7가지 Tips

Google Maps API 출시 이래로, 개발자들은 고객이 가까이에 있는 매장을 쉽게 찾는 데 도움이 되는 지도를 만들어왔습니다. 10년이 지났지만 여전히 매장 찾기 서비스(Store Locator)는 Google Maps의 주요한 성공사례입니다. 그리고, Google Maps API로 할 수 있는 것들이 훨씬 더 많습니다. 그래서, 당신의 고객을 위한 맞춤형 매장찾기 서비스를 만들기 위한 7가지 유용한 팁을 소개하려고 합니다.

 

1. 주소 입력을 위해 자동완성(Autocomplete) 기능을 이용하세요.

자동완성 기능은 Google Maps JavaScript API의 Places 라이브러리 기능 중 하나입니다. 자동완성 기능은 당신의 어플리케이션 내 Google Maps 검색창에서 텍스트를 모두 입력하기 전에 미리 검색해주는 기능을 제공합니다. 사용자가 주소를 입력하기 시작할 때, 자동완성 기능이 나머지 텍스트를 완성해줍니다. Google Places API는 이러한 기능이 담긴 서치박스 위젯을 제공하기 때문에, 부정확한 사용자 유입을 분석할 필요가 없습니다.

 

2. 로그인(Signed-in)의 추가적인 혜택을 제공하세요.

위치 저장 기능(Attributed save)이 있다면, 웹사이트 방문자들은 구글지도와 같은 다른 웹사이트의 지도에서도 당신의 매장 위치를 저장할 수 있으며, 클릭 시 당신의 사이트로 연결될 수도 있습니다. Google Maps JavaScript API의 로그인(Sign-in) 기능은 집이나 직장 같이 이용자들이 저장해둔 위치들이 나타나는, 그들에게 최적화된 지도를 갖게 할 것입니다.

 

3. HTML5 Geolocation을 이용해 고객들의 위치를 자동으로 찾으세요.

매장 찾기 서비스 페이지를 이용하는 고객들은 원하는 매장의 위치의 검색 결과를 최대한 빨리 얻고 싶어 합니다. HTML5 Geolocation을 사용하면, 사용자의 위치를 바로 파악해 자동으로 주변 매장의 위치를 나타낼 수 있습니다. 매장 찾기 서비스를 최대한 효율적이고 간편하게 제공하는 것은 고객들이 원하는 정보를 신속하게 찾고 궁극적으로는 당신의 매장에 조금 더 빨리 방문할 수 있다는 것을 의미합니다.

Google_Geo_Developers_Blog__Map_Tips__Build_a_great_store_locator

FedEx 웹사이트의 ‘Find FedEx Locations’ 페이지는 Geolocation을 활용한 매우 성공적인 사례입니다. 고객이 FedEx의 위치를 검색하기 시작할 때, 지도에 고객과 가장 가까운 매장 위치가 나타납니다.

 

4. 매장 외관을 Street View 이미지로 제공하세요.

Google Street View Image API를 활용해 매장과 주변 지역의 이미지를 제공하면, 고객이 좀 더 쉽게 매장에 찾아올 수 있습니다. Walgreens App은 웹사이트의 매장 찾기 서비스와 구글 스트릿 뷰를 통합해 Walgreens의 고객들이 더 쉽게 매장을 찾을 수 있도록 했습니다.
Google_Geo_Developers_Blog__Map_Tips__Build_a_great_store_locator 2

5. 검색 결과를 실제 운전 거리로 비교해보세요.

일반적으로, 매장 찾기 서비스의 데이터베이스들은 공간 검색을 수행할 때 직선거리 정보를 제공합니다. 하지만, 이런 정보는 종종 오해의 소지를 불러일으킬 수 있습니다. 데이터베이스 검색 후, Distance Matrix 서비스를 사용하면, 검색 결과를 실제 운전 거리에 따라 재분류할 수 있습니다. 뿐만 아니라, Directions 서비스를 통해 지도에서 네비게이션처럼 실제 방향, 턴 정보 등을 제공한다면 고객은 당신의 어플리케이션을 떠날 필요가 없습니다.

 

6. 작은 지도보다는 큰 지도, 우리 회사에 맞게 스타일링된 지도를 사용하세요.

사람들은 시각적, 공간적으로 생각합니다. 따라서 우리 회사에 맞게 스타일링된 지도는 당신의 매장 찾기 서비스의 중요한 포인트가 될 것입니다. 지도 가시화의 효율성을 향상시키기 위해 선택된 매장을 자동으로 강조하거나 모든 매장의 위치를 저장할 수 있도록 줌 레벨을 자동으로 설정하는 등의 역동적인 요소들을 사용하는 것을 고려해보세요. Styled maps를 활용한다면, 표준 구글 베이스맵을 당신의 가게 브랜드 이미지에 맞게 커스터마이징할 수 있습니다.

Google_Geo_Developers_Blog__Map_Tips__Build_a_great_store_locator 3

이용자가 테슬라의 웹사이트에서 “Find Us”를 선택하면, 주변에 있는 모든 테슬라 매장의 위치를 자동적으로 나타납니다.

 

7. 지도가 검색 경험을 향상시킬 수 있게 하세요.

당신의 웹사이트 이용자들이 지도에서 또 다른 매장의 위치를 찾을 수 있게 하세요. Event listener를 지도 idle event에 도입해 이용자가 지도를 확대하거나 축소할 때마다 매장 위치 정보를 불러올 수 있도록 하세요. 이 기능을 활용하면 이용자들이 원하는 매장의 위치를 다시 보기 위해 재검색을 하지 않아도 되기 때문에, 더 원활한 검색 경험을 제공할 수 있습니다.

샘플 코드로 바로 시작하고 싶다면 Google Maps API에서 Store Locator Library를 살펴보세요. 위의 기능들을 활용한 매장 찾기 서비스의 사례를 확인할 수 있습니다.
출처: http://googlegeodevelopers.blogspot.kr/2015/04/map-tips-build-great-store-locator.html