UX/UI Writing 의 모든 것

 

 

'회원가입을 하시면 혜택을 드립니다.'
'가입하고 혜택 받아가기!'

 

둘 중에 어떤 카피를 써야 좋을까?

앱이나 웹뿐만 아니라 모든 디지털 인터페이스를 디자인할 때, 어떤 문구를 써서 유저와 소통해야 할까 항상 고민이 됩니다.

또한 어떤 것이 더 좋은 문구 인지도 헷갈리기도 하죠.

오늘은 UX/UI 라이팅 에 대해서 함께 알아보기로 합시다.

 

01 보이스 앤 톤 설정하기

Corina yen의 HCI 연구에 따르면 사람들이 컴퓨터를 다룰 때도 사람을 대할 때와 같은 사회적 규범을 따른다는 것이 발견되었습니다.

쉽게 말해 사용자는 디지털 인터페이스와 언어를 통해 상호 작용할 때, 사람과 대화 할 때와 같은 반응을 한다는 것입니다.

마치 일을 성공하면, 칭찬을 해주는 친구처럼 우리는 컴퓨터에게 그런 인간적인 상호 관계를 기대하는 것입니다.

 

"컴퓨터야 칭찬해줘..."

 

또한  Clifford Nass교수의 연구에 의하면 보이스 앤 톤 디자인을 신뢰감 있게 하면 할수록

사용자는 해당 기업을 더욱 신뢰한다는 연구결과가 나왔습니다.

 

그럼 신뢰감을 주는 보이스 톤은 무엇일까?

 

신뢰감 있는 보이스 톤 디자인에서 가장 중요한 것은 바로 일관된 언어입니다.  

콘텐츠와 같은 같은 언어적 요소와 보이스 톤과 같은 비언어적인 요소가 일관되지 않으면 신뢰도가 떨어진다는 것입니다.

 

주니어 네이버의 가입 화면에서 이름 쓰는 곳에 '성명'이라고 되어있다면..?

 

일관된 보이스 앤 톤을 설정하기 위해서는 다음 3가지를 검토하여 설정해야 합니다.

 

1	회사 브랜드의 성격을 정의하라	브랜드의 비잔과 미션, 그리고 가치를 정의한 뒤 브랜드가 사람이라면 어떤 성격을 가졌을지 상상하고 정의하라. ex) 미국에서는 회원가입시 생년월일 수집의 이유를 명시해야 하는데... -유명하고 진지한 성격의 나이키 Require to support the Children's Online Privacy Protection Act =아동온라인 정보 보호법에 의거함 -독특한 스타일 빈티지의류 사이트 제이맨 Sorry, our lawyers made us ask =죄송합니다만, 우리변호인단이 요청해서요.^^;
2	타깃 고객을 설정or분석하라	주로 제품을 이용하는 고객의 연령, 성별, 경제적 지위등의 인구 통계학적 조사에 따라 그들이 사용하는 언어를 참고하여 설정해야한다. 그들이 사용하는 언어를 아는법? - 자사 혹은 경쟁사 브랜드의 소셜 미디어 댓글 - 사용성 평가 기록 - 고객 문의 페이지의 문의 내용 - 포커스 그룹인터뷰의 녹취록
3	브랜드와 사용자 사이의 관계를 규정하라	브랜드와 사용자와의 관계는 친구가 될수도 있고, 가족, 사업 파트너, 커플 등 다양한 관계를 가질 수 있다. 때문에 위에 과정을 통해 브랜드와 사용자간의 관계를 구정해야한다. ex) 같은 '금융'서비스를 제공해도 브랜드마다 관계는 다를 수 있다 -진중한 사업 파트너 "현재 계좌의 잔액이 300원 입니다." -나의 자산 멘토  "소비 지출이 큰 달입니다! 오늘 모닝커피는 생략할까요?"

 

02 대화형 글쓰기로 사용자와 대화하기

우리의 언어는 문어체와 구어체로 나누어집니다. 문어체는 진중한 느낌을 줄 수 있는 방면 구어체는 가볍고 친근 한 느낌을 줍니다,

예부터 문어체는 편지나 글과 같은 작성자와 수신자 간의 시차가 있는 경우에 쓰였습니다.

반면 구어체는 메시지를 듣는 순간 바로 응답 가능한 커뮤니케이션에 쓰입니다.

 

그렇다면 우리가 디지털 인터페이스를 통해 소통할 때는?

구어체를 사용하는 대화형 글쓰기를 사용해라!

 

'인터넷은 문자 언어와 음성 언어 사의의 오랜 경계를 허물어 버리고 세 번째 선택권인 '대화형 글쓰기'를 만들어 냈다'
- 카멜 와이즈먼& 일란 고넨

대화형 문장을 쓰는 요령은 아래와 같습니다.

1	누군가의 입에서 나온 단어를 사용하라	'인증목적을 위해 귀하가 제공한 이메일 주소로 이메일이 발송됩니다.' 이런 말을 대화에서 사용하지 않죠, 이럴때는 '인증 이메일이 이메일 수신함으로 전송 됩니다'로 바꿔 봅시다! *tip. 수동태보다는 능동태를 우리는 주로 말할때 사용합니다.
2	직접 읽어봐라	누군가에게 내가이렇게말한다면, 누군가 나한테 이렇게 말한다면 이해하기 쉽고 적절한지 확인 해보자!
3	예상치 못한 대답을 해라	우리의 대화가 제밌는 이유는 상대방에서 어떤 말이 나올지 모르기 때문입니다. 때문에 '송금이 완료되었습니다' > ' 잠시만 기다려 주세요' > ' 에러입니다 다시 시도하세요' 이런 식의 예측가능한 대화보다는 사용자에게 정말 하고 싶은 말을 사용합시다.
4	질문을 던지자	질문을 던지면 사용자는 대화를 하고 있다는 느낌을 받을 수 있습니다. ex) 나이를 입력하시오  Hmm...        나이는 어떻게 되나요? Better!

 

---

03 Principles : 원칙에 따라 하나하나 체크해보자

1,2단계처럼 보이스 앤톤을 설정하고 대화형 글 쓰는 준비가 되었다면!

아래 8가지의 원칙을 지켜서 본격적으로 글을 써볼까요?

 

본격적으로 글을 써볼까?!

원칙 1 : 간결하게 쓰자  ⭐️ 

제품의 빠른 탐색과 검색을 위해 핵심 메시지를 담아서 최대한 간결하게 작성!

Hmm...  : 친구나 가족 등 이메일 주소를 가지고 있는 사람에게 돈을 보내세요. 2단계의 절차로 지연시간이 없으며 발신자 부담 금액이 없습니다.
Better!  : 이메일을 가지고 있는 누구에게나 돈을 보내세요. 쉽고 빠르고 무료입니다.

Hmm...  : 계정 연동을 위해 휴대폰의 정보를 계정의 서버에 입력하고 있습니다. 약 5분 정도 소요될 예정입니다.
Better!  : 휴대폰과 계정이 현재 연결 중입니다. 5분만 기다려주세요.

핵심 작업이나 개념을 설명할 때 복잡한 의미를 많이 나열하지 마세요.

 

원칙 2 : 해야 할 것이 아닌 해야할 다음 방법을 알려주기 

제품의 빠른 탐색과 검색을 위해 핵심 메시지를 담아서 최대한 간결하게 작성하세요.

Hmm...  : 오류가 발생했습니다. 계정을 등록해야 투표가 가능합니다.
Better!  : 오류가 발생했습니다. 투표를 위해 계정 등록하세요
사용자에게 해야 한다는 것을 알리기보다는 해야 할 방법을 직관적으로 알려주세요.

 

원칙 3 : 누구나 이해 가능한 단어 사용하기 

업계에서 사용 가능한 전문용어나, 특정 계층이 사용하는 용어는 피하고 누구나 아는 단어를 사용하기.

Hmm...  : 쿼드코어 이하의 AP에서는 디스크 로딩 속도가 저하됩니다. 버거 메뉴에서 GPS 토글키 눌러 해제하십시오.
Better!  : 휴대폰을 더 빠르게 하기 위해, 상단 메뉴에서 위치정보 수집 버튼을 눌러 위치정보 수집을 끄세요.
문맥을 이해하는 데 필요한 경우가 아니면 기술 용어를 사용해서 설명하지 마세요.
(너무 극단적 예시인가?ㅋㅋ)

 

원칙 4 :  점 (.) 이때는 사용하지 말자 

언제 .을 찍어야 할까 고민될 때 아래의 경우에는 찍지 마세요.

• 라벨                         
• Bulleted lists (지금 이게 불렛 리스트)
• Hover text             
• Dialog body Text

Hover text

Dialog body Text

 

원칙 5 : 문장 구조에서 목적어를 먼저 사용하기 

사용자의 빠른 이해를 위해 목표 달성을 위한 문구에서는 문장 구조에서 목적어를 먼저 사용해보세요.

Hmm...  : 사진을 폴더에서 휴지통으로 드래그하여 사진을 제거하세요.
Better!  : 사진을 제거하기 위해 사진을 폴더에서 휴지통으로 드래그하세요.

문맥을 앞단을 읽자마자 사용자는 해당 지침이 자신에게 필요한 것인지 한 번에 알 수 있으며, 기억하기도 더 쉽습니다. 

 

원칙 6 : 부정어보다는 긍정어로 사용하기 

부정어보다는 긍정어를 사용하면 제품의 이미지 또한 호감형이 됩니다.

Hmm...  : 30자 이상으로 작성할 수 없습니다
Better!  : 30자 이내로 작성해주세요

Hmm...  : 잘못된 계정을 입력했습니다
Better!  : 올바른 계정을 입력해주세요

(이건 삶을 살아가는데 대화법 팁이기도 함ㅋㅋ )

 

원칙 7 : 일관성을 유지하기 

보이스 앤 톤과 연관하여 항상 일관된 문체를 유지해야 합니다.

Hmm...  :
(활기찬 캐릭터)
지금 바로 계정을 등록하고 친구와 함께 혜택 받아 가세요!
> 올바른 계정이 아닙니다. 수정하십시오
(급정색하는 느낌 )

Better!  : 
(활기찬 캐릭터)
지금 바로 계정을 등록하고 친구와 함께 혜택 받아 가세요!
> 올바른 계정을 다시 입력해주세요. 

 

 

여기까지 UX/UI writing에 대해서 알아보셨는데 어떠셨나요?

당연한 소리도 있고, 몰랐던 정보도 있을 것 같아요.

한번 보고 가는 것 보다 글 쓸 때마다 두고두고 체크하면,

사용자가 이해하기 쉬운 글을 쓸 수 있을 것이라 생각합니다!

(내가 그러려고 이 포스팅 썼음)

 

그럼 다음 포스팅으로 만나요!

흥바!

 

출처:
-킨너렛 이프릿. 마이크로카피 (변상희 옮김)
-리디북스 디자인 시스템. https://ridi.design/
-구글 머터리얼 디자인. https://material.io/design/communication/writing.html
-피오. UX라이팅을 위해 알아두면 좋은 5가지 팁. 브런치. https://brunch.co.kr/@dakitani/8