데이터를 이미지로

Younghoon Kim
now-this-sigak
Published in
9 min readApr 25, 2019

데이터 시각화는 말 그대로 “데이터를 이미지로” 만드는 것이라고 할 수 있습니다. 이렇게 보면 참 간단한 말이지만 실제로 데이터를 이미지로 만드려고 해 보면 막연한 구석이 많습니다. 데이터도 그때그때 다르고, 어떤 그래프나 시각화 테크닉을 이용하여 표현해야 할지 선택지가 많죠. 이러한 과정을 조금 더 체계적으로 정리할 수 있다면 시각화가 조금 더 편하게 생각되실 겁니다. 정보 시각화 (데이터 시각화)의 세계에서 (1) 데이터란 무엇이고, (2) 이미지란 무엇이며, (3) 데이터와 이미지를 어떤 관계가 있는지 알아보겠습니다.

데이터

데이터는 다양한 형태로 존재합니다. 파일 캐비닛에 보관된 한 장 한 장의 서류부터, 클라우드에 저장된 csv파일까지 전부 데이 터니까요. 이렇게 다양하고 복잡한 데이터를 아주 쉽게 바라볼 수 있는 방법이 있습니다. 데이터를 표(Table)의 형태로 바라보는 것입니다.

각 행은 한 개의 기록으로, 각 열은 데이터의 속성으로 하여 데이터를 표의 형태로 생각할 수 있습니다.

표의 각 행은 한 개의 기록(record)이 되고, 표의 열은 하나의 속성 (혹은 필드, field)를 의미합니다. 보기의 예제는 가상의 기상 관측 데이터인데요, 각 줄은 한 개의 관측 기록이 되고, 각 관측 기록은 “지역”, “관측 연도”, “관측 월”, “강수량”을 속성으로 갖는 것이지요. 각 표는 다양한 속성 값을 갖게 되는데 이러한 속성 값은 다시 세 가지 형태로 분류해 볼 수 있습니다.

N — Nominal (명목형 자료) : 어떤 단어나, 카테고리 형태의 자료를 의미합니다. 예를 들어 과일 (사과, 딸기, 귤, …)이나 장르(액션, 코믹, 로맨스, …) 같은 것 말이죠.

O — Ordinal (순서형 자료) : 자료의 값들이 어떤 기준으로 정렬 될 수 있으면 순서형 자료입니다. 한우 등급 (1++, 1+, 1, 2, 3)을 예로 들 수 있겠네요.

Q — Quantitative: (양적 자료) : 양적 자료는 크기를 다루는 자료인데 다시 두가지로 나누어 생각해 볼 수 있습니다.

  • Interval (구간형) : 구간만이 의미를 갖으며 0을 정의할 수 없는 자료입니다. 예를 들어 온도(섭씨), 연도, IQ 등이 구간형 양적 자료입니다.
  • Ratio (비율형) : 0을 정의할 수 있는 자료입니다. 나이, 키, 거리 같은 것이지요. 온도도 절대온도(켈빈)으로 표시하면 비율형 자료가 될 수 있습니다.

이제 제각각 같았던 데이터들이 조금 정리된 것 갖죠? (더 전문적인 데이터 모델이 궁금하시면 Relation Data Model을 참고하세요.) 이렇게 정리된 데이터를 어떻게 이미지로 표현할 수 있을까요? 이제 데이터 시각화에서 이미지란 무엇인지 살펴보겠습니다.

이미지

프랑스의 지도학자 Jacques Bertin은 그의 저서 <Sémiologie Graphique> (1967) 에서 이미지에 대해 이렇게 이야기했습니다.

이미지는 신호(Sign)의 집합으로서 인식됩니다. 송신자는 정보를 신호에 부호화시키고 (encoding)하고, 수신자는 그 신호를 해독(decoding)합니다.

아래의 이미지를 예로 들어 볼까요?

이 이미지를 우리는 아래와 같이 디코딩한다고 볼 수 있습니다.

  1. 세 개의 서로 다른 위치 A, B, C가 있다.
  2. B는 A와 C사이에 있다.
  3. B와 C사이의 거리가 A와 B 사이의 거리에 두배 정도 된다.

Bertin은 유사성, 순서, 그리고 비율을 알아챌 수 있게 하는 것이 신호의 속성이라고 하였는데 위의 예의 각 세 디코딩 결과와 상통하는 말이죠. 반대로 이야기하면, 우리가 이 속성들을 이용한다면 다시 정보를 인코딩할 수 있다는 뜻이기도 합니다. 이 속성들을 토대로 Bertin은 아래와 같은 이미지의 변수(visual variable)들을 정리했습니다.

<Sémiologie Graphique> (1967)

번역해 보면, XY 위치, 크기, 밝기(value), 질감, 색, 방향, 모양 등이 이미지 변수라는 것인데요, 이에 몇 가지를 덧붙일 수 있을 것 같습니다. 크기는 길이, 넓이, 부피로 나누어 생각할 수 있고, 질감뿐만 아니라 투명도, 흐릿한 정도(Blur)도 포함시킬 수 있겠네요. 그럼 이러한 이미지 변수들이 실제로 어떻게 사용되었는지 한 가지 예를 통해서 봐보겠습니다.

이 시각화는 Charles Joseph Minard가 제작한 나폴레옹의 원정(1869)입니다. 이 시각화에는 어떤 이미지 변수들이 사용되었을까요? 우선 위의 Flow형태의 차트와 아래의 선 그래프로 나누어 생각해 봅시다. 아래의 선 그래프는 X 위치에 경도(혹은 시간)를, 그리고 Y 위치에 온도를 나타내고 있습니다. 그리고 위의 차트는 평면상에 위치(X, Y)를 통해 진군의 경로를, 두께(크기)를 통해 병력의 규모를, 그리고 색깔을 통해 진군과 퇴군의 구분을 나타내고 있고요.

자 그럼 이제…

어떻게 이미지 변수들과 데이터 속성을 대응시킬까요?

그전에, 한 가지 문제가 있습니다. (뭐죠!?) 주어진 데이터에 이미지 변수를 대응시킬 방법이 너무 많다는 것입니다. 위의 나폴레옹의 러시아 원정 시각 화물은 총 6개(온도, 날짜, 위치(2), 진군/퇴군 여부, 군대의 규모)의 자료 속성을 가지고 있습니다. 이 6가지를 6개의 이미지 변수에 대응시킨다면 총 6! 개의 경우의 수가 있을 겁니다. (중복을 허용한다면 6개보다 더 많은 이미지 변수에도 대응시킬 수 있고 그러면 더 많은 경우가 생기겠죠.) 이렇게 많은 방법 중 어떤 것을 골라야 할까요? Jock Mackinlay는 이를 해결하기 위한 두 개의 원리를 제안하고 있습니다.

  • 표현력 (Expressiveness) : 시각화를 통해 표현하려는 데이터의 모든 측면이 나타나고, 데이터에 포함되지 않은 사실들은 나타나지 않아야 합니다.
From “Automating the Design of Graphical Presentations of Relational Information” (1986)

위의 예를 보면 각 막대의 자동차의 국적을 막대의 길이를 통해 표현하고 있습니다. 예를 들어, Accord는 일본에서 만들어졌고, AMC Parcer는 미국에서 만들어졌다는 데이터를 시각화로서 보여주고 있는데요, 일본과 미국이라는 속성에는 정량적인 측면이 존재하지 않음에도 ‘길이’라는 양적인 정보를 표현하기 적합한 이미지 변수를 통해 나타내고 있습니다. 혹시라도 보는 사람들로 하여금 일본이 미국보다 크다/좋다/많다 등의 비교를 하게 만들 수 있고, 이러한 방식의 이미지 변수와 데이터 특성을 매칭 시켜선 안된다는 게 표현력 원리입니다. Bertin은 이미지 변수에 따른 표현 가능한 데이터 타입을 아래와 같이 정리하고 있습니다.

‘O ‘는 해당 이미지 변수가 그 데이터 타입을 표현할 수 있음을 표시합니다.

이렇듯 Mackinlay가 제시한 기준에 의한다면 경우의 수를 많이 줄일 수 있습니다. 그렇다면 어떤 식으로 데이터에 대응하는 이미지 변수를 골라야 골라야 좋은 시각화를 만들 수 있을까요? 이를 위해 두 번째 효율의 원리가 필요합니다.

  • 효율 (Effectiveness) : 시각화는 정보를 효율적으로 전달 할 수 있어야 합니다.

Mackinlay가 이야기하는 효율이란, 여러 방식으로 이해될 수 있습니다. 만약 주어진 데이터가 같다면 우리 뇌가 가장 빠른 시간 내에 데이터를 읽어낼 수 있는 이미지 변수를 선택하여 시각화를 해야 할 것이고, 같은 시간이 걸린다면 최대한 정확하게 데이터를 읽어 낼 수 있게 표현을 해야겠지요. Mackinlay는 시각 화물 인지에 관한 연구결과(대표적으로 Cleveland & McGill의 연구)를 종합하여 아래와 같은 이미지 변수의 효율성을 정리하였습니다.

From “Automating the Design of Graphical Presentations of Relational Information” (1986)

전체적으로 위치를 이용할 때 데이터가 제일 효과적으로 표현되고, 그다음으로 양적 데이터의 경우 길이나 각도를, 순서형의 경우 색을 이용할 경우 효과적으로 표현된다고 합니다. 위치를 이용하는 그래프의 예는 산점도(Scatter Plot)가 있는데요, X 축이나, Y축에 데이터를 대응하여 데이터를 나타낸다고 생각할 수 있습니다. 길이를 사용하여 데이터를 나타낸 경우는 막대그래프, 각도를 사용하여 나타낸 경우는 파이형 도표 등이 있습니다. 그리고 모양의 경우 양적 데이터나 순서형 데이터를 표현하기에 효과적이지 않지만 명목형 데이터에는 효과적으로 사용될 수 있고요 (예: 서울/시애틀/도쿄를 나타낼 때에 각각 동그라미/세모/네모 등으로 나타내는 경우). 이 효율성 비교를 통해 시각화 후보군 중에 효율이 좋은 이미지 변수를 각각의 데이터에 대응시키면 시각화를 완성시킬 수 있게 되는 것이지요.

지금까지의 내용을 요약하며 글을 마무리하겠습니다. 데이터 시각화는 “데이터를 이미지로” 만드는 것인데,

  1. 데이터란 표의 형태로 볼 수 있고 크게 N (명목형), O (순서형), Q (양적)세 가지 종류로 나누어 생각할 수 있다.
  2. 이미지란 여러 데이터를 이미지 변수를 통해 인코딩(부호화) 한 것이고 보는 사람은 그 변수를 통해 데이터를 디코딩 (해독) 한다.
  3. 데이터의 종류에 따라 표현 가능한 이미지 변수에 정직하게 인코딩하되, 가장 효율적인 방식으로 인코딩하여 최적의 시각화를 완성시킨다. (Expressiveness & Effectiveness)

여기까지의 내용은 무려 30년 전의 논문을 기반으로 한 것입니다. (제 인생보다도 더 오래된 내용이네요.) 이러한 연구를 토대로 아직도 많은 시각화 연구가 진행되고 있습니다. 앞으로의 글들을 통해서 더욱 많은 이야기를 해볼게요! 그리고 간간히 최신 연구내용도 소개할 수 있도록 노력해보겠습니다. 읽어주셔서 감사합니다. 😊

*컨텐츠의 일부는 Jeffery Heer 교수님의 시각화 수업 자료에서 참고하였습니다.

--

--

Younghoon Kim
now-this-sigak

Ph.D. Student @ Paul G. Allen Center for Computer Science & Engineering