경기 이벤트를 3D 압박 지형으로 바꾸기

축구 경기를 3D 지형으로 표현하면 경기의 흐름은 어떻게 보일까? StatsBomb Open Data에 기록된 이벤트를 팀별로 모아 시간에 따라 변하는 필드로 만들고, 46초 숏폼 영상으로 렌더링했다. 이 글에서는 완성된 화면을 읽는 법보다 데이터가 영상이 되기까지의 제작 과정을 따라가 본다.

먼저 알아둘 점 영상 속 파도는 선수들의 실제 위치를 추적한 결과가 아니다. 경기 이벤트가 피치의 어느 구역에서 일어났는지를 시간에 따라 요약해 그린 것이다.

1. 이벤트를 시간과 좌표로 정리

StatsBomb 이벤트 데이터에는 패스와 운반, 슛처럼 경기 중 일어난 행동의 시각과 위치가 담겨 있다. 먼저 필요한 이벤트를 골라 시간과 피치 좌표를 읽고, 팀별로 나눠 시간순으로 정리했다. 좌표를 같은 경기장 기준으로 맞추면 서로 다른 이벤트도 한 평면에서 비교할 수 있다. 화면의 점 하나는 선수의 순간 위치가 아니라 이벤트가 발생한 지점을 뜻한다.

2. 좌표를 색과 높이가 있는 지형으로

피치를 2차원 격자로 나눈 뒤, 각 시점 주변에서 두 팀의 이벤트가 어느 구역에 상대적으로 많이 모였는지 계산했다. 두 팀의 분포 차이를 지형의 높이와 색에 반영했다. 한 팀의 이벤트가 상대적으로 많이 나타난 구역은 그 팀의 색으로 칠하고, 분포 차이가 큰 곳은 지형을 높여 표현했다.

이렇게 그리면 점만 볼 때보다 경기 흐름과 공간적 쏠림을 파악하기 쉽다. 양 팀의 분포가 비슷해지는 지점을 이어 화면을 가로지르는 경계선도 만들었다. 이 선은 시각적으로 경계를 읽기 위한 장치다. 검증된 압박선이나 선수들의 실제 수비 라인으로 볼 수는 없다.

3. 시간 흐름과 득점 장면 만들기

각 프레임의 지형을 따로 계산하면 경계와 높이가 빠르게 튈 수 있다. 인접한 시점의 결과를 부드럽게 연결해 깜빡임을 줄였다. 그 결과 전선은 천천히 움직이고, 지형은 경기 시간에 따라 오르내린다.

득점 지점에는 잠시 솟아오르는 스파이크를 더해 주요 순간을 강조했다. 이 효과는 득점 위치와 시각을 눈에 띄게 보여주기 위한 연출이다. 스파이크 높이는 슛의 세기나 압박 수치를 나타내지 않는다.

4. 그래픽을 숏폼 화면으로 조립

3D 필드에 점수와 경기 시계, 팀 색상, 하단 시간 그래프와 이벤트 마커를 배치했다. 시간 그래프는 현재 재생 지점과 경기 전체 흐름을 함께 보여주고, 골 마커는 주요 이벤트가 발생한 시점을 짚는다.

Remotion으로 화면을 구성하고 영상을 렌더링했다. 완성본은 1080×1080 해상도, 초당 30프레임, 46초 길이다. 시험 렌더에서는 득점 스파이크가 화면 위쪽에서 잘렸다. 높이를 낮춰 문제를 해결한 뒤 전체 영상을 다시 출력했다.

데이터와 제작

데이터: StatsBomb Open Data