데이터 시각화 콘텐츠 읽기, 뉴욕타임즈 You draw it 시리즈
왠지 이럴 것 같은데...
우리가 무언가에 대해 '느낌적인 느낌'으로 갖고 있는 생각과 짐작이 진짜인지 팩트 체크해볼 수 있는 데이터 시각화 콘텐츠를 소개합니다. 미국의 대표적인 일간지 <뉴욕 타임즈>(The New York Times)는 인터랙티브 데이터 시각화 콘텐츠를 꾸준히 발행하고 있는 매체로, 'You Draw It'이란 스타일의 인터랙티브 데이터 시각화 콘텐츠를 발행하였습니다. 이번 포스팅에서는 뉴욕타임즈의 'You Draw It' 콘텐츠를 살펴봄으로써 데이터 시각화에서의 독자 인터랙션에 대해 간략히 이야기해보고자 합니다.
2015년 4월에 발행된 'You Draw It : How Family Income Predicts Children's College Chances' 콘텐츠는 부모의 수입과 자녀의 대학 입학 간의 관계에 대한 추측을 차트 위에 직접 그려볼 수 있도록 유도합니다. 독자는 부모의 수입 비율과 자녀의 대학 입학률 간의 관계를 차트 빈 영역 위에 라인 형태로 그리게 됩니다.
독자의 인터랙션에 의해 스토리텔링이 이어지는 이 콘텐츠에서 적극적인 액션을 유도하는 것이 중요합니다. 이를 위해 본문 기사 중에는 '추측'의 경우에 따라 어떤 형태의 라인을 그려야 할지 보여줍니다. 텍스트 문장 사이사이의 이미지 요소가 포함되어 있는 모습이 낯설게 느껴지기도 하지만, 독자 입장에서는 어떤 형태의 라인을 그려야 할지 직관적으로 이해할 수 있습니다.
부모가 돈이 많을수록 자녀의 대학 입학률이 높을 것으로 예상하고 라인을 그려보았습니다. 마우스 드래그로 라인을 그려야 하는데 x 축의 모든 영역 즉, 비어있는 차트 모든 영역에 라인이 그려지지 않으면 해당 영역이 노란색 음영으로 표시되고 라인을 마저 그려야 다음 단계로 넘어갈 수 있습니다. 라인을 그린 뒤 독자는 하단의 'I'm done' 버튼을 클릭합니다. 이후 하단에는 실제 데이터와 독자의 예상이 반영된 라인을 하나의 차트 안에 시각화해 보여줌으로써 둘 사이에 어떤 차이가 있는지 알 수 있습니다. 또한 독자의 예상과 실제 현실이 어떻게 다른지 몇 가지 인사이트를 간략히 요약해 텍스트로 제공합니다.(제 추측에 대한 코멘트는 부모의 수입이 가장 낮은 경우에 자녀의 대학 입학률을 너무 낮게 예측했고, 부모의 수입이 높을 경우에 자녀의 대학 입학률 예측은 현실과 비슷한 수준이라고 하네요.)
앞의 내용에 이어서는 본격적으로 기자가 의도한 기사의 내용이 다뤄집니다. 가장 첫 부분에는 뉴욕타임즈의 독자가 선택한 78,022번의 예측은 어떤 결과를 보이는지 종합, 시각화 차트에 히트맵과 유사한 방식으로 함께 표현한 점이 인상적입니다. '나 말고 다른 사람들은 어떻게 예측했을까?'라는 독자가 떠올릴만한 궁금증에 대한 답을 미리 제시함으로써 콘텐츠의 몰입도가 높아졌을 것이라고 생각합니다.
2017년 1월 'You Draw it' 스타일이 적용된 또 다른 콘텐츠 'You Draw It: What Got Better or Worse During Oama's Presidency'가 발행되었습니다. 앞서 살펴보았던 2015년 4월 발행 콘텐츠 'You Draw It : How Family Income Predicts Children's College Chances'와 어떤 차이가 있는지 살펴볼까요?
일단 차트를 살펴보면 빈 영역에 'Draw the Line for Obama years'라는 텍스트를 표기해 독자의 인터랙션을 직접적이고 직관적으로 유도했습니다. 기본적으로 차트는 이미 특정 부분의 데이터가 라인으로 그려져 있고, 독자는 빈 영역에 대한 라인만 그리면 됩니다. 콘텐츠 주제의 콘셉트 상 오바마 정권의 성과를 확인하기 위해 부시 정권이 비교 대상이 된 것이고, 부시 정권의 데이터를 기준으로 오바마 정권의 데이터를 예측해 볼 수 있습니다.
독자 인터랙션 시 차트 영역 중 라인이 그려지지 않은 영역은 노란색 음영으로 표시하는 것은 2015년 발행 콘텐츠와 동일합니다. 이는 남은 부분을 모두 그려야 한다는 의미를 나타냅니다. 비어있는 모든 영역에 라인을 그린 이후 하단의 'show me how i did' 버튼을 클릭하면, 새로운 차트가 생성되지 않고 원래 있던 차트에 실제 데이터를 표시하는 파란색 라인이 그려집니다. 화면 이동 없이 독자가 예측한 데이터와 실제 데이터를 한눈에 확인할 수 있다는 점이 장점입니다. (리서치를 해보니 you-draw-it 차트 스크립트가 공개되어 있네요.) 뿐만 아니라 모바일에서 보이는 화면도 차트가 잘려 보이는 등의 문제없이 반응형 형태로 제작되어 문제없이 어떤 화면에서도 콘텐츠를 제대로 볼 수 있습니다.
여기서 또 하나 인상적인 점은 텍스트 배치와 인터랙션을 통해 간결하고 핵심적으로 스토리텔링에 힘을 더한 것입니다. 차트 위에 배치된 글은 문장의 끝을 맺지 않고 있으며, 독자의 인터랙션 이후에 등장하는 글과 함께 하나의 문장이 되는 것을 알 수 있습니다. 즉, 독자가 '오바마 정권 기간 동안 실업률은...'이란 질문의 답을 알고 싶으면 인터랙션을 통해 자신의 생각을 시각화해야 하고, 그 이후에야 실제 데이터를 시각화(파란색 라인)와 함께 답을 글로서 알게 되는 것입니다. 독자의 적극적인 인터랙션을 유도하기 위한 효과적인 방법이었고, 콘텐츠 내 글의 길이가 짧은 편이라 지루함 없이 빠르게 콘텐츠 전체를 읽을 수 있다는 점이 장점입니다.
이 콘텐츠는 앞서 살펴본 you-draw-it 차트 7개가 나란히 배치되는 것으로 구성됩니다. 각각 정권을 평가할 만한 지표-오바마 정권의 성과를 실업률, 유죄판결을 받은 이민자 수, 헬스케어에 대한 국가 지불 비용, 국가 부채, 불법적으로 거주하고 있는 멕시코인 수, 폭력 범죄 수, 아프가니스탄과 이라크에 있는 군대 수-로 오바마 정권에 대한 개인의 생각과 실제 데이터를 비교하고 결과적으로 개별 항목에 대해 개인이 갖고 있을지도 모르는 편견을 깰 수 있도록 돕습니다.
올해 발행된 'You Draw It' 콘텐츠에 대한 반응이 좋았던지(?) 지난 4월 <뉴욕타임즈>는 과도한 약물 투여 현상(The Drug Overdose Epidemic)을 주제를 동일한 형태의 콘텐츠 'You Draw It: Just How Bad Is the Drug Overdose Epidemic?'를 발행하였습니다. 개인의 편견을 깨기 위한 하나의 목적 아래 데이터 시각화의 활용, 차트 인터랙션, 텍스트 배치가 유기적으로 역할을 한 점은 충분히 매력적이고 리뷰할 만한 가치가 있는 콘텐츠라고 생각합니다. 사실 지난 4월 말 발행된 뉴스젤리의 <잃어버린 대통령 - 진보와 보수 20년, 데이터로 보는 정권 성적표>도 'You Draw It' 콘텐츠에서 많은 부분을 아이디어로 얻어서 제작되었습니다. 관심 있으신 분들은 <잃어버린 대통령- 진보와 보수 20년, 데이터로 보는 정권 성적표> 콘텐츠 제작기도 함께 읽어보기를 권합니다.
* 이 글의 원문 출처는 뉴스젤리 블로그 '[데이터 시각화] 당신의 생각을 팩트체크해보세요!- <뉴욕 타임즈> 'You Draw It' 시각화 콘텐츠'입니다.