NCBT-V2 . 화면 UI 재설계

위 화면은 NCBT V1 의 메인 화면이다. 내 기준에서는 나쁘지 않은 것 같긴 하지만 처음 우리 서비스에 입장하는 사용자들에 대한 배려가 부족한 것 같다는 생각이 들었다. 사실 변명아닌 변명이긴 하지만 V1 에서는 백엔드 개발에 집중하느라 사용자들이 가장 먼저 마주하는 화면 개발은 등한시 했었다. 그러나 풀스택 개발자를 목표로 하면서 UI/UX 측면에서 사용성에 대한 고민과 개선이 필요하겠다는 생각이 들어 V2 개발을 추진하면서 가장 먼저 화면 UI 를 재설계하고자 한다.

🔍 문제점 분석

🔥 문제 1. 사용자가 기능을 한 눈에 파악하기 어렵다.

일단 우리 서비스의 목적이 무엇인지 생각해보자. 우리는 NCBT 프로젝트를 네이버 클라우드 자격증 시험을 준비하는 수험생들을 위한 웹 사이트라고 소개하고 있다. 그러므로 사용자가 마주하는 첫 페이지에서 사이트의 목적이 무엇인지 명확하게 파악할 수 있어야 한다.

✅ 해결 1. 연습문제 페이지를 메인 화면으로 바꾼다.

✅ 해결 2. 튜토리얼을 추가하여 버튼 위치, 기능을 설명하자.

🔥 문제 2. 제공하는 기능에 비해 화면이 복잡해 보인다. 좀 더 가볍게 구성하면 이탈을 막을 수 있을 것 같다.

가장 큰 기능은 연습문제, 모의고사 두 가지이다. 랭킹, 게임, 후원 기능은 구현되지 않은 부분도 있고 화면에서 많은 영역을 차지할 필요가 없는데 기존 화면에서는 너무 큰 비중을 차지하고 있는 점이 오히려 불편하게 느껴졌다.

✅ 해결 1. 게임 기능은 무산되었으니 버튼을 삭제하고, 후원 기능은 개발중이니 임시로 주석처리한다.

✅ 해결 2. 기존의 차트형 랭킹은 삭제하고 툴킷 형식으로 변경한다.

🔥 문제 3. 회원 정보는 최소한만, OAuth2 로그인이 있으니 폼 로그인 기능은 필요 없을 것 같다.

모든 사용자가 회원가입할 필요는 없지만 랭킹이나 북마크 기능을 원하는 사용자는 인증이 필요하다. 기존에는 폼 로그인 방식과 소셜 로그인 방식 두 개를 구현했었는데, OAuth2 인증은 비밀번호를 입력하지 않고, 토큰을 사용하므로 일반적인 폼 로그인 방식보다 안전할 것 같았다. 그렇다면 아예 보안을 위해 폼 로그인을 없애고 소셜 로그인 방식만 남기는 것이 더 좋을 것 같다. 그리고 이건 선택 사항이긴 하지만 구글 로그인을 하나 더 추가하면 좋을 것 같다.