두께감이 있는 버튼은 그렇지 않은 버튼보다 더 클릭율이 높나?

어쩌면 바보 같은 질문이라 생각하는 분이 있을 수도 있다. 나도 (좁게는) 웹 디자인 업계에, (넓게는) 인터랙티브 미디어 제작 업계에 10여년 동안 종사하면서 이 점에 대해서는 단 한 번도 의심해 본적이 없으니까.

현실세계, 그러니까 우리가 실제로 물건을 잡고, 누르고, 만지는 세계의 모든 -아니, 최소한 거의 대부분의- 버튼은 그 버튼이 올려진 배경 물체에서 도드라지도록 튀어나와 있다. 지금까지 사람들은 당연히 무언가를 '눌러서' 작동하는 버튼은 그 배경이 되는 물체에서 튀어나온 입체감을 갖도록 디자인해왔다. 손에 실제로 잡히지 않는, 디지털 환경에서 작동하는 인터랙티브 디자인 매체가 등장한 후, 이런 현실세계의 디자인을 모방해서 만들기 시작한 것도 바로 그 이유다. 익숙하니까.

현실세계의 버튼의 모양을 본따서 만들면 당연히 그게 '클릭할 수 있는 버튼' 처럼 보인다고 생각했고, 대부분의 디자이너들이 그렇게 디자인해왔다. 그렇다면, 이 글을 읽고 어떤 생각이 드는가?

In my research for this article, I hardly found any scientific research backing up whether buttons on screen that look like buttons are actually more clickable. There’s plenty of evidence backing up contrast, color theory, and heirarchy, but I’d be willing to bet that a flat orange button is just as effective as a beveled orange button when set in an appropriate context. Here are a few opinions of other designers.

이 글을 위한 조사에서 실제 버튼처럼 생긴 화면 위의 버튼이 좀 더 클릭을 유도한다는 걸 뒷받침하는 과학적인 연구를 전혀 찾을 수 없었다. 대비, 색상 이론, 계층구조를 뒷받침하는 증거는 아주 흔하지만, 나는 적절한 맥락에 놓이기만 한다면 납작한 오렌지색 버튼이나 두께감이 있는 오렌지 버튼이나 똑같이 효과적이라는 데 오백원 건다. 여기 몇 가지 다른 디자이너의 의견이 있다.

출처 http://speckyboy.com/2012/12/11/the-flat-design-aesthetic

이 글의 출처가 된 글은 최근 디자인 트렌드에 새로 불어닥친 'Flat Design'를 말하는 글이다. Flat Design은 말 그대로 '납작한' 디자인을 뜻하는데, 화면 위에 있는 요소의 두께감을 강조하지 않고, 디자인 요소를 절제해서, 최소화하는 디자인을 말하는 듯 하다. 아마도 90년대 중후반의 웹디자인을 기억하는 분이라면 이 말에 동의할 거다. 그 시절의 디자인은 버튼부터 시작해 모든 요소가 지금보다 훨씬 두껍고, 그림자 등의 요소도 더 많이 강조했다. 이 글의 서두에서 말했다시피 납작한 평면 화면 위에 디자인을 구현해야 하니 이래저래 현실 세계의 요소를 차용하고자 하는 의도가 강해서 그랬을지도 모르고.

그 반면, 요즘 등장하는 디자인, 특히 트위터, 페이스북, 핀터레스트, 텀블러 등 최근 전세계적으로 Hot한 서비스라 꼽히는 서비스들은 하나 같이 두께감을 강조하지 않고, 화면 위의 모든 요소를 절제해서 사용한다. 복잡한 그래픽 이미지 요소를 싹 걷어낸 반면 그 자리를 단순한 단색 혹은 다양한 색상의 실사 이미지로 채운다. 이런 서비스들만 그렇다고 오해하는 분이 있을 수 있는데, 많은 디자인 에이전시들도 예전처럼 화려한 그래픽 요소를 강조하지 않는다. (국내 디자인 에이전시들은 잘 모르겠다)

위 인용문의 출처를 찾아가서 한 번씩 보시고(글에 포함된 예시 이미지도 보시고), 그 소감을 얘기해주면 좋겠다.

덧: 등록하고 보니 이 블로그에 쓴 백번째 글이군. 흠.