데이터, 데이터, 데이터. 그 어느 때보다 데이터가 빠르게 쌓여 가는 세상입니다. 이 데이터를 다루고, 분석하는 능력도 필수지만, 데이터를 표현하는 방법 역시 날이 갈수록 중요해지고 있습니다. 데이터 시각화는 데이터에 형태를 부여해 한눈에 파악할 수 있게 해 줍니다. 따라서 시각화 만큼 데이터를 효과적으로 전달하고, 설득력 있게 전달하기 좋은 방법은 없습니다.
인사이트에서는 그동안 데이터를 시각화하는 방법과 여러 도구를 소개해 왔습니다.
인포그래픽
– 『월스트리트저널 인포그래픽 가이드 : 데이터 사실 수치를 표현할 때 지켜야 할 기본 원칙』
데이터 시각화
그리고 데이터 시각화 시리즈의 맥을 이어 갈, 두 번째 D3.js 입문서!
『D3를 이용한 시각적 스토리텔링(Visual Storytelling with D3)』을 출간했습니다.
두 책의 차이점이 뭔지 궁금한 분을 위한 가이드!
- 1. D3의 기술적인 측면을 빠르게 파악하고 싶다!→『D3.js』
- 2. D3로 내 의도를 잘 전달하는 시각화를 만들고 싶다!→『D3를 이용한 시각적 스토리텔링』
전통적인 시각화는 종이에 그려진 고정된 이미지였지만, 오늘날의 시각화는 웹 브라우저를 통해 사용자가 마우스로 손쉽게 조작할 수 있는 인터랙티브(Interactive)한 형태로 발전했습니다. 따라서 각종 정보를 직관적인 형태로 웹에 표현해 주는 다양한 도구가 소개되고 있습니다. 그중 D3는 자바스크립트를 사용해 데이터를 시각화하는 도구입니다. 특히 데이터를 그래픽 요소와 연동해서 간단한 동작 방식으로 빠르게 시각화를 만들어 낸다는 점에서 많은 분이 관심을 보입니다.
하지만 초보자 입장에서는 이 책처럼 개발자가 아니어도 할 수 있다고 독려하는 입문서를 보면서도 뭔가를 만들어 낸다는 게 생각처럼 쉽지만은 않습니다. 간단한 동작 방식이나 빠르게 만든다는 것 모두 어느 정도 기술에 익숙한 수준에서 느낄 수 있는 특징이죠. 일단 D3의 동작 방식을 이해하려면 HTML, CSS 그리고 자바스크립트 지식이 필요한 데다가, 사용 방법에 익숙해지는 데도 시간을 들여야 합니다.
웹으로 시각화를 만들어 보고 싶은데 이렇게 여러 가지 기술을 이해해야 하다니! 이미 ‘내 길이 아님’이라고 생각할 분도 계실 것 같은데요..
HTML과 CSS가 낯설지 않고(HTML: 웹페이지 문서를, CSS: 꾸민다), 데이터 시각화에 흥미가 있다면! 두려움은 접어두시고 『D3를 이용한 시각적 스토리텔링』으로 한번 시작해 보길 바랍니다. 🙂 이 책은 D3를 소개하는 입문서이지만, 기술 자체를 딱딱하게 설명하기보다는 ‘시각화를 완성해 나가는 과정’에 초점을 맞춰 진입 장벽을 낮추었습니다.
<책에서 다루는 시각화 주제: ‘지구는 늙어가고 있는가?’>
이 책은 “좋은 시각화는 어떻게 만들 수 있을까?”란 고민에서 시작합니다. 그리고 시각화를 만드는 도구로 D3를 선택해서 그래프를 완성해 나갑니다. 먼저 어떤 이야기가 담긴 시각화를 만들지 함께 고민하고, 주제를 정한 뒤 해당 데이터를 찾아서 시각화 하기 좋은 형태로 가공합니다. 그 다음에는 어떤 그래프 형태를 선택할지 장단점을 비교합니다. 최종적으로 막대 그래프를 선택해 본격적으로 D3를 사용해 시각화를 만들어갑니다. 그래프 결과 자체만 보면 심심하게 느낄 수 있지만, “어떻게 좋은 시각화를 만들까?” 하는 물음에서 선택된 형태인 만큼 시각화 세계에 막 들어선 초보자 입장에서는 의미 있는 선택으로 볼 수 있습니다.
또한 이 책에는 역자인 박은정 님, 김한결 님이 원서에 없는 내용을 부록에 담았습니다. 지도 이미지를 활용해 뭔가 표현하고 싶은 분이 아주 많을텐데요. 데이터를 구하는 방법부터 구현 과정이 상세하게 녹아 있어 부록에서 많은 힌트를 얻을 수 있으리라 생각합니다.
<D3로 대한민국 인구밀도 시각화하기>
데이터에 관심 있는 분이라면, D3가 제공하는 다양한 시각화 세계를 한번 경험해 봤으면 좋겠습니다. 이 책의 가장 큰 장점은 데이터를 다루고 웹상에서 뭔가 해보고 싶은 마음이 굴뚝같지만, 경험이 없는(저 같은) 초보자의 궁금증을 해결해 준다는 점입니다. 여러분도 이 책으로 시각화할 때 고민해야 할 점은 무엇인지, 어떻게 만들어 나갈지 한번 훑어 보신 다음,개인적인 프로젝트를 하나 시작해 보세요! 그리고 웹을 통해 많은 분들과 시각화를 공유해 보길 바랍니다. 🙂
옮긴이 박은정 님의 솔직한 책 서평! (링크)
책을 사려는 분들께 미리 말씀드리자면, 이 책은 극단적으로 말해서 그래프 하나를 만들고 끝냅니다.
그래서 저도 이 책을 처음 봤을 때는 “뭐야, 왜 막대 그래프 하나만 달랑 그리고 책을 끝내?”라고 생각했지만, 책을 다 읽고 보니 기술적인 측면과 사용자 경험적 측면 양면으로 그래프를 제대로 그리는 방법을 배운 것 같습니다. 그럼으로써 (일면 지루해질 때도 있었지만) 오히려 기초를 탄탄히 다질 수 있게 된거죠.
아마 ” JavaScript the definite guide”류의 서적으로 프로그래밍을 배울 수 없다고 생각하시는 분이라면 제 의견에 동의하실거라고 생각합니다만, 다양한 시각화 또는 시각화 방식을 단순 나열하기만 했다면 저도 이 책에 대해 좋은 평가를 내리지 않았을 것입니다. 하지만 어찌보면 요즘 같이 온라인 콘텐츠가 범람하고 라이브러리 다큐멘테이션이 친절할 때에는 오히려 한 가지 대상을 깊고 상세하게 파고 들어서 책이라는 채널이 할 수 있는 가장 좋은 방식으로 튜토리얼을 만든 것 같다는 생각입니다.
결론적으로, 단순히 D3를 기술적인 측면에서 보고 시각화 서적을 고르려는 분께는 다소 실망스러운 책일 수도 있습니다. 하지만 막대 그래프 하나를 그리더라도 “(유저의 편의와 사용성을 고려해서) 제대로” 그리고 싶은 분이라면, 그리고 한 걸음 한 걸음 친절히 안내해주는 설명을 좋아하는 분이라면 이 책도 좋아할거라 생각합니다.
물론, 그럼에도 불구하고, 재미와 호기심을 더하기 위해 부록에 감초처럼 우리나라 인구밀도 코로플래스를 그리는 짤막한 장을 추가했습니다. 아마 이 책을 다 읽고 나서 그 부록을 보면, 책을 읽기 전보다 월등히 성장해서 수월하게 읽어내려가는 자신을 발견할 수 있을거라 생각합니다.
그리고 박은정 님께서 블로그에 맛집 지도 그리는 방법을 공유해 주셨습니다 ! 데이터를 표현하는 데 관심 있는 분들께 아주 도움이 되는 글입니다. 여러 버전의 맛집 지도가 나오길 기대해 봅니다*_*
D3로 만든 시각화 예제와 커뮤니티 소개
- 미세먼지 데이터 시각화하기 (블로터, 창성실 님)
- 노량진 수산시장 시세 (Goonoo Kim 님)
- 페이스북 데이터 시각화와 저널리즘 그룹
* 『D3를 이용한 시각적 스토리텔링』은 다음 인터넷 서점에서 만나보실 수 있습니다.
[ Yes24 ] [ 교보문고 ] [ 알라딘 ] [ 인터파크 ]
※ 예제 코드: https://github.com/e9t/d3-book
※ 정오표