어제 방송한 남자의 자격을 보고 너무도 부끄러웠다. 국내 웹사이트의 잘못된 UI 설계를 너무도 생생하게 까발려주고 있어서이다. 나도 저런 사이트, 저런 화면을 만드는데 일조했구나 싶어 안타까운 마음이 밀려왔다. 아무 생각 없이 입력하도록 한 개인 정보, 너무나 많은 입력 항목, 사용자에게 잘못된 방식으로 피드백을 전달하는 화면. 잘못 설계한 웹페이지의 전형을 보는 듯 했다.
방송에서 이경규, 김태원, 김국진 이 세 분의 OB가 가장 많이 헤맨 지점을 되짚어보자.
1. 아이디를 꼭 받아야 하나?
회원 가입 페이지를 설계하려면 이것부터 물어봐야 한다. 우리 사이트에서 아이디를 꼭 받아야 하나? 어떤 이유로 아이디가 필요한가? 아이디를 받으면 그 정보를 어디에 쓸 건가? 아이디를 안받으면 어떤 문제가 생길까? 온라인 음원 사이트에서 아이디를 꼭 받아야 하는 이유를 생각해보자. [잠시 생각] 난 못찾겠다.
2. 아이디를 받았으면 됐지, 닉네임은 왜 받을까?
아이디를 받으면 많은 부분이 쉬워진다. 나도 안다. 그렇다면 아이디를 받은 후에 닉네임을 받는 이유는 뭘까? 왜 받을까? 김국진이 '적으라는 걸 다 안적으니까 이런 문제가 생기는거야!' 하고 외치던 게 생각난다. 닉네임을 받는 이유도 알려주지 않고 무조건 입력하라고만 한다. 닉네임을 꼭 받아야 하나? 받아야 한다면 그걸 꼭 회원 가입할 때 받아야 하나? 나중에 닉네임이 꼭 필요한 곳에서 받으면 안되나?
3. 아이디 중복 체크, 꼭 그 방식으로 해야 할까?
어제 방송의 절정은 아이디를 지을 때였다. 이미 사용중인 아이디가 있어 쓰지 못한다는 메시지와 이 아이디는 써도 된다는 메시지를 구분하지 못해 오랜 시간이 걸렸다. 메시지를 꼼꼼이 읽지 않은 세 명의 잘못인가? 아니다. 두 개의 메시지를 똑같은 글꼴로 똑같은 방식으로 전달한 설계가 잘못이다. 아이디를 받으면 중복 검사를 해야 한다는 점은 충분히 이해한다. 그러나 중복 검사를 하는 방법을 얼마든지 달리 구성할 수 있다.
우선 사용자가 아이디를 입력하는 순간 중복 여부를 판단해서 화면 상으로 알려주는 방법이 있다. 이 방법은 최근에 사용하기 시작했으니 방송에 나온 음원 사이트가 만들어진 시점에 적용하지 못했을 수는 있다. (이젠 알았으니 고쳐라!) 그러나 입력과 동시에 검사를 하지 않는다 하더라도 다른 방식으로 피드백을 줄 수 있다. 사용자가 중복 검사 버튼을 누른다. 이미 동일한 아이디가 사용중이라면, 중복 검사 결과 팝업창에 다시 아이디를 입력할 수 있도록 입력창을 넣어라. 이거 벌써 오래된 방법이다. 다들 그렇게 한다. 그리고 사용할 수 있는 아이디라면 '입력하신 아이디는 사용할 수 있습니다. [확인]' 형식으로 구성할 것이 아니라, '입력하신 아이디는 사용할 수 있습니다. 이 아이디를 사용하시겠습니까? [예]' 형식으로 구성해야 한다.
아이디를 사용할 수 없다는 메시지와 사용할 수 있다는 메시지가 동일한 글꼴에, 동일한 형태로 제공되니 초보자들이 당황할 수밖에. 메시지를 꼼꼼이 살펴보기 전에 쓱 봐도 차이를 구별할 수 있도록 디자인해야 한다.
4. 휴대전화 번호는 왜 받나?
말해 봐라. 휴대전화 번호를 왜 받나? 회원가입할 때 휴대전화 안받아도 된다. (아마 주소도 받을텐데, 정말이지 온라인 음원 사이트에서 주소를 받는 이유를 모르겠다. 마케팅 자료로 사용하는 것 외에 어디에 쓰나?) 휴대전화를 사용자가 입력하도록 하고 싶다면, 휴대전화 번호를 받는 이유를 같이 알려라. 소액 결제는 신용카드로 불가능할 수 있으니 휴대전화 결제를 위해 지금 입력해두면 좋다고 써라.
5. 체크안한 약관이 있다면 빠뜨린 부분을 알려줘라.
국내 서비스는 동의해야할 이용약관이 수두룩하다. 개인정보제공 동의부터 시작해 많은 사이트는 대여섯개도 된다. 이 많은 항목 중에 체크가 빠진 항목을 알림 메시지에 이름만 적어주면 안된다. 메시지창을 닫으면 틀린 부분을 표시하라. 어디에 체크가 빠졌는지 그 부분으로 화면을 되돌려주거나 그 부분의 글꼴색을 바꾸거나, 하여간 방법을 찾아라. 만약 약관 전부에 동의해야만 한다면 동의 버튼을 일일이 만들지 말고, 맨 마지막에 한 번만 넣어라. 사용자가 어느 부분에 체크를 안했는지 바로 알 수 있도록 하지 못하면 방송에서 본 것 같은 일이 생긴다. 동의해야 할 약관이 많으면 최소한 그거라도 제공해야 할 거 아닌가.
국내 사이트들은 하나 같이 회원 가입 시에 엄청난 양의 정보를 요구한다. 스타트업 기업이 운영하는 사이트들만 예외다. 규모가 큰 기업이 운영하는 규모가 큰 사이트일수록 많은 정보를 요구한다. 회원 가입은 사용자와 서비스가 만나는 접점 중 하나이며, 접점 중에서도 가장 중요한 부분이다. 가입을 포기하면 고객을 잃는다. 사용자는 까짓거 안쓰면 되지만, 서비스 제공자는 고객을 잃고 잠재 수익도 잃고 이미지도 잃는다. 아마도 김국진은 앞으로도 오랫 동안 온라인 서비스를 사용하지 않으리라 결심했을 터다. 잘못된 설계 때문에.
나도 지은 죄가 많다. 나도 별 생각 없이 그렇게 구성한 적도 많고, 알고도 고객의 고집을 꺾지 못해 그런 적도 많다. 그 사이트를 설계한 사람이 누구건 간에 본인의 의도와 달리 어쩔 수 없이 집어넣은 입력 항목도 있을 수 있다. 그렇다면 어제 방송을 윗분에게 보여줘라. 우리 사이트 사용자들이 이렇게 많은 정보를 입력하느라 사이트 가입을 포기한다고. 어제 방송에 등장한 그 음원 사이트는 아마 지금쯤 비상이 걸렸으리라 본다. 안걸렸으면 정말 문제 있는 거다. 그렇게 잘못된 설계가 많은데 그걸 극명하게 보고도 고치지 않는다면 문제가 커도 너무 크지.
어제 방송에선 그나마 액티브X는 안나왔다. 아마도 제작진이 미리 깔아놨을 걸로 짐작한다. 만약 그렇지 않았다면 음원을 구입해서 다운받을 때도 한바탕 소란이 일었을 거다. (벅스뮤직 말고 액티브X를 걷어낸 사이트가 또 있나?) 방송에서 아주 잠깐이지만, 그 음원 사이트의 이름을 검색엔진에서 타이핑하는 장면이 등장했다. 이름까지 나왔으니 잘못한 설계, 이제라도 고치길 간절히 바란다.
덧: 댓글로 소리바다도 액티브X를 사용하지 않는다는 제보가 왔습니다. 멜론 사용자 분 계시면 멜론은 어떤지 알려주세요~
방송에서 이경규, 김태원, 김국진 이 세 분의 OB가 가장 많이 헤맨 지점을 되짚어보자.
1. 아이디를 꼭 받아야 하나?
회원 가입 페이지를 설계하려면 이것부터 물어봐야 한다. 우리 사이트에서 아이디를 꼭 받아야 하나? 어떤 이유로 아이디가 필요한가? 아이디를 받으면 그 정보를 어디에 쓸 건가? 아이디를 안받으면 어떤 문제가 생길까? 온라인 음원 사이트에서 아이디를 꼭 받아야 하는 이유를 생각해보자. [잠시 생각] 난 못찾겠다.
2. 아이디를 받았으면 됐지, 닉네임은 왜 받을까?
아이디를 받으면 많은 부분이 쉬워진다. 나도 안다. 그렇다면 아이디를 받은 후에 닉네임을 받는 이유는 뭘까? 왜 받을까? 김국진이 '적으라는 걸 다 안적으니까 이런 문제가 생기는거야!' 하고 외치던 게 생각난다. 닉네임을 받는 이유도 알려주지 않고 무조건 입력하라고만 한다. 닉네임을 꼭 받아야 하나? 받아야 한다면 그걸 꼭 회원 가입할 때 받아야 하나? 나중에 닉네임이 꼭 필요한 곳에서 받으면 안되나?
3. 아이디 중복 체크, 꼭 그 방식으로 해야 할까?
어제 방송의 절정은 아이디를 지을 때였다. 이미 사용중인 아이디가 있어 쓰지 못한다는 메시지와 이 아이디는 써도 된다는 메시지를 구분하지 못해 오랜 시간이 걸렸다. 메시지를 꼼꼼이 읽지 않은 세 명의 잘못인가? 아니다. 두 개의 메시지를 똑같은 글꼴로 똑같은 방식으로 전달한 설계가 잘못이다. 아이디를 받으면 중복 검사를 해야 한다는 점은 충분히 이해한다. 그러나 중복 검사를 하는 방법을 얼마든지 달리 구성할 수 있다.
우선 사용자가 아이디를 입력하는 순간 중복 여부를 판단해서 화면 상으로 알려주는 방법이 있다. 이 방법은 최근에 사용하기 시작했으니 방송에 나온 음원 사이트가 만들어진 시점에 적용하지 못했을 수는 있다. (이젠 알았으니 고쳐라!) 그러나 입력과 동시에 검사를 하지 않는다 하더라도 다른 방식으로 피드백을 줄 수 있다. 사용자가 중복 검사 버튼을 누른다. 이미 동일한 아이디가 사용중이라면, 중복 검사 결과 팝업창에 다시 아이디를 입력할 수 있도록 입력창을 넣어라. 이거 벌써 오래된 방법이다. 다들 그렇게 한다. 그리고 사용할 수 있는 아이디라면 '입력하신 아이디는 사용할 수 있습니다. [확인]' 형식으로 구성할 것이 아니라, '입력하신 아이디는 사용할 수 있습니다. 이 아이디를 사용하시겠습니까? [예]' 형식으로 구성해야 한다.
아이디를 사용할 수 없다는 메시지와 사용할 수 있다는 메시지가 동일한 글꼴에, 동일한 형태로 제공되니 초보자들이 당황할 수밖에. 메시지를 꼼꼼이 살펴보기 전에 쓱 봐도 차이를 구별할 수 있도록 디자인해야 한다.
4. 휴대전화 번호는 왜 받나?
말해 봐라. 휴대전화 번호를 왜 받나? 회원가입할 때 휴대전화 안받아도 된다. (아마 주소도 받을텐데, 정말이지 온라인 음원 사이트에서 주소를 받는 이유를 모르겠다. 마케팅 자료로 사용하는 것 외에 어디에 쓰나?) 휴대전화를 사용자가 입력하도록 하고 싶다면, 휴대전화 번호를 받는 이유를 같이 알려라. 소액 결제는 신용카드로 불가능할 수 있으니 휴대전화 결제를 위해 지금 입력해두면 좋다고 써라.
5. 체크안한 약관이 있다면 빠뜨린 부분을 알려줘라.
국내 서비스는 동의해야할 이용약관이 수두룩하다. 개인정보제공 동의부터 시작해 많은 사이트는 대여섯개도 된다. 이 많은 항목 중에 체크가 빠진 항목을 알림 메시지에 이름만 적어주면 안된다. 메시지창을 닫으면 틀린 부분을 표시하라. 어디에 체크가 빠졌는지 그 부분으로 화면을 되돌려주거나 그 부분의 글꼴색을 바꾸거나, 하여간 방법을 찾아라. 만약 약관 전부에 동의해야만 한다면 동의 버튼을 일일이 만들지 말고, 맨 마지막에 한 번만 넣어라. 사용자가 어느 부분에 체크를 안했는지 바로 알 수 있도록 하지 못하면 방송에서 본 것 같은 일이 생긴다. 동의해야 할 약관이 많으면 최소한 그거라도 제공해야 할 거 아닌가.
국내 사이트들은 하나 같이 회원 가입 시에 엄청난 양의 정보를 요구한다. 스타트업 기업이 운영하는 사이트들만 예외다. 규모가 큰 기업이 운영하는 규모가 큰 사이트일수록 많은 정보를 요구한다. 회원 가입은 사용자와 서비스가 만나는 접점 중 하나이며, 접점 중에서도 가장 중요한 부분이다. 가입을 포기하면 고객을 잃는다. 사용자는 까짓거 안쓰면 되지만, 서비스 제공자는 고객을 잃고 잠재 수익도 잃고 이미지도 잃는다. 아마도 김국진은 앞으로도 오랫 동안 온라인 서비스를 사용하지 않으리라 결심했을 터다. 잘못된 설계 때문에.
나도 지은 죄가 많다. 나도 별 생각 없이 그렇게 구성한 적도 많고, 알고도 고객의 고집을 꺾지 못해 그런 적도 많다. 그 사이트를 설계한 사람이 누구건 간에 본인의 의도와 달리 어쩔 수 없이 집어넣은 입력 항목도 있을 수 있다. 그렇다면 어제 방송을 윗분에게 보여줘라. 우리 사이트 사용자들이 이렇게 많은 정보를 입력하느라 사이트 가입을 포기한다고. 어제 방송에 등장한 그 음원 사이트는 아마 지금쯤 비상이 걸렸으리라 본다. 안걸렸으면 정말 문제 있는 거다. 그렇게 잘못된 설계가 많은데 그걸 극명하게 보고도 고치지 않는다면 문제가 커도 너무 크지.
어제 방송에선 그나마 액티브X는 안나왔다. 아마도 제작진이 미리 깔아놨을 걸로 짐작한다. 만약 그렇지 않았다면 음원을 구입해서 다운받을 때도 한바탕 소란이 일었을 거다. (벅스뮤직 말고 액티브X를 걷어낸 사이트가 또 있나?) 방송에서 아주 잠깐이지만, 그 음원 사이트의 이름을 검색엔진에서 타이핑하는 장면이 등장했다. 이름까지 나왔으니 잘못한 설계, 이제라도 고치길 간절히 바란다.
덧: 댓글로 소리바다도 액티브X를 사용하지 않는다는 제보가 왔습니다. 멜론 사용자 분 계시면 멜론은 어떤지 알려주세요~
'웹과 모바일' 카테고리의 다른 글
| 양념통과 UI 기획 세미나 (0) | 2011.01.19 |
|---|---|
| 아이폰용 장갑 구입기 (0) | 2010.12.08 |
| 아이폰 3Gs 32GB를 샀다. 오늘은 2010년 10월 13일! (2) | 2010.10.13 |
| 야구심판과 유니버셜 디자인 (2) | 2010.10.08 |
| 아이폰4 예약 구매해서는 보험 처리 받을 수 없다 (6) | 2010.10.01 |
