지도 기반의 버스 앱 리디자인
버스 도착을 확인하는데 기존의 즐겨찾기 목록이 제게는 적합하지 않아 불편했습니다. 그래서 버스 앱을 지도 기반으로 만들어 사용하고 있습니다.
맥락에 따른 버스 즐겨찾기 정보 디자인
기존 버스 앱의 즐겨찾기 목록에는 출근 할때 집 앞에서 타는 버스, 갈아타는 버스, 퇴근 할때 회사 근처에서 타는 버스, 갈아타는 버스, 수영장 갔다 집에 오는 버스들이 섞여 있습니다. 각 상황에서 버스가 두 개 이상 있다보니 목록은 점점 길어집니다. 긴 목록을 스크롤 하면서 내가 지금 탈 버스를 찾다 보면 화가 납니다. 내가 탈 것도 아닌 잡음이 되는 버스 목록을 왜 보고 있어야 하지? 앱이 아닌 비서라고 생각하면 불친절하거나 센스 없는 거거든요. 폰은 지금 내가 어디 있는지, 몇 시인지를 알고 있으니 내가 어떤 버스를 타려는 맥락인지도 알 수 있잖아요.
네이버 지도의 버스 즐겨찾기에서 이름을 목적지에 따라 '회사','집' 등으로 변경해서 정렬해 볼 수는 있지만 그렇다고 지금 내가 타야 할 버스가 한 눈에 들어오지는 않습니다. 카카오 버스는 정류장 별로 그룹핑하여 보여주어 좀 더 보기 편하지만 내가 뭘 타야 하는지 바로 보이지 않는다는 점에서는 차이가 없습니다. 예외적이긴 하지만 전 갈아타는 같은 정류장에서 아침에는 회사로 저녁에는 집으로 가는데요. 같은 정류장이라도 다른 맥락이 섞여 있으면 오히려 방해되기도 합니다.
내가 지금 상황에서 타려는 버스만 알아서 잘 보여줄 수는 없을까요? 할 수 있습니다. 내가 있는 곳 근처의 즐겨찾기만 보여주는 정도의 간단한 필터링을 할 수 있습니다. 하지만 위치 정보가 정확하지 않거나 하면(실내에 있거나 하여) 실제 의도를 제대로 반영하지 못하는 false negative 오류가 생길 수 있습니다. 예외적인 상황을 고려하면 목록 형태보다 지도를 기반으로 보여주는 게 더 이점이 있습니다. 의도한 즐겨찾기를 잘못 보여주더라도 지도의 이동이나 줌 아웃을 통해 어렵지 않게 다른 즐겨찾기를 볼 수 있거든요.
또 몇 정거장 전이라고 표시하기보다 지도 위에 표시하면 버스가 어디쯤 오고 있는지 직관적으로 알 수 있습니다.
즐겨찾기에 이용 시간대를 옵션으로 지정하면 같은 장소에서 다른 맥락인 경우도 걸러낼 수 있습니다. 같은 정류장에서 출퇴근 버스를 갈아타는 경우에도 퇴근 시간이면 출근 버스는 흐릿하게 표시하여 현재 맥락의 버스에만 집중하도록 했습니다.
도착 시간 정보를 표시하는데도 작지만 의미 있는 디테일이 있습니다. 같은 정류장에 여러 대의 버스가 있는 한 경우에, 그냥 번호순이 아니라 도착 시각에 따라 정렬해 먼저 올 버스가 먼저 보입니다. 어떤 버스가 먼저 올지 고민하지 않아도 됩니다. 보통 첫 번째, 두 번째 도착 시간을 함께 제공하는데 둘의 중요도가 같지 않습니다. 그다음 버스에는 관심없는 경우가 많으니 흐리게 표시하면 중요한 정보에 더욱 쉽게 집중할 수 있습니다. 버스가 가까이 와서 1분 이내에 도착하는 경우에 색을 강조하여 표시하면 인지 비용이 줄어듭니다.
즐겨 찾기 등록도 지도 기반으로 하면 보다 직관적으로 바꿀 수 있습니다. 기존은 정류장 번호를 먼저 검색하고 버스를 선택하거나 버스 번호를 검색하고 경로에서 정류장을 선택하여 개별적으로 등록하는 방식 위주였습니다. 무슨 DB 입력하는 것 같아요. (주변 지도에서부터 선택하는 방법도 물론 제공하지만요)
출근할 때 타는 버스, 퇴근할 때 타는 버스, 운동 갔다 집에 오는 버스 등 맥락에 따라 즐겨찾기를 하는 것으로 사고를 바꾸면 UI도 달라집니다. 탈 정류장을 선택하고 목적지를 지도에서 선택하면 해당하는 경로의 모든 버스를 찾아줍니다. 즐겨찾기에 왜 굳이 탑승시간을 지정할까요? 똘똘한 앱은 이제 내가 출근 시간에 이 정류장 근처에 가면 앱을 켜지 않아도 자기가 알아서 버스들의 도착 시간과 바로 승차 알림을 푸시로 알려줄 수 있게 됩니다.
주변 정류장 버스 확인
주변 정류장의 버스 정보를 확인할 때도 지도 기반이 보다 유용합니다. 즐겨찾기와 주변 정류장 모드를 나눌 필요가 없거든요. 지도에 내 위치를 표시하면 내가 어느 정류장 근처에 있는지 바로 확인할 수 있습니다.
높은 빌딩이 밀집한 곳에선 전파 반사로 GPS가 부정확해져 내가 길 건너편에 있는 것처럼 표시되는 경우가 자주 있습니다. 그래서 낯선 곳에서는 내가 어느 정류장에 서 있는지 지도를 봐도 헷갈리게 됩니다. 위치와 시선 방향을 함께 표시하면 이런 문제를 어느 정도 해결할 수 있습니다. 정류장에서 도로를 바라보면서 지도상의 내 위치를 확인해보면 실제 위치를 가늠하는 데 도움이 됩니다.
현재 정류장에서 버스 길찾기
코엑스에서 열리는 전시회에 가기 위해 고속터미널 앞의 버스 정류장으로 갔습니다. 여기에 바로 가는 버스가 많다는 걸 알고 있었거든요. 하지만 몇 번 버스를 타는지 까진 모릅니다. 정류장에서 버스 노선도를 하나하나 살펴보면서 코엑스 가는 버스를 찾으려다 포기했습니다. 노선도 디자인이 너무 나쁘거든요. 운 좋게 하나 찾더라도 더 빨리 오는 버스가 있진 않을지, 경로가 다르니 어떤 버스를 타는 게 더 빠를지 비교 선택이 불가능한 정보 형태입니다.
스마트폰의 대중교통 길찾기를 이용하면 스마트하게 몇 번 버스를 탈지, 어떤 버스가 먼저 올지 알 수 있습니다. 하지만 내가 지금 정류장에 있는 상황이라면 기존 앱은 그리 똘똘하게 정보를 보여주지는 않습니다.
네이버 지도는 길찾기가 우선이라 버스 도착 시간은 알려주지 않습니다. 1, 2분 빨라 봤자 10분씩 더 버스를 기다려야 하면 아무 의미 없잖아요.
그래서 다음 지도는 버스 도착 시간을 함께 표시해 줍니다. 자 이제 버스 검색 능력 시험을 보겠습니다. 아래 검색 결과를 보고 다음 물음에 답하시오. "뫄뫄는 지금 고속터미널 정류장에 서있다. 코엑스 전시장에 가려면 어떤 버스를 타는게 가장 좋은가?"
정답을 찾았나요? 정답을 찾는데까지 시간은 얼마나 걸렸나요?
가장 빠른 35분 걸리는 401번 버스를 탈까요? 13분 기다려서?
아니면 그다음 1분 느리지만 4분 58초 후 도착하는 3414번 버스를 탈까요? 함정이에요. 이건 신호등을 기다려 횡단보도를 건너 150m 떨어진 다른 정류장이에요.
왜 검색결과는 바로 답을 주지 않나요? 왜 내가 결과를 보고 생각하고 해석해서 답을 찾아야 하나요? 물론 이 앱들은 이런 특정한 맥락을 위한 앱이 아니라 범용적인 맥락의 길찾기 앱인 걸 감안해야 합니다.
하지만 현재의 목록 위주의 대중교통 특히 버스 길찾기 결과는 사용자의 검색 행태에 적합하지 않습니다. 대중교통 길찾기 사용자를 관찰해보면, 경로를 결정하기 위해 지도로 들어가서 확인하는 경우가 많습니다. 실제 목적지와 도착 정류장이 다르기 때문인데요. 걸리는 시간은 도보 시간으로 가늠할 수 있다고 해도 버스에서 내려 목적지까지 어떤 길로 어떻게 가는지가 사용자의 성향이나 상황에 따라 중요하니까요. 목록에서 지도로 왔다갔다 stacked in time 방식의 정보 표현이라 좋다고 할 수 없습니다.
지도 기반 길찾기
현재 버스 정류장에 있다는 맥락으로만 한정하면 불필요한 과정을 줄이고 보다 효율적으로 내가 탈 버스를 찾아볼 수 있습니다. 현재 정류장에서 갈 수 있는 버스 노선은 정해져 있으니까요.
1. 출발 정류장을 선택하면 그 정류장에서 갈 수 있는 노선이 모두 표시됩니다.
2. 목적지를 지도에서 선택하면 그곳까지 운행하는 버스를 모두 찾아줍니다.
지도에 정류장 별로 그룹핑해서 보여주니까 어디에서 내리는 게 좋은지 바로 확인할 수 있습니다.
질문은 "어떤 버스를 타는게 가장 좋을까?" 이므로 정보 위계는 버스 번호가 가장 잘 두드러지도록 합니다. 목적지에 빨리 도착하는 게 좋으니까 먼저 목적지에 도착할 버스를 먼저 보여줍니다. 목적지 예정 도착 시각은 현 정류장에의 도착 예정 시간과 이동 시간을 더해서 구합니다.
정보를 나열할 때는 최선의 선택 하나를 추천해 주는 게 인지 비용을 줄여주는데 굉장히 중요합니다. 351,362,401,4318 번 중 먼저 오는 걸 타야지 하고 여러 번호들을 작업 기억 안에서 정류장에 들어오는 버스들을 주의해서 확인 한다고하면 생각만 해도 피곤합니다. 기억해야 할 번호의 수도 많아지고 비교 처리해야 할 작업량도 많아지거든요. 하지만 362가 오는지만 확인하다고 대상이 하나가 되면 훨씬 수월해 집니다.
3. 하지만 그것도 역시 귀찮으니까, 오른쪽 아래 알림 버튼을 누르면 해당 버스가 정류장에 도착 했을 때 알려줍니다.
[참고##정보디자인##]