UX Design Pattern#1_Logins_Case별 적용 사례_1부

만약에 당신이 서비스 UX 디자이너고 그 시나리오를 만들기 위해 키노트를 켰다면, 모르긴 몰라도 그 첫 페이지는 Login 모듈이 될 것이다. 인간의 사고는 모든 사건을 순차적으로 파악하고자 하는 뿌리 깊은 전통이 있기 때문에 시작을 '시작'에서 부터 시작하지 않으면 시작 이후의 모든 상황을 뒤죽박죽 엉망진창으로 만들기 때문이다. 그러므로 당신은 첫 페이지의 타이틀을 Login이라고 적을 수 밖에 없을 것이다. 

자, 어쨌든 일이 시작됐으니 이제부터 뭐가 필요한지 생각해 보자. 상황에 따라 많이 다르겠지만 요즘 같은 세상에 서비스를 만들면서 OAuth 모른척 넘어가기는 매우 힘들 것이다. Facebook이나 twitter를 이용한 로그인은 사용자의 Activation 비율을 상당히 높여줄 수 있기 때문이다. 물론 OAuth를 적용했다고 해서 자사 로그인 기능을 빼먹을 수는 없다. 자사 로그인에는 당연 가입 절차도 필요하다. 그러니 여기에 필요한 기능은 대충 다음과 같이 정리 된다. 

1. Facebook으로 로그인 하기

2. twitter로 로그인 하기

3. 자사 아이디로 로그인 하기

4. 회원 가입 하기

그리고 그 UI는 대충 아래와 같은 형태가 될 것이다.

단순 보다 명확 - 늘어 놓기

  

몇몇 서비스의 경우 자사 아이디로 로그인하는 단계를 줄이기 위해 아래처럼 첫 페이지부터 아이디, 비밀번호 입력 창을 제공하는 경우도 있다.

  

나는 이런 디자인을 '늘어 놓기'라고 부르는데 이 늘어 놓기는,

첫째, 모든 기능에 1 depth 접근 가능하다는 점

둘째, 어떤 기능도 숨겨져 있지 않다는 점

에서 아주 명확한 장점이 있다. 특히 나처럼 노파심 많아 '유저가 원하는 기능을 못 찾으면 어떻게하지?'라는 걱정을 주렁주렁 달고 사는 디자이너라면 이와 같은 디자인에서 말할 수 없는 안도를 얻을 것이다. 물론 명확한 장점만큼 단점도 명확한데, 

첫째, 화면이 번잡하다는 점

둘째, 로그인 개수가 늘어났을 때 대책이 없다는 점

이다. 첫 번째 단점은 아래와 같이 GUI를 구성해 해결할 수도 있다.

모호함이 증가한 대신 모던함이 늘었다!

하지만 두 번째의 경우 솔직히 마땅한 대안이 없는 게 사실이다. 물론 어떤 서비스도 로그인 방법을 4~5개 이상으로 늘릴리는 없겠지만, 당신의 클라이언트, 당신의 기획자, 당신의 각종 '장'들은 프로젝트를 언제든지 거지같이 만들 준비가 되어 있는 방심할 수 없는 사람들이다. 게다가 확장이 불가능하다는 근본적 구조 문제는 설령 때려 죽여도 '이 이상 버튼이 늘어날리는 없다'는 신체포기각서와 함께하더라도 뭔가 개운치 않은 뒷맛을 남기는 것이 사실이다.

어지간히 미치지 않고서야 이런 디자인을 할 수는 없지 않은가

2부에서 계속!