디자인 심리학 A to Z, 31가지 법칙을 한눈에
미니 디자인 심리학 사전
어젯밤, 당신은 밤늦게까지 프로젝트를 위해 디자인을 완성했습니다. 모든 기능이 제자리에 있고, 시각적으로도 멋져 보입니다. 하지만 잠자리에 들면서 문득 불안한 생각이 듭니다.
"이 디자인, 정말 사용자가 원하는 걸까? 나는 기능에만 집중한 나머지 사용자의 심리를 놓치고 있는 건 아닐까?"
디자인을 하면서 한 번쯤 할 수 있는 고민입니다. 우리는 종종 기술적 완성도나 비즈니스 목표에 매몰돼 정작 가장 중요한 사용자 심리를 놓치곤 합니다. 하지만 걱정 마세요. 이런 고민이 들 때 바로 적용할 수 있는 심리학 법칙 31가지를 준비했습니다.
그때 그 디자인은 왜 실패했을까?
디자인을 하다 보면 완벽해 보이는 디자인을 출시했는데 사용자 반응이 예상과 다르다거나, A/B 테스트 결과가 이해되지 않아 고민이 될 수 있습니다. 때로는 데이터만으로 해결할 수 없는 문제에 봉착하기도 합니다. 이때 디자인 심리학은 새로운 관점을 제시합니다. 지금부터 31가지 디자인 심리학 법칙을 살펴보며 사용자 행동 뒤에 숨겨진 욕구에 한 발자국 더 가깝게 다가가 봅시다.
@midjourney31가지 디자인 심리
피츠의 법칙
힉의 법칙
밀러의 법칙
게슈탈트 원리
폰 레스토프 효과
심미적 사용성 효과
칵테일파티 효과
피크-엔드 규칙
프레이밍 효과
인지 부하 이론
심적 회계 이론
시리얼 포지션 효과
테슬러의 법칙
야콥의 법칙
파레토 원칙
지커닉 효과
확증 편향
배너 블라인드니스
딜믹의 법칙
사회적 증명 이론
프라이머시 효과
리센시 효과
개인화 효과
정보 격차 효과
멘털 모델 이론
아하 모먼트
색채 심리
도플갱어 브랜딩
소유 효과
딥 워크
피드백 루프
1. 피츠의 법칙
목표물의 크기가 클수록, 거리가 가까울수록 조작이 쉬움
모바일 앱 하단 내비게이션 바에서 자주 사용하는 기능의 버튼을 크게 만들고 엄지손가락이 쉽게 닿는 위치에 배치합니다. '홈'이나 'FAB(Floating Action Button)' 버튼이 크고 접근하기 쉬운 것과 관련 있습니다.
@LINE Design system2. 힉의 법칙
선택지가 2배 증가할수록 반응 시간은 약 0.5-1초씩 증가
우버는 차량 유형 선택에서 처음에는 2-3개의 주요 차량 유형만 표시합니다. 이후 '더 보기' 옵션을 통해 추가 차량 유형을 제공합니다. 큰 카테고리만 보여주고 사용자가 선택하면 세부 장르를 제시함으로써 선택의 부담을 줄이는 패턴들이 힉의 법칙에 해당합니다. 모바일 화면에서는 선택지를 3-4개로 제한하는 것이 이상적입니다. 10개가 넘어간다면 검색 기능을 제공하는 것이 좋습니다.
@Laws of UX that Uber Follows. medium3. 밀러의 법칙
한 번에 7±2개의 정보만 단기 기억에 남음
아이폰은 홈 스크린에 배치할 수 있는 앱 아이콘을 4개로 제한합니다. 페이스북의 반응 이모지 개수도 밀러의 법칙으로 볼 수 있습니다. 사용자가 한 번에 기억할 수 있는 정보의 양은 5~9개 사이고, 디자이너는 정보 단위를 최소화할 필요가 있습니다.
@facebook4. 게슈탈트 원리
개별 요소보다 전체를 패턴으로 인식
애플 웹사이트의 제품 나열 방식. 비슷한 제품군을 근접하게 배치하고 동일한 스타일로 디자인합니다. 보는 사람은 이를 유사 제품 그룹으로 인식합니다.
@apple5. 폰 레스토프 효과
시각적으로 확실히 구별되는 것이 더 기억남
보통 CTA(Call-to-Action), 오류 메시지, 새로운 기능 소개 등에 적용됩니다. 과도하게 이 법칙을 적용하면 일관성이 깨지니 주의할 필요가 있습니다.
6. 심미적 사용성 효과
아름다운 것이 사용하기 쉽다고 인식됨
실제 사용성과 별개로 시각적으로 매력적인 디자인이 더 쉽게 사용할 수 있다고 느낍니다. 애플 제품 라인업이 대표적입니다.
@apple7. 칵테일파티 효과
시끄러운 환경에서도 관심 있는 특정 소리나 대화에 집중할 수 있는 능력
UX에서는 개인화에 해당할 수 있습니다. 슬랙에서 사용자가 멘션 된 메시지만 강조되거나, 워드 프로세서의 '집중 모드' 기능 등이 해당합니다.
@slack8. 피크-엔드 규칙
경험의 절정과 마지막 순간이 전체 경험을 좌우
아마존이 결제 과정을 간소화하고, 원클릭 주문 등으로 긍정적인 경험을 만드는 것 등이 해당합니다. 꼭 결제 같이 끝 단계가 아니라도 듀오링고의 첫 번째 레슨 완료 후 축하 메시지와 성과 요약도 유사합니다. 디자인에서는 핵심 기능(가치)과 경험의 절정을 연결시키려는 노력이 중요합니다.
@amazon9. 프레이밍 효과
정보 제시 방식에 따라 달라지는 의사결정
대표적으로 동일 정보를 이득 또는 손실의 관점에서 제시하는 긍정형 프레임이 있습니다. 아래 둘은 같은 메시지만 90% 성공률에 대한 선택률이 대체로 훨씬 높습니다.
예: 90% 성공률 vs 10% 실패율
10. 인지 부하 이론
한 번에 처리할 수 있는 정보량의 한계
단계별 온보딩 프로세스가 해당됩니다. 복잡한 기능을 한 번에 모두 소개하지 않고, 사용자가 필요로 할 때마다 조금씩 안내합니다. 구글 맵스의 운전 모드처럼 핵심 정보만 큰 글씨로 표현하는 것이 여기 해당합니다.
@autoevolution11. 심적 회계 이론
지출을 다양한 심리적 범주로 나누어 관리하거나, 이득보다 손실에 민감한 심리
금융 앱에서 지출 카테고리를 명확하게 구분하여 보여주는 것이 대표적입니다. 가격 측면에서는 사용자가 느낄 수 있는 '손실'을 최소화하는 방향으로 디자인하는 것이 좋습니다. 예를 들어, 무료 기능의 축소보다는 프리미엄 기능의 추가에 초점을 맞추는 것이 효과적일 수 있습니다.
@토스피드12. 시리얼 포지션 효과
목록의 처음과 끝 항목을 가장 잘 기억함
UX에서는 사용자가 기억해야 할 중요 항목을 리스트의 처음이나 끝에 배치하는 것이 해당합니다. 링크드인은 프로필에서 가장 중요한 정보(이름, 직함, 사진)를 맨 위에, 추천서를 맨 아래에 배치하여 기억에 남도록 합니다.
13. 테슬러의 법칙
모든 시스템에는 제거할 수 없는 복잡성이 존재함
포토샵의 고급 설정을 떠올릴 수 있습니다. 복잡한 기능을 완전히 제거하는 대신, 고급 사용자를 위한 별도의 메뉴로 이동시켜 필요한 사용자만 접근할 수 있게 했습니다.
@포토샵에서 직접 캡쳐14. 야콥의 법칙
이미 경험한 사이트와 유사한 경험을 기대함
대부분의 이커머스 사이트에서 장바구니 아이콘의 위치는 우측 상단에 정해집니다. 만약 장바구니 아이콘 위치가 달라진다면 유저들은 혼란을 겪을 것입니다. 사용자들에게 익숙한 위치나 패턴은 곧 심리적 기준점이기도 합니다.
15. 파레토 원칙
80% 결과의 원인이 20%에서 비롯됨
마이크로소프트 워드의 리본 메뉴가 여기 속합니다. 가장 자주 사용되는 20%의 기능을 메인 리본에 배치하고, 나머지 80%는 복잡성 때문에 추가 메뉴로 숨깁니다. 그 외에도 20%의 헤비 유저가 대부분의 서비스 수익을 만들어내는 경우도 해당합니다.
@sitesbay16. 지커닉 효과
미완성된 작업이 더 잘 기억남
링크드인의 프로필 완성도 바를 떠올릴 수 있습니다. 접속 시 미완성된 프로필 항목을 강조하여 사용자가 계속해서 정보를 추가하도록 유도합니다.
17. 확증 편향
기존 신념을 지지하는 정보를 선호함
SNS 알고리즘과 연관이 있습니다. 뉴스피드 알고리즘은 사용자가 자주 상호작용하는 유형의 콘텐츠를 더 많이 노출시켜 사용자의 기존 관심사를 강화합니다. 유사 신념을 가진 그룹 추천도 여기 속합니다.
18. 배너 블라인드니스
사용자는 광고처럼 보이는 요소를 무시함
사이트 콘텐츠와 유사한 스타일의 네이티브 광고가 해당합니다. 단순한 이미지 배너 대신 광고를 퀴즈나 투표화하는 것도 배너 블라인드니스 측면으로 볼 수 있습니다.
@insight19. 딜믹의 법칙
즉각적인 피드백의 효용성
스픽, 듀오링고 같은 교육 앱의 칭찬 메시지가 해당합니다. 사용자가 문제를 풀거나 과정을 통과할 때마다 바로 긍정적인 피드백을 제공합니다. UX에서 딜믹의 법칙은 긍정성 외에도 즉각적 피드백으로 사용자의 불확실성을 감소시키는 역할을 합니다. 사용자는 내 행동을 시스템이 인식하고 있다고 생각해 신뢰도가 올라갑니다.
@maze20. 사회적 증명 이론
다른 사람들의 행동을 따라 하는 경향
대표적으로 리뷰가 있습니다. 다른 사용자들의 실제 경험과 평가를 보여줌으로써 신뢰를 구축하고 결정을 돕습니다. 다른 말로는 소셜프루프라고도 합니다. 결정 버튼 밑에 서비스를 이미 사용한 사람들의 숫자를 써주는 것도 사회적 증명 이론을 활용한 UX 전략입니다.
@medium: joydeeproni21. 프라이머시 효과
일련의 정보 중 처음 접하는 정보가 후속 정보보다 더 큰 영향을 미치고 잘 기억되는 현상
UX에서는 기사나 블로그 포스트에서 핵심 정보를 첫 문단에 요약하는 것이 해당합니다. 가장 중요한 뉴스를 첫 번째로 배치해 사용자 주의를 끌고 기억에 남도록 합니다. 가장 긍정적이거나 유용한 리뷰를 상단에 먼저 노출시켜 주는 것도 프라이머시 효과를 활용한 UX 전략입니다.
22. 리센시 효과
가장 최근 접한 정보를 잘 기억함
유튜브의 영상 추천 알고리즘이 대표적입니다. 사용자가 최근에 시청한 영상과 관련된 콘텐츠를 우선적으로 추천하여 관심을 유지합니다. 내 기호에 대한 시스템의 관심으로 여겨 신뢰도가 올라가는 효과가 생깁니다.
23. 개인화 효과
개인에게 맞춤화된 경험이 더 효과적이다.
사용자의 개별적인 특성, 선호도, 행동 패턴 등을 고려하여 맞춤화된 경험을 제공함으로써 사용자 만족도와 참여도를 높이는 현상 전반을 말합니다. UX에서는 북 커머스에서 '이 책을 구입하신 분들이 산 책 섹션' 등이 해당합니다. Slack의 역할 기반 온보딩 프로세스가 다른 것 역시 개인화 효과로 볼 수 있습니다.
@yes2424. 정보 격차 효과
부분적으로 숨겨진 정보가 호기심을 자극함
링크드인의 '프리미엄 기능'을 떠올릴 수 있습니다. 일부 정보를 제한적으로 보여주고 전체를 보려면 프리미엄 구독이 필요하다고 안내하여 호기심을 자극합니다.
25. 멘털 모델 이론
사용자의 실제 경험과 일치하는 디자인을 쉽게 이해함
애플의 '휴지통' 아이콘이 상징적입니다. 현실 세계의 휴지통 개념을 디지털 환경에 적용하여 사용자가 직관적으로 이해할 수 있게 했습니다. 플로피 디스크 아이콘이 지금까지 활용되는 이유이기도 합니다.
@apple26. 아하 모먼트
사용자가 제품이나 서비스의 가치를 깨닫는 순간
제가 가장 좋아하는 아하 모먼트는 Dropbox의 파일 동기화입니다. 시작하면서 빠르게 서비스 가치를 느끼게 됩니다. 캔바의 온보딩 역시 템플릿을 하나 만들어 봄으로써 최적화와 동시에 사용자가 핵심 가치를 빠르게 경험할 수 있는 아하 모먼트에 해당합니다.
에어비앤비 - 첫 숙박을 성공적으로 마쳤을 때
카카오택시 - 첫 차 호출 후 탑승했을 때
X - 첫 팔로워를 얻거나 리트윗을 받았을 때
슬랙 - 팀 멤버와 첫 실시간 대화를 나눴을 때
핀터레스트 - 첫 번째 핀을 저장하고 관련 추천을 받았을 때
27. 색채 심리
디자인에서 색상은 단순한 미적 요소를 넘어 사용자의 경험과 행동에 큰 영향을 미치는 중요한 요소
글로벌 명상 앱 캄의 강을 닮은 차분한 파란색은 감성을 건드립니다. 캄의 명상과 관련한 앱 내 목표와도 시각적으로 연결됩니다. 구글 캘린더의 정보 계층을 색상으로 구조화하는 측면에도 색채 심리는 적용됩니다. 이외에도 문화적 맥락을 고려해 국가에 따라 브랜드 키컬러를 다르게 출시하는 것도 여기 해당합니다. 중국에서의 빨간색 (행운) vs 서양에서의 빨간색 (위험)을 떠올릴 수 있습니다
@usabilitygeek28. 도플갱어 브랜딩
디지털에 현실 세계 법칙을 적용하면 이해가 쉬워짐
멘털모델과 유사한 개념입니다. 슬랙의 이모지 반응을 떠올릴 수 있습니다. 현실 세계의 표정과 제스처를 디지털 환경에 적용하여 커뮤니케이션을 더 풍부하고 직관적으로 만들 수 있습니다.
@expdyn: medium29. 소유 효과
자신이 소유한 것에 더 높은 가치를 부여함
자신이 소유한 물건이나 서비스에 대해 객관적인 가치 이상의 가치를 부여하는 심리적 현상을 말합니다. 스포티파이의 '당신을 위한 데일리 믹스' 같이 내 이름과 선호도를 반영한 개인화된 경험이 대표적입니다. 드롭박스가 사용자에게 무료 저장 공간을 제공하는 것도 소유 효과로 볼 수 있습니다.
@spotify30. 딥 워크
방해 요소를 최소화하면 집중력과 생산성이 향상됨
노션(Notion)의 미니멀한 인터페이스가 대표적입니다. 불필요한 요소를 숨김으로써 사용자가 콘텐츠 생성에 집중할 수 있는 환경을 제공합니다.
31. 피드백 루프
행동의 결과가 다시 그 행동에 영향을 미치는 순환 과정
사용자 행동에 즉각적이고 명확한 시각적 피드백을 제공해 순환을 만듭니다. SNS의 '좋아요' 버튼을 통해 참여감이 증가하고 콘텐츠 생산 동기를 받는 것 등이 대표적입니다.
나가며
UX 디자인에서 심리학의 다양한 원리들이 어떻게 적용되는지 살펴보았습니다. 이 원리들은 단순한 이론이 아니라 현재도 수많은 사용자 경험을 혁신하고 개선하고 있는 도구입니다. 그럼에도 우리가 기억해야 할 점은, 이 원리들이 절대적인 규칙은 아니라는 점입니다. 서비스마다 고유한 맥락과 사용자들의 니즈에 맞게 적용을 해야 하기 때문입니다. 그리고 새로운 기술이 등장한다면 원리들은 또 다른 변화를 맞을 수 있습니다.
미래의 UX는 새로운 기술과 만나 지금보다 훨씬 더 복잡해질 것입니다. 그러나 변하지 않는 것은 사용자를 이해하고 그들의 경험을 개선하고자 하는 우리의 근본적인 의지라고 생각합니다. 이 캄캄한 어둠에서 등대가 돼줄 수 있는 유일한 것은 옳은 것을 만들어야 한다는 윤리덕 잣대라고 생각합니다.
심리학적 원리들은 양날의 검이라고 생각합니다. 때문에 디자이너는 디자인 결정이 사용자들에게 미칠 심리적 영향을 고려해야 합니다. 이처럼 강력한 힘을 현명하게 사용할 수만 있다면, 우리는 단순히 예쁘고 사용하기 쉬운 제품을 넘어, 사용자의 삶을 진심으로 개선하는 경험을 만들어낼 수 있을 것이라 믿습니다.
'디자인 심리학 A to Z, 31가지 법칙을 한눈에' (끝)
<참고자료>
