광고판 디자인
시속 95KM로 스쳐 지나가는 광고판을 만든다는 생각으로 접근하라
UX 고전이라고도 알려진 '사용자를 생각하게 하지마' 읽어보셨나요?
이 책은 출간된 지는 20년도 넘었고, 개정이 된 지도 10년이 지났지만 여전히 유효한 가르침을 줍니다.
요새 일을 하면서 생각보다 본질과 원리를 잊고 관성적으로 디자인하고 있던 부분이 많더라고요.
잘해서가 아니라, 잘하기 위해 다시 한번 기본이 되는 원리와 원칙을 정리하고 공유합니다.
광고판 디자인
책 '사용자를 생각하게 하지마!'에서는 이렇게 말합니다.
디자인을 할 때 시속 95KM로 스쳐 지나가는 광고판을 만든다는 생각으로 접근하라고요.
그리고 구체적인 방법을 알려줍니다.
관례를 이용하라
시각적 계층구조를 효과적으로 구성하라
클릭할 수 있는 요소를 명확하게 표시하라
주의를 흩뜨릴만한 요소를 없애라
내용을 훑어보기 좋은 방식으로 구성하라
관례를 이용하라
관례를 사용하면 내용을 빠르고 쉽게 이해하는데 도움이 된다.
관례는 널리 사용되거나 표준화된 디자인 패턴을 말합니다.
예를 들면 정지 표지판, 장바구니의 쇼핑카트 메타포, 페이지에서 로고 위치 등이요.
새로운 아이디어가 더 낫다는 것을 확신할 때 혁신하라.
창의적, 혁신적, 심미적 요소는 사용자 편의성을 보장한 상태에서 해야 한다. 사람들이 별도로 익히는 수고를 하지 않아도 될 정도로 명확하거나, 또는 익히는 수고를 약간 들이더라도 그만큼 가치 있는 것으로 대체해라.
약간의 수고를 들여도 관례를 넘어선 새로운 사례로 최근에 출시한 아이폰 16의 카메라 버튼이 생각나더라고요. 버튼을 꾹 누르면 사진이 찍히고, 가볍게 누르면 아래처럼 확대, 노출, 심도 등을 조절할 수 있는데 처음엔 어려웠지만 익히고 나니 굉장히 유용하겠다는 생각이 들었어요.
시각적 계층구조를 효과적으로 구성하라
명료하지 못하면 훑어보는 처리속도가 느려진다고 말합니다. 중요한 내용 무엇인지 이해하기 위해 뇌가 훨씬 더 많은 과정을 거쳐야 하기 때문이죠.
더 중요한 부분이 더 눈에 띈다.
중요한 것, 중요하지 않은 것 등의 구역을 명확히 게 구분해야 합니다.
사용자가 페이지의 어떤 부분에 초점을 맞출지 어떤 부분은 마음 편히 무시할지 빠르게 결정할 수 있도록요.
페이지의 구역을 또렷하게 구분하라.
논리적으로 연관된 요소가 시각적으로 연결되어 있다.
두 요소 간 상, 하위 관계가 형성되어 있다면 이를 시각적으로도 보여준다.
배너 맹 (Banner Blindness)을 주의하라.
그리고 재밌는 개념에 대해 말해주는데요. 바로 '배너 맹 (Banner Blindness)'입니다. 광고를 포함하고 있다고 생각되는 영역을 사용자가 철저히 무시할 수 있는 능력을 말합니다. 저희는 사실 웹사이트와 앱 서비스에서 수많은 광고를 마주하지만 인간은 '광고'처럼 생기면 광고라 인식하고 무시합니다. 있지도 않은 것처럼요.
클릭할 수 있는 요소를 명확하게 표시하라
어포던스(Affordance)
클릭 어포던스 이런 말 들어보셨나요? 어포던스는 제품 디자인에 내표된, 사용자가 어떻게 사용하면 될지 알려주는 시각적인 힌트를 말합니다. 기표(Signifier)라고도 불리며 시각적 사용자 인터페이스의 핵심입니다.
'클릭'할 수 있다면 클릭 가능하다는 시각적 단서를 제공해야 합니다.
형태(버튼, 탭), 위치(메뉴 표시줄 안), 서식(색상, 밑줄)을 통해 드러낼 수 있어요. 어포던스는 기능을 더욱 선명하게 드러냅니다. 숨기지 마세요.
주의를 흩뜨릴만한 요소를 없애라
진짜 도움이 되는 부분만 남기고 나머지는 모두 없애라
모든 것이 이해를 방해하는 시각적 잡음이라고 가정하고 시작하자
시각적 잡음 (Visual noise)
시끄러움: 모든 요소가 주의를 끌기 위해 아우성, 중요한 요소가 무엇인지 모를 때
무질서: 온갖 요소가 사방에 흩어져 있을 때, 기준선과 레이아웃 없을 때
어수선함: 너무 많은 내용을 담아 유용한 부분이 가려질 때
내용을 훑어보기 좋은 방식으로 구성하라
사용자는 자신이 원하는 것을 찾기 위해 텍스트를 훑어보는 데 많은 시간을 쓴다.
제목을 잘 짓고 제대로 활용하기
사려 깊게 잘 지은 제목은 내용의 개요가 된다. 사용자가 어떤 부분일 읽고, 훑어보고, 건너뛰어야 할지 결정하는데 도움을 얻는다. 제목에 적절한 서식을 적용해 제목 크기, 상단 여백, 내용과의 여백을 잘 조절하자.
단락의 길이 짧게 유지하기
문단 분량을 짧게 유지하는 습관을 들이자. 긴 단락을 만난 독자는 벅차다는 느낌 때문에 읽는 데 어려움을 느낀다. 단어의 장벽(Wall of words)이라고도 한다.
불릿 목록 사용하기
불릿 목록으로 만들 수 있는 항목이라면 만들고, 항목 사이에 여백을 유지하자.
주요 용어 강조하기
훑어볼 때 주로 찾는 게 중요한 단어, 구절을 강조하자. 너무 자주 사용하진 말자.
