UXUI 디자인에 심리학 법칙 적용해보기 _ 제이콥의 법칙

디자이너가 디자인 외에 또 다른 지식을 배워야 한다면 그것은 바로 심리학일 것입니다. 그만큼 디자인을 할 때 심리학적인 요소가 많이 들어갑니다. 디자인은 눈을 즐겁게도 하지만 마음을 움직이고 행동을 변화시키기도 하니까요.

 

순수 미술 분야는 잘 모르겠으나 적어도 UIUX 디자이너에게는 화면을 설계할 때 심리학이 도움이 될 때가 많은 것 같습니다 :) 이전에 쌓인 데이터가 없다면 디자인의 이유를 설득하기 어렵지만, 심리적인 요소들을 잘 알고 있다면 누군가가 '왜 이렇게 디자인했어요?' 혹은 '이게 왜 더 좋은 디자인인가요?'라고 물었을 때 설득하기가 한결 수월해지기도 합니다. 

 

UIUX의 10가지 심리학 법칙 (출처: 인터파크 도서)

 

존 야블론스키의 [UIUX의 10가지 심리학 법칙]에는 UIUX에 관한 10가지의 심리학 법칙과 이 법칙들이 적용되는 사례를 소개합니다. 사례가 많이 소개되어 있지 않아서 이해를 높이고 공부도 할 겸 관련 10가지의 법칙과 관련된 사례들을 찾아보았습니다. 이번 포스팅은 제 1장 제이콥의 법칙에 대한 내용을 다룹니다!

 

 

제이콥의 법칙

 

사람들은 하루에도 여러 사이트를 방문하며 시간을 보냅니다. 그래서 사람들은 사용하는 앱이나 사이트가 자신이 이미 알고 있는 사이트들과 같은 방식으로 작용하기를 원한다고 합니다. 여기서 ‘멘탈 모델’이라는 개념이 나옵니다. 책의 정의를 빌려 쓰자면 멘탈 모델은 심리학 개념으로 우리가 어떤 시스템에 관해, 특히 그 시스템 작동 방식에 관해 알고 있다고 생각하는 바를 가리킵니다. 쉽게 말해 과거의 경험으로 쌓은 지식을 새로운 대상과 만날 때 사용한다는 것입니다. 

 

 

구글 사례 분석

 

다른 분야에도 멘탈 모델이 적용될 테지만 UIUX 분야에서 멘탈 모델이 적용된 사례들을 찾아보았습니다. 가장 먼저 구글의 검색창 사례가 보였습니다. (역시 구글👍🏻) 

 

 

구글의 브라우저 검색창과 사이트 검색창!

 

구글의 사이트 검색창은 브라우저의 검색창과 디자인이 아주 비슷합니다. 제가 기억하기로는 예전엔 브라우저 검색창은 브라우저 이동으로, 사이트 검색창은 궁금한 것을 검색하는 용도로 사용했습니다. 그런데 언젠가부터 구글이 브라우저 검색창에서도 결과가 나오는 검색을 할 수 있도록 기능을 바꿨더라고요. 브라우저 검색창과 사이트 검색창에서 사용자가 같은 행동을 한다는 것을 알고 같은 기능을 적용한 대표적인 사례입니다.

 

 

 

어느 검색창인지 구별하실 수 있으신가요?

 

제가 예시로 가지고 온 검색창들이 각각 어느 브라우저와 사이트의 검색창인지 구별이 되시나요? (찾지 않고 바로 맞추실 수 있다면 당신은 1%) 

여러 사이트와 브라우저의 검색창이 아주 유사한 모습을 보입니다. 작동하는 방식도 거의 비슷합니다. 예시로 가져온 검색창은 모두 비슷하게 작동하기 때문에 사용자는 노력을 들이지 않고도 바로 사용할 수 있습니다. 만약 검색할 때 Enter가 아닌 스페이스 바를 눌러야 검색이 되는 사이트가 있다면 사용자들은 아주 불편을 느꼈을 거예요. 제이콥의 법칙에 의해 사용자는 다른 사이트와 유사한 방식으로 현재 머무는 사이트의 검색창이 작동하기를 바라고 사용할 겁니다 :)

 

 

쇼핑 앱 사례 분석

 

제가 자주 사용하는 앱 중에는 쇼핑 앱이 있습니다. 한 번 쇼핑하기 시작하면 앱 3~5개는 기본으로 켜 놓고 돌아가면서 사용하곤 합니다. 쇼핑 앱에서도 제이콥의 법칙이 적용된 요소가 보입니다. 무신사, 에이블리, 지그재그, W Concept에서 그 요소를 찾아보겠습니다.

 

 

쇼핑 앱 비교

 

쇼핑 앱에서는 하트 버튼이 SNS처럼 단순히 '좋아요'를 표시하는 기능이 아니라는 것을 알고 있습니다. 찜하기 혹은 어딘가에 상품을 보관하는 용도로 사용될 것이라고 예상합니다. 실제로도 거의 모든 쇼핑 앱에는 하트로 누른 상품을 담아 놓는 탭이 존재합니다. 만약 하트=장바구니인 쇼핑 앱이 있다면? 사용자의 멘탈 모델과 조화를 이루지 못해 서비스 이탈로 이어질 가능성이 높아집니다. 

 

 

---

제이콥의 법칙을 공부하니 앱과 웹 사이트가 점점 유사해지는 이유를 알 것 같아요. 사용자가 쉽게 받아들일 수 있도록 관습적인 혹은 익숙한 디자인을 선호하다 보니 서로 비슷해지나 봅니다. 디자이너로서 창의적인 디자인으로 문제를 해결하고 싶을 때도 있지만 창의적으로 해결하는 것이 사용자에게 더욱 피로감을 주지는 않는지, 사용자의 예상과 어긋나는지는 않는지 항상 주의를 기울여야겠습니다. 

 

지루하지 않게, 하지만 너무 독창적이어서 사용성을 해치지 않는 선에서 최선의 디자인을 고민해야겠어요 :)

 

 

 

참고: www.justinmind.com/blog/mental-models/