[책] 버려지는 디자인 통과되는 디자인 - 웹&앱 디자인

이 책은 컬러, 그리드, 타이포그래피, 그래픽 요소, UX의 다섯 가지 주제에 대해 기본적인 이론을 살펴본 뒤, 총 89개의 사례에서 버려지는 디자인과 통과되는 디자인을 비교하여 설명한다. 각 사례에는 하나의 대표 주제가 있으며, 각 사례에서 어떤 효과를 위해 무엇을 바꾸었는지 해설한다.

이 책의 장점은 풍부한 사례다. 이론으로만 접하거나 개별 요소를 따로 살펴볼 때보다, 여러 요소가 함께 놓인 실제 화면을 볼 때 이해하기 쉬운 부분이 있다. 수정 전후의 디자인을 직접 비교할 수 있다는 점도 좋다. 다만 사례마다 특정 디자인 요소를 주제로 붙여 전개하는 방식은 아쉽다.

반대로 단점은 사례를 기반으로 설명하다보니 설명이 짜임새 있지 못하다는 것이다. 문제가 있는 디자인은 대개 한 가지 요소에만 문제가 있지 않다. 여러 요소를 함께 수정해야 하고, 각각의 수정이 화면에 미치는 영향도 다르다. 이렇다 보니 사례별로 주제를 선정하는 방식은 좋은 전달 방식이 아니라는 생각이 든다.

이 책은 사례의 주제에 해당하는 요소뿐 아니라 다른 수정 사항도 함께 설명한다. 그러다 보니 정작 사례의 주제보다 다른 요소의 개선을 더 많이 이야기하기도 한다. 개별 수정의 이유는 이해할 수 있어도, 해당 사례가 왜 그 주제의 사례로 제시되었는지는 의문이 남는다.

예를 들면, 1장 컬러 편에는 '다채로운 색상의 인덱스 디자인'이라는 주제로 웹사이트를 다룬 사례가 있다. 이 사례의 주제는 다채로운 색상을 사용하여 디자인을 심심하지 않게 만드는 것이다. 하지만 실제 개선한 사례를 보면, 버튼에 네거티브 기법을 적용한 것보다 시선이 먼저 가는 메인 이미지에서 복잡한 정보를 제외하고 사용자의 행동을 유발하는 CTA 버튼을 추가한 것이 가장 먼저 눈에 띤다. 그리고 저자가 설명하고 있지는 않지만, 메뉴 버튼의 크기를 늘려 사용성을 높인 것도 효과적이다. 동시에 CTA가 있는 메인 이미지를 복잡한 정보를 제공하는 아래 화면과 분리한 것도 효과적이다. 하지만 이런 개선은 '다채로운 색상'이라는 주제와는 거리가 있다. 오른쪽이 더 좋은 디자인이라는 것에는 동의하지만 이 사례가 주제에 맞는 사례는 아니라고 생각한다.

다른 예시로 그리드 편에 나온 '확장 그리드로 공간을 활용한 콘텐츠 디자인'을 주제로 한 웹 사이트도 있다. 저자는 마이너스 마진을 사용해 내부 박스를 확장하여 여백을 효율적으로 사용했다고 설명한다. 하지만 누가 봐도 이 수정된 시안에서 핵심은 색감의 통일이다. 오히려 마진의 변경은 매우 미묘하기 때문에 변경했다고 말해주기 전에는 눈치채기 힘들다.

또한 문제로 지적한 부분이 개선된 시안에도 그대로 남아 있어, 설명과 수정 결과가 이어지지 않는 경우도 있다. 예를 들어 그래픽 요소 편에 나오는 '상품의 모티브를 살린 메뉴 디자인'이라는 주제의 시안에서는, 영문 메뉴에 대해 영어를 모국어로 하지 않는 사용자에게는 직관성이 떨어진다고 지적했지만, 정작 통과된 디자인에서도 여전히 영문 메뉴를 사용한다. 영문 메뉴라는 요소가 가지는 일반적인 문제를 설명하고 싶지만 적절한 시안이 없어 이번 시안의 설명에 넣은 것 같은데, 읽는 입장에서는 어리둥절할 수밖에 없다.

사례가 풍부하고 개별 수정에 대한 설명도 유익해서, 전달 방식의 아쉬움이 더 크게 느껴진다. 각 사례에 하나의 주제를 할당하기보다는 여러 개선 방법을 먼저 설명하고, 실제 사례에서 어떤 방법들이 적용됐는지 짚어주는 구성이었으면 어땠을까? 아니면 하나의 사례를 단계적으로 고쳐 나가는 과정을 보여주는 구성이었으면 어땠을까? 이런 전개 방식이면 지금처럼 무리하게 주제를 할당하다 엇나가는 일은 없었을 것 같다.