로그인, 회원가입, 그리고 비밀번호: UX 가이드
UX Login, Register and Password UX
다음은 아래 글에 대한 번역입니다.
https://uxplanet.org/ux-login-register-and-password-the-ultimate-design-guide-f18b1932ee84
오늘은 디자이너들이 자주 겪게 되는 문제들에 대해 탐구해보려 합니다. 바로 로그인, 회원가입, 그리고 잊어버린 비밀번호 복구에 대한 ux죠. 이 문제들은 페이지 이탈률 뿐만 아니라 페이지 전환에도 막대한 영향력을 행사합니다.
여러분이 고려해야 할 두 가지가 있습니다.
첫째, 사용자들의 정보가 중요하게 작용하는 커머스 계열의 웹사이트.
둘째, 사용자들의 정보가 선택적으로 사용되는 웹사이트 또는 애플리케이션.
로그인과 회원가입의 ux는 항상 고통스럽습니다. 누구도 빈칸을 채우고, 이메일을 체크하며 인증받고, 조건에 부합하는 새로운 비밀번호를 만들면서 새로운 사이트에 가입하는 것을 좋아하지 않습니다.
회원가입 당시에 사용한 비밀번호를 까먹은 적이 있나요? 저는 그런 적이 정말 많았고, 그때마다 비밀번호를 복원해야 했습니다.
로그인과 회원가입에서의 ux는 컴퓨터에서보다 모바일 환경에서 더욱 고통스럽습니다. 왜냐하면 사용자들은 이메일을 확인받기 위해 앱을 전환하거나, 특수문자나 대문자를 찾기 위해 키보드를 전환해야 하기 때문입니다.
뮌헨 대학에서 진행된 연구에 따르면, 모바일 환경에서 사람들은 컴퓨터에서보다 비밀번호를 입력하는데 두 배의 시간을, 그리고 컴퓨터에서보다 보안이 약한 비밀번호를 만든다고 합니다.
회원가입 ux를 개선하기
1. 회원가입을 통한 이점을 사용자들에게 알려주기
회원가입을 통해 사용자들이 얻는 게 무엇인가요? 사용자들은 회원가입으로 어떤 이득을 볼 수 있나요? 다음은 그 예시입니다.
2. 회원가입을 대신할 수 있는 방법들 제시하기
이것은 좀 더 빠르게 회원 가입할 수 있는 방법입니다. 소셜 로그인이나 구글 로그인을 사용하세요.
타이핑하고 비밀번호를 기억하는 걸 피하는 건, 회원가입 ux를 매끄럽게 만드는 훌륭한 방법입니다. 이메일과 비밀번호를 입력하는 기본적인 방법을 선호하는 사용자들이 있어도 말이죠.
3. 입력할 내용은 최소한으로
적을수록 좋습니다. ux의 관점에서 봤을 때, 이메일과 비밀번호 정도만 물어보는 것이 적절합니다.
이 단계에서는 성별, 생일과 같은 당장은 필요 없는 정보들에 대해 묻지 않는 것이 좋습니다. 이런 정보들은 사용자들이 프로필 페이지에서 추가할 수 있으니, 나중에 언제든 물어보면 됩니다.
4. 입력창을 반복시키지 않기
회원가입에 있는 입력창을 제발 반복하지 마세요. 예를 들어, 비밀번호를 다시 입력하게 하거나 이메일을 두 개 입력하는 것처럼 말이죠.
5. 회원가입 인증을 이메일을 통해 하지 않기
이 단계는 매우 중요합니다.
어떤 기업들에게는 플랫폼에서 사용자들을 인증하는 것이 중요할 수 있습니다.
일단은 가입 후에 모든 기능을 정상적으로 사용할 수 있고, 나중에 언제든지 이메일을 통해 인증할 수 있는 방법을 고려하세요. 이메일을 통한 인증은 가입 다음날에도 진행할 수 있습니다.
반드시 지금 인증이 필요하다면, 앱 전환이 필요하지 않은 다른 방법들을 사용하세요. 좋은 사례로 sms를 통한 인증이 있습니다. sms를 통해 인증 시, 사용자들은 앱을 전환하거나(모바일) 창을 전환할 필요 없이(컴퓨터), 타이핑을 통해 쉽게 인증을 마칠 수 있습니다.
흐름을 전환하는 건 ux에 치명적인 습관입니다. 사용자들이 방향감각을 잃게 되면 서비스의 장벽을 높이게 되며, 이는 결국 서비스가 제공하고자 하는 ux를 주지 못하는 결과를 초래합니다.
비밀번호 ux 개선하기
비밀번호 ux를 개선하는 것은, 제가 다른 주제들과 분리해서 다루고 싶은 주제입니다. ux에서 비밀번호는 매우 고통스럽기 때문이죠.
6. 지나치게 많은 보안 조건을 피하기
"안전한"비밀번호를 만드느라 지쳐본 적이 있나요? 특수문자나 숫자가 "자주 쓰는"비밀번호에 없어서, 그 비밀번호를 사이트에서 사용하지 못한 적이 있나요?
오늘날 보안은 웹사이트에서 정말 중요하다고 생각합니다. 50여 개의 웹사이트를 조사해본 결과, 90%의 웹사이트에서는 오직 2-3개의 보안 조건을 사용 중이었으며, 작년 동안 보안 문제도 없었습니다.
저는 아래 내용 중 오직 2-3개의 보안 규칙을 사용하라고 권하고 싶습니다. 다 사용하라는 게 절대 아닙니다.
비밀번호에 숫자 포함
비밀번호에 대문자 포함
비밀번호에 특수문자 포함
8자리 이상의 비밀번호
반복 없는 비밀번호
선(-,–,—,_) 없는 비밀번호
7. 비밀번호 보기/감추기 기능 제공하기
이 기능을 제공하는 것은 ux에 긍정적입니다. 사용자는 비밀번호를 타이핑하면서 볼 수 있기 때문에, 실수를 덜 하게 됩니다.
8. 비밀번호를 두 번 쓰지 않게 하기
앞에서도 말했듯, 같은 내용을 반복하게 하지 마세요.
9. 비밀번호 강도 그래프 보여주기
요즘엔 비밀번호 관련 ux를 개선시킬 수 있고, 손쉽게 웹사이트에 적용할 수 있는 심플한 스크립트가 많습니다.
이 스크립트를 통해서 사용자들은 실시간으로 자신의 비밀번호 보안을 시각 정보와 함께 확인할 수 있습니다(예를 들어 초록> 노랑> 빨강 순으로 말이죠).
10. 비밀번호 조건을 미리 제시하고, 실시간으로 상황 보여주기
Mailchimp가 잘 해내고 있습니다. 마음에 들어요.
로그인 ux를 개선하기
로그인 ux를 개선하는 것이 이 글의 마지막 부분입니다.
11. 소셜 로그인 사용하기
이건 소셜 회원가입과 동일한 생각입니다.
12. 지문인식을 통해 로그인할 수 있게 하기
이 방식으로 로그인에서 발생하는 고통을 덜어낼 수 있습니다. 시중에 사용되는 스마트폰의 80%가 지문인식을 지원하기에 로그인을 터치아이디로 진행할 수 있습니다.
13. 비밀번호 보기/숨기기 기능 제공하기
회원가입에서와 동일한 생각입니다. 다만 비밀번호를 보이게끔 하는 게 기본 설정이 될 필요는 없습니다. 사용자가 보안상 안전하지 못하다고 느낄 수 있기 때문이죠.
저는 평범하게 비밀번호를 "*"로 표기하고, 비밀번호를 보이게 할지 말지는 사용자가 결정하게 두길 권장합니다.
14. "비밀번호가 기억이 안 나시나요"링크 주변에 두기
가끔씩 비밀번호를 까먹기 때문에, 비밀번호를 복원할 수 있는 링크가 전체 로그인 과정에 있어야 합니다.
이건 비밀번호 복원 과정이 진행되어야 할 최선의 방법입니다.
15. 비밀번호 없이 로그인하기
몇몇 혁신적인 기업에서는 비밀번호 입력 없이 로그인하는 방법을 시도 중입니다.
그런데 그걸 어떻게 하는 걸까요? 여기 몇 가지 예시가 있습니다.
sms 인증번호 활용하기, twilio
사용자가 타이핑을 원하지 않을 때, 몇 가지 대안을 제시하기: slack의 매직링크가 좋은 예시입니다. autho를 통해 웹사이트에 이 기능을 통합시킬 수 있습니다.
생채 인증을 통한 인증: 아마도 이 글에서 가장 혁신적인 부분이라 생각됩니다. 로그인/회원가입 ux의 미래가 될 것이라 확신합니다. 몇 가지 예시로 얼굴인식, 음성인식, 지문인식, 홍채인식, 손인식 등이 있습니다.
요약
로그인/회원가입에 최상의 사용자 경험을 생각해서 웹사이트에 적용하세요.
커머스 서비스라면 게스트 로그인을 고려해보세요.
모바일 우선의 서비스라면 최대한의 정보를 요구하고 단순화하세요.
사용자들에게 회원가입으로 얻을 수 있는 이점을 알려주세요.
소셜 로그인과 회원가입을 사용하세요.
가입에 필요한 내용은 필수적인 내용만 넣으세요.
반복된 입력란을 사용하지 마세요(비밀번호 확인란 등).
사용자를 인증할 수 있는 다른 대안책을 고려해보세요(sms 인증, 이메일 등).
비밀번호 ux를 개선하세요: 너무 많은 조건을 두지 마세요. 그리고 조건들을 미리 알려주세요. 비밀번호 보기/가리기 옵션을 제공하세요. 비밀번호를 두 번 물어보지 마세요. 보안 강도를 보여주세요.
다른 로그인 방법을 제공하세요: 생체 인증을 통한 로그인 등 여러 가지 다른 로그인 방법들을 활용하세요.
