마음을 생각하는 디자인

책 소개

제프 존슨(Jeff Johnson) 저. 원제 ‘Designing with the Mind in Mind’. UI 디자인 가이드라인은 어디에서 왔는가? 이 책은 노먼, 슈나이더만, 닐슨 등 거장들의 디자인 규칙 이면에 있는 인지심리학 원리를 체계적으로 해설한다. “왜 그렇게 디자인해야 하는가”를 이해하면 규칙을 외울 필요 없이 상황에 맞게 응용할 수 있다는 것이 핵심 메시지다.

핵심 인사이트

1. 지각은 경험·맥락·목표에 따라 편향된다

  • 과거(경험): 이전 경험이 현재 보이는 것을 결정한다.
  • 현재(맥락): 듣고 있는 것이 보는 것에 영향을 주고, 그 반대도 성립한다.
  • 미래(목표): 빨간 차를 찾고 있으면 빨간 것만 시각적으로 튀어 보인다. 목표가 어디를 볼지, 무엇에 민감할지를 결정한다.

디자인 함의: 모호함을 피하라, 일관성을 유지하라, 사용자의 목표를 이해하라.

2. 게슈탈트 원리 — 시각적 구조 인식의 법칙

원리설명
근접성가까운 것끼리 그룹으로 묶여 인식된다
유사성비슷해 보이는 것끼리 하나의 묶음으로 인식된다
연속성끊어진 조각 대신 연속적인 형태를 인식한다
완결성열린 부분을 자동으로 닫아 완성된 형태로 본다
대칭성복잡성을 줄이는 방향으로 단순한 해석을 찾는다
전경/배경작은 대상물을 전경으로, 큰 것을 배경으로 인식한다
공통 운명함께 움직이는 대상이 하나의 묶음으로 지각된다

3. 읽기는 부자연스러운 행동이다

비숙련 독자는 단어를 음절 단위로 분해해 읽고, 숙련 독자는 단어를 통째로 인식한다(사용하는 뇌 영역이 다르다). 부적절한 정보 설계가 읽기를 방해하는 요소: 비일상적 어휘, 가독성 낮은 글꼴, 작은 글꼴, 복잡한 배경, 반복 속에 숨은 정보, 중앙 정렬.

해결책: 특성 주도의 자동화 처리를 돕고, 제한된 어휘를 일관되게 사용하며, 훑어읽기 쉬운 시각적 계층을 만들라. 꼭 읽어야 하는 내용을 최소화하라.

4. 색상 지각의 한계와 가이드라인

색상 구별 능력을 저해하는 세 가지: 희미함(채도가 낮을수록 구분 곤란), 영역 크기(작을수록 판별 곤란), 영역 간 거리(멀수록 구분 곤란).

5가지 색상 가이드라인:

  1. 채도와 명도에서도 구분하여 사용할 것
  2. 쉽게 구분할 수 있는 색상을 사용할 것
  3. 색맹이 구분하기 힘든 조합을 피할 것
  4. 색상은 다른 힌트에 더해 보조적으로 사용할 것
  5. 강한 대비 색 조합은 분리하여 사용할 것

5. 주의력·기억·학습의 제약

단기 기억: 서로 관련 없는 항목 5±2개. 모드(Mode)가 추가적 기억 부담을 만든다.

장기 기억: 오류에 취약하고, 정서에 따라 차별적이며, 추후 왜곡될 수 있다.

학습을 촉진하는 조건: 과업 중심적이고 단순하며 일관된 조작법, 친숙하고 과업 중심적이며 일관된 어휘, 위험성이 낮은 환경.

6. 사고 과정: 목표 → 실행 → 평가

  • 목표: 초기 단계에서부터 목표 도달까지의 명백한 단계를 제공하라
  • 실행: 매 선택 지점마다 목표로 유도하는 명백한 ‘정보 냄새’를 제공하라
  • 평가: 적절한 피드백과 현재 상태 정보 + 되돌아갈 수 있는 자유

핵심: 일차적 목표 달성 후 뒷정리는 잊어버린다 → 시스템이 자동으로 처리하거나 상기시켜야 한다.

7. 반응성 — 시간에 대한 요구사항

반응성 ≠ 성능. 핵심은 인과관계의 지각(0.14초 이내)과 사용자 체감 기다림의 관리다.

실전 가이드라인:

  • 명령 수용을 즉시 알리고, 결과는 나중에 보여줘라
  • 남은 작업 수와 완료율을 보여주되, 0%가 아닌 1%에서 시작하라
  • 단위 과업 사이의 지연이 과업 중간의 지연보다 낫다
  • 중요한 정보를 먼저 보여주고, 사용자가 언제든 취소할 수 있게 하라

내 생각

이 책의 가장 큰 가치는 “왜”에 대한 답을 준다는 것이다. “일관성을 유지하라”는 규칙을 외우는 것과, 경험에 의한 지각 편향·포착 오류·학습 이론을 이해한 뒤 그 규칙을 체화하는 것은 전혀 다른 수준의 설계 역량을 만든다.

특히 ‘반응성’ 챕터의 인간 두뇌 시간 상수 테이블(0.001초~0.7초)은 프런트엔드 개발자와 UX 디자이너가 함께 참조해야 할 필수 자료다. 다만 원서의 풍부한 사례 이미지가 한국어 맥락에서 직관적으로 간 와닿지 않는 부분이 있다.

한 줄 요약

디자인 규칙을 외우지 말고, 그 규칙이 나온 인지심리학 원리를 이해하라.


출처 및 저작권 안내 본 글은 아래 도서를 읽고 핵심 개념을 개인적으로 정리·재구성한 서평 형식의 2차 저작물입니다. 원본 도서의 직접 인용은 최소화했으며, 모든 해석과 구성은 필자 개인의 관점입니다. 저자: 제프 존슨 | 도서명: 마음을 생각하는 디자인