남자의 자격을 보고 부끄러워진 웹기획자

웹과 모바일 2010.11.01 20:12
어제 방송한 남자의 자격을 보고 너무도 부끄러웠다. 국내 웹사이트의 잘못된 UI 설계를 너무도 생생하게 까발려주고 있어서이다. 나도 저런 사이트, 저런 화면을 만드는데 일조했구나 싶어 안타까운 마음이 밀려왔다. 아무 생각 없이 입력하도록 한 개인 정보, 너무나 많은 입력 항목, 사용자에게 잘못된 방식으로 피드백을 전달하는 화면. 잘못 설계한 웹페이지의 전형을 보는 듯 했다.

방송에서 이경규, 김태원, 김국진 이 세 분의 OB가 가장 많이 헤맨 지점을 되짚어보자.

1. 아이디를 꼭 받아야 하나?

회원 가입 페이지를 설계하려면 이것부터 물어봐야 한다. 우리 사이트에서 아이디를 꼭 받아야 하나? 어떤 이유로 아이디가 필요한가? 아이디를 받으면 그 정보를 어디에 쓸 건가? 아이디를 안받으면 어떤 문제가 생길까? 온라인 음원 사이트에서 아이디를 꼭 받아야 하는 이유를 생각해보자. [잠시 생각] 난 못찾겠다.

2. 아이디를 받았으면 됐지, 닉네임은 왜 받을까?

아이디를 받으면 많은 부분이 쉬워진다. 나도 안다. 그렇다면 아이디를 받은 후에 닉네임을 받는 이유는 뭘까? 왜 받을까? 김국진이 '적으라는 걸 다 안적으니까 이런 문제가 생기는거야!' 하고 외치던 게 생각난다. 닉네임을 받는 이유도 알려주지 않고 무조건 입력하라고만 한다. 닉네임을 꼭 받아야 하나? 받아야 한다면 그걸 꼭 회원 가입할 때 받아야 하나? 나중에 닉네임이 꼭 필요한 곳에서 받으면 안되나?

3. 아이디 중복 체크, 꼭 그 방식으로 해야 할까?

어제 방송의 절정은 아이디를 지을 때였다. 이미 사용중인 아이디가 있어 쓰지 못한다는 메시지와 이 아이디는 써도 된다는 메시지를 구분하지 못해 오랜 시간이 걸렸다. 메시지를 꼼꼼이 읽지 않은 세 명의 잘못인가? 아니다. 두 개의 메시지를 똑같은 글꼴로 똑같은 방식으로 전달한 설계가 잘못이다. 아이디를 받으면 중복 검사를 해야 한다는 점은 충분히 이해한다. 그러나 중복 검사를 하는 방법을 얼마든지 달리 구성할 수 있다.

우선 사용자가 아이디를 입력하는 순간 중복 여부를 판단해서 화면 상으로 알려주는 방법이 있다. 이 방법은 최근에 사용하기 시작했으니 방송에 나온 음원 사이트가 만들어진 시점에 적용하지 못했을 수는 있다. (이젠 알았으니 고쳐라!) 그러나 입력과 동시에 검사를 하지 않는다 하더라도 다른 방식으로 피드백을 줄 수 있다. 사용자가 중복 검사 버튼을 누른다. 이미 동일한 아이디가 사용중이라면, 중복 검사 결과 팝업창에 다시 아이디를 입력할 수 있도록 입력창을 넣어라. 이거 벌써 오래된 방법이다. 다들 그렇게 한다. 그리고 사용할 수 있는 아이디라면 '입력하신 아이디는 사용할 수 있습니다. [확인]' 형식으로 구성할 것이 아니라, '입력하신 아이디는 사용할 수 있습니다. 이 아이디를 사용하시겠습니까? [예]' 형식으로 구성해야 한다.

아이디를 사용할 수 없다는 메시지와 사용할 수 있다는 메시지가 동일한 글꼴에, 동일한 형태로 제공되니 초보자들이 당황할 수밖에. 메시지를 꼼꼼이 살펴보기 전에 쓱 봐도 차이를 구별할 수 있도록 디자인해야 한다.

4. 휴대전화 번호는 왜 받나?

말해 봐라. 휴대전화 번호를 왜 받나? 회원가입할 때 휴대전화 안받아도 된다. (아마 주소도 받을텐데, 정말이지 온라인 음원 사이트에서 주소를 받는 이유를 모르겠다. 마케팅 자료로 사용하는 것 외에 어디에 쓰나?) 휴대전화를 사용자가 입력하도록 하고 싶다면, 휴대전화 번호를 받는 이유를 같이 알려라. 소액 결제는 신용카드로 불가능할 수 있으니 휴대전화 결제를 위해 지금 입력해두면 좋다고 써라.

5. 체크안한 약관이 있다면 빠뜨린 부분을 알려줘라.

국내 서비스는 동의해야할 이용약관이 수두룩하다. 개인정보제공 동의부터 시작해 많은 사이트는 대여섯개도 된다. 이 많은 항목 중에 체크가 빠진 항목을 알림 메시지에 이름만 적어주면 안된다. 메시지창을 닫으면 틀린 부분을 표시하라. 어디에 체크가 빠졌는지 그 부분으로 화면을 되돌려주거나 그 부분의 글꼴색을 바꾸거나, 하여간 방법을 찾아라. 만약 약관 전부에 동의해야만 한다면 동의 버튼을 일일이 만들지 말고, 맨 마지막에 한 번만 넣어라. 사용자가 어느 부분에 체크를 안했는지 바로 알 수 있도록 하지 못하면 방송에서 본 것 같은 일이 생긴다. 동의해야 할 약관이 많으면 최소한 그거라도 제공해야 할 거 아닌가.

국내 사이트들은 하나 같이 회원 가입 시에 엄청난 양의 정보를 요구한다. 스타트업 기업이 운영하는 사이트들만 예외다. 규모가 큰 기업이 운영하는 규모가 큰 사이트일수록 많은 정보를 요구한다. 회원 가입은 사용자와 서비스가 만나는 접점 중 하나이며, 접점 중에서도 가장 중요한 부분이다. 가입을 포기하면 고객을 잃는다. 사용자는 까짓거 안쓰면 되지만, 서비스 제공자는 고객을 잃고 잠재 수익도 잃고 이미지도 잃는다. 아마도 김국진은 앞으로도 오랫 동안 온라인 서비스를 사용하지 않으리라 결심했을 터다. 잘못된 설계 때문에.

나도 지은 죄가 많다. 나도 별 생각 없이 그렇게 구성한 적도 많고, 알고도 고객의 고집을 꺾지 못해 그런 적도 많다. 그 사이트를 설계한 사람이 누구건 간에 본인의 의도와 달리 어쩔 수 없이 집어넣은 입력 항목도 있을 수 있다. 그렇다면 어제 방송을 윗분에게 보여줘라. 우리 사이트 사용자들이 이렇게 많은 정보를 입력하느라 사이트 가입을 포기한다고. 어제 방송에 등장한 그 음원 사이트는 아마 지금쯤 비상이 걸렸으리라 본다. 안걸렸으면 정말 문제 있는 거다. 그렇게 잘못된 설계가 많은데 그걸 극명하게 보고도 고치지 않는다면 문제가 커도 너무 크지.

어제 방송에선 그나마 액티브X는 안나왔다. 아마도 제작진이 미리 깔아놨을 걸로 짐작한다. 만약 그렇지 않았다면 음원을 구입해서 다운받을 때도 한바탕 소란이 일었을 거다. (벅스뮤직 말고 액티브X를 걷어낸 사이트가 또 있나?) 방송에서 아주 잠깐이지만, 그 음원 사이트의 이름을 검색엔진에서 타이핑하는 장면이 등장했다. 이름까지 나왔으니 잘못한 설계, 이제라도 고치길 간절히 바란다.

덧: 댓글로 소리바다도 액티브X를 사용하지 않는다는 제보가 왔습니다. 멜론 사용자 분 계시면 멜론은 어떤지 알려주세요~
  • 지나다가 2010.11.05 11:33 신고 ADDR 수정/삭제 답글

    1번의 아이디 문제는 어떠한 형태로든 한명의 고객을 구분하기 위한 수단이자 key로, 어떤 형태가 되었든 아이디라는건 필요합니다. 꼭 DB설계상의 이슈가 아니라 하더라도, 결재정보나 어떤 음악을 샀는지에 대한 정보등을 고객을 구분할 한개의 아이디에는 반드시 매칭을 해야될거기때문에 어쩔수가 없긴하지요.. 다른 항목에 대해서는 대부분 동의합니다

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.05 15:28 신고 수정/삭제

      맞습니다. 고객을 구분하기 위해 당연히 필요하지요. 댓글을 다신 분이 제 질문에 대한 답은 이미 하신 것으로 보여요. '어떤 형태가 되었든 아이디가' 필요한 것이지, 반드시 6글자 이상의 알파벳, 숫자의 조합으로 아이디를 만들 필요는 없는 거지요.

      제 질문은 그거에요. 고객을 구분하기 위해 이미 주민등록번호까지 체크했습니다. 그렇다면 굳이 아이디를 문자열로 입력하는 방식이 아니라, 이메일로 대체(이미 많이 하죠)하거나, 랜덤한 이미지를 보여줘서 고르게 하거나 하여간 대안은 있어요. 굳이 아이디를 입력해서 중복체크를 하는 방식 말고도 유일한 값으로 해당 회원을 구분할 수 있죠.

  • pighair 2010.11.05 11:51 신고 ADDR 수정/삭제 답글

    공감합니다. 그리고 소리바다는 액티브엑스 없이 맥에서 이용할 수 있습니다. 다운로더를 Air로 제공하거든요.

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.05 15:07 신고 수정/삭제

      아. 소리바다도 액티브X를 걷어냈군요. 이거 참 반가운 소식입니다. 저는 벅스만 사용해서 몰랐어요.

  • Favicon of http://blog.kangjang.net BlogIcon 건더기 2010.11.05 12:11 신고 ADDR 수정/삭제 답글

    제가 트위터에도 이전에 썼던 화두인데, "외국 사이트 가입시 소요시간= 최대 30초. 한국 사이트 가입시 소요시간= 평균 5분" ....

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.05 15:14 신고 수정/삭제

      서비스 공급자의 욕심을 걷어내야 합니다. 예전에 제가 쇼핑몰을 구축할 때 회원가입을 최소화하려고 무진 애를 쓴 적이 있어요. 주소, 전화번호 다 안받고. 처음엔 동의하던 고객 담당자가 며칠 후에 '지역 정보가 필요하니 주소, 전화번호를 받아야겠다'고 말을 바꾸더군요.

      쇼핑몰은 상품 주문을 할 때가 되면 넣지 말라고 해도 주소를 넣습니다. 그러니 굳이 가입할 때 주소를 받을 필요가 없다는 게 제 생각이었죠. 그러나 고객은 실제 주소와 배송지는 다르다는 이유로 주소정보를 받아야 한다고 주장을 굽히지 않았습니다. 맞는 말입니다만, 그럼 실제 주소를 받아서 어디다 쓸까요... 다 욕심이죠.

  • Favicon of http://twitter.com/17sai BlogIcon Silver 2010.11.06 14:18 신고 ADDR 수정/삭제 답글

    현재 NC에서 서비스중인 24hz도 IE외 다른 브라우저로 음악 다운이 가능하더라구요..

    덕분에 크롬으로 잘쓰고 있습니ㅏㄷ.

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.06 20:52 신고 수정/삭제

      아아. 액티브X를 사용하지 않은 음원 사이트가 많군요! 반가운 일입니다.

  • me2 2010.11.06 15:40 신고 ADDR 수정/삭제 답글

    미투데이는 sns인데, 왜 글을 보려면 가입이 필요한걸까요;

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.06 20:53 신고 수정/삭제

      미투데이는 초창기 이후 잘 사용하지 않아서 기억이 안나는데, 글을 보려면 로그인을 해야 하나요? 그건 좀 자살행위인 듯;;

    • Favicon of http://science.binote.com BlogIcon goldenbug 2010.11.06 23:54 신고 수정/삭제

      미투데이도 로그인하지 않고 볼 수 있습니다. 다만 무지 복잡하고 힘들게 만들어서 누구나 다들 포기하죠. -_-'''
      원래 초기 미투데이는 쉬웠지만, 나중에 점점 어려워지더군요. -_-;

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.07 13:14 신고 수정/삭제

      NHN이 인수한 이후 변화가 있었나요.. 음.

  • 좋은 글에 공감합니다. 저도 요즘 서비스를 하나 기획하면서 고민이 많은데 좋은 공부가 될 것 같습니다. 즐거운 주말 되세요.

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.07 13:14 신고 수정/삭제

      감사합니다. 멋진 서비스 만드시길.

  • 공감공감 2010.11.09 17:08 신고 ADDR 수정/삭제 답글

    Daum자료실 같은 경우 참 독특합니다. IE를 쓰면 다운로드용 ActiveX를 설치합니다. 크롬이나 다른 브라우저를 쓰면 그냥 http로 다운로드 하고요. 이왕 만들어놓은 ActiveX를 버리기 아까워서 그러는 걸까요? 여러 브라우저를 사용하는 사용자들은 헤메기 일쑤인데 고치질 않더군요.

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.11.10 18:09 신고 수정/삭제

      다음, 네이버 모두 심파일을 통해 자료실 서비스를 하는데요, 심파일 역시 똑같거든요. 아마 그래서 그런게 아닐까 싶은데, 심파일이 그렇게 하는 이유는... 궁금하네요.

  • Favicon of http://kraze.tistory.com/ BlogIcon 모르겐 2010.12.05 04:08 신고 ADDR 수정/삭제 답글

    정말 원하는 정보가 너무 많은 것 같습니다.
    종교 적어내라고 하지 않는 거 보면 신기할 정도죠...
    개인의 프라이버시권에 대한 한국만의 이상한 풍조가 만들어낸 양식이 아닐까란 생각도 듭니다.
    한국 사람들... "애는 몇명이에요? "결혼 하셨어요?" 이런 질문 아무렇지 않게 하잖아요....

    • Favicon of http://thinkofweb.net BlogIcon mindfree 2010.12.06 19:48 신고 수정/삭제

      흠.. 개인적인 질문을 아무렇지 않게 많이 하는 문화와 연결될 수도 있다는 생각은 못했네요.. 다른 이유(마케팅 측면, 주민등록번호와 실명인증을 강제하는 규정 등)도 있겠지만 말씀하신 관점도 생각해볼 수 있겠습니다.