하지만 여기서 호출단계에 도착하기 전 화면에서도 여러 플로우가 나와서 이 화면은 따로 분석해보았다.
이 화면은 숫자는 쓰지 않고 4가지를 색으로만 구분해보았다.
맨 아래 하얀 플로우는 지도를 클릭할 때 나오는 도움말이 있어서 넣게 되었다. 지도에 밑줄을 그릴 순 없어서 따로 만듦
지도를 클릭하면 나오는 Help text
위 플로우 중 파란색 플로우에서 인상 깊게 본 UI가 있다.
텍스트 필드가 포함된 다이얼로그
텍스트필드 + 다이얼로그 조합은 처음 봤기에 인상깊게 보았다. 컴포넌트로 조립하기 쉬울 것 같고 만들기 연습도 해보면 좋겠다는 생각을 했다.
이후 클로닝을 하면서 느낀점을 토대로 분석을 진행해 보았다.
분석 내용
개인 클론 및 분석을 마치고 핵심 기능 분석을 진행했다.
2. 핵심기능 분석하기
웅-장
이 핵심기능을 분석하는 것이 오늘 나에게 가장 큰 시련이었다. 끊임 없이 팀원과 생각을 공유하고 화합을 맞춰나가는 것이 굉장히 어려웠다. 특히 문제를 바라보는 '관점'에서의 차이가 나를 가장 힘들게 했다.
우리 팀원들은 핵심기능을 '내비게이션'으로 설정하고 유저플로우를 그리게 되었다. 처음에 나는 내비게이션의 모든 플로우를 찍고 다른 앱들의 플로우와 비교하여 공통적으로 많이 나오는 UI를 비교/분석하고 싶었다. 그러나 짧은 시간에 분석해야하는 상황에 그럴 수 없고 핵심 플로우만 추려 비교하자는 팀원의 말에 설득되어 위와 같이 진행하게 되었다.
하지만 곧바로 갈등 상황이 나왔다. 각 화면마다 그리드 시스템을 분석하자는 내용이었다. 나는 서비스가 이용한 하나의 그리드 시스템을 찾고자 했고 나를 제외한 팀원은 각 화면마다 쓰인 그리드 시스템을 조사하자고 하였다. 이 상황은 설득 당했다기 보다 내가 잘 모르고 시간이 부족해 넘어간 케이스다. 이 부분은 어떻게 진행하는 게 좋았을 지에 대해 튜터님께 조언을 구해봐야겠다.
🛑인사이트: 아래 화면에 보이는 탭은 탭바의 형식을 한 필터이다.
위 사진에 보이는 서비스 핵심 기능 중에 중요한 컴포넌트 순위를 정할 때에도 어김없이 갈등이 일어났다. 나는 카드 UI보다 바텀시트가 더 중요하다고 생각하는 입장이었고 다른 팀원들은 카드가 더 중요하다고 생각했다.
나의 입장: 지도에서 바텀시트는 지도를 보면서 동시에 다른 액션을 수행할 수 있는 중요한 역할을 한다. 카드UI가 선택이라면 바텀 시트는 필수다.
팀원의 입장: 하지만 홈화면과 지도 모두에서 카드UI가 더 많이 쓰였다. 바텀시트는 한 화면에서만 쓰였기에 중요성이 덜하다.
이 말을 듣고 Card UI와 바텀시트의 중요성이 비슷할 수 있겠다는 생각을 했다. 하지만 어째서인지 나의 의견이었던 바텀시트는 5위까지 내려가 버렸다. 이때 시간이 부족한 상황이었지만, 솔직히 나vs팀원으로 의견이 계속 갈린 탓에 자신감이 떨어져서 바텀시트가 FAB나 탭바보다 중요할 것이라는 의견을 못냈던 것도 있었다. (컴포넌트의 중요도가 미션 완성도보다는 중요x)
이후에 핵심 UI 설계 패턴을 분석하였는데 두 가지 방법으로 진행했다.
1. 불편한 점을 중심으로 보는 UI 2. 네비게이션의 핵심 기능 중심으로 보는 UI
티맵, 네이버지도, 카카오맵으로 각각의 불편한 점을 중심으로 UI를 살펴보았다.
핵심 기능 중심으로 분석할 때는 '목적지 검색'과 '목적지 안내' 플로우로 나누어 살펴보았다.
추가적인 인사이트와 내용은 정리해서 내일 WIL로 작성해보겠다.
🛑막간 인사이트: 4배수 디자인 中 홀수 행간에 대한 튜터님들의 생각
내일이 거의 마무리인데 할 수 있을까? 발표 준비는 시작도 못했는데 큰일이다. 진짜 큰일이다. 큰일이다. 큰일이다.
