Skip to Content
Go Back
안형우

안녕하세요. 14년차 풀스택 웹개발자 안형우입니다. 이 블로그에서는 WordPress, PHP, CSS, 사용성, 리눅스 서버 등 풀스택 웹개발에서 마주하는 다양한 문제 상황과 해결책, 필요한 개념들을 다룹니다. 👉 소개


작업물

📌 CSS가 어려운 이유 — 프로젝트 중심 실전 CSS 강의 소개 2023-04-13
📌 워드프레스, 답답한 빌더와 플러그인 대신 시원하게 커스터마징하기(강의) 2023-01-15
📌 아무도 말하지 않는 PHP의 좋은 점 2018-10-13
📌 유지보수하기 쉬운 CSS 전략(슬라이드) 2016-12-20
📌 워드프레스 테마에서 템플릿 파일 매칭 순서 2013-05-12
📌 [번역] CSS 코드 냄새 2013-01-01

월스트리트 저널이 모바일 앱 사용자 리뷰에서 별표를 2개밖에 못 얻은 이유 by Jacob Nielson

오늘 제이콥 닐슨의 useit에서 재밌는 메일이 날아왔다.(난 메일링 리스트 등록자다.)

제목은 “Why WSJ Mobile App Gets ** Customer Reviews”(왜 월스트리트저널 모바일 앱은 사용자 리뷰에서 별을 두 개밖에 못 받았을까?)였다.

모바일에도 관심이 많고, 사용성에도 관심이 많으니 당연히 읽어 봤다.

(여기부터는 내가 읽고 이해한 바를 그대로 옮긴 것이다. 닐슨의 글을 내가 해설하는 거라고 설명하면 된다. 그래서 닐슨의 글보다 짧다. 그리고 당연히 영어를 잘못 읽어서 잘못 이해한 게 있을 수 있다.)

첫 화면을 제대로 구성하지 못하면 망한다

핵심은 사용자를 혼란스럽게 하는 첫 화면이었다.

현재 월스트리트 저널 아이폰 앱의 첫 화면인데, “2주 간 무료입니다. 서둘러 구독하세요!” 하는 메세지가 화면의 2/3를 차지하고 있다.

기존 온라인 구독자들은 이 화면을 보고 분개한 것이다. “왜 같은 기사에 돈을 두 번 내야 하냐?!” 하는 게 이 앱이 저평가를 받은 가장 큰 이유였다. 가장 많은 추천을 받은 리뷰 세 개가 모두 이런 내용이었다. 이 리뷰들은 전부 별표 하나였다.

사용자들은 로그인이라는 버튼을 거의 보지 못했다. 사용자 리뷰에 별이 두 개밖에 없는 게 그걸 증명한다. (68,418개 리뷰가 있었는데 그 중 4만 명이 별 한 개를 줘야 평균 별 두 개가 된다.)

월스트리트 저널은 왜 이렇게 했을까?

그럼 월스트리트 저널처럼 유능한 신문사가 왜 이런 실수를 한 것일까?

아마도 기존 구독자는 새로운 돈을 벌게 해 주는 게 아니니까 새 구독자에 완전히 방점을 찍기 위해 이런 디자인을 낸 듯하다.

그러나 이건 완전히 실수다.

왜냐?

같은 기사에 돈을 두 번 내게 만드는 것처럼 보이면 얄팍한 상술을 쓰는 걸로 보일 수 있다. 이건 브랜드 가치를 저하시켜 장기적으로는 피해를 준다.

그러면서 제이콥 닐슨은 이런 조언을 한다.

신문은 인터넷 시대에 살아남기 위해 두 가지 원칙을 가져야만 한다. 이것은 피할 수 없다.

신뢰성을 유지하라: [돈을 지불하면서까지 신문을 보는 충성도 높은 독자는] 구글 같은 데서 아무 사이트나 보는 사람들보다 훨씬 더 존중받아야 한다.

– 충성도 높은 독자들과 깊은 관계를 유지하라, 그래서 시중에 널린 콘텐트 수집기를 이용하기보다 신문을 가장 먼저 보도록 만들어라.[역자 주: paper라고 써 있어서 ‘신문’으로 번역했다. 온라인 신문을 말하는 데서 종이신문을 말할 까닭이 없다고 생각해서다.]

구체적으로 어떻게 하라는 건지 조언이 있었다면 좋았겠지만, 여튼 닐슨은 “하지 마라”를 강조했다. 월스트리트 저널의 전략은 장기적으로 브랜드 가치를 하락시키는 방법이라는 거다.

충성도 높은 독자가 부당한 대우를 받았다고 느끼게 되면 브랜드 가치는 급락(dive)한다고 말하면서 말이다.

대안

그러면서 대안 디자인을 내놓는데 이것도 대박이다.

이 디자인에 대해 이렇게 설명한다.

  • 세 가지 시나리오를 명확히 제시해서 혼란을 없앴다.
  • 버튼을 나란히 배치해서 독자들이 못 보고 지나치게 될 가능성을 줄였다.
  • 단어의 모호성을 제거해 첫 화면에서 보게 되는 옵션을 줄였다.

[세 번째 항목에 대한 내 생각 – Register와 Subscribe, Log in 이라는 세 옵션은 의미가 분명치 않아서 사용자들을 혼란스럽게 한다. Login과 Register만 남기고, 위쪽 표에는 구체적인 단어로 설명을 붙였다는 말인 것 같다]

대박. 이런 배치를 보고서 혼란을 느끼면 그제서야 사용자의 잘못이 될 거라고 본다.

주당 1.99$라고 쓰지 않고 연간 103.48$라고 쓴 이유는

그리고 몇 가지 설명을 덧붙이는데, 첫째, 왜 주당 1.99$라고 쓰지 않고 연간 103.48$라고 썼는지다.

내가 가져오지 않은 그림이 있는데 정기구독 버튼을 눌렀을 때 이동하게 되는 웹페이지였다. 여기엔 주당 1.99$라고 씌어 있었다.

닐슨이 새로 제시한 페이지에 103.48$라고 씌어 있는 걸 보고 나도 좀 이상하다고 생각했는데 바로 설명이 나왔다.

어차피 카드에서 최종 결제는 103.48$로 하게 되는데 주당 1.99$라고 표시하면 사용자들이 배신감을 느끼게 된다는 거다.

혹여라도 사용자가 주당 1.99$가 결제될 거라고 생각하고 구독을 하게 되면 콜센터에 불이 날 거라는 조언도 했다. 콜센터 운영 방식은 기업 수익에 큰 영향을 준다고 덧붙이면서 말이다.

전화번호를 제거할까도 생각했지만…

이어지는 다음 설명. 전화번호를 굳이 밖으로 꺼내 놓은 이유는 신뢰성 때문이라고 했다.

또한 모바일 사용자들은 어떤 앱에 자기 신용카드 정보를 입력하는 걸 꺼리는 경향이 있기 때문이기도 하다. 그래서 전화 구독할 가능성이 여전히 꽤 된다는 거다.

폐기한 디자인에 대한 설명

닐슨은 이런 디자인도 생각해 봤는데 폐기했다.

기존 온라인 유료 사용자에게는 매우 편한 디자인이지만, 이 디자인의 약점은 새 구독자다.

뭔가 입력창이 있으면 그건 엄청나게 강조된다고 한다. 새로 구독을 하는 사람들은 아래쪽에 있는 ‘제한된 무료 사용’과 ‘정기 구독’ 버튼을 봐야 하는데, 위쪽에 입력창이 있으면 그걸 못 보게 될 가능성이 크다는 거다.

또한 모바일은 화면이 작은 데도 불구하고 여전히 사람들은 위쪽만 보는 경향이 있다고 한다.

앞서 제안한 화면에서 유료 구독자는 로그인 버튼을 누른 다음 로그인 창을 만나게 될 것이다. 즉, 로그인을 위해 한 번 클릭을 더 해야 하는 거다.

하지만, 중요한 건 클릭 횟수가 아니라 사용자가 들이는 시간이다. 클릭 몇 번을 하더라도 명료한 흐름만 있다면 큰 문제는 없다.

또, 이건 보안 등급이 높은 앱이 아니기 때문에 아이디 비번 저장을 할 수 있도록 하면 두 번째 사용부터는 로그인창으로 갈 필요가 없으므로 별 문제가 안 된다. 누가 핸드폰을 훔쳐서 공짜로 월스트리트 저널을 읽는다고 해도 사용자에게 별로 피해가 아니다.

그래서, 기존 유료 구독자에게는 유리한 디자인임에도 불구하고, 이 디자인을 추천하지 않는다고 밝혔다.

닐슨의 이 글을 읽으면서 느낀 점

첫째는, 월스트리트 저널 같은 유명한 신문사의 디자인 실수를 바로 콕 집어내서 자신들의 가치를 높이는 전략을 구사하는 게 정말 대단해 보였다.

닐슨의 이번 글은 특별히 길었는데, 이걸 통해 자신들의 장점을 정말로 확실히 보여 준 것이다. 월스트리트 저널의 실수가 워낙 전형적이고 명백한 것이었으므로 닐슨의 장점을 보여 주는 데 정말 효과적인 소재였다.

자신들의 대안 디자인을 내놓은 것도, 워낙 훌륭한 재디자인이라서 감탄했지만, 더 감탄했던 것은 자신들이 폐기한 디자인을 보여 주면서 설명을 한 것이었다.

자신들이 이 재디자인을 위해 꽤 많은 노력을 기울이고 여러 옵션을 고려했다는 것을 증명하는 것이기 때문이다.

폐기한 디자인을 설명하는 걸 본 사람이라면, ‘아, 폐기한 디자인이 꽤 많이 있겠구나. 신경 많이 썼네’ 하는 느낌을 받을 것이다.

닐슨은 거대 신문사의 실수를 바탕으로 우호적인 조언을 하면서 자신의 가치를 확실히 빛냈다. 뭘 좀 아는 사람이다.

그리고 배울 점도 많은 것 같다. 특히 나는 신문 웹사이트를 관리하니까, 꽤 가치있는 글이었다.

앞으로도 열심히 봐야지.

안녕하세요. 14년차 풀스택 웹개발자 안형우입니다. 이 블로그에서는 WordPress, PHP, CSS, 사용성, 리눅스 서버 등 풀스택 웹개발에서 마주하는 다양한 문제 상황과 해결책, 필요한 개념들을 다룹니다. 👉 소개


작업물

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다