brunch

You can make anything
by writing

C.S.Lewis

by 임송이 Nov 20. 2016

색이 날개다

'무변촌' 인터랙티브 카토그램 색상 선택기

'사돈 식구를 집으로 맞이하듯이 품위 있게 차트에 색상을 적용하라'.*


데이터 시각화 책에서 색이 가지는 중요성을 설명한 문장이다. 색은 데이터 시각화 콘텐츠에서 독자에게 첫 번째로 다가가는 요소다. 독자가 형태를 이해하기 전에 색의 느낌이 먼저 전달되기 때문이다.

그리고 독자가 시각화의 의미를 파악하는 단계에서는  데이터의 맥락도 함께 전달한다. 예를 들면 서로 대비되는 색을 가진 요소는 서로 대비되는 데이터를 뜻한다. 맥락을 함께 전달하기 때문에 미적인 용도로 색을 사용할 때와 달리 주의해야 할 점이 몇 가지 있는데 그중 하나는 각 항목마다 너무 유사한 색을 사용해서 안 된다는 점이다. 색을 가진 요소 하나하나가 독립적인 데이터로 인식돼야 하기 때문이다.


아름답고 품위 있으면서, 데이터 전달도 충실한 색을 선택해야 하다 보니 형태를 잡는 것보다 색을 정하는 게 더 오래 걸리는 경우가 많았다. 그리고 '색' 때문에 특히 고민했던 이 기사. 

전국 시군구별 변호사 수 인터랙티브.

무변촌(변호사가 없는 마을) 기사에서 전국 시군구별 변호사 수를 보여주기 위해 카토그램 형태로 지도를 제작했다. 카토그램은 면적이 아니라 특정 통계 정보를 기반으로 지도의 면적을 재구성한 지도다. (인터랙티브 보기)

우리나라는 특히 광역 단위 중 가장 좁은 서울시에 모든 게 밀집돼있기 때문에 절대 면적을 기반으로 한 일반 지도를 사용하면 정보가 왜곡되는 경우가 많다. 그래서 이를 막기 위해 동일한 면적(육각형 1개 = 1개 시군구)으로 구를 재구성한 뒤, 색상으로 변호사 수 차이를 표현했다.


지역별 색 차이로 데이터를 보여줘야 하기 때문에 색 사용이 중요했다. 색을 정하기 전에 먼저 데이터의 특성과 보여줘야 하는 걸 정리해보면 다음과 같았다.

표현해야 할 데이터 : '변호사가 없는 지역', '총 변호사 수', '변호사 1인당 담당인구수'

변호사가 없는 지역, 즉 '변호사 수 = 0'인 지역을 강조해야 한다.

총 변호사 수는 많을수록 좋은 지역이고, 변호사 1인당 담당 인구수는 적을수록 좋은 지역이다.

포인트 컬러는 빨간색(변호사가 없는 지역, #F20000)과 보라색(변호사가 많은 지역, #6d37e2).

처음에는 보라색 하나만 사용해서 카토그램을 만들었었다. 왼쪽은 지역별 총 변호사 수 최솟값부터 최댓값까지 색 범위를 자동으로 계산한 그래픽, 오른쪽은 데이터 구간을 계산해 색 차이를 조정한 그래픽이다.

딱 보기에 지역별로 큰 차이 없어 보였다...  왜 그럴까? 이유는 데이터 분포에 있었다.

'총 변호사 수' 분포 그래프

왼쪽 그래프는 총 변호사 수 값의 분포를 나타내는 그래프다. 분포를 보면 대부분 0-100명 미만 구간에 몰려있다. 100명 이상인 지역은 많지 않은데 그마저도 최댓값이 5700으로 지역마다 차이가 크다 보니, 단순히 단계를 나눠서 한 가지 색으로 표현하면 값의 차이가 제대로 전달되지 않는 것이었다.


그래서 아예 각 구간별로 서로 다른 색을 사용했다. 총 변호사 수, 변호사 1인당 담당 인구수 모두 5개 구간으로 나누고 의미에 따라 동일한 색을 사용했다.


왼쪽은 한 가지 색만 사용한 카토그램, 오른쪽은 색을 수정한 카토그램이다.


유일하게 '총 변호사 수', '변호사 1인당 담당 인구수' 모두 보라색('매우 좋음' 구간)을 유지한 지역은 바로 서초구였다. 데이터의 의미가 색으로도 드러났다. 변호사 1인당 담당 인구수 그래프는 색이 많아서 초점이 약간 분산되는 점이 아쉽지만 의미는 보라색만 사용한 그래프보다 뚜렷하게 보여준다. (약간 오방낭 느낌이 있지만..?!)  


[ 주석 ]

* 출처 : 월스트리트 저널 인포그래픽 가이드

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari