인터페이스를 위한 글쓰기

♪♪

안녕하세요 Kaely Coon입니다 저는 Jennifer Bush고요 저희는 Apple의 Human Interface 팀에서 일하고 있는 작가(Writer)입니다 Apple 제품 및 서비스 전반에 관여하죠 오늘 저희는 직접 배운 팁과 우수 사례를 알려드릴 건데요 개발자 여러분들이 앱이나 게임을 쓸 때 도움이 될 수 있는 것들입니다 저희는 UX Writers나 콘텐츠 디자이너라고 불리는데요 우리가 쓰는 건 문자열, 카피, 텍스트에 해당합니다 본질적으로 언어라는 걸 통해 디자인하는 게 우리 일입니다 Apple은 초창기 모두를 위한 장치를 디자인하려고 했었죠 누구와도 소통이 가능해야 했다는 뜻입니다 최초의 Mac은 '보는 대로다'라는 디자인 원칙으로 만들어졌죠 여기엔 언어도 포함됩니다 Mac은 이해하기 쉬운 단순한 언어로 만들어졌습니다 사용자에 초점이 맞춰졌죠 사람을 환영했어요 제품 전반에 걸쳐 켜자마자 나타나는 말은 'Hello'입니다 초기부터 인터페이스에서 대화형을 유지했죠 디자인과 자연스럽게 작동하면 대화를 알아채지 못할 겁니다 하지만 모든 사용자 경험에서 중심이 되죠 문구는 사람들이 원하는 걸 할 수 있게 도와줍니다 미모티콘 만들기, 영화 보기 등 상관 없이요 문구가 사라지면 앱은 어떤 모습일까요? 약간 비어 있는 모습이죠? Apple Music 앱의 비주얼은 각 섹션이 뭔지 보여줍니다 하지만 앨범과 플레이리스트의 차이가 보이시나요? 브라우징하거나 라디오 듣는 건요? 스크린에 문구가 많지 않더라도 예상되는 것과 다음에 뭘 할지 이해할 수 있죠 오류가 나더라도 길을 찾을 수 있습니다 라이팅은 소통하는 것입니다 당연히 말을 포함하죠 그런 말이 모인 구조와 말이 나타나는 타이밍 사람들이 그걸 읽고 받는 감정까지 포함됩니다 UX Writer들이 언어로 디자인하는 법을 알려드렸는데요 '그게 무슨 의미지?'하고 궁금해 하실 겁니다 이건 앱 디자인 프로세스의 일부를 일찍 쓰면 쓸수록 이걸 경험하는 사람들이 더 나은 경험을 할 수 있다는 뜻입니다 이번 세션에서는 제품 문구 개발 시 저희가 고려하는 4가지를 알려드리겠습니다 종종 더 많은 것을 고려해야 하기 때문에 오늘 알려드릴 것들이 유일한 것은 아닙니다 이번 세션이 앱을 쓸 때 유념해야 할 유용한 프레임워크를 제공할 수 있었으면 좋겠네요 4가지 유형은 '목적', '예상' '맥락', '공감'입니다

앞글자를 따 'PACE'라고 부르기로 했는데요 라이팅 시 고려해야 하는 중요한 사항입니다

PACE는 자연스러운 플로우를 만들어 여러분이 말하는 것에 사람들이 참여하고 흥미를 가지도록 만들어 주죠 뭘, 어떻게, 언제 말할 지 알아야 한다는 겁니다 이제 Jen이 '목적'에 대해 이야기하겠습니다

앱의 스크린을 개발할 때 그 순간 알아야 할 가장 중요한 걸 생각해야 하죠 그게 바로 스크린의 목적입니다 어떻게 전달할 수 있을까요?

먼저, 정보 계층을 고려해야 합니다 즉, 스크린 위 요소를 순서대로 나열하는 거죠 예시를 보시죠 다음은 Messages 플로우의 인트로 스크린입니다 목적이 맨 상단에 있으니 바로 눈에 들어오죠 '친구들에게 당신의 이름과 사진을 공유하세요' 아마 이걸 가장 먼저 보셨을 겁니다 '이름과 사진 선택' 버튼을 그 다음으로 보셨겠죠 사람들은 항상 스크린에 있는 텍스트를 순서대로 읽기 않아요 그래서 헤더와 버튼이 명료해야 하죠

스크린 위의 나머지 텍스트는 그래도 중요한 목적을 가집니다 커스터마이징할 수 있는 것과 누구와 무엇을 공유할지를 알려주고 있지만 텍스트는 약간 더 작죠 정보 계층은 스크린의 목적을 전달할 수 있게 도와줍니다 뭘 빼야할 지 파악하세요 스크린의 목적을 알면 유지하고 싶은 아이디어와 뺄 수 있는 아이디어 이동 가능한 아이디어를 파악할 수 있죠 다음은 iPhone의 온도 경고 스크린을 가짜로 만든 와이어프레임인데요 타이틀이 굉장히 명료하죠 하지만 텍스트가 너무 많습니다 너무 많은 걸 하려 하죠

스크린의 목적을 생각해 보세요 iPhone의 온도를 왜 낮춰야 하는지 말해줘야 하나요? 그렇다면 직사광선에 있다거나 앱 사용이 많다고 하겠죠 하지만 긴급 연락은 가능하다고 말해줘야 하는데요 이 버튼은 꽤 큽니다 이게 꼭 필요하다고 알려주는 것 같죠 실제 스크린을 볼까요? 스크린이 훨씬 단순하죠

헤드라인은 ‘온도(Temperature)’ 뿐입니다 온도계 이미지가 온도가 높다는 정보를 알려주고 있기 때문에 명시적으로 말할 필요가 없죠 문장 하나로 iPhone 온도를 낮춰줘야 사용 가능하다고 말해주고 있습니다 버튼에는 '긴급'이라고 써있기 때문에 긴급 연락을 해야 할 때 뭘 할지 명확히 말해주죠

자세한 내용을 다 넣지 말고 '단순함'을 목표로 하세요 스크린의 목적을 말해주세요 비밀이 아니니까요! 누군가에게 새로운 기능을 소개한다고 가정하면 왜 그 기능이 있는지, 왜 중요한지 말해야 하죠 인트로 스크린 헤더의 문구는 스크린 타임 줄이기가 취침 전 '하기 좋은 일'이라고 이야기합니다 이게 이 기능의 목적이죠 이제 기능 설정의 이유를 아실 겁니다 모든 스크린에는 목적이 있습니다 플로우에 여러 단계가 있다면 전체 흐름의 목적을 정의하세요 각 스크린의 정의도 물론이고요 그럼 스크린이 간단해지고 불필요한 단계가 줄어듭니다 처음에 환영 방법을 고려하고 알아야 하는 것을 알려주세요

다음은 Apple Cash를 가족 공유로 설정하기 위해 디자인된 플로우 속 스크린인데요

사용 대상이 '18세 미만 가족 구성원'이고 '돈을 주고받고 구매 시 Apple Pay 사용 가능'이라고 텍스트가 알려주고 있네요

다음 단계에서 텍스트의 목적은 다음에 뭘 할지 알려주고 신원을 확인하는 겁니다 데이터 및 프라이버시에 대한 중요 정보를 알려주죠 이 프라이버시 정보는 스크린 공간을 꽤 차지합니다 하지만 중요한 정보죠 프라이버시는 Apple의 핵심 가치 중 하나입니다 앱의 가치를 생각하고 전체적으로 드러날 수 있게 해주세요

신원 확인 후에는 플로우의 마지막인데요 기능 사용을 시작할 준비가 아직은 다 되지 않았네요 이 스크린은 카드 활성화에 시간이 걸림을 알려주고 알림이 예상됩니다

다 됐네요! 이제 Apple Cash로 돈을 보낼 수 있습니다 스크린에 뭘 쓸지 결정하기 어렵다면 목적부터 다시 생각해 보세요 정보 계층을 고려하고 빼야 할 내용을 파악해 모든 스크린에 목적을 가지면 목적을 전달할 수 있습니다 다음, '예상'에 대해 이야기해 봅시다

이건 앱 문구를 대화로 생각하게 해주는 건데요 대화는 앱과 사용자 사이에 이루어집니다 좋은 대화라면 말이 오고 가죠 듣기도 하고 이야기나 질문도 한다는 겁니다 앱에서도 비슷하게 매 순간 소통이 잘 이루어지는 방법을 예상하죠

주말에 늦잠을 자려는 상황이라고 가정해 봅시다 Clock 앱으로 가서 알람을 변경할게요 알람을 내일 울리는 걸로 변경하려고 합니다 매일 안 울리고요 액션 시트는 이 변경 내용을 일정에서 주말마다 적용할 건지 묻습니다 첫 선택지는 '다음 알람만 바꾸기'인데요 그럼 예상되죠 다음 날의 모닝콜만 생각하는 거라고요 자기 전 잠금 화면은 '잘 자요'라고 해줍니다 또, '취침 모드가 켜졌다'고 이야기해 주죠 작은 버튼은 '알람 시간'을 말해주고요 '잘 자요'는 친화적이고 친근한 톤입니다 그리고 이제 당신이 잠에 들 것임을 인정합니다 다음 날 아침 알람이 울리기 전 일어나서 iPhone 사용을 시작하면 알람이 울리길 원하지 않는다고 예상하죠 그래서 일어난 것 같으니 알람과 수면 모드를 끌지 물어 봅니다 대화가 직관적으로 느껴지고 장치가 필요에 맞게 이야기하죠 대화형임을 고려했을 때 Writer는 보이스와 톤을 많이 고려합니다 앱의 보이스를 먼저 개발하고 톤을 다양하게 만들어 보세요 앱이 뭐라고 말할지 스스로 생각해 보세요 신나고 재밌는 게임을 개발 중이신가요? 아니면 보안과 신뢰도가 중요한 뱅킹 앱인가요? 아니면 아이들이 쓰는 앱인가요? 사용할 단어 유형을 결정하기 위해 누구에게 말하고 있는지를 고려해 보세요 흔히 사용되는 용어를 리스트로 만드세요 웹사이트, 이메일 등 다른 소통 수단에서도 사용할 수 있는 보이스를 만들어 줍니다 사람들이 뭘 하게 될지 예상하여 톤을 고려할 수 있죠 Apple Watch가 '넘어진 것 같다'고 하네요 괜찮다면 '넘어졌지만 괜찮다'고 답할 수 있죠 스트레스가 가득한 순간에서 차분하고 명료한 톤입니다 Apple은 어떤 장치를 사용 중이건 하나의 일관된 보이스를 제공합니다 하지만 상황에 따라 톤은 변화하죠 친구와 통화할 때와 은행과 통화할 때 보이스 톤의 변화가 일어나는 것을 생각해 보세요 Watch의 Activity 앱에서 Move Streak 설정 시 ‘일일 연속 Move 기록이’ '신기록 35일을 달성했다!'고 알려줍니다 축하해 주는 톤이죠 느낌표도 있고요 이런 건 너무 자주 사용하진 마세요 가벼워 보이니까요

앱을 쓸 때는 항상 다음에 뭐가 오는지 물어야 합니다 다음 액션이나 누군가 갖게 될 질문을 예상함으로써 뭘 말해야 할지 알 수 있거든요 Apple Watch의 Breathe에서는 '숨쉬는 것에 집중하라'고 안내해 줍니다

시작 방법을 모를 수도 있으니 '들이쉬고 내쉬라'고도 이야기해주죠 비주얼로 메시지를 강화하고 진동으로 타이밍을 맞춰주며 사용 방법에 대한 질문에 답을 해줍니다 Maps에서는 사용자가 집으로 향하는 것 같다면 '집까지 8분 남았다' 'Audubon Ave로 가라' '거리가 한산하다' 등의 알림이 나타납니다 다음에 할 일을 예상함으로써 사용자의 결정을 도와주죠 디자인과 텍스트가 긴밀하게 작동할 때 앱 사용 시 자연스럽다는 느낌이 듭니다 '예상'이란 앱을 대화의 일부로 생각하는 겁니다

보이스를 개발하고 상황에 따라 톤을 변경하세요

그리고 다음에 올 것에 대한 질문에 답을 해주세요 사람들에게 직접 올바르게 이야기하는 것은 앱 경험을 단순 기능이 아닌 마법같은 것으로 바꿔줍니다 다음은 '맥락'입니다 먼저 앱을 벗어나서 생각해 보세요 누군가 앱을 사용할 때 조용한 공간에 있을까요? 아니면 번잡한 공항에 있는 상황일까요? 운전이나 요리같은 것에 집중하고 있는 상황일까요? 아니면 앱에 온전히 집중할 수 있는 상황일까요? Apple Watch는 이런 질문을 통해 사용자가 운동 중인데 아직 기록을 하고 있지 않다면 실외 운동 중이니 긴 글을 읽으려고 멈추지는 않을 것이라는 게 여기서의 맥락인 거죠 그래서 ‘실외 산책 기록(Record Outdoor Walk)’이라는 큰 버튼이 나타납니다 반대로 운동을 멈추면 맥락이 변합니다 총 거리, 평균 속도, 활성 킬로칼로리 등 이제 약간의 정보를 더 받아들일 수 있겠죠 파노라마 사진을 찍을 때는 집중이 카메라 앱과 사용자가 찍으려는 앱으로 분산되는데요 온스크린 화살표가 지시 사항을 안내합니다 '파노라마를 찍을 땐 계속 움직이라'고요 문구가 사용자가 보고 있는 화살표 바로 아래 나타나죠 도움이 되는 알림은 어떻게 쓸까요? 누군가 액션을 확인하거나 선택하도록 해야 할 때 앱의 경고 가장 잘 사용될 수 있는데요 맥락에 따라선 방해라서 도움이 되고 명확한 경고를 원하실 겁니다 Weather 앱을 키니 위치 사용 허가가 필요하다는 알림이 뜨네요 앱을 열었을 때 뜨기 때문에 맥락과 관련된 것으로 느껴지죠 알림은 허가가 사용될 맥락도 알려줍니다 여기선 지역 날씨를 보여주고 관련 공지를 보냅니다

일부 알림은 부정적인 액션일 수도 있습니다 계정 내 장치 제거와 같이 되돌릴 수 없는 걸 수도 있죠 좀 더 자세히 볼까요? iPhone을 제거할 거냐고 묻고 있습니다 ‘제거(Remove)’나 ‘취소(Cancel)’ 버튼으로 대답할 수 있죠 누군가 중요한 선택을 해야 한다는 게 여기서의 맥락이죠 여기선 정보를 잃을 수도 있는 선택이니까요 'Remove'는 부정적 액션이라 빨간색이고 왼쪽에 있습니다 오른쪽의 'Cancel' 버튼은 액션을 취하지 않고 알림창을 꺼주죠 하지만 Cancel 사용 시 유의하세요 이건 가짜 구독 알림인데 여기서 보시다시피 ‘취소 확인(Confirm Cancellation)’이라는 타이틀 때문에 왼쪽, 오른쪽 버튼 중 어떤 버튼을 선택해야 할지 바로 눈에 보이지 않습니다 '확인할 경우 이 플랜에 대한 액세스를 잃게 된다'고 나머지 텍스트에 써 있는데요 썩 도움이 되지는 않죠

플랜을 지금 끝내겠다는 건지 액세스가 가능하다는 건지 명확하지 않습니다 '이 플랜'이라는 어구도 굉장히 모호합니다 특히 구독하는 게 2개 이상일 경우에는요

조금만 바꿔도 이런 문제를 고칠 수 있습니다 아래 보실 수 있는 새로운 타이틀에서는 취소하려는 구독 서비스가 뭔지 알려주고 '구독 취소'와 '구독 유지' 버튼이 잘 매치되어 있습니다 메시지 바디는 간결합니다 '구독은 6월 21일까지'라고 말해주고 있죠

'Yes'나 'No' 버튼이 없다는 게 보이실 거예요 알림을 쓸 때 항상 버튼이 취할 액션을 구체적으로 명시하는 게 제일 좋습니다 이 알림에서는 버튼 라벨만 읽어도 어떤 선택을 하고 있는지 알 수가 있죠 알림을 보는 또다른 맥락은 뭔가 잘못됐을 때입니다 오류는 종종 경고로 나타나는데요 다음의 가짜 예시에서 보실 수 있듯이요 사용자가 할 수 없는 걸 말해주는 타이틀은 아니죠 오류 코드 숫자가 무슨 의미인지도 알기 힘들고요 마지막 줄의 세 가지 문장은 어떤 정보도 알려주지 않습니다 2개의 버튼은 왜 있는지도 알 수가 없죠 두 버튼 다 똑같은 기능을 하는 것 같은데 말이죠 '이런!'과 같은 메시지 속 감탄사는 잘난체하는 듯한 톤입니다 '제발', '미안합니다'도 성의가 없고요 이런 표현들은 지양하세요

다음은 좀더 나은 사례입니다 타이틀은 '청구 문제가 있다'고 알려주죠 뭘 해야 하는지도 정확히 알려주고요 구독 액세스를 지속하고 싶다면 '새 지불 방식 추가'라는 상단 버튼을 누르면 문제를 해결할 수 있는 곳으로 이동하게 됩니다 '나중에 확인'이라는 하단 버튼은 하려던 걸 지속하게 해주어 나중에 다시 돌아갈 수 있죠 이제 유용한 빈 화면, 앱에서 콘텐츠가 없는 곳을 어떻게 만들 수 있을지 한 번 이야기해 보죠 빈 화면은 할 일 목록 중 마지막 항목을 완료했을 때처럼 축하하거나 교육을 위해서 사용될 수 있습니다 하지만 맥락에 따라 다르죠 또다른 예시를 볼까요? 이 가짜 레스토랑 앱에서는 가장 좋아하는 메뉴에 저장해 놓은 게 없습니다 '마음에 드는 게 없냐'는 타이틀은 기발한 느낌이 나죠 앱의 보이스와 매치된다면 효과가 있을 겁니다 하지만 모두가 이해하긴 힘들고 번역되기도 힘든 문구죠

그리고 아래 텍스트에는 '먹고싶은 걸 찾는다면 돌아오라'고 되어 있습니다 여기서 어떤 콘텐츠가 나올지 유용한 정보나 지시를 주지 않는 텍스트죠

반면 Apple Podcasts 라이브러리에서는 '저장된 에피소드가 없다'고 명확하게 말해줍니다 그 다음에 설명해주죠 '듣고 싶은 에피소드를 저장하면' '여기 나타난다'고요 훨씬 낫습니다 정리해 보자면 맥락에 대해서는 사람들이 앱을 사용하면서 뭘 하고 있을지 앱을 벗어나서 생각하세요

맥락과 관련된 알림을 쓰고 명확한 선택지를 제공하시고요

또, 적절한 톤을 이용하고 도움이 되는 지침을 주어 빈 공간을 유용하게 만들어 보세요

마지막으로 '공감'에 대한 이야기입니다

사용자 경험 라이팅에서 '공감'이란 모드를 위해 쓰는 것을 목적으로 한다는 뜻입니다 앱에는 뮤지션, 게이머, 다른 개발자와 같은 특정 사용자층이 있고 그들에게 말을 해야 하죠 하지만 그 누구도 배제하고 싶진 않으실 겁니다 속담, 유머는 모두가 이해하기 힘들고 번역하기도 어렵기에 간단하고 평이한 언어를 사용하는 것이 가장 좋습니다

여기서 핵심은 현지화 요구에 반응해야 한다는 겁니다 여러분이 만든 앱은 전세계에서 사용될 수 있죠 정말 멋진 기회입니다! 앱이 다양한 언어와 문화에 적응해야 한다는 뜻이기도 하죠

한 언어에서 다른 언어로 번역할 때 문구가 더 길어지거나 짧아질 수 있습니다 어떤 언어는 수직으로 써야 하기도 하죠 왼쪽에서 시작하는 언어로 앱을 사용하는 이도 있겠지만 반대의 경우도 있습니다 예시를 한 번 보죠 iPhone에서 언어 변경 시 나타나는 확인 창인데요 영어에서 태국어로 변경했습니다

영어 알림창 문구는 '설정 적용 시 iPhone이 재시작한다'이고 '태국어로 변경'과 '취소'라는 두 개 버튼이 있죠

태국어에서는 상단 텍스트가 약간 더 깁니다 공간도 더 큰 문자에 따라 조정됐습니다 네덜란드어에서는 텍스트가 훨씬 깁니다 텍스트가 두 줄이라 상단 공간이 더 넓어졌고요 히브리어는 오른쪽부터 읽는 언어죠

문구 길이 외에도 여러 가지를 고려해야 하는데요 미국 영어에서는 요일에 대한 달력의 약자가 M, T 등과 같이 문자 하나로 되어 있는데요

카탈루냐어에서는 요일의 약자가 두 글자입니다 한 글자로 된 어미 변화가 없거든요 한편, 아랍에서는 약자를 전혀 쓰지 않네요 UI는 이런 언어 변화에 적응할 수 있어야 합니다

이제 '접근 가능성'을 알아 볼까요? 앱에서 모든 사람들을 환영하는 건 중요합니다 앱이 가능한 많은 사람들에게 사용되기 위해서는 가능한 많은 사람들에게 말해야 하죠 시각 장애인이나 눈이 잘 보이지 않는 사용자는 글씨를 더 키우거나 VoiceOver 사용이 가능합니다

앱 요소 라벨링을 위해 사용하는 언어에 집중하세요 앱의 문구들은 앱 사용자들이 경험하는 모든 것입니다 여러분도 그 경험이 잘 디자인되길 바라시죠?

모든 요소의 텍스트는 유용하고 사려 깊고 기술적이어야 합니다 링크와 버튼 같은 내비게이션 아이템에 대한 Voice Over 텍스트와 심볼, 그래프, 이미지도요 Voice Over 앱은 미모티콘을 어떻게 설명하고 있을까요? 첫 번째는 이렇네요 '마치 비밀을 공유하는 듯' '손을 입 옆에 대고 고개를 옆으로 기울인 사람' 이 텍스트에는 신체적 묘사만 포함된 게 아닙니다 '비밀을 공유하는 듯'이라는 의도도 들어가 있죠

두 번째는 이렇습니다 '팔을 내리고' '검지를 만지고 있는 명상 중인 사람' 여기도 팔과 검지에 대한 신체적 묘사와 함께 명상이라는 맥락이 기술되어 있습니다

세 번째 예시에서도 맥락과 자세를 기술합니다 '손톱을 물어뜯는 긴장한 사람'이라고요 각각의 예시가 '사람'으로 기술되어 있는 것에 주목하세요 '남자'나 '여자'가 아닙니다 특정 성별을 불필요하게 언급하지 않음으로써 모두가 환영받는다는 느낌을 줄 수가 있습니다 모두 똑같이 배려하는 마음으로 기술하는 언어를 사용하세요 앱 라이팅에서 공감을 사용하는 건 중요합니다 단순한 언어를 사용해 모두를 위해 쓰세요

텍스트 크기 변경 등 현지화에 반응하세요

접근 가능성을 고려해 디자인하세요 사려깊은 텍스트를 사용하세요 앱 언어를 자주 검토해 변경하셔도 됩니다 두려워하지 마세요 언어는 계속해서 발전하기에 앱 문구 또한 그래야 합니다 이 주제에 대해 아셔야 할 게 훨씬 더 많은데요 포용적 앱 디자인에 대해 더 알아보시려면 Human Interface Guidelines를 참고하세요 오늘은 '목적', 예상' '맥락', '공감'에 대해 이야기해 보았습니다 앱이나 게임 텍스트를 잘 디자인하기 위해 사용할 수 있는 개념들이죠 초기 라이팅 고민의 가치를 나중에 채워야 하는 것이 아닌 디자인 프로세스의 일부라고 이해하셨길 바랍니다 올바른 문구를 찾기 위해 고군분투하고 계시다면 가장 간단한 마지막 팁을 드리겠습니다 문구를 크게 소리내어 읽어 보세요 문구가 친구에게 말하는 것처럼 대화형으로 들리는지 확인하기에 굉장히 도움이 될 겁니다 불필요하거나 반복되는 문구, 문법 실수, 타이포 등을 찾아낼 수도 있고요 이런 세세한 것들도 중요하죠 인터페이스 라이팅은 스크린 반대편 사람들에 대한 호기심에서 시작됩니다 그들에게 존중과 이해를 갖춰서 말해 보세요 그럼 올바른 문구를 찾게 되시리라 믿습니다