글로 하는 디자인 UX Writing
더 나은 고객 경험을 위한 글쓰기 UX 라이팅 (마이크로카피)
내가 쓰는 온라인 서비스
텍스트 존재의 의미
평소 즐겨쓰는 앱에서 원하는 목적을 수행할 때, 화면 속 텍스트를 요소요소 살펴본 적이 있는가?
기발하거나 심금을 울리는 카피라이팅이 아니라면 대부분의 단어와 문장을 그저 디자인 요소로써 인식하기 때문에, 어느 위치에 어떤 텍스트가 적혀있는지 또렷이 기억하긴 어렵다. 텍스트를 글로 인식하지 않고 자연스럽게 탐색하다가도, 다음 화면이 예상되지 않는 버튼이나 단번에 이해하기 어려운 문장을 만나면 휙 넘기던 손가락을 주춤하게 되는 상황이 생긴다.
아주 극단적인 사례로, 국내에 들어온 해외 서비스 중 한국어 패치가 제대로 적용되지 않은 앱을 보면 간혹 엉뚱하고 우스꽝스러운 표현들을 발견할 수 있다. Amazon의 홈 화면 사례를 보자. 아래 위젯은 크게 위젯 타이틀, 상품 섬네일, CTA 버튼으로 구성되어있다. 이 중 '샵으로 이동'한다는 의미의 'Shop now' CTA, 이 버튼을 누른다면 다음 화면에서는 해당 테마의 상품이 더 많이 진열된 샵 리스트가 나올 것이라 예상할 수 있다. 실상은 달랐다. 아마존에서 언어 모드를 한국어로 전환했을 때, 그 자리에는 전혀 다른 의미의 문구가 적혀있었다. '지금 쇼핑하세요'. 뾰족하게 어떤 행동을 유도하는지도, 다음에 어떤 화면이 나올지도 예상하기 어려운 문구였다. 이는 기존 CTA의 문제라기보단, 번역 과정에서 맥락을 고려하지 않고 그대로 직역하여 잘못된 의미를 전달한 케이스겠지만.. 어찌됐든 오역된 텍스트 버튼만으로는 기존 의도가 전혀 전달되지 않았다.
'Amazon' Home Widget앱에서 텍스트가 잘못 설계된다는 것은 백화점에 아무런 이정표도, 직원의 설명도, 인포메이션 키오스크도 없는 상황과 같다. 그저 비주얼과 간판 이름만 보고 이리저리 찾아다녀야 하는 것이다. 나이키 매장을 찾고자 1층부터 8층까지 전층을 헤매며 아까운 시간을 소비하게 될 수도 있다. 불명확하거나 오해의 소지가 있는 텍스트는 고객이 뜻을 이해하기까지 불필요한 시간을 낭비하기도, 오인하여 잘못된 선택을 하기도, 갈 곳을 잃어 방황하거나 심지어 이탈하게 되는 불편한 경험까지도 야기한다.
단일 목적에만 충실했던 초창기 앱들과 달리 지금은 앱 하나에도 수십, 수백 가지 기능과 서비스가 붙는다. 스마트폰 하나로 모든 일상 경험이 가능한 만큼, 복잡해진 경로에 따라 고객이 밟는 모든 동선에 명확한 디렉션 가이드와 흥미로운 넛지 포인트가 필요하다.
이 글은 미국에서 시작되어..
UX 라이팅은 언제 생겨난 걸까?
우리는 고객 경험과 사용성을 설계하는 것을 UX(User eXperience)라 부른다. 그렇다면 사용성을 구성하는 요소는 디자인만으로 충분할까? 오프라인에서 말로 설명하고 손짓으로 안내하던 부분을 디자인 컴포넌트와 이미지만으로 표현하는 데는 한계가 있다. UX의 사용성은 디자인과 텍스트의 공동 노력으로 이루어진다.
'UX는 디자인과 언어를 포함한 긍정적인 사용자 경험에 대한 모든 것'이라는 개념을 이해하는 것이 UX Writing의 첫 번째 단계다. UX를 텍스트로 설계한다는 의미에서 '글로 만드는 디자인'이라 할 수도 있겠다. 이러한 맥락으로 페이스북, 슬랙에서는 UX Writing을 '콘텐츠 디자인'이라 부르기도 한다. (실리콘밸리에서 정의하는 UX Writing은 다음 편에서 자세히 다뤄보겠다.)
UX 글쓰기는 미국의 프로덕트 디자이너 조슈아 포터(Joshua Porter)가 2009년 블로그에서 '마이크로카피'라는 용어를 언급하면서부터 비롯됐다. 조슈아가 전자상거래 프로젝트를 진행하던 당시, 고객 중 십분의 일이 청구소 주소를 잘못 입력해 온라인 거래에 실패하고 금전적 손실까지 입는 상황이 발생했다. 이 문제를 해결하기 위해 그는 청구소 주소 입력 필드 옆에 문장 하나를 추가했다.
"신용카드 대금 청구서의 주소와 같은지 꼭! 확인해 주세요."
© Joshua Porter's Blog <Writing Microcopy>고객들이 대강 입력하고 무심히 지나치던 부분을 콕 집어 한번 더 검토할 수 있도록 설계한 문구였다. 그저 문장 하나 추가했을 뿐인데, 이후 고객들의 실수는 반 이상으로 줄어들었다. 정확한 안내 한 줄은 에러 대응 시간을 줄이고, 실제 거래 전환율까지 높이는 비즈니스 임팩트를 가져왔다.
또 다른 예시로, 그가 담당하던 도서 상세페이지의 결제 정보에는 항상 Paypal 로고가 붙어있었다. Paypal에 가입해야만 결제가 가능했던 번거로운 과정에서 많은 이탈이 발생했다. 이 문제를 해결하기 위해 조슈아는 가입 절차를 생략할 수 있는 구조로 결제 기능을 재설계했다. 하지만 기존 학습된 고객들은 개선 사항을 전혀 인식하지 못했다. 이번에도 도서 상세페이지의 Paypal 로고 옆에 새로운 카피를 추가했다.
"이 책은 페이팔을 통해 결제되지만, 페이팔 계정이 별도로 필요하지 않습니다."
로고 옆에 추가된 카피 한 줄은 잠재 고객들이 갖고 있던 레거시를 버리고, 구매 허들을 낮춰 구매율을 높이는 데 큰 도움을 줬다.
아이러니하게도, 가장 작은 조각인 마이크로카피가 가장 큰 영향을 미칠 수 있었다. 정확한 위치와 타이밍에 몇 가지 문구만으로 사용자 경험을 완전히 바꿀 수 있다는 레슨런을 통해, 조슈아는 이런 유형의 카피를 마이크로카피(Microcopy)라 부르게 됐다.
마이크로카피 품은
UX Writing
마이크로카피는 말 그대로 아주 세부 단위의 카피다. UI/UX에서 사용자가 취하는 행동에 직접 관여하는 단어 또는 문구로, 행동 이전에 동기를 부여하거나 행동에 대한 지침을 안내한다. 책에서는 이런 마이크로카피를 작업하는 일을 UX 글쓰기, UX Writing이라 정의했다.
마이크로 카피를 쓰는 일 = UX Writing
UX Writing의 결과물 = 마이크로 카피
지금 보고 있는 앱 화면에서도 마이크로카피를 쉽게 찾을 수 있다. 메시지 박스, 팝업, 툴팁, 헤더 타이틀, 탭, 배지와 칩, CTA, 옵션피커 문구나 단위, 스낵바, 태그, 오류 메시지, 이용 약관 및 보안 정보, 상품 페이지 상단 개요에 있는 여러 혜택과 배송 관련 정보들까지 UI/UX를 이루는 모든 텍스트가 마이크로카피에 속한다.
© Google 'Material Desgin'실무에서는 마이크로카피보단 UX Writing이라는 표현을 주로 쓰며 카피를 다루는 범위 또한 넓다. 추천 상품을 테마별로 묶은 위젯 타이틀, 특정 서비스를 소개하는 랜딩 페이지의 타이틀 및 디스크립션, 가끔은 신규 서비스로 유도하기 위한 여러 진입점 중 하나로 배너 카피를 쓰기도 한다. 신규 프로젝트에 투입됐을 땐 서비스 네이밍까지 함께 작업하기도 한다. 어떻게 보면 UX Writing은 마이크로카피보다 폭넓은 개념으로 UX 콘텐츠 전반을 만드는 일이라고 할 수 있겠다. (범위나 관여 정도는 기업마다 차이가 있을 테니 참고만 하자.)
앞선 근거를 토대로 내가 생각하는 UX Writing의 역할은 크게 네 가지다.
1. 고객이 원하는 목적지에 잘 도달할 수 있도록 단계별로 올바른 행동 지침을 안내 (Guide-line)
2. 고객에게 특정 서비스를 인지시키고, 의도한 방향에 따라 행동을 취하도록 동기 부여 (Nudging)
3. 전체 퍼널을 고려해 고객의 end-to-end 경험을 설계 (Customer Journey Copy)
4. 이후 행동 결과를 언제든 쉽게 트래킹 할 수 있도록 끝까지 책임 (Feedback)
아, 이제 느낌이 온다?
- 인스타그램: 최근 활동 탭(♡ 아이콘)을 GNB 영역으로 옮기고는 위치가 변경됐다고 알려준 툴팁
- 트위터: 게시글 작성 시 150자 내로 작성하라는 안내 메시지(&글자 수 초과할 때 뜨는 에러 메시지)
- 쿠팡: 커머스 홈에서 흔히 볼 수 있는 'OOO님을 위한 추천' 위젯 타이틀
- 카카오T: 택시를 잡았다가 취소할 때 뜨는 팝업 메시지와 CTA
- 에어비앤비: 숙소 검색 시 검증된 호스트의 숙소임을 보여주는 섬네일 내 배지
이 모든 고객 경험을 돕는 단어와 문장, 페이지를 덮는 긴 구절까지를 마이크로카피, UX Writing이라 부른다.
Coupang / Kakao T / Air bnb근데 그거 그냥
카피라이팅 아닙니까? 아닙니다.
UX Writing은 고객의 시선을 끌고 특정 경험을 유도한다는 점에서 마케팅 DNA가 깃든 카피라고도 볼 수 있다. 여기서 카피라이팅과는 어떤 차이점이 있는지 궁금해할 것이다. 우선 책에서 찾아본 정의는 이렇다.
카피라이팅 - 제품, 서비스, 도구 및 창의적인 물건 등 무언가를 판매하는 텍스트
UX라이팅 - 사용자와 인터페이스의 의사소통을 지원하고 향상시키는 텍스트
카피라이팅은 대충 알겠는데, UX 라이팅 설명은 솔직히 무슨 말인지 모르겠다. 쉽게 말해 카피라이팅은 TV나 옥외광고(ATL), SNS나 오프라인 행사(BTL)에서 볼 수 있는 짧고 매력적인 메시지로, 강하게 한 방 때리는 게 특징이다. 상품 판매 목적의 화려하고 자극적인 카피도 이에 속한다. 반면 UX Writing은 프로덕트의 UX 퍼널 전반에 깔려있다. 고객이 원하는 목적지에 원활하게 도달할 수 있도록, 인터페이스 곳곳에 퍼져 친절하고 센스있는 멘트로 길잡이 역할을 한다. 소소한 단어, 문장 단위부터 더 자세한 가이드를 주는 구절까지 그 형태도 다양하다. 두 카피의 차이를 보다 쉽게 전달하고자 이분법적으로 구분해봤다. (이 또한 기업마다 차이가 있으니 '참고'만 해달라.)
Copywriting vs UX Writing (point of view)UX Writing은 말 그대로 고객 경험 글쓰기다. 고객의 동선을 따르며 전달력 높은 메시지를 제공하는 일이 무엇보다도 우선이지만, 마케팅적인 DNA도 갖고 있기에 어느 부분에서는 카피라이팅과의 경계가 모호하게 느껴질 수 있다. 브랜드 '보이스 앤 톤'에 맞는 일관된 메시지를 가져간다든지, 특정 영역에서 시선을 집중시키고 행동을 유도한다는 점은 카피라이팅의 특징이라고도 볼 수 있으니 말이다.
그렇다면 위 맥락에 맞게 다시 정의해본다.
UX라이팅은 UX의 전반적인 퍼널을 생각하며 단계별 상황을 고려한 글쓰기로, 고객이 단번에 '아하!' 하며 내용을 정확하게 파악할 수 있어야 한다.
카피라이팅 - UX 플로우와는 크게 상관없이 후킹이 주목적인 카피로, 고객이 한번 더 생각해야 하거나 숨은 의미를 찾아야 한다. (상품 세일즈를 위한 단순 카피는 예외!)
"Don't Make Me Think"
UX Writing을 '단번에 아하!' 라고 표현하고나니 회사에서 귀에 닳도록 들은 문장이 생각난다. 돈-메잌-미-띵ㅋ! 고객이 글의 의미를 거듭 생각하지 않도록 하는 것은 UX Writing 불변의 법칙이다. 우리 고객은 바쁘다. 카피 하나하나 유추하지 않고 쓱 훑기만 해도 바로 파악할 수 있길 원한다. 결국 잊지 말아야 할 것은 우리의 글로 고객에게 빠르고 명확하고 좋은 경험을 주어야 한다는 것이다. 단번에 이해할 수 있는 카피로 소중한 시간을 아껴주는 일, 지금 '고객 경험 글쓰기'를 하는 사람들이 가져야 할 가장 큰 미션이다.
* 다음 글에서는 실리콘밸리에서 정의하는 UX Writing, 업무 프로세스, 맥락있는 글쓰기를 다룰 예정이다.
