[240705] 6주차 WIL(KPT)

UI 분석 기반의 디자인 개선

 

지금까지 진행한 내용을 피피티로 만들어서 발표를 진행했다.

발표 결과, 큰 변화가 아니더라도 실질적인 문제를 해결하려는 점이 좋았다는 피드백을 들었다.

 

이전에 김소윤 튜터님께서 핵심행동에서 사용자가 문제를 겪는 부분을 찾아 내는 것이 중요하다는 말씀을 하셨었는데

그 부분을 적극적으로 받아 들여서 핵심 행동 플로우에 집중을 했던 것이 좋은 방향으로 이끌었던 것 같다.

 

그러나 두 가지 문제점이 있다는 피드백을 받았다.

먼저, 디자인 된 화면에서 GNB 바의 선택되지 않은 아이콘이 너무 연한 색이라 Disabled 상태로 보여지고

GNB 위쪽의 화면의 아이콘과 구분이 되지 않는 문제점이 있었다.

GNB의 선택된 상태를 강조하기 위해 선택되지 않은 부분을 너무 흐리게 한 것 같다. 또한, 아이콘의 형태에 일관성을 부여하기 위해 형태를 통일하다 보니 일반 아이콘과 GNB 영역의 아이콘이 유사해진게 문제가 되었다.

 

그리고 두 번째는 상단 탭이라고 생각했던 부분이었는데 강조하고 싶었던 부분인 Ebook 부분이 전혀 강조되지 않는 디자인이었다. 그러나 진짜 문제는 디자인이 아니었다.

우리 조에서 탭이라고 생각했던 부분은 사실 이 부분은 상단 탭이 아니라 페이지 이동 버튼이었다. 이 영역이 탭이었다면 페이지가 이동하는 것이 아닌 하위 콘텐츠만 바뀌어야 하는데 버튼을 누르면 페이지가 이동하기 때문에 탭이라고 보기는 힘들다는 것을 알게 되었다. 

 

그렇다면, 이 부분을 어떻게 수정을 해야할 지가 문제가 되었다.

현재 상태를 유지하자니 탭의 형태로는 페이지 이동 버튼임을 드러낼 수도 없고 로고와 탭에 중복적으로 교보문고라는 문자가 보여진다. 이 부분을 수정하려면 다양한 레퍼런스를 참고해야 할 것이라는 튜터님의 말씀을 들었다. 

 

 

 

튜터님께서 예시로 보여주신 이미지는 쓱 화면이었는데 로고 옆의 버튼을 누르면 바텀시트가 생기면서 브랜드를 선택할 수 있게 된다. 이와 관련해서 추가적으로 궁금한 부분이 생겨서 튜터님께 질문을 하게 되었다. 오른쪽 사진의 왼쪽 UI는 3년전의 교보문고의 UI이고 오른쪽은 현재 UI인데 왼쪽에서 오른쪽으로 변경하게 된 이유가 무엇인지 질문했다. 그 결과, 명확한 답을 얻게 되었다. 이와 같은 방식을 사용하면  Ebook 카테고리가 존재한다는 사실이 강조되지 않고, 버튼을 두 번 눌러야 페이지를 이동할 수 있다는 점에서 사용자가 불편함을 겪게 된다. 따라서, 이와 같은 방식을 이용했을 것이라고 말씀하셨다.

 

이야기를 모두 듣고 나니, 어제 TIL에 올렸던 리디나 인터파크의 경우에도 버튼을 두번 눌러야 페이지 이동이 가능하다는 점에서는 동일한 문제점을 가지게 된다는 걸 알게 되었다. 이 부분에서 Ebook을 강조하면서도 페이지 이동을 하는 UI의 사용성이 편하게 하기 위해서는 지금보다 훨씬 많은 자료조사 필요할 것이라는 생각이 들었다. 지금 당장은 문제를 해결할 수 없을 것 같아서 시간을 가지고 더 개선안을 찾아봐야 겠다.

---

 

[이번 챕터 KPT]

 

KEEP

• 팀원들과 계속 소통하면서 의견을 조율하기

PROBLEM

• 진행하고 있는 내용을 정리하지 않고 계속 진행한 것
• 계획된 내용을 시간 안에 진행하기 위해 목적보다 절차에 집중한 것 
• 의견이 조율되지 않는 부분에 너무 시간을 많이 쓴 것
• 의견 전달을 할 때 완곡하게 하지 못한 점

TRY

• 단계를 진행할 때마다 내용을 정리하기
• 팀 안에서 결론을 내기 어려운 부분은 바로 튜터님한테 가서 질문하기
• 의견을 이야기하기 전에 정리하고 하기