UX Design Pattern#2_Logins_비밀번호 분실 안내

Login 디자인 패턴을 조사하다보니 의도치않게 왕따 꼽사리같은 '비밀 번호 분실 안내' UI가 눈에 들어왔는데 나름 다양한 형태가 있는것 아닌가! 비주류에 작은 기능이긴 하지만 사회적 약자를 사랑하는 마음으로 특별 편성을 결정했다. 그래서 오늘은 'Login 디자인 패턴 그 속편: 비밀 번호 분실 안내'다!

쿨하게, 그리고 솔직하게

'헤이 브로, 왓섭. 유가 찾는 게 혹시 이거?'라고 묻듯 쿨하고, 솔직한 UI다. 'Forgot Password?' 짧고 간단할 뿐만 아니라 밑줄만 그어줬을 뿐인데 버튼처럼 행세하는 마법까지 발휘한다. Label이야 조금씩 변했지만 제공 방식 자체는 웹시절부터 꾸준히 사랑받아온 전통적 UI라고 볼 수 있다(반대로 생각하면 웹의 잔재일 수도).

  

레이블은 동일하지만 Forgot Password를 정식 버튼으로 승격시켜준 디자이너들도 있다. 

  

'밑줄 그은 텍스트'냐 아니면 '버튼'이냐, 외관은 큰 차이가 없어 보이지만 이런 결과에 다다르기까지는 상당히 다른 근거가 작용했을 것이다. 전자를 지지하는 디자이너들은, 

첫째, 이 씬에서 가장 중요한 건 '로그인'이므로 'Forgot Password'가 더 눈에 띄어서는 안되며

둘째, 아이디와 비번을 애써 입력한 뒤 실수로 'Forgot Password' 버튼을 누를 끔찍한 경험을 막기 위해

'밑줄 그은 텍스트'가 최선이라고 말할 것이다. 실제로 저 거대하고 불길한 회색 버튼은 크기나 위치면에서 '제발 나를 눌러 주세요'라고 노래를 부르고 있는 것 같다. 반면 후자를 지지하는 디자이너들은, 

첫째, 위 사례는 버튼이 문제가 아니라 아예 잘못된 디자인 사례이며 

둘째, 모든 앱이 너처럼 희멀건한 바탕에 눈에 띄는 색으로 글씨를 적을 수 있는 게 아니므로 

컨텍스트에 따라 옳고 그름은 충분히 역전될 수 있다고 말할 것이다. 아래 사례를 보면 실제로 Rockmelt 보다는 Wunderlist의 'Forgot Password'가 시인성이 높으며 위 사례와 비교해 봤을 때 크기나 위치면에서 혼란을 줄 여지는 없어 보인다. 

  

은밀하게, 그리고 절묘하게

앞에 논쟁들을 가볍게 비웃을 수 있을 만큼 절묘한 디자인이다. 

  

'?' 아이콘 하나는 너무 모호한 것 아니냐고 묻는 사람에게 영화 '건축학 개론'의 한 장면을 보여주고 싶다. 

납득이: 고백해 새꺄

이제훈: 뭐라고?

납득이: (완벽한 계획이라는 듯) 야 첫 눈 오는 날 만나자고 해

이제훈: 그게 고백이야? 아니 아무 의미 없이 생각할 수도 있잖아

납득이: 그걸 아무 의미 없이 생각하는 그런 곰만도 못한 여자는 차라리 안 만나는게 나

부디 당신이 곰을 만나지 않기를 성부와 성자와...

비밀번호를 모른다고요? 그럼 꺼져

우리 모두 이렇게 배짱 부릴 수 있는 서비스의 주인공이 될 때까지 화이팅!

  

웹과 앱을 동시에 운영하는 서비스들은 계정 관리를 웹에서만 할 수 있을 때가 많다. 

물론 위 두 서비스들이 그런 경우인지는 확인 안해봄. 뿡야!