리디북스 이벤트 디자인은 여러 곳에서 많은 칭찬을 듣습니다. 출판사에서는 ‘가지고 싶은 디자인’, 고객들은 ‘눈에도 잘 들어오고 참 예쁘게 잘하는 디자인’이라는 칭찬을 하며, 회사에서는 디자이너들을 신뢰하고 높이 평가해줍니다. 이와 같은 신뢰는 하루아침에 만들어지지 않았습니다. 우리는 단지 예쁘게 만드는 것보다, 제한된 공간에서 어떻게 사용자에게 효과적으로 콘텐츠를 전달할 것인가에 대해 먼저 고민합니다. 우리의 콘텐츠 디자인 방법을 몇 가지 소개해드리겠습니다.


1. 빠른 정보전달을 위한 레이아웃

레이아웃은 제한된 공간에 구성요소들을 규칙적으로 배치하는 것에서 더 나아가, 사용자에게 원활히 정보가 전달되는 공간이 될 수 있어야 합니다. 경험상 제품 유형이나 디바이스에 따라 레이아웃을 나눠서 접근하는 것이 효과적이었습니다.

1) 첫 번째, 유형에 따라 레이아웃 다르게 하기.

리디북스에서는 진행하는 이벤트는 크게 할인 이벤트와 신간 발매 이벤트 두 가지 유형으로 나눠볼 수 있는데, 사용자가 페이지를 볼 때 어느 부분에 집중해야 할지 도와주어야 하므로 각 유형에 따라 레이아웃을 구성하는 방식을 달리하고 있습니다.

할인 이벤트


할인 이벤트에서는 할인정보를 명확하게 전달하는 게 중요합니다. 상단에는 세트 특가/반값 대여 등의 할인 유형을 명시해주고 하단에는 할인가/할인율 텍스트를 크게 강조합니다.

신간 이벤트


반면 신간 발매 이벤트에서는 어떤 책이 새로 나오는지가 중요하기 때문에 상단에 책의 제목과 그 아래로는 책의 이미지를 부각합니다.

2) 두 번째, PC와 모바일 레이아웃 다르게 하기.

PC와 모바일 레이아웃

모바일 시대에 중요한 것 중 하나는 사용자들이 사용하는 기기의 해상도가 다양하다는 점입니다. PC와 모바일 기기의 특징에 따라 레이아웃을 별도로 제공한다면 더 좋은 사용자 경험을 줄 수 있을 것입니다. 보다 상세한 내용은 “모바일에 최적화된 이벤트 디자인 방법” 글을 참고해 주세요.


2. 보이지 않는 눈의 길, 시각적인 동선

사람들은 자연스레 왼쪽에서 오른쪽, 위에서 아래, ‘Z’모양으로 시선이 이동합니다. 이렇게 익숙한 시선의 흐름을 ‘시각적인 동선’이라고 합니다.

시각적인 동선

제일 먼저 눈에 보이는 메인 타이틀과 서브타이틀을 확인하고 아래로 시선을 이동하여 책의 표지와 이벤트의 정보를 확인하셨을 겁니다. 상단에 가장 중요한 정보와 이미지를 크게 넣은 것은 사용자의 시각적인 동선을 막아 오브젝트나 정보를 강조하는 동시에 사용자의 시선을 부여잡는 강력한 힘이 있습니다.


3. 여백에서 나오는 집중도

여백은 단순한 배경이 아니라 콘텐츠를 강조하고 가독성을 높이며 레이아웃의 균형을 맞추는 중요한 요소입니다. 여백은 어느 정도 있는게 좋을까요?

여백에서 나오는 집중도 예시1


요소들의 배치는 같지만, 여백 없이 빼곡하게 큰 이미지와 텍스트로 이루어져 있는 왼쪽 이미지보다 적당한 여백을 준 오른쪽 이미지가 훨씬 눈에 잘 들어오지 않나요? 단순히 큰 이미지와 큰 텍스트가 눈에 더 잘 보일 것으로 생각할 수 있지만, 적당한 여백을 활용한다면 정보들의 집중도를 높일 수 있습니다.

한가지 예시를 더 보겠습니다.

여백에서 나오는 집중도 예시2

꾸민 요소가 많이 있는 이미지는 오히려 가독성이 떨어지고 시선이 분산되는 것을 느낄 수 있습니다. 반면 상대적으로 꾸민 요소가 적고 적당한 여백으로 공간을 채운 이미지는 더 시선 집중이 되고 주제를 돋보이게 해주고 있습니다. 이처럼 여백은 단순히 빈 공간이 아니라 디자이너가 의도한 또 다른 디자인 영역이라 생각합니다.


4. 시선의 흐름을 고려한 정렬

요소의 정렬 방식은 정보전달에 상당한 영향을 끼칩니다.

시선의 흐름을 고려한 정렬

일정한 원칙과 의도에 따라 통일감 있게 잘 정렬이 되어있다면 구조를 빠르게 파악하여 내용을 쉽게 이해할 수 있습니다. 또한, 긴 텍스트에는 중앙 정렬보다는 좌측 정렬이 더 잘 읽힙니다. 일정한 시선 처리로 시선의 흐름을 최소화하여 정보를 더욱 쉽게 읽을 수 있기 때문입니다.


화려하고 자극적인 이벤트 디자인이 짧은 순간 사용자들의 눈에 더 잘 띌 순 있습니다. 하지만 당장 눈에 띄진 않더라도 사용자에게 한 걸음 더 다가가 그들이 정말 원하는 정보가 무엇인지, 어디서 불편함을 가졌는지에서 고민을 시작하고 디자인을 하게 된다면 사용자를 사로잡는 좋은 이벤트 디자인이 될 것으로 생각합니다.