인터랙션 엔지니어링 · 7 / 10

UI는 말한다: 사용자는 카피를 어떻게 읽나

컨트롤을 잘 골라도 UI는 말을 해야 해요. 버튼 두 글자, 다이얼로그 한 문장이 제품과 사용자의 전부 대화예요. 마이크로카피는 인터랙션의 절반이에요: 잘 쓰면 사용자가 안 생각해도 되고, 틀리면 컨트롤이 표준이어도 소용없어요. AI의 마이크로카피 비법은 하나—무슨 일이든 「확인」.

버튼 동사확인 / 취소시스템 말 번역다이얼로그 고치기
「확인」은 제일 바쁜 버튼이자, 제일 쓸모없는 버튼

오늘 「확인」을 몇 번 눌렀는지 세어 보세요. 삭제·제출·종료·덮어쓰기·비우기 다이얼로그에 같은 단어가 백 가지 결과를 보증해요. 문제는 여기예요: 버튼 자체에 답이 없고, 답은 본문에 있어요. 사용자는 문단을 다 읽어야 이번 탭이 뭔지 알죠. 「확인 / 취소」 짝은 게으른 거예요—읽기 비용을 사용자에게 떠넘겨요.

처방은 버튼에 결과를 실는 거예요. 「확인」을 「이 3개 삭제」로, 「취소」를 「그대로 두기」로 바꾸세요. 본문을 한 글자도 안 읽어도 버튼만 훑으면 안전하게 답할 수 있어요. Cooper는 About Face 4 21장에서 기능 다이얼로그에 같은 규칙을 세워요: 제목에 동사를 쓰세요. 제목은 뭘 확인하는지, 버튼은 누르면 뭐가 되는지—양쪽 다 사용자가 추측하지 않게.

「기능 다이얼로그 제목에는 동사를 쓰세요.」
Alan Cooper, About Face 4 21장: 동사는 동작과 결과를 싣고, 명사와 「알림」은 아무것도 안 실어요.

이 규칙의 테스트 버전도 있어요: 본문을 가리고 제목과 버튼만 보고 안전하게 답할 수 있나요? 되면 카피 합격, 본문을 다시 봐야 하면 여전히 「확인 / 취소」의 게으른 변종이에요. 먼저 몇 가지 대조를 보며 동사 버튼의 감촉을 익혀 보세요.

장면게으른 버전결과를 실은 버전
장바구니 비우기확인 / 취소12개 비우기 / 일단 두기
편집 나가기예 / 아니요저장하고 나가기 / 변경 버리기
휴대폰 번호 연결 해제계속 / 뒤로138****2046 연결 해제 / 해제 안 함

「결과를 실은 버전」의 부산물도 보세요: 수량과 대상이 버튼에 함께 들어가요(12개, 138****2046)—사용자를 대신해 마지막 확인을 한 셈이죠. 오조작은 대개 「다른 묶음을 고른 줄 알았어」에서 나와요. 버튼이 대상을 말해 주면 그 오해가 바로 풀려요.

사용자 말, 시스템 말

버튼 밖, 두 번째 재난 구역은 명사예요. 화면에 「필드 user_mobile 검증 실패」「유일성 제약 위반」이 적혀 있어요—사용자 아무도 모르는 말, DB와 로그에서 그대로 끌어온 거죠. Cooper는 14장에서 뿌리를 파요: 개발자가 DB 요구를 사용자 요구보다 앞에 두니, 소프트웨어는 CPU를 섬기고 사용자는 소프트웨어를 위해 일하는 꼴이 돼요.

14장에는 자주 인용되는 원칙도 있어요: 오류가 프로그램 탓이 아닐 수 있어도, 책임은 프로그램의 것. 휴대폰 번호가 한 자리 모자라고 사용자명이 중복되는 건 사용자 「실수」지만, 그 오류를 듣고 고칠 수 있는 말로 번역하는 건 프로그램 몫이에요. 메뉴 이름도 예외가 없어요. Cooper는 「파일」조차 구현 모델의 말이라 보고, 인보이스 앱 메뉴는 「인보이스」여야 한다고 해요. 사용자가 자기 물건을 뭐라고 부르면, UI도 그렇게 부르세요.

시스템 말진짜 하고 싶은 말병근
이 작업은 취소할 수 없습니다「이 작업」이 뭔 작업이에요? 말하세요시스템 시점의 지시—사용자가 직전 단계를 스스로 떠올려야 함
Error 422어디가 틀렸고, 어떻게 고치나HTTP 상태 코드는 개발자용 로그(2강 병력)
Session 만료로그인이 만료됐어요. 다시 로그인하면 돼요Session은 구현 모델 말, 사용자 말은 「로그인」

AI가 UI를 쓸 때 이 병에 특히 잘 걸려요: 데이터 구조를 보고 카피를 만들고, 필드 이름이 곧 라벨이 돼요. 막지 않으면 DB가 무대에 올라 연설하죠. 아래에서 다이얼로그를 직접 고쳐, 카피 세 곳을 사람 말로 바꾸고 mock이 바로 바뀌는 걸 보세요.

실습 · 다이얼로그 고치기, mock이 바로 바뀜

왼쪽 삭제 확인 다이얼로그는 AI가 실제로 내는 수준이에요: 제목 「알림」, 본문 모호, 버튼 「확인 / 취소」. 오른쪽 세 곳에서 「사람 말로」를 하나씩 누르세요. 고칠 때마다 다이얼로그가 바로 갱신되고, 세 곳을 다 고친 뒤 본문 가리기 테스트를 하세요.

버튼 카피 고쳐쓰기 고침 0 / 3
장면: 사용자가 메일 3통을 고르고 삭제를 눌렀어요. 오른쪽 각 줄의 「사람 말로」를 누르면 왼쪽 다이얼로그가 바로 바뀌어요
mail.example.com/inbox
알림
이 작업을 실행하시겠습니까? 이 작업은 취소할 수 없습니다.
취소 확인
제목알림사람 말로 →
이 메일 3통을 삭제할까요?
「알림」은 정보량이 제로예요. 기능 다이얼로그 제목은 동사를 쓰세요(21장)—동작과 수량을 제목에 넣으면 사용자는 한눈에 뭘 확인하는지 알아요.
본문이 작업을 실행하시겠습니까? 이 작업은 취소할 수 없습니다.사람 말로 →
삭제하면 「휴지통」으로 가고 30일 보관된 뒤, 그다음에야 영구 삭제돼요.
「이 작업」은 시스템 시점의 지시예요—사용자가 방금 뭘 눌렀는지 스스로 떠올려야 하죠. 본문은 결과 디테일을 말해야 해요: 어디로 가고, 얼마나 남고, 아직 살릴 수 있는지.
버튼취소 / 확인사람 말로 →
그대로 두기 / 이 3통 삭제
「확인 / 취소」는 답을 전부 본문에 걸어요. 버튼이 각자 결과를 싣고, 위험한 쪽을 빨간색으로 바꾸면—본문을 한 글자도 안 읽어도 잘못 누르지 않아요.
대결 · 어느 다이얼로그가 더 위험한가

위험의 정의부터: 사용자가 이해 못 해도 눌러 버리는 그거야말로 위험이에요. 지난 강의 「늑대다」 실험에서 봤듯이, 사용자가 다이얼로그에 쓰는 평균 시간은 한 줄도 못 읽어요. 카피가 흐린 다이얼로그는 사각에 칼을 두는 셈이죠. 아래 둘 다 고객 데이터를 지워요—사용자에게 맡길 용기가 나는 쪽을 누르세요.

흐린 카피 vs 분명한 카피 A/B 대결
사용자에게 맡길 용기가 나는 쪽을 누르세요. 투표 후 다른 쪽이 어디가 위험한지 공개돼요
방안 A
crm.example.com/customers
경고
이 작업은 선택된 데이터에 영향을 줍니다. 계속하시겠습니까?
취소확인
어떤 데이터에, 어떻게 영향이 가는지—전부 사용자 상상력에 맡김
방안 B
crm.example.com/customers
이 고객 3명을 삭제할까요?
이름 아래 팔로업 기록 24건도 함께 삭제돼요. 삭제 후 30일 안엔 휴지통에서 되돌릴 수 있어요.
그대로 두기이 3명 삭제
대상, 연쇄 결과, 퇴로—세 가지가 모두 드러나 있음
실습 · 시스템 말을 사람 말로 번역

버튼 다음은 명사예요. 아래 다섯 줄은 AI가 UI에 그대로 올리기 좋아하는 시스템 말이에요. 각 줄에서 진짜 사람 말 번역을 고르세요. 주의: 어떤 선택지는 시스템 말만 꾸민 거라, 뼈대는 여전히 로그예요.

시스템 말 번역 문제 0 / 5
각 줄에서 번역 하나를 고르세요. 틀리면 설명이 나오고, 다시 고를 수 있어요
DB_CONN_TIMEOUT
A데이터베이스 연결 시간 초과(오류 코드 10060). 잠시 후 다시 시도하십시오.
B방금 서버에 연결되지 않았어요. 작성한 내용은 이 기기에 저장돼 있고, 네트워크가 돌아오면 자동으로 다시 시도해요.
꾸며 입은 시스템 말이에요. 「데이터베이스」「오류 코드」는 여전히 구현 모델 말. 사용자는 어느 구간이 타임아웃됐는지 관심 없고, 내 게 사라졌는지, 내가 뭘 해야 하는지만 궁금해요.
맞아요. 데이터베이스 얘기는 한마디도 없어요. 사용자가 제일 무서워하는 것(내용이 안 사라짐)부터, 그다음 행동 필요 여부(손댈 필요 없음, 자동 재시도). 기술 장애는 스스로 삼켜요—2강 3요소의 명사 버전이에요.
필드 user_mobile 검증 실패
A휴대폰 번호가 한 자리 모자라요. 지금 10자리예요. 하나 더 채우면 제출할 수 있어요.
B휴대폰 번호 형식이 올바르지 않습니다. 확인 후 다시 입력하십시오.
맞아요. user_mobile을 「휴대폰 번호」로 바꾼 건 겨우 합격선. 「한 자리 모자람」까지 말해야 검증 결과 번역이 끝난 거예요—사용자가 세지 않아도 어떻게 고칠지 알아요.
「올바르지 않음」에 「확인하십시오」를 붙이면, 사용자가 검증기를 다시 돌리게 하는 셈이에요. 프로그램은 어디가 부족한지 이미 알아요—말하는 게 그 책임이에요(14장).
Session 만료, Token 무효
A세션 자격 증명이 만료되었습니다. 액세스 토큰을 다시 발급받으십시오.
B로그인이 만료됐어요. 다시 로그인하면 이어서 편집할 수 있고, 초안은 그대로 있어요.
Session을 「세션 자격 증명」, Token을 「액세스 토큰」으로 바꾸면 말은 한글이지만, 모델은 여전히 구현 모델이에요. 사용자 사전엔 「로그인」만 있어요.
맞아요. 사용자 말(로그인), 분명한 출구(다시 로그인), 제일 급한 안심(초안이 있음)—한 문장에 세 가지를 다 처리해요.
404 Not Found: /orders/8291
A요청한 리소스가 존재하지 않습니다. 주소가 올바른지 확인하십시오.
B이 주문을 찾을 수 없어요. 취소됐을 수 있어요. 「전체 주문」에서 보거나, 고객센터에 문의해 보세요.
「리소스」「주소」는 HTTP 말이에요. 사용자가 누른 건 주문이고, 그 세상엔 리소스가 없고 주문만 있어요.
맞아요. 사용자 말(주문)로 현황을 말하고, 출구 두 개(목록으로, 고객센터)를 줘요. 404 같은 막다른 페이지에선 출구가 설명보다 값져요.
이 작업은 유일성 제약을 위반합니다
A이 사용자명은 이미 쓰이고 있어요. 다른 걸 시도해 보세요—숫자를 붙여도 좋아요.
B데이터가 중복되어 작업이 거부되었습니다. 수정 후 다시 시도하십시오.
맞아요. 「유일성 제약」은 DB가 스스로 세운 규칙이고, 사용자 눈엔 「이름이 이미 차지됨」이에요. 팁(숫자 붙이기)을 주면 막다른 길이 갈림길이 돼요.
「데이터 중복」이 「유일성 제약」보다 조금 낫지만, 어떤 데이터가, 누구와, 어떻게 해야 하는지—하나도 안 말해요. 번역은 사용자가 행동할 수 있을 때까지예요.
오류 메시지 3요소, 2강에서 이미 다룸

여기까지 오면 2강의 오류 카피 고쳐쓰기가 떠오를 거예요: 무슨 일, 왜, 어떻게. 그 3요소가 오류 메시지의 뼈대이고, 이번 강의는 뼈대 안 단어 선택이에요. 둘이 합쳐져야 완전한 카피 실력. 3요소는 다시 안 가르치고, 점프 카드는 여기 있어요.

이 장 인용 · 상태 3종 세트: 로딩, 빈 상태, 오류 상태오류 메시지 3요소(무슨 일, 왜, 어떻게)와 약한 카피 세 줄의 완전한 고쳐쓰기는 2강에서 다 다뤘어요. 여기를 눌러 건너뛰세요.

마지막 종합 문제: 이번 강의 버튼 실력과 위 3요소를 함께 시험해요.

문서 닫을 때 저장 안 된 변경이 있으면, 버튼 조합을 어떻게? 객관식
틀려도 설명이 나와요. 맞을 때까지 고르세요
A「확인 / 취소」, 본문에 저장 안 된 변경이 사라진다고 명시
B「저장하고 닫기 / 저장 안 함 / 취소」—버튼 세 개가 각자 결과를 실음
C「예 / 아니요」, 본문이 「저장할까요?」라고 물음
D「알겠어요」, 변경이 사라진다고 알림
핵심 요점

버튼이 결과를 싣는다: 「확인」을 「이 3개 삭제」로, 「취소」를 「그대로 두기」로. 검수 기준: 본문을 가리고 제목·버튼만 봐도 안전하게 답할 수 있어야 해요.

사용자 말을 쓰세요: Session, 필드명, 오류 코드는 구현 모델 말—사용자에게 들이밀지 마세요(Cooper, About Face 4 14장). 번역은 사용자가 행동할 수 있을 때까지.

오류는 프로그램의 책임: 사용자 입력은 틀릴 수 있어요. 그 틀림을 듣고 고칠 수 있는 말로 말하는 건 프로그램 몫. 사용자를 탓하지 마세요. 3요소 뼈대는 2강.

AI에게 요구하는 말: 「버튼 카피는 동작과 수량을 명시하고, 『확인 / 취소』 짝을 금지. UI 문구에 필드명·오류 코드·Session 등 시스템 말을 넣지 말 것」. UI 디테일은 여기까지, 다음 강의부터 이 요구를 AI에게 번역해 들려줘요.

콘텐츠 출처: 샤오산 아카데미 「인터랙션 엔지니어링」 특집 오리지널; 일부 인터랙션 원칙은 About Face 4: The Essentials of Interaction Design에서 정리.