인터랙티브 기능을 활용한 데이터 시각화의 장점
뉴스 기사를 읽다가 기사 속 차트를 들여다본 경험이 있으신가요? 단순히 숫자가 나열된 표를 볼 때와 달리, 다양한 방식으로 표현된 차트는 때로 수백 마디의 글보다 훨씬 더 강렬한 메시지를 전달합니다. 이렇게 데이터를 직접 수집하고 분석하여 그 안에 담긴 사회적 의미를 시각화로 풀어내는 보도 방식을 ‘데이터 저널리즘’이라고 부릅니다. 뉴스젤리는 데이터 시각화 전문 기업으로서 매년 데이터 기반 보도의 뛰어난 사례들을 선정하는 한국 데이터 저널리즘 어워드의 수상작들을 살펴보고 소개하는 콘텐츠를 발행해 왔는데요.
지난 2025년 11월 28일 발표된 8개의 수상작을 살펴보며 뉴스젤리가 특히 주목한 지점은 바로 ‘인터랙티브 기능’입니다. 사용자가 차트와 직접 상호작용을 하며 데이터를 탐색할 수 있는 장치들이 돋보였기 때문인데요. 오늘은 인터랙티브 기능을 활용한 장점을 잘 보여주는 수상작 사례들을 소개해 드리겠습니다.
1. 애니메이션: 역동적인 연출로 데이터의 시각적 가시성을 높이다
첫 번째로 살펴볼 인터랙티브 기능은 ‘애니메이션’입니다. 애니메이션은 화면 속 요소들이 고정되어 있지 않고 차례로 등장하거나 부드럽게 움직이는 효과를 말하는데요. 정보가 나타나는 순서를 조절함으로써 독자가 이야기에 자연스럽게 몰입하도록 돕습니다. 실제 수상작에서 이 기능이 어떻게 활용되었는지 자세히 알아볼까요?
[수상작] ‘극우’ 유튜버는 이미 계엄을 알고 있었다
뉴스젤리가 눈여겨본 첫 번째 수상작은 ‘올해의 주목할만한 데이터 저널리스트 상’을 받은 경향신문 황경상 기자의 「극우 유튜버는 이미 계엄을 알고 있었다」입니다. 2024년 12월 계엄 선포 사태를 다룬 이 기사는 극우 유튜버들이 사전에 계엄 관련 여론을 어떻게 형성해 왔는지를 데이터로 추적했습니다. 경향신문 데이터저널리즘팀은 구독자 50만 명 이상의 유튜브 채널 12곳에서 2년간 게시된 영상 600건을 분석해 9가지 핵심 주제를 추출했는데요. 방대한 데이터를 전달하는 과정에서 애니메이션 효과를 활용해 독자들이 분석 결과를 더 잘 이해할 수 있도록 했는데요, 한번 살펴볼까요?
기사 도입부에서는 2024년 1월부터 12월까지의 영상 데이터가 시간의 흐름에 맞춰 왼쪽에서 오른쪽으로 등장합니다. 위 영상에서 노란색은 분석된 9가지 주제 중 하나라도 언급된 영상을, 빨간색은 윤 대통령 내외를 옹호하는 주제가 포함된 영상을 의미하는데요. 독자가 스크롤을 내리면 화면이 점차 채워지며, 계엄 선포 시점에 가까워질수록 특정 주제의 언급이 증가하는 흐름을 확인할 수 있습니다. 오른쪽인 12월에 가까워질수록 빨간색 표시가 많아지는 애니메이션을 통해 당시 여론이 어떤 방향으로 형성됐는지를 직관적으로 보여줍니다.
다음은 숫자가 실시간으로 올라가는 카운트 업(Count-up) 애니메이션입니다. 보도에 활용된 총 조회수 1억 6000만 회, 총 영상 시간 730시간, 댓글 수 70만 개라는 방대한 데이터 규모를 단순히 텍스트로 적지 않고 숫자가 차오르는 방식으로 보여줬는데요. 애니메이션 효과를 통해 극우 유튜브 영상이 우리 사회에 미친 파급력이 얼마나 거대했는지를 각인시켜 줍니다.
마지막은 기사의 핵심인 주제별 빈도를 보여주는 히트맵 애니메이션입니다. 분석 대상인 영상 600개를 회색 사각형으로 배열한 뒤, 특정 주제가 언급된 영상만 색상으로 표현했는데요. 위 영상을 보면, 중국과 관련된 영상은 노란색으로, 북한과 관련된 영상은 초록색으로 구분해 각 주제가 전체 데이터 속에서 어떤 분포를 보이는지 한눈에 알 수 있습니다.
기사에서는 7가지 주제에 동일한 차트 구조를 활용했는데요. 반복되는 구성으로 자칫하면 전개가 단조로워질 수 있는데, 주제가 바뀔 때마다 색상 데이터가 새롭게 채워지는 애니메이션 효과로 독자가 지루해하지 않고 끝까지 이야기를 따라오게 했습니다.
2. 스크롤링 기반의 인터랙션: 사용자 움직임에 맞춰 깊이 있는 스토리텔링을 전달하다
두 번째로 소개할 인터랙티브 기능은 ‘스크롤링 기반의 인터랙션’입니다. 웹페이지는 한 화면에 모든 정보를 담기 어렵기 때문에, 사용자는 기본적으로 스크롤을 내리며 콘텐츠를 탐색하게 되는데요. 스크롤링 기반 인터랙션은 사용자의 스크롤 속도나 위치에 맞춰 화면의 특정 요소가 반응하거나 변하는 기법을 말합니다. 실제 수상작 사례를 통해 이 기능이 어떻게 활용되었는지 살펴볼까요?
[수상작] 33개 지표로 살펴본 한국 사회 불평등 보고서
첫 번째 사례는 앞선 사례와 마찬가지로 ‘올해의 주목할만한 데이터 저널리스트 상’을 수상한 경향신문 황경상 기자의 「33개 지표로 살펴본 한국 사회 불평등 보고서」입니다. 한국 사회의 불평등을 보여주는 주요 지표 33개를 선정해, 최대 20년 치 수치를 정밀하게 분석했는데요.
기사에서는 33개 지표를 한 화면에서 비교할 수 있게 스몰 멀티플즈 기법을 활용했습니다. 스몰 멀티플즈는 동일한 규격의 작은 차트들을 나열해 데이터 간 차이를 직관적으로 드러내는 시각화 방식인데요. 이 기사에서는 각 지표를 같은 크기의 차트로 나란히 배치해 독자들은 여러 지표의 차이를 한눈에 대조할 수 있습니다.
그래프의 범례를 안내한 위 이미지를 보면, 시간의 흐름에 따른 변화는 선으로 표현해 지표의 성격에 따라 색상을 다르게 적용했는데요. 긍정적인 지표는 파란색, 부정적인 지표는 빨간색으로 구분해 각 지표의 대략적인 경향을 판단할 수 있게 했습니다. 금융 위기, 코로나19 등 지표 변화에 영향을 미친 주요 사건들은 보조선으로 표시했습니다.
여기서 뉴스젤리가 주목한 기능은 바로 스크롤에 따라 각 차트가 실시간으로 반응하는 하이라이팅 기법인데요! 독자가 스크롤을 내리면 화면 우측 텍스트 박스에 각 지표에 대한 설명이 나타나고, 동시에 설명에 해당하는 차트가 밝게 강조됩니다. 나머지 차트들은 흐리게 처리되어 독자의 시선이 설명하고자 하는 텍스트와 차트에 자연스럽게 머물도록 유도했습니다.
청년과 교육 관련 지표의 부정적인 흐름을 설명하는 구간에서는 위 영상처럼 ‘기초수급 아동 비율’, ‘20~30대 기초생활수급자’ 등의 차트를 차례대로 하이라이팅해 미래 세대의 불평등이 심화되고 있다는 메시지를 효과적으로 전달했습니다.
[수상작] 가지도 않을 표를 사는 사람들
스크롤링 기반의 인터랙션을 잘 활용한 두 번째 사례는 ‘올해의 영 데이터저널리스트 상’을 수상한 「가지도 않을 표를 사는 사람들」입니다. 최근 한국 프로야구의 폭발적인 인기와 함께 티켓에 웃돈을 얹어 파는 암표 문제가 심각해지고 있는데요. SBS 데이터사이언스와 저널리즘 아카데미 3기인 뷰티풀숲은 야구 암표 산업의 실체를 밝히기 위해 작년 여름 국내 최대 티켓 거래 플랫폼인 티켓베이(Ticketbay)의 데이터를 직접 크롤링해 약 2만 건의 데이터를 분석했습니다.
한국 프로야구 시즌 티켓 가격이 좌석에 따른 암표 가격 차이를 보여주고자 2가지 차트를 함께 활용했는데요! 왼쪽의 히트맵은 야구장 배치에 따라 원가 대비 암표 거래가의 비율을 색의 진하기로 표현해 어느 좌석이 비싼지를 보여줍니다. 오른쪽의 막대 차트는 원가와 평균 거래가를 각각 남색과 주황색으로 구분해 좌석별 가격 차이를 구체적으로 비교할 수 있게 했습니다.
여기서 주목할 점은 차트의 위치는 고정된 채 스크롤에 따라 데이터만 매끄럽게 교체된다는 점입니다. 위 영상처럼 스크롤을 내리면 8월 정규시즌 데이터가 한국시리즈 데이터로 바뀌고, 이때 오른쪽 막대 차트의 주황색 막대가 길어지면서 한국시리즈 기간의 암표 가격이 급등했음을 확인할 수 있습니다.
동일한 시각화 구조를 유지하면서 데이터만 바꿔 보여주는 방식을 통해 독자는 시선을 옮길 필요 없이 스크롤만으로 두 시점의 데이터를 자연스럽게 비교하게 됩니다. 스크롤링 인터랙션을 활용해 정규시즌과 한국시리즈 간의 암표 가격의 차이를 보여주는 스토리텔링 사례였습니다.
3. 필터: 스스로 탐색하며 즉각적인 데이터 비교를 가능하게 하다
마지막으로 소개할 인터랙티브 기능은 사용자가 원하는 기준에 따라 데이터를 골라볼 수 있는 ‘필터’입니다. 필터는 사용자가 특정 항목을 선택하면 해당하는 데이터만 차트에 실시간으로 반영되는 기능을 말하는데요! 사용자는 정해둔 순서대로 읽는 것이 아니라, 직접 궁금한 데이터의 차트를 찾아보며 서로 비교할 수 있습니다. 필터를 잘 활용한 두 가지 수상작 사례를 살펴볼까요?
[수상작] 예산으로 보는 이재명 vs 윤석열
첫 번째 사례는 ‘올해의 주목할만한 데이터 저널리스트 상’을 수상한 경향신문 황경상 기자의 「예산으로 보는 이재명 vs 윤석열」입니다. 2025년 8월, 이재명 정부는 출범 후 첫 예산안인 2026년 예산안을 발표했는데요. 경향신문은 나라살림연구소의 분석과 정부 열린재정 시스템의 데이터를 바탕으로 728조 원에 달하는 예산의 흐름을 분석했습니다.
원형 보로노이 다이어그램(Voronoi Diagram)을 활용해 예산 배분 현황을 시각화했는데요! 전체 예산을 하나의 원으로 설정하고, 각 분야의 비중에 따라 조각의 크기를 달리해 예산 비중을 한눈에 파악할 수 있습니다. 마우스를 조각 위에 올리면 분야별 상세 예산 금액도 확인할 수 있습니다. 하지만 단일 정부의 수치만으로는 예산 구조의 변화를 체감하기 어려운데요. 여기에 버튼 형태의 필터를 활용해 정권별 예산안을 비교할 수 있도록 했습니다.
위 영상을 보면, 상단에 버튼 3개가 보이는데요. 2022년은 문재인 정부, 2025년은 윤석열 정부, 2026년은 이재명 정부의 예산안을 의미하는 버튼입니다. 사용자가 연도를 선택하면 차트가 해당 시점의 예산 비중에 맞게 즉각적으로 변해 정권별 예산 편성의 차이를 직관적으로 비교할 수 있습니다.
특히 2026년 예산안 비중은 점선으로 별도 표시해 이전 정부와의 변화 폭을 한눈에 가늠할 수 있습니다. 핵심 분야인 인공지능데이터진흥 부문은 옅은 색으로 강조되어, 2022년에서 2025년 사이 한 차례 축소되었던 예산이 2026년에 다시 크게 확대되는 것을 확인할 수 있습니다. 텍스트로만 읽었다면 복잡했을 정부의 예산 편성을 사용자가 직접 클릭하면서 데이터 인사이트를 발견할 수 있는 인터랙티브 사례였습니다.
[수상작] 정부의 첫 얼굴들 – 역대 내각·대통령실 비교 분석
필터 기능을 잘 활용한 또 다른 사례는 ‘올해의 주목할만한 데이터 저널리스트 상’을 수상한 경향신문 황경상 기자의 「정부의 첫 얼굴들 – 역대 내각·대통령실 비교 분석」입니다. 각 정권의 정체성과 통치 철학을 엿볼 수 있는 인사 구성을 분석한 기사인데요. 역대 정부 내각 구성원들의 출신 배경을 어떤 방식으로 추적했는지 살펴볼까요?
기사 초입에서 대통령 취임 직후 구성된 첫 내각 인사를 픽토그램으로 보여줍니다. 실제 인물 사진을 활용해 각 정부가 어떤 인물들과 함께 출발했는지 한눈에 들어오도록 구성했는데요. 사진 위에 마우스를 올리면 이름, 나이, 직무뿐만 아니라 출신 지역과 학력 같은 상세 정보가 툴팁(Tooltip)으로 나타나 개별 인물의 배경까지 깊이 있게 살펴볼 수 있습니다.
이 차트의 핵심은 상단에 배치된 10가지 버튼형 필터인데요! 위 이미지를 보면, ‘서울대’, ‘고시’, ‘여성’, ‘관료’ 등 10가지 기준 중 하나를 선택하면, 해당 조건에 맞는 인물만 선명하게 남고 나머지는 흐릿하게 처리됩니다. 필터를 클릭해 정권별로 특정 출신 인물이 얼마나 포함되었는지 즉각적으로 비교할 수 있습니다. 픽토그램 하단에는 선택한 기준의 비중(%)을 표시하고, 가장 높은 수치는 하늘색으로 강조해 정권 간의 차이를 편하게 파악할 수 있습니다.
기사에서는 첫 내각뿐 아니라, 정권 전체 임기 동안 인사 변화도 분석했습니다. 노무현 정부부터 윤석열 정부까지 주요 직위에 임명된 455명의 재임 기간을 타임라인 차트로 나타냈는데요. 여기에도 앞서 본 것과 동일한 필터가 적용되어 있어, 특정 조건에 해당하는 인물들이 어느 정권과 부처에서 임명되었는지를 살펴볼 수 있습니다.
실제로 기사에서는 관료 출신 인사가 정부 출범 초기보다 임기 진행 중에 늘어나는 경향이 있다고 설명하는데요. 두 차트에서 ‘관료’ 필터를 선택하면 기사에서 짚어준 핵심 인사이트를 차트 상에서 직접 확인할 수 있습니다. 예를 들어 노무현 정부의 경우 출범 초기 관료 비중은 왼쪽 이미지처럼 20.7%였지만, 임기 전체를 보여주는 오른쪽 이미지에서는 36.9%까지 늘어난 모습을 볼 수 있는데요. 사용자는 필터를 통해 출범 시점과 전체 임기를 오가며 데이터를 비교하며, 기사의 내용뿐만 아니라 데이터를 적극적으로 탐색하며 인사이트를 얻을 수 있습니다.
에디터의 한마디
지금까지 제8회 한국 데이터 저널리즘 어워드 수상작 가운데 인터랙티브 기능이 효과적으로 활용된 사례들을 살펴봤습니다. 뉴스젤리가 인터랙티브 기능에 집중하는 이유는 단순히 시각적인 화려함을 넘어, 사용자가 직접 데이터와 상호작용하면서 스스로 그 의미를 발견하게 만드는 강력한 도구라고 생각하기 때문인데요! 실제로 이번 수상작들에서 보여준 애니메이션과 스크롤링 기반의 인터랙션은 정적인 웹사이트에 생동감을 불어넣어 우리의 시선을 자연스럽게 데이터의 흐름 속으로 이끌었습니다. 사용자가 직접 기준을 선택하는 필터 기능은 데이터를 능동적으로 탐색하고 비교하며 기사의 인사이트를 깊이 있게 이해하도록 했습니다. 기사 속 인터랙티브 요소들 덕분에 평소 어렵게 느껴졌던 정치·사회 이슈들이 더 친숙하게 다가오지 않았나요?
오늘 소개한 사례들 외에도 한국 데이터 저널리즘 어워드 공식 웹사이트에서는 데이터의 가치를 빛낸 다른 사례들도 만나볼 수 있습니다. 데이터가 전하는 사회의 생생한 목소리가 궁금하시다면, 직접 방문해 깊이 있는 스토리텔링을 경험해 보는 건 어떨까요?
<참고 자료>
- 강원양, 최현욱, 뉴스젤리, 2020, “데이터가 한눈에 보이는 시각화”
- 데이터저널리즘코리아와 건국대학교 디지털커뮤니케이션연구센터(DCRC), 한국 데이터 저널리즘 어워드 (KDJA, Korean Data Journalism Awards)
- 경향신문 데이터저널리즘팀, 2025-04-11, 「극우 유튜버는 이미 계엄을 알고 있었다」
- 경향신문 데이터저널리즘팀, 2025-03-11, 「33개 지표로 살펴본 한국 사회 불평등 보고서」
- 뷰티풀숲, 2025, 「가지도 않을 표를 사는 사람들」
- 경향신문 데이터저널리즘팀, 2025-10-28, 「예산으로 보는 이재명 vs 윤석열」
- 경향신문 데이터저널리즘팀, 2025-07-29, 「정부의 첫 얼굴들 – 역대 내각·대통령실 비교 분석」
Editor. 기획팀 채젤리
