MEJE BOOKS 읽기 사이트

KIM DONG-EUN · FTUE 최초 사용자 경험

16 비집중상태의설계

김동은WhtDrgon. · Chapter 16

16장. 비집중 상태의 설계: 소음·오염 속의 버튼과 LED


첫 화면은 집중한 사람을 위해 만들면 안 된다. 사용자가 그 화면을 어디서 켤지 우리는 고를 수 없고, 켜는 사람의 적지 않은 수가 이미 반쯤 딴짓 중이기 때문이다. 앞 장에서 공들여 또렷하게 만든 세계의 답도, 받을 사람이 절반만 보고 있으면 절반밖에 닿지 않는다.

우리는 화면을 만들 때, 그 화면을 볼 사람도 우리처럼 그것만 본다고 가정한다.

기획자가 첫 화면을 들여다보는 순간을 떠올려 보자. 조용한 사무실에서 큰 모니터를 앞에 두고 두 손 다 자유로운 채 머릿속엔 이 화면 생각뿐인 상태로, 몇 시간을 들여다보며 버튼 위치를 다듬고 글자 크기를 고른다. 문제는 그 화면을 실제로 만날 사람이 그 사무실에 없다는 것이다. 그는 흔들리는 버스 안에서 한 손으로 손잡이를 잡고 다른 손 엄지로 화면을 조작하며, 옆 사람 통화 소리와 정류장 안내 방송 사이에서 내릴 정거장을 신경 쓰며 화면을 본다. 만든 사람은 집중의 끝에서 화면을 보고, 쓰는 사람은 산만함의 한복판에서 화면을 본다.

이 어긋남에서 이 장이 시작한다. 첫 경험을 설계할 때 가장 흔히 깔리는 거짓 전제가 "사용자는 화면에 집중하고 있다"여서, 거의 모든 화면이 조용한 방에 앉은 사람을 위해 그려진다. 그런데 우리가 잡으려는 일반인은 지하철 한 정거장, 엘리베이터를 기다리는 짧은 짬에 흘러든 사람이다. 그에게 우리 게임은 유튜브·숏폼과 같은 줄에서, 그것도 그가 절반만 보고 있는 동안 경쟁한다. 집중한 사람을 위한 화면을 만들면, 정작 그 화면을 만날 산만한 사람을 놓친다.

물론 모든 첫 실행이 버스 안에서 일어나지는 않는다. 자기 전 침대처럼 꽤 집중된 자리에서 처음 켜는 사람도 분명히 있다. 그러나 사용자가 어디서 켤지를 우리가 고를 수 없으니, 설계는 가장 나쁜 조건에 맞출 수밖에 없다. 그리고 이렇게 맞춰도 손해 보는 쪽이 없다. 산만한 사람을 통과시키는 화면은 집중한 사람도 통과시키지만, 집중한 사람만 통과시키는 화면은 산만한 사람을 떨어뜨린다. 한쪽으로만 기우는 이 비대칭 덕분에, 산만함을 기본값으로 두는 것은 단정이 아니라 추론이 된다. 보도 턱을 깎아 만든 경사로가 본래 휠체어를 위한 것이었지만 유모차를 미는 사람과 여행 가방을 끄는 사람까지 모두를 돕게 되었듯이, 가장 어려운 조건에 맞춘 설계는 나머지 모두에게도 편하다.

같은 화면, 조용한 방과 시끄러운 버스에서

가상의 캐릭터 게임으로 들어가 보자. 캐릭터를 모으고 대화하고 짧은 영상을 보는 모바일 게임이고, 첫 화면에서 사용자는 첫 캐릭터로 삼을 동물을 하나 고른 뒤 색과 무늬를 손본다. 조용한 방에서 이 화면을 보면 아무 문제가 없다. 후보 동물 여섯이 줄지어 있고 위쪽엔 진행 단계가 작은 점으로 표시되고 한쪽 구석엔 도움말 물음표와 설정 톱니가 얌전히 놓여 있어, 차분히 보면 다 읽힌다.

같은 화면을 흔들리는 버스로 옮겨 본다. 엄지 하나로만 닿고, 눈은 아주 짧게 화면을 봤다가 창밖을 보고 다시 화면으로 돌아온다. 이제 후보 여섯은 한눈에 안 들어오고 어느 게 지금 고른 건지 헷갈리며, 진행 단계 점은 너무 작아 보이지도 않는다. '다음'으로 넘어가는 버튼은 화면 위쪽 구석에 있어서 손잡이를 잡은 손의 엄지가 닿지 않고, 색을 잘못 골랐는데 어디를 눌러야 되돌아가는지 모르겠다. 그는 잠깐 버티다 앱을 닫는다. 화면이 나빠서가 아니라, 조용한 방의 사람을 위해 그려진 화면을 시끄러운 버스의 사람이 만났기 때문이다.

MEJE 아이동월드에서는 이 산만함이 한층 더 심하다. 강아지 아이동을 돌보는 팬도 늘 차분하지 않고, 가만히 앉아 화면만 보는 존재가 아니다. 알림이 오고 다른 앱을 오가고 손가락은 아무 데나 톡톡 친다. 그 와중에도 "지금 여기를 누르면 돼"가 또렷이 빛나야 하고, 팬이 한눈을 팔다 돌아왔을 때 화면이 "아까 뭐 하고 있었지?"를 다시 묻게 하지 않아야 한다. 산만한 팬에게 화면이 침착하게 한 가지만 가리키고 있으면, 팬은 그 한 가지를 누르고 다음으로 간다. 그래서 아이동월드의 첫 세션 화면에서는 우상단의 메뉴와 알림 배지를 전부 잠가 두고, 엄지가 닿는 하단 한가운데에 아이동을 쓰다듬는 버튼 하나만 빛나게 했다. 다른 앱에 다녀온 팬에게는 화면이 마지막으로 만지던 그 자리에서 다시 열리고, 아이동이 먼저 고개를 들어 아까 하던 일을 몸짓으로 가리킨다.

산만한 사람을 위한 세 가지: 지금 누를 것, 지금 상태, 지금 문제

비집중 상태를 기본값으로 두면, 첫 화면이 책임져야 할 것이 세 가지로 좁혀진다. 지금 무엇을 누를지, 지금 어떤 상태인지, 지금 무엇이 잘못됐는지. 이 셋이 한눈에 들어오면 산만한 사람도 통과하지만, 셋 중 하나라도 화면을 뒤져야 알 수 있으면 거기서 사람이 샌다. 11장의 말로 옮기면 이렇다. 같은 화면이라도 산만한 사람에게는 요금이 배로 뛴다. 누를 것을 고르느라 멈추는 것도, 어디까지 했는지 가늠하는 것도, 오류문을 곱씹는 것도 전부 요금인데, 비집중 상태는 그 요금을 낼 잔고가 가장 얇은 상태다.

첫째, 지금 누를 것이 빛나야 한다. 화면에 누를 수 있는 게 열 개여도 지금 이 순간 눌러야 할 것은 보통 하나인데, 그 하나가 나머지 아홉과 같은 무게로 놓여 있으면 산만한 사람은 무엇을 누를지 고르느라 멈춘다. 선택지가 많을수록 결정이 느려진다는 건 오래된 이야기고, 비집중 상태에서는 그 느려짐이 곧 이탈이다. 지금 눌러야 할 하나를 가장 크고 가장 밝게, 그리고 엄지가 닿는 곳에 둔다. 크고 가까운 표적을 사람이 더 빨리 정확히 누른다는 것도 오래된 이야기다. 한 손으로 흔들리는 버스에서 쓰는 사람에게, 화면 위쪽 구석의 작은 버튼은 사실상 없는 버튼이다.

둘째, 지금 상태가 한눈에 보여야 한다. 사용자가 한눈을 팔다 돌아왔을 때, 화면은 "당신은 지금 여기 있고, 이것까지 했고, 이게 다음"이라고 묻지 않아도 말해 주고 있어야 한다. 진행이 점 세 개로 너무 작게 표시되면 돌아온 사람은 자기가 어디쯤인지 다시 가늠해야 하고, 그 가늠이 곧 요금이다. 상태는 작게 속삭이지 말고 크게 보여 줘야 한다. 지금 고른 게 무엇인지, 저장이 됐는지 안 됐는지, 다음이 무엇인지가 곁눈질로도 읽혀야 한다.

이 일을 기계들은 오래전부터 LED로 해 왔다. 공유기나 세탁기 앞면의 작은 불빛은 글자 하나 없이도 켜졌는지, 돌아가는지, 문제가 생겼는지를 색 하나로 전하고, 사람은 지나가다 곁눈질 한 번으로 그것을 읽는다. 화면 가득 글을 쓸 수 있는 시대에도 기계가 불빛 하나를 고집하는 이유는 분명한데, 그 불빛을 볼 사람이 기계 앞에 멈춰 서 있지 않기 때문이다. 첫 화면의 상태 표시가 배워야 할 모범이 바로 이 LED라서, 진행 점 세 개를 조금 더 키우는 일보다 화면 전체가 표시등처럼 한 가지 상태를 한눈에 내뿜게 하는 일이 먼저다.

셋째, 지금 문제가 보여야 한다. 무언가 잘못됐을 때 사용자는 그것을 읽으려고 멈춰 서 있지 않으니, 문제는 사용자의 언어로 한눈에 보여야 한다. 자동차 계기판을 떠올려 보자. 계기판의 경고등은 통상 두 단으로 말한다고 전해진다. 엔진 점검을 알리는 호박색 등은 "가까운 시일에 봐 달라"는 뜻이고, 유압이나 냉각수처럼 빨간 등이 켜지면 "지금 멈추라"는 뜻이다. 어느 쪽이든 운전자는 산소 센서의 전압이 기준을 벗어났다는 설명을 읽지 않는다. 그럴 겨를도 없고 그럴 필요도 없이, 색 하나가 문제의 존재와 급한 정도까지 즉시 전한다. 첫 화면의 오류 표시도 이래야 한다. 무엇이 왜 어떻게 잘못됐는지 길게 설명하는 회색 글자보다 지금 어디가 문제인지 가리키는 또렷한 신호 하나가 산만한 사람에게는 낫고, 계기판의 두 단처럼 지금 멈춰야 할 문제와 나중에 봐도 되는 문제를 색과 무게로 갈라 주면 더 좋다. 설명은 멈춰 선 사람을 위한 것이고, 신호는 지나가는 사람을 위한 것이다.

이 문장은 격언으로 읽고 지나갈 게 아니라 도구로 쓸 수 있다. 첫 화면에 올라간 모든 텍스트를 둘 중 하나로 강제 분류해 보라. 지나가는 사람이 곁눈질로 받는 신호인가, 멈춰 선 사람이 읽어야 하는 설명인가. 설명으로 분류된 문장은 그것을 읽으러 기꺼이 멈춰 설 사람이 오는 자리로 옮기고, 첫 화면에서 설명은 0개를 목표로 삼는다. 무리한 목표처럼 들리지만, 지금 자기 화면의 텍스트를 세어 보면 신호인 줄 알고 넣은 설명이 몇 개인지부터 드러난다.

이 셋을 관통하는 원칙이 사용자의 어휘로 말하기다. 화면에 뜨는 모든 글자는 그것을 만든 사람의 말이 아니라 그것을 읽을 사람의 말이어야 한다. "동기화 실패"는 만든 사람의 말이고, "저장이 안 됐어요. 다시 해 볼까요?"는 쓰는 사람의 말이다. 비집중 상태에서는 한 번 더 곱씹어야 하는 말은 안 읽히고, 곁눈질로 한 번에 뜻이 박히는 말만 살아남는다.

게이머의 정보, 일반인의 소음: 미니맵과 꽉 찬 HUD

비집중 상태를 다루는 장이니, 게임의 관습 하나를 검문소에 세운다. 화면 가장자리를 빈틈없이 채우는 습관이다. 미니맵, 퀘스트 마커, 빼곡한 HUD, 그리고 여기저기 빨갛게 붙는 알림 배지. 미리 말해 두면 '한꺼번에 많이'를 겨누는 검문은 이 책에 세 번 나오는데, 이 장이 보는 것은 읽기의 소음이고, 한꺼번에 많은 할 일을 떠안기는 과부하는 19장이, 한꺼번에 긴 설명을 선청구하는 문제는 21장이 따로 본다.

이 관습이 무엇을 당연하다고 전제하는지부터 본다. 게임 화면의 네 귀퉁이는 보통 정보로 가득하다. 왼쪽 위에 체력과 자원, 오른쪽 위에 미니맵, 화면 곳곳에 퀘스트 마커와 다음 목표 화살표, 메뉴 아이콘마다 새 소식을 알리는 빨간 점. 이 빽빽함은 게이머가 한 화면에서 많은 정보를 동시에 읽을 수 있고 또 읽고 싶어 한다는 전제 위에 서 있고, 이 전제는 액션·전략 게임의 오랜 전통에서 자랐다. 정보가 많을수록 잘 다룰 수 있는 사람에게 빈 화면은 오히려 정보가 모자란 화면이다.

일반인은 이 전제를 공유하지 않는다. 게이머에게 미니맵은 길을 읽는 지도지만 처음 온 사람에게 그것은 화면 구석에서 깜빡이는 알 수 없는 그림이고, 퀘스트 마커는 게이머에게 "저기로 가라"는 친절한 안내지만 일반인에게는 화면 여기저기에 박힌 정체불명의 느낌표다. 빨간 알림 배지는 게이머에게 "확인할 새 소식이 있다"는 신호지만, 다른 앱들에서 그 빨간 점에 시달려 온 사람에게는 또 하나의 빚 독촉처럼 보인다. 같은 요소가 한쪽에는 정보고 한쪽에는 소음이며, 비집중 상태에서는 읽을 줄 모르는 정보가 전부 소음으로 쌓인다.

이 빽빽함이 도를 넘었다는 불만은 게이머들 사이에서도 오래전부터 나왔다. 한 대형 오픈월드 시리즈는 지도를 열면 수십 개의 아이콘이 화면을 뒤덮는 것으로 이름이 났고, 그 위에 깜빡이는 미니맵과 나침반까지 더해져 정작 세계는 뒷전이 됐다는 말을 들었다고 전한다. 한쪽에선 텅 빈 화면을 일부러 아이콘으로 도배해 그 습관을 비꼬는 팬 합성 이미지가 돌기도 했으니, 화면을 채우는 관성이 게임계 안에서도 농담거리가 됐다는 뜻이다. 게이머조차 과하다고 느끼는 빽빽함이라면, 그것을 읽는 법조차 모르는 채 흔들리는 버스에서 만난 일반인에게는 더 말할 것도 없다.

이 관습이 일반인에게 물리는 요금은 정보 과부하다. 산만한 사람은 안 그래도 화면에 절반만 집중하고 있는데, 그 절반의 주의력을 읽을 줄도 모르고 지금 필요하지도 않은 요소 여남은 개가 나눠 가지니, 정작 지금 눌러야 할 하나가 그 소음에 파묻힌다. 화면이 꽉 찼다는 건 풍성하다는 뜻이 아니라 지금 중요한 하나가 어디 있는지 알 수 없게 됐다는 뜻이다. 게이머는 이 빽빽함을 헤치고 자기에게 필요한 정보를 골라내는 데 익숙하지만, 일반인은 그 골라내기 자체가 요금이다.

본질만 남기고 바꾼다. 첫 화면에서는 가장자리를 비우고, 미니맵·마커·배지는 그것을 정보로 읽을 사람이 와 있고 그가 그것을 찾는 순간에만 하나씩 켠다. 처음 온 사람의 첫 화면에는 지금 누를 것 하나, 지금 상태 하나, 그리고 문제가 생기면 문제 하나. 그것 말고는 다 끈다. 길을 보여 줘야 한다면 미니맵 대신 가야 할 곳을 화면 한가운데에 직접 보여 주고, 새 소식이 있다면 빨간 점 대신 사용자가 한숨 돌린 다음에 한 번 말을 건다. 비우는 것은 정보를 빼앗는 게 아니라, 산만한 사람의 절반짜리 주의력을 지금 가장 중요한 하나에 모아 주는 일이다. 화면이 한가해 보일까 봐 채워 넣은 것들이, 사실은 그 사람을 내쫓고 있었다.

▶ 내 화면에 대입하는 세 가지

  1. 이 화면이 한 손과 흔들림과 소음 속에서도 읽히나.
  2. 가장 중요한 한 가지가 산만한 중에도 보이나.
  3. 소리를 꺼도 전달되나. 셋 중 하나라도 막히면, 그 화면은 조용한 방에 앉은 사람만 통과시킨다.

그래서, 화면을 그리기 전에 그 사람이 선 자리를 그린다

비집중 상태를 기본값으로 두면, 첫 화면을 그리는 순서가 바뀐다. 화면을 먼저 그리고 "여기에 뭘 더 넣을까"를 묻는 대신, 그 화면을 만날 사람이 선 자리를 먼저 그린다. 그는 어디에 있나, 손은 몇 개 자유로운가, 소리는 들리나, 눈은 몇 초나 머무나. 이 자리를 정하고 나면 화면이 책임질 세 가지, 곧 지금 누를 것, 지금 상태, 지금 문제가 저절로 좁혀지고, 나머지는 다 미루거나 끈다.

이 결정이 맞았는지는 계기판에서 확인한다. 첫 화면을 연 사람 중 첫 버튼까지 가는 사람이 얼마나 되는지, 머뭇거리다 나가는 사람이 어디서 멈추는지를 보는 것이 출발점인데, 이 비율 하나만 보면 그것은 일반적인 이탈 지표일 뿐 산만함이라는 가정 자체를 재 주지는 않는다. 가정을 재려면 같은 화면을 시간대와 세션 맥락별로 갈라 본다. 출퇴근 시간의 첫 실행과 잠들기 전의 첫 실행이 같은 자리에서 막히는지 다른 자리에서 막히는지를 비교하고, 앱을 벗어났다 돌아온 사람이 하던 일을 바로 이어가는지 처음부터 다시 헤매는지를 본다. 산만한 시간대에서만 유독 사람이 새고 돌아온 사람이 헤맨다면, 그 화면은 지금 누를 것이 충분히 빛나지 않거나 상태를 충분히 크게 보여 주지 않고 있다는 신호다. 조용한 방에서 우리끼리 보면 멀쩡한 화면이 흔들리는 손에서는 어디가 막히는지를 그 숫자가 비춰 주니, 첫 화면 테스트는 큰 모니터 앞이 아니라 한 손으로 들고 걸으면서 해 봐야 한다.

참고 콘텐츠

이 장의 개념이 드러나는 다른 매체의 사례.

비디오게임

  • 어쌔신 크리드·파 크라이의 탑 오르고 물음표 채우기 : 높은 탑에 오르면 주변 지도가 열리며 같은 활동 아이콘 수십 개가 한꺼번에 깔리고, 플레이어는 세계를 보는 대신 지도에서 물음표를 지우는 일만 한다. 너무 빽빽하다는 비판이 오래 쌓여, 어쌔신 크리드 섀도우스는 빼곡한 활동 아이콘을 걷어내 무엇이 있는지 직접 찾아가게 바꿨다고 전해진다.
  • 엘든 링의 황금빛 길잡이 : 미니맵으로 화면 구석을 채우는 대신, 축복 자리에서 다음에 가야 할 방향으로 황금빛 줄기가 피어올라 화면 한가운데 세계 안에서 다음 한 걸음을 직접 가리킨다. 가장자리를 비운 반대 사례로 자주 꼽힌다.
  • 데드 스페이스의 등에 새긴 체력 막대 : 화면에 따로 체력 숫자나 막대를 띄우지 않고, 주인공 슈트의 척추를 따라 빛나는 막대 하나로 상태를 보여 준다. 여유로우면 푸른빛, 절반 아래면 노랑, 죽음에 가까우면 빨강이 깜빡여 곁눈질로도 지금 상태가 읽힌다. 기계장치 / 가전 UX
  • 자동차 계기판의 경고등 : 산소 센서 전압이 어떻다는 설명 대신 색으로 말한다. 호박색 점검등은 '가까운 시일에 봐 달라'를, 유압·냉각수의 빨간 등은 '지금 멈추라'를 전한다고 알려져 있다. 급한 정도까지 색 하나로 가르는 2단 신호다.
  • 가전의 상태 표시등(전원·동작·오류) : 지금 켜졌는지, 돌아가는지, 문제가 생겼는지를 불빛 색 하나로 곁눈질에도 읽히게 한다.

나머지 참고 콘텐츠는 이 글 끝의 '16장 부록'에 모아 두었다(단행본에서는 부록 D로 묶인다).


설계 노트 ▶ 직접 해보기

우리 게임의 첫 화면을 휴대폰에 띄운다. 그리고 자리에서 일어나, 한 손으로만 폰을 들고 방 안을 걸어 다니면서 그 화면을 써 본다. 가능하면 음악이나 영상을 옆에서 틀어 둔다.

걸으면서 세 가지를 소리 내어 확인한다. 지금 내가 뭘 눌러야 하는지 한눈에 보이는가. 내가 지금 어디까지 했는지 곁눈질로 알 수 있는가. 만약 뭘 잘못 눌렀다면, 무엇이 잘못됐는지 한눈에 보이고 사용자의 말로 쓰여 있는가.

한 가지라도 멈춰서 화면을 뒤져야 했다면, 그곳을 적어 둔다. 거기서 산만한 사람이 샌다. 화면 가장자리에 붙은 것들 중, 지금 처음 온 사람이 읽을 줄 모르거나 지금 필요하지 않은 것에 하나씩 가위표를 친다. 가위표 친 것은 첫 화면에서 끄고, 그것을 정보로 읽을 사람이 올 때까지 미룬다. 정밀한 점검은 부록 B의 경험 요금표와 부록 A의 관습 해체 체크리스트로 이어진다.

큰 모니터 앞에서 멀쩡한 화면은 흔들리는 손에서 다시 시험한다. 한 손으로 들고 걸으면서 통과한 화면만, 산만한 사람도 통과시킨다.

한 줄 요약: 사용자는 조용히 집중한 상태가 아니라 산만함과 소음의 한복판에 있다. 첫 화면은 그 산만한 사람을 위해 지금 누를 것, 지금 상태, 지금 문제 세 가지를 한눈에, 사용자의 말로 보여 줘야 한다. 게이머에겐 정보인 미니맵·마커·꽉 찬 HUD·알림 배지는 처음 온 사람에겐 소음이니, 첫 화면 가장자리는 비우고 지금 중요한 하나에 주의를 모은다. 다음 장: 산만한 사람은 분명히 무언가를 잘못 누른다. 그때 화면이 어떻게 답하느냐가 그를 붙잡기도 하고 내쫓기도 한다. 다음은 그 실수의 순간을 본다. 실패는 막아야 할 적인가, 아니면 재미의 일부인가. 그리고 실수한 사람에게서 통제감을 빼앗지 않는 법.


16장 부록: 참고 콘텐츠 모음

여기 모은 것은 사용자가 산만함의 한복판에서 화면을 만난다는 이 장의 전제가 여러 매체와 기계에서 어떻게 다뤄지는지 보여 주는 참고 사례들로, 비디오게임부터 방송·인쇄물·현실의 안내 체계까지 매체별 소제목으로 묶고 각 항목 끝에 '살펴볼 점'을 달았다. 본문이 세운 구분, 곧 지나가는 사람이 곁눈질로 받는 신호와 멈춰 선 사람이 읽는 설명의 구분, 그리고 가장 나쁜 조건에 맞춘 설계가 나머지 모두를 돕는다는 비대칭을 머리에 두고 보면, 사례마다 무엇을 신호로 남기고 무엇을 설명으로 미뤘는지가 보일 것이다. 지금 누를 것, 지금 상태, 지금 문제라는 세 책임 중 어느 것을 맡은 장치인지 가려 보며 읽으면 더 좋다.

비디오게임

  • 다마고치의 호출음과 주의 아이콘 : 1990년대 중반에 나온 휴대 육성 기기로, 배가 고프거나 돌봄이 필요하면 짧은 호출음이 울리고 화면 구석의 주의 아이콘 하나가 켜진다. 무엇이 왜 필요한지 길게 설명하지 않고, 신호 하나로 '지금 나를 봐'를 전한다. 산만한 채 다른 일을 하던 사람도 그 한 신호로 돌아온다. 살펴볼 점: 신호는 주머니 속까지 따라가 부르는 일만 하고, 설명은 기기를 꺼내 들여다본 다음에야 하는 분업을 보자. 신호와 설명의 분리가 기기 하나에 통째로 구현돼 있다.
  • MMORPG의 꽉 찬 HUD와 빨간 알림 배지 : 게이머에겐 정보지만 처음 온 사람에겐 읽을 줄 모르는 소음이 한꺼번에 쌓이는 화면이다. 살펴볼 점: 같은 화면이 읽는 법을 아는 사람에겐 정보고 모르는 사람에겐 소음이라는 비대칭을 보자. 읽는 법을 배우기 전의 눈으로 자기 화면을 다시 보는 훈련 재료가 된다.
  • 캔디크러시의 단순한 첫 화면 : 지금 누를 것 하나만 크게 빛나, 한눈팔다 돌아와도 무엇을 할지 바로 보인다. 살펴볼 점: '지금 누를 것'이 빛나는 화면의 전형으로 보자. 한눈팔다 돌아온 사람이 머뭇거림 없이 다음 동작으로 가는지가 이 설계의 성적표다.
  • 저니(2012)의 HUD 없는 화면 : 체력 숫자도 지도도 점수도 없이, 캐릭터가 두른 스카프의 길이와 반짝임이 비행할 수 있는 여력을 보여 준다. 살펴볼 점: 상태 표시를 화면 가장자리의 계기가 아니라 세계 안의 사물로 옮긴 사례로 보자. 화면 전체가 표시등처럼 한 가지 상태를 내뿜게 하라는 본문의 LED 이야기와 같은 결이다.

필름 실사

  • 액션 영화의 정신없는 빠른 컷 편집 : 너무 많은 것을 동시에 보여 주면, 관객은 정작 중요한 한 장면을 놓친다. 살펴볼 점: 정보량을 늘릴수록 전달이 줄어드는 역설을 보자. 잘 만든 액션은 가장 중요한 동작 직전에 오히려 화면을 정리해 시선을 한곳에 모은다.

실사 TV / 드라마

  • 뉴스 화면의 빼곡한 자막 띠와 속보 바 : 정보를 가득 채울수록, 곁눈질로 보는 사람에게 지금 중요한 한 줄이 묻힌다. 살펴볼 점: 채널 입장에서는 전부 중요한 정보라는 점이 함정임을 보자. 보내는 쪽의 중요도와 받는 쪽의 주의력은 다른 단위로 움직인다.
  • 홈쇼핑 화면의 가격·자막·전화번호 도배 : 산만하게 보는 시청자를 위해 정작 살 이유 하나만 크게 띄우는 곳도 있다. 살펴볼 점: 같은 산만한 시청자를 두고 도배와 비움이라는 두 전략이 갈리는 현장으로 보자. 어느 쪽이 시청자의 상태를 더 정확히 전제했는지 비교해 보면 좋다.
  • 스포츠 중계의 스코어버그 : 화면 구석에 점수와 시간이나 이닝이 상시 떠 있어, 중간부터 본 사람도 곁눈질 한 번으로 상황을 따라잡는다. 점수를 화면에 상시 띄우는 이 표시는 1990년대 중계에서 자리 잡았다고 알려져 있다. 살펴볼 점: '지금 상태'를 묻지 않아도 말해 주는 장치의 원형으로 보자. 언제 합류해도 따라잡게 하는 설계가, 한눈팔다 돌아온 사용자를 받아 주는 화면과 같은 일을 한다.

만화

  • 만화의 집중선 : 한 칸 안에서 한 점을 향해 선을 모아 그려, 독자의 눈을 지금 봐야 할 한 곳으로 끌어당긴다. 칸 전체를 똑같이 그리지 않고 가장 중요한 한 곳에만 시선을 모으는, 종이 위의 스포트라이트다. 살펴볼 점: 하나를 빛내려면 나머지를 눌러야 한다는 원리가 종이 위에서도 같음을 보자. 모든 요소를 같은 무게로 그린 칸에는 집중선이 들어설 데가 없다.

음악

  • 매장·공항의 배경음과 안내 방송 : 사람이 절반만 듣는 환경이라, 정말 중요한 안내는 짧은 신호음과 한 문장으로만 끊어 전한다. 살펴볼 점: 절반만 듣는 사람을 전제로 신호음 하나와 한 문장으로 줄인 구성을 보자. 중요한 안내일수록 길어지는 게 아니라 짧아진다는 점이 핵심이다.

연극 / 극장

  • 무대 조명의 스포트라이트 : 무대 전체를 다 밝히지 않고, 지금 봐야 할 배우 한 명에게만 빛을 모아 관객의 눈을 끈다. 살펴볼 점: 비추는 일과 어둡게 두는 일이 한 묶음이라는 점을 보자. 첫 화면에서 무엇을 끄기로 했는지가 곧 그 화면의 조명 설계다.

실제 아케이드 머신

  • 오락실의 큰 버튼과 깜빡이는 'INSERT COIN' : 시끄럽고 정신없는 곳에서도 지금 할 일 하나가 크게 빛나도록 만든 설계다. 살펴볼 점: 소음과 경쟁이 최악인 환경에서 단련된 신호의 크기·점멸·위치를 보자. 조용한 사무실에서 그린 화면을 오락실 한복판에 세워 보는 상상이 좋은 점검이 된다.

현실 업무 절차

  • 비행기 객실의 비상구 유도등과 픽토그램 : 당황한 사람을 위해 글 대신 그림 신호 하나로 지금 갈 곳만 가리킨다. 살펴볼 점: 당황이라는 가장 심한 비집중 상태에 맞춘 설계가 평시의 모두에게도 읽힌다는 비대칭을 보자. 경사로의 원리가 안전 설계에서는 훨씬 오래전부터 상식이었다.
  • 병원·공항의 색 동선 안내 : 복잡한 길을 다 설명하는 대신, 바닥의 색 선 하나만 따라가게 해 헤매지 않게 한다. 살펴볼 점: 전체 지도를 외우게 하는 대신 다음 한 걸음만 잇따라 주는 방식을 보자. 설명을 줄이는 게 아니라 아예 없애고 신호만 남긴 사례다.
  • 지하철 노선도의 점에서 점으로 : 실제 지형을 버리고 직선과 색 선만 남겨, 지금 있는 점에서 가려는 점까지 색 하나만 따라가면 되게 했다. 이 방식은 1930년대 런던 지하철의 다이어그램식 노선도에서 비롯했다고 알려져 있다. 살펴볼 점: 정확한 지형 정보를 버리는 결정이 정보를 빼앗는 게 아니라 주의를 모아 주는 일임을 보자. 무엇을 버릴지 정한 만큼만 신호가 또렷해진다.

일반 앱

  • 자동차 내비게이션의 다음 한 번의 안내 : 전체 경로를 다 띄우는 대신 '다음에 우회전' 하나만 크게 보여 줘 운전 중에도 읽힌다. 살펴볼 점: 시스템이 아는 것과 지금 보여 줄 것이 다르다는 절제를 보자. 전체 경로를 가진 시스템이 운전자에게는 다음 한 번만 말한다.
  • 한 손 모드·하단 큰 버튼을 둔 앱 : 흔들리는 곳에서 엄지가 닿는 곳에 지금 누를 것을 둬, 위쪽 구석의 버튼을 없는 버튼으로 만들지 않는다. 살펴볼 점: 닿지 않는 버튼은 사실상 없는 버튼이라는 본문의 문장을 손으로 확인해 보자. 한 손으로 폰을 들고 자기 화면의 버튼을 하나씩 눌러 보면 된다.
  • 구글 검색의 텅 빈 첫 화면 : 흰 배경 한가운데 검색창 하나만 둬서, 처음 온 사람도 지금 무엇을 해야 하는지 한눈에 안다. 둘레의 빈 공간은 비어 있는 게 아니라 시선을 그 하나에 모으는 장치다. 살펴볼 점: 비움이 곧 기능이라는 점을 보자. 화면이 한가해 보일까 봐 채워 넣고 싶은 충동을 어디까지 누를 수 있는지의 본보기다.
  • 사람 말로 고쳐 쓴 오류 화면 : 'Error 404' 같은 코드 대신 '찾는 페이지가 없어요, 처음으로 돌아갈까요?'처럼 읽을 사람의 말로 적은 곳이 늘었다. 만든 사람의 말은 한 번 더 곱씹어야 하지만, 쓰는 사람의 말은 곁눈질에 한 번에 박힌다. 살펴볼 점: 신호와 설명을 가르는 본문의 기준으로 문장을 다시 읽어 보자. 곁눈질에 뜻이 박히면 신호고, 곱씹어야 하면 설명이다.
  • 배달·택시 앱의 한 줄 상태 표시 : '조리 중이에요', '기사님이 오고 있어요'처럼 지금 단계 하나만 크게 띄우고, 세부 내역은 누르면 보이게 접어 둔다. 살펴볼 점: 곁눈질로 확인하고 다시 딴짓으로 돌아가는 사용 패턴을 그대로 전제한 상태 표시로 보자. 사용자가 화면을 지키고 서 있지 않다는 가정이 문장 단위까지 내려와 있다.
  • 영상 앱의 이어서 보기 : 보던 작품이 첫 줄에 떠, 멈춘 그 장면부터 다시 이어진다. 살펴볼 점: 한눈팔다 돌아온 사람에게 '아까 뭐 하고 있었지'를 묻게 하지 않는 장치로 보자. 돌아온 사람이 하던 일을 바로 잇는지 처음부터 헤매는지가 본문이 권한 계기였다.

기계장치 / 가전 UX

  • 비행기 조종석의 마스터 코션·워닝 등 : 어느 계통에 문제가 생기든, 조종사의 시선 안에 놓인 큰 등이 먼저 '지금 봐야 한다'를 전한다. 통상 즉시 대응할 일은 빨간 마스터 워닝이, 점검할 일은 호박색 마스터 코션이 맡는 두 등 구성으로 알려져 있다. 어느 부품이 왜 어떤지는 그다음 패널에서 확인하고, 첫 신호는 색과 깜빡임뿐이다. 살펴볼 점: 먼저 주의를 끌고 내용은 다음 단계에 맡기는 2단 분업을 보자. 첫 신호가 설명까지 떠안으려 할 때 무엇이 무너지는지 거꾸로 짐작하게 해 준다.
  • 아이폰의 무음 스위치 : 오랫동안 측면의 물리 스위치여서, 화면을 켜 보지 않아도 스위치의 위아래 위치를 손끝으로 만져 무음인지 알 수 있었고, 살짝 보면 드러난 주황색으로 한눈에 확인됐다. 최근 기종에서는 누르는 버튼으로 바뀌었다. 살펴볼 점: 상태 하나를 촉감과 곁눈질이라는 두 통로로 읽게 한 설계를 보자. 화면을 켜는 일조차 요금이라는 감각이 하드웨어에 새겨져 있다.
  • 스마트워치 길 안내의 좌우 다른 진동 : 손목 기기의 길 안내는 좌회전과 우회전에 서로 다른 진동 패턴을 울려, 화면을 보지 않고도 어느 쪽으로 꺾을지 알게 한다고 알려져 있다. 살펴볼 점: 눈이 길에 묶인 최악 조건에서 답의 통로를 촉각으로 옮긴 설계로 보자. 신호는 감각을 갈아탈 수 있고, 가장 바쁜 감각을 피해 전달되는 신호가 살아남는다.
  • 밥솥·세탁기의 완료 멜로디 : 취사나 세탁이 끝나면 멜로디가 울려, 다른 방에서 딴 일을 하던 사람에게도 끝났다는 사실이 닿는다. 살펴볼 점: 사용자가 기기 앞에 없다는 전제를 그대로 받아들인 설계로 보자. 본문이 말한 '그 화면만 보고 있지 않다'의 가전판이다.