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

돌아가긴 하는데요. 그래서요?

지난 장에서는 「어디가 못생겼는지」를 보는 연습이었어요. 이번 장은 「어디가 쓰기 힘든지」예요. AI가 넘긴 앱은 기능도 있고 누르면 반응도 나는데, 쓰면 곳곳이 거슬려요. 이번 레슨에서 장 전체의 토대를 먼저 잡아요: 인터랙션의 병은 미학의 병보다 더 숨어 있어요. 그다음 이론 체크리스트를 들고, 다섯 군데를 직접 잡아 볼게요.

서론·논점배려 체크리스트흠잡기 실험자가 점검 투표
한눈 vs 한 바퀴

미학의 병은 빨리 드러나요. 페이지를 열자마자 색이 난잡하고 간격이 빽빽하면, 삼 초 만에 미간이 찌푸려져요. 인터랙션의 병은 깊이 숨어요. 데모 이 분 동안은 멀쩡하다가, 실제 사용자가 데이터를 잘못 지우고, 한 번 끊기고, 텅 빈 첫 화면을 열 때야 병이 터져요.

이게 Vibe Coding 시대의 새 함정이에요. AI가 「만들어 내기」를 쉽게 만들었고, 기본으로 넘기는 인터랙션은 「돌아간다」 수준에 멈춰요: 빈 상태는 텅 비고, 오류는 alert, 삭제는 확인 없음, 저장해도 반응이 없어요. 검수할 때 두 번 눌러 보면 괜찮아 보이는데, 사용자는 일주일 만에 지우고 싶어요.

차원미학의 병인터랙션의 병
드러나는 때페이지를 연 뒤 처음 삼 초써 본 뒤: 잘못 삭제, 오프라인, 첫 실행
누가 먼저 발견본인이 한눈에도 알아채요대개 사용자가 대신 발견하고, 대가는 이탈이에요
AI가 틀리는 모습알록달록, 글자 크기가 싸워, 보기만 해도 이상해요데모에선 멀쩡하고, 엣지 케이스는 전부 함정이에요
검수 방식보기: 스크린샷만으로 리뷰 가능쓰기: 흐름을 한 바퀴 돌리고, 나쁜 상황도 다 해 봐요
예쁜지 못생긴지는 한눈에 보이고, 쓰기 좋은지는 써 봐야 알아요. 그래서 인터랙션의 병은 더 숨고, 체크리스트로 받쳐 줘야 해요.
배려는 체크리스트예요. 뒤집으면 흠잡기 목록이 돼요

목록은 어디서 왔을까요? Alan Cooper가 《About Face 4》 제 8장 「디지털 제품의 예절」에서 답을 냈어요. Nass와 Reeves의 연구를 빌려, 설계 원칙 하나로 정리했죠:

「소프트웨어는 사람처럼 배려해야 해요.」
Alan Cooper, 《About Face 4》 제 8장

Cooper의 관찰은 뼈를 때려요. 인터랙션 제품이 우리를 화나게 하는 이유는 대개 기능 부족이 아니라 배려 없음이에요. 배려하는 소프트웨어의 특성을 십여 가지 적었고, AI 산출물을 점검하기에 가장 맞는 여섯 가지를 골랐어요. 각 줄을 거꾸로 읽으면, 그게 곧 흠잡기 기준이에요.

배려하는 소프트웨어는…Cooper의 뜻AI 기본 산출의 반대
미리 내다봐요다음에 뭘 원할지를 예측하고 미리 준비해요처음 열면 텅 비어 있고, 다음 단계는 전부 짐작이에요
제때 알려 줘요관심 있는 진행은 먼저 말해 주고, 묻게 두지 않아요저장을 눌러도 반응이 없고, 돌아가도 말이 없어요
자기 문제로 귀찮게 하지 않아요기술 장애는 스스로 삼키고, 코드 냄새 나는 말로 떠넘기지 않아요네트워크가 끊기면 Error: code 500을 얼굴에 들이밀어요
자신 있게 하되, 퇴로는 남겨 둬요말한 대로 하고 되묻지 않아요. 실수하면 복구를 도와줘요지우기 전에 세 번 묻거나, 지우면 정말 끝이에요
쓸데없는 질문은 안 해요기억할 선택은 기억하고, 줄 수 있는 기본값을 줘요열 때마다 같은 질문을 또 해요
어설픈 실수를 막아 줘요실수하려는 걸 보고 조용히 잡아 주고, 탓하지 않아요잘못 지우는 걸 보고만 있다가 「작업 실패」 팝업을 띄워요

표의 오른쪽 열이 바로 다음 흠잡기 실험의 표적이에요. 외우지 말고, 한 번 잡아 보면 기억에 남아요.

이 장과 앞뒤 장의 역할도 짧게 정리해요. 미학 엔지니어링은 예쁨, 이번 장은 쓰기 좋음, 심리학 편은 사용자 느낌. 세 장이 각각 검수 체크리스트 한 장씩 내놓으면, 그게 「출시 전 체크리스트 세 장」이에요.

좋은 소식도 있어요. 이 여섯 병 AI가 다 고칠 수 있어요. 기본값이 안 고칠 뿐이죠. 병명을 말할 수 있으면 처방을 내요. 장 전체가 「뭘 원하는지 분명히 말하기」를 반복 연습하는 이유예요.

실습 · 배려 없는 지점 다섯 곳, 하나씩 눌러 보세요

아래는 AI가 만든 할 일 앱 「오늘의 할 일」이에요. 기능은 갖춰져 있고, 돌아가요. 여기에 배려 없는 지점 다섯 곳이 이 화면에 다 있어요. 어색한 데를 누르면 돼요. 맞히면 오른쪽에 진료 카드가 세워지고, 체크리스트의 어느 줄을 어겼는지·어떻게 고칠지 적혀 있어요.

「오늘의 할 일」 흠잡기 0 / 5 찾음
다섯 곳은 상단 배너, 도구 모음, 오류 바, 목록, 보관 영역에 있어요. 잘못 눌러도 벌은 없어요
todo.example.com
8월 11일 · 3개 남음 저장
야간 모드를 켤까요? 켜기 괜찮아요 열 때마다 또 물어요
Error: request failed with status code 500 확인
고양이 동결건조 간식 사기오늘 18:00 · 쇼핑×
이번 달 전기요금 내기내일까지 · 생활 납부×
집주인에게 답장하기이미 이틀 미룸×
오늘보관됨
진료 카드가 여기 쌓여요. 제일 거슬리는 곳부터: 한 초라도 더 생각하게 만든 블록이, 문제 있는 블록이에요.
다섯 곳 전부 맞췄어요. 진료 카드 다섯 장을 다시 보면: 기능 부족은 한 곳도 없어요. 앱은 그대로 돌아가요. 병은 전부 예절에 있어요. 그게 Cooper 그 말의 뜻이에요. 사용자를 화나게 하는 건 대개 배려 없음이고, 기능 부족은 뒤로 밀려요. 빈 상태와 오류 고치는 법은 다음 레슨 전체에서, 지우면 끝은 3레슨의 오류 방지와 되돌릴 수 있음에서 다뤄요.
저장 성공, 북 치고 장구 쳐야 할까요

흠잡기 목록에는 헷갈리기 쉬운 병 한 쌍이 있어요. 피드백이 없는 것도 병이고, 피드백이 지나친 것도 병이에요. Cooper가 제 8장에서 콕 집었어요. 인터랙션 제품은 불필요한 알림으로 자랑하기를 좋아해요. 「문서 저장 성공!」 같은 팝업은 닫히기만 기다리고, 흐름을 끊을 뿐이에요. 아래 편집기 둘 다 저장 피드백이 있어요. 더 배려한다고 생각하는 쪽을 눌러 주세요.

같은 저장 동작, 피드백 두 가지 A/B 대결
카드를 눌러 투표하면, 판정이 열려요
방안 A
docs.example.com/weekly
주간 보고서 초안총 486자 · 마지막 편집 21:47저장

이번 주 주문 내보내기 기능을 마무리했어요. 연동 통과, 목요일에 이미 출시.

다음 주 계획: 내보내기 형식을 Excel까지 확장. 영업일 사흘 예상…

알림
저장 성공!
확인
저장할 때마다 팝업으로 축하해요. 「확인」을 눌러야 다시 쓸 수 있어요
방안 B
docs.example.com/weekly
주간 보고서 초안총 512자 · 마지막 편집 21:47저장됨

이번 주 주문 내보내기 기능을 마무리했어요. 연동 통과, 목요일에 이미 출시.

데이터 쪽에서 최근 30일 리텐션 보드를 채웠고, 지표는 제품과 맞춰 봤어요.

다음 주 계획: 내보내기 형식을 Excel까지 확장. 영업일 사흘 예상…

자동 저장됨 · 방금
버튼이 자리에서 「저장됨」으로 바뀌고, 구석에 타임스탬프 한 줄. 손은 멈추지 않아요
한 표 주세요 · 어디까지 참아 왔나요

흠잡기 목록을 봤으니, 매일 쓰는 소프트웨어—AI로 직접 만든 것 포함—를 떠올려 보세요. 배려 없음 여섯 가지 중 제일 많이 당한 하나를 고르고, 남들은 뭘 참는지 확인해 보세요.

배려 없음 여섯 가지, 뭐가 제일 괴롭나요 한 표 주세요
한 줄을 눌러 한 번만 투표해요. 끝나면 분포가 보여요
텅 빈 상태, 다음 단계는 짐작뿐
오류가 전부 코드 은어
손 미끄러져 지웠는데, 못 찾음
눌렀는데 반응 없음, 됐는지 모름
같은 질문을 매번 또 물음
한 번 죽고, 한참 쓴 게 전부 사라짐
인터랙션 검수, 이 순서로 세 번 돌아요

흠잡기 목록은 생겼고, 쓰는 자세가 남았어요. 미학 검수는 스크린샷이면 되지만, 인터랙션 검수는 손으로 흐름을 돌아야 하고, 세 번·매번 다른 역할로 돌아야 해요.

몇 번째누구 역할어떻게무슨 병을 잡나
첫 번째단골 사용자이상 경로를 따라 메인 플로를 끝까지저장했는데 반응 없음, 끝없이 물어봄 같은 일상 마찰
두 번째재수 없는 사용자일부러 실수: 한 줄 삭제, 네트워크 끊기, 형식 잘못, 제출 두 번오류가 남 탓하기, 지우면 끝, 죽으면 전부 날아감
세 번째신규 사용자데이터를 비우고 처음부터. 첫 화면마다 멈춰 보고텅 빈 상태, 다음 단계는 짐작뿐

두 번째·세 번째가 제일 자주 생략되고, AI의 병은 딱 거기에 쌓여요. 데모가 보여 주는 건 언제나 첫 번째: 네트워크 원활, 데이터 준비됨, 경로 반듯. 사용자를 대신해 나머지 두 번을 돌리면, 출시 전에 병을 잡아요.

돌릴 때 배려 체크리스트를 옆에 두고, 화면마다 물어보세요. 미리 내다보나요? 알려 주나요? 남 탓하나요? 퇴로는 있나요? 쓸데없는 질문을 하나요? 어설픈 실수를 막아 주나요? 물음표 여섯 개를 지나면, 그 화면 검수는 끝이에요.

골라 보세요 · 왜 인터랙션의 병이 더 숨나요
AI가 잘 돌아가는 앱을 넘겼는데, 왜 인터랙션 문제가 제일 잘 빠져나가나요? 객관식
틀려도 설명이 있어요. 맞힐 때까지 고르세요
AAI가 쓴 인터랙션 코드에 버그가 더 많아서요
B인터랙션 문제는 실제 사용에서만 드러나고, 검수할 때 두 번 눌러서는 그 순간에 닿지 않아서요
C사용자는 인터랙션을 안 보고 기능만 보니까요
D인터랙션 디자인에 기준이 없어서 맞고 틀림을 못 가리니까요
핵심 요점

인터랙션의 병은 더 숨어요: 미학 문제는 삼 초에 드러나고, 인터랙션 문제는 잘못 삭제·오프라인·첫 실행 때까지 참았다가, 대개 사용자가 대신 발견해요.

「돌아간다」는 합격선일 뿐이에요: AI 기본 인터랙션은 「돌아간다」에 멈춰요. 사용자를 화나게 하는 건 대개 배려 없음이고, 기능 부족은 뒤로 밀려요(Cooper, 《About Face 4》 제 8장).

배려 체크리스트를 뒤집으면 흠잡기 목록이에요: 미리 내다보기, 제때 알리기, 남 탓 안 하기, 자신 있게 하되 퇴로 남기기, 쓸데없는 질문 않기, 어설픈 실수 막기. 여섯 줄을 AI 산출물에 하나씩 대보세요.

인터랙션 검수는 쓰고, 보기만 하지 마세요: 흐름을 한 바퀴 돌리고, 나쁜 상황도 다 해 보세요: 한 줄 삭제, 네트워크 끊기, 새 계정 열기. 다음 네 레슨에서 흠잡기 손잡이를 하나씩 풀어요. 먼저 상태 3종 세트부터.

콘텐츠 출처: 샤오산 아카데미 「인터랙션 엔지니어링」 특집 오리지널; 일부 인터랙션 원칙은 《About Face 4: 인터랙션 디자인의 정수》에서 정리했어요.