지도에서 찾아 전화까지 가는 사용자 흐름과, 샵을 1분 만에 등록하는 운영자 흐름을 화면으로 정리했습니다.
스토리보드란?
스토리보드는 서비스의 화면을 실제 모습에 가깝게 미리 그려 보는 문서입니다. 개발 전에 화면을 먼저 맞춰 보면, 만들고 나서 바꾸는 비용이 생기지 않습니다.
마지막까지 보시면 1차에 무엇이 만들어지고, 2차에 무엇이 붙는지가 화면으로 구분되어 보이실 것입니다.
가입도 로그인도 없이, 지도를 연 순간부터 전화가 걸리기까지 다섯 단계로 끝납니다.
홈 화면 아이콘을 눌러
내 위치 기준 지도를 봅니다
마두동·정발산동처럼
다니기 쉬운 동만 고릅니다
지도와 같은 결과를
가까운 순 목록으로 훑습니다
사진·영업시간·위치를
한 화면에서 확인합니다
버튼 한 번으로
바로 통화가 시작됩니다
서비스를 열면 가장 먼저 보이는 화면입니다. 가입이나 로그인 없이 곧바로 고양·파주 샵이 지도 위에 뜨고, 같은 결과를 목록으로도 볼 수 있게 토글을 지도 위에 올렸습니다. 홈 화면에 추가해 두면 이 화면이 앱처럼 바로 열립니다.
지도에 보이는 범위의 샵만 불러오고, 핀이 겹치면 묶어서 표시합니다. 샵이 수백 곳으로 늘어도 지도가 느려지지 않게 하기 위한 처리입니다. 하단 목록은 지도와 같은 결과를 가까운 순으로 정렬해 보여 주며, 각 줄의 전화 아이콘에서 상세를 거치지 않고도 바로 걸 수 있습니다.
고양·파주 안에서 실제로 다닐 수 있는 동만 남기는 화면입니다. 시를 왼쪽에서 고르고 동을 오른쪽에서 여러 개 체크합니다. 등록된 샵이 없는 동은 눌리지 않게 흐리게 두어 헛걸음을 막습니다.
동 목록은 행정동 기준으로 기획 단계에서 확정한 뒤 고정합니다. 개발 중간에 동 기준이 흔들리면 필터 결과와 샵 데이터가 어긋나기 때문입니다. 선택 결과는 주소에 남아, 같은 조건을 그대로 공유하거나 다시 열 수 있습니다.
상호·사진·주소·영업시간·소개를 한 번에 확인하고 전화로 넘어가는 화면입니다. 전화 버튼은 스크롤과 상관없이 항상 화면 아래에 붙어 있습니다. 모든 샵이 같은 형식으로 보이며, 돈을 낸 샵을 위로 올리는 구분은 두지 않습니다.
전화 버튼은 기기 전화 앱을 바로 여는 방식입니다. 다만 카카오톡 등에서 열린 브라우저에서는 동작이 다를 수 있어, 그 경우까지 검수 항목에 넣어 확인합니다. 영업시간은 요일별로 저장해 두고 오늘 기준으로 영업중·휴무를 자동 표시합니다.
6개월 안에 80곳을 채우려면 등록이 빨라야 합니다. 관리자 웹은 그 속도를 기준으로 설계했습니다.
찾아 둔 주소를
그대로 붙여넣습니다
동과 지도 위치가
알아서 채워집니다
사진을 끌어다 놓으면
크기 조정까지 자동입니다
폐업·정보 부족 샵은
스위치 하나로 숨깁니다
노출 지역을 켜고 끄며
2차 확장을 준비합니다
제안서에서 말씀드린 역제안이 그대로 보이는 화면입니다. 주소를 붙여넣는 순간 동과 지도 위치가 채워지고, 남는 일은 상호·전화·영업시간과 사진뿐입니다. 오른쪽 지도로 위치가 맞는지 바로 보면서 등록합니다.
주소를 위치로 바꾼 결과는 등록하는 순간 저장해 둡니다. 나중에 주소 데이터가 바뀌어도 샵 위치가 흔들리지 않게 하기 위해서입니다. 상가 2층처럼 도로명 주소만으로 어긋나는 곳은 지도에서 핀을 끌어 직접 맞출 수 있습니다. 아래 잠긴 항목들은 2차 확장용으로, 데이터 자리만 잡아 두고 화면에서는 꺼 둔 상태입니다.
| 상호 | 동 | 전화번호 | 사진 | 상태 | 노출 |
|---|---|---|---|---|---|
| 수리원 테라피 | 마두동 | 031-905-4728 | 6장 | 노출중 | |
| 자하 아로마 웰니스 스파 | 정발산동 | 031-812-3390 | 4장 | 노출중 | |
| 연서 경락 | 백석동 | 031-977-5512 | 0장 | 사진 없음 | |
| 온담 스파 | 장항동 | 031-903-7741 | 3장 | 노출중 | |
| 파주 힐링테라피 | 운정동 | 031-946-2287 | 2장 | 숨김 | |
| 소연 발관리 | 탄현동 | 031-921-6634 | 5장 | 노출중 |
등록한 샵을 한눈에 훑고 고치는 화면입니다. 왼쪽에 등록 현황이 목표 80곳 대비로 항상 보이게 두어, 오픈 이후 얼마나 채웠는지가 바로 확인됩니다. 사진이 없는 샵은 색으로 구분해 먼저 보완하도록 했습니다.
노출 스위치를 끄면 사용자 화면과 지도에서 즉시 사라집니다. 데이터를 지우는 것이 아니라 감추는 방식이라, 폐업 후 재개업이나 정보 보완 중에도 다시 켜기만 하면 됩니다. 모든 샵은 같은 조건으로 정렬되며 노출 순서를 사람이 임의로 올리지 않습니다.
노출할 지역을 켜고 끄는 화면이자, 2차에 무엇이 붙는지를 한눈에 보여 주는 화면입니다. 1차는 고양·파주만 켜 두고, 나중에 서울·인천으로 넓힐 때는 스위치를 켜는 것으로 시작합니다.
오른쪽 잠긴 항목들은 예약·결제·별점·사장님 계정처럼 2차에 붙일 기능입니다. 1차에서 데이터 자리와 연동 창구만 미리 만들어 두기 때문에 1차 금액은 늘지 않고, 2차에서는 화면만 붙이면 됩니다. 사용자 앱을 만들 때도 지금 만드는 같은 창구를 그대로 씁니다.