brunch

매거진 디자인 뉴스레터 디독

라이킷 17 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 김자유 Jan 18. 2020

방금 만든 CTA 버튼, 카피도 신경 썼나요?

*본 글은 디자인 뉴스레터 디독에서 발행한 글입니다.

해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv

디독

page.stibee.com

책 보러 가기

사용자의 행동을 이끌어내는 마이크로카피 만들기

‘이 카피로는 잘 안 와 닿는 것 같은데-,
이렇게 쓰면 잘 알아듣지 않을까?’

갑자기 무슨 말인가 싶으시죠?

한 에이전시의 조용한 사무실 안, 매 번 새로운 웹사이트 제작에 착수할 때마다 제 머릿속에서 왕왕대는 혼잣말입니다. 디자인하기도 바쁜데 웬 카피를 고민하고 있냐 싶으신 분들도 있겠죠. 네-! 물론 일정에 맞춰 자체적으로 원고를 작성해서 보내주시는 고객분들도(...사실 원활히 수급이 안 되는 경우가 더 많고요. 공감?) 있지만...

소개나 연혁과 같은 정보성 원고만 수급되는 경우가 대부분인 데다- 간혹 문의하기와 같은 제품 및 서비스의 사용 플로우에 대한 부분까지 원고가 수급됐다길래 살펴보면, ‘문의'라는 타이틀 하나와 ‘궁금한 사항이 있다면 남겨주세요.’와 같은 딱딱한 서브 카피가 전부죠. 이런 상황에 도움 되는 저만의 비기(이고 싶은) 책을 한 권 구독자분들께 소개해드릴까 해요!

* 구독자분들의 이해를 돕기 위한 연출 컷입니다 :-)

1. 마이크로카피를 만나기 전과 후

물론 위와 같이 수급되는 카피가 잘못되었다는 것은 아니에요. 하지만 좀 더 해당 제품과 서비스에 어울리면서 동시에 사용자를 확 끌어들일 수 있는 카피란 게 있지 않을까요?

이런 생각에 더욱 집착하고 고집이 생기게 된 건(물론 디자인에도 똥고집쟁이!) 마이크로카피-UX 디자이너의 글쓰기란 책을 만나고부터였던 것 같아요. 전문 카피라이터도 아니고 소문난 책 덕후도 아니면서, 막무가내로 혼자 겁도 없이 바꾼 카피로 고객 측에 재제안을 하고 있던. 그런 망아지 같은 때였죠. (아련)

한 때 겁 없는 망아지 같던 저를 쫒아 진행하느라 고생하셨던 PM, 리더, 동료분들께 심심한 감사 인사를..

2. 마이크로카피 : 파트1 보이스앤톤 디자인부터!

‘사람이 말하는 듯한 카피가 더 잘 읽히고 와 닿지 않을까?’

(혼자만의) 가설로 웹사이트의 모든 카피를 구어체로 범벅하고 있던 저에게 이 책은 무슨 말을 제일 먼저 했을까요? 보이스앤톤부터 디자인해라.

책에서 언급하는 보이스앤톤 디자이란, 브랜드가 모든 인터페이스에서 사용자와 커뮤니케이션할 때 사용하는 언어를 말하는데요. 브랜드나 그 속의 콘텐츠(언어적 요소)와 보이스 톤과 같은 비언어적 요소가 일치하지 않을 경우, 사용자들이 해당 브랜드나 서비스에 진정성 없고 신뢰할 가치가 없다고 판단한다고 해요. 즉 단순히 구어체에 귀염 뽀짝한 카피만이 사용자를 위한 답이 아니란 것이죠. 그렇다면 브랜드의 보이스앤톤은 어떻게 디자인할 수 있을까요?

책에서는 이 방법으로 브랜드/타깃, 2가지 섹션으로 분리해서 각각 단계별 절차를 보여줍니다. 앞에서 말씀드렸듯, 만능 보스급인 줄 알고 웹사이트를 구어체로 밀어버렸던 그 시절의 저에게 꼭 필요한 부분은 (책 내용 모두 정말 중요하지만요!) 브랜드 섹션이 아니었나 싶어요.

가령, 새로운 프로젝트를 착수했다면, 해당 브랜드의 비전과 미션의 핵심을 명확하고 분명하게 숙지하는 것이 브랜드 파트의 첫 번째라고 해요. 다음은 브랜드의 가치에 대해 정의하는 것인데, 예를 들어 ‘재미있는’, ‘진지한’ 과 같은 키워드를 솎아내는 과정이에요.(Tip: 키워드 도출에 참고할 수 있도록 116가지 가치 키워드를 책에서 정리해주고 있어, 저는 해당 페이지를 살짝 접어놨어요.)

책 속 116가지 가치 키워드를 살짝 보여드릴게요!

여기까지 왔다면, 마지막은 바로 브랜드의 성격을 묘사하는 것인데요. 브랜드가 사람이라고 상상해보라네요.(...응?) 더 나아가 주위 사람들을 대하는 방식, 유머 감각과 같은 성격적 특성과 그 성격을 정의하는데 도움이 될 만한 가상의 옷 스타일까지도 상상해보라고 말하고 있어요. 이때 정의되는 보이스앤톤으로 앞으로 만들어야 할 모든 카피의 기준이 되는 것이죠.

참고 사례. (마이크로카피 43p)

두 개의 미국의 온라인 쇼핑몰 사이트에서 회원가입 시 사용자의 생년월일 입력을 요청할 때, 각 사이트는 정보가 필요한 이유를 알리게 되어 있는 법 규정대로 다음과 같이 제공하고 있어요.

유명하고 진지한 성격의 나이키는,
required to support the Children’s Online Privacy Protection Act(COPPA).
: 아동 온라인 정보 보호법(COPPY)에 의거함

반면 독특한 스타일의 빈티지 의류를 판매하는 제이 피터팬은,
Sorry, our lawyers made us ask.
:죄송합니다만, 우리 변호인단이 요청해야 한다네요.

파트2에서는 실제 웹사이트 사례를 간접적으로 벤치마킹할 수 있어요!

3. 마이크로카피 : 파트2. 정의된 보이스앤톤, 어떻게 시작할까

앞서 공유드린 부분은 파트1. 보이스앤톤 내 1장 중 일부로 (전체의 한.. 20%쯤 될까요)

2장의 대화형 글 쓰는 방법과 3장의 행동을 끌어내는 비법까지 살펴봤다면, 책의 파트2에서는 실제 사례들을 살펴볼 수 있는데요. 큼큼! 제가 제일 재밌어하고 업무 중 가장 많이 살펴보게 되는 파트입니다. (저의 카피 짓기의 생명선이랄까- )

저는 특히 404 에러에 대한 내용에 눈이 많이 가는데요. 평소 404페이지까지 고려해서 원고가 수급되지 않기 때문에 거의 순도 100% 저의 바람대로 카피를 지을 수 있기 때문이죠.

이때 가장 많이 참고한 부분은 바로 404페이지를 위한 마이크로 카피 작성법인데요. 사용자는 ‘404 에러’라는 말이 무엇인지도, 왜 나타났는지도 모른다는 부분에서 격하게 동의하기 때문에 더더욱 이 책의 404페이지 카피 작성법에 공감하며 참고할 수 있었던 것 같아요.

그 뒤로 ‘404’나 ‘에러'라는 표현을 쓰지 않거나, 쓰더라도 크게 강조하지 않으면서 디자인하고 있답니다. 우리 구독자분들은 어떻게 404페이지를 디자인하고 계실지 궁금하네요. (404페이지를 위한 마이크로 카피 작성법이 궁금하시다면, 마이크로카피-205p를 참고하세요!)

추가로 404페이지 사례들 중 웃기지만 가장 영업이 자연스러웠던(?) 사례를 살짝 보여드릴게요.

이 페이지는 휴가 중입니다.

회원님도 떠나셔야죠. 트립어드바이저는 회원님에게 딱 맞는 호텔의 최저가를 찾기 위해 200개 이상의 예약 사이트에서 가격을 비교합니다. (응, 자연스러웠어-)

https://www.tripadvisor.com/404

핳… 찾아보는 데는 문제 없습니다; (부끄럽네요)

4. 마이크로카피 : 파트3. 사용성 높이기 (실무 꿀팁 대방출)

파트1을 통해 보이스앤톤의 기저를 다지고 파트2의 사례를 통해 간접 벤치마킹을 했다면, 파트3은 본격적인 실무 카피 작성 꿀팁이 대방출된다고 해도 과언이 아니에요. 마이크로카피의 사용성을 높일 수 있는 기본 원칙부터 사용자가 제품이나 서비스에 대한 신뢰가 쌓이지 않아 자신의 정보를 입력하기 꺼려할 때, 어떤 형식의 카피로 사용자가 느낄 우려를 누그러뜨릴 수 있는지 사례와 함께 제시해주고 있는데요. 하나의 꿀팁에 적게는 3개, 많게는 7개까지의 실제 사례를 모아주고 있어 실무에서도 마이크로카피를 정말 많이 신경 쓰고 있구나란 생각이 들더라고요.

파트3에도 내용이 정말 많기 때문에, 읽었음에도 불구하고 100% 완벽하게 기억하진 못해요.(재밌는 사례만 기억날 뿐- 왜 꿀팁을 기억하지 못하니!) 그래서 저는 인덱스 스티커라고 하나요? 문구점에 파는 색색별 스티커로 인상 깊었던 내용을 표시해가며, 실무에 참고할 때마다 열어보고 있습니다.

5. 마치며 : 구독자분들 중 저와 비슷한 분이 계실까요?

물론 UI 디자이너는 UI 디자인을 제일 잘해야겠죠! (디자이너에게 제일 중요한 것은 디자인!)

하지만, 자신이 디자인한 UI가 자신이 만든 카피와 함께 시너지를 발휘해 브랜드에 대한 경험을 사용자에게 매력적으로 제공할 수 있다면 얼마나 더 좋을까요?

저는 (조건1) 일정에 무리가 없다면, (조건2) 고객 측에 충분한 재제안이 가능한 상황이라면, 거의 매 번 UI 디자인과 함께 카피를 수정/새로 작성해 전달드리고 있어요. UI 디자인의 컴포넌트를 맞추듯 전체적인 카피의 말투나 단어 간 규칙, 뉘앙스를 맞춰가면서 아직까진(?) 매 프로젝트를 큰 이슈나 질타 없이 디자인하고 마무리하고 있는데요. (자연스럽게 디자인 시안과 함께 카피를 제안한 다음 PASS 되면 그대로 밀고 갑니다_영업비밀)

추가로 마이크로카피는 단순 텍스트를 넘어 VUI의 본질에도 벗어나지 않는다는 사실, 모두 아시죠? 만약, 저와 비슷한 관심사에 아직 시도를 못해본 분들이 있다면, 부디 저의 이번 책 추천이 도움되었으면 좋겠습니다.

지금까지- 손은 눈으로 볼 수 있는 디자인을 하면서, 머리로는 보이지 않는 것들에도 관심이 많은, 디독의 세 번째 에디터 효정이었습니다. 안뇽!

WRITTEN BY 효정