
WC 2026 — Data Portraits
W杯1試合分の約1,500イベントを起伏する布と地形に変換する。xGが高さ、主導権が縫い目の位置になる。
- クレジット
- Alexander Bogachev
- 使用技術
- WebGLThree.jsGLSLデータ可視化生成的表現
Alexander Bogachev が個人で作った、FIFAワールドカップ2026の各試合を1試合ごとに3Dの肖像に変換するプロジェクト。トップページから試合を選ぶと /m/fra-eng/ のような試合専用URLに入り、生成されたシーンが再生されます。データは FotMob の分単位モメンタム(valueNorm に正規化)と Opta/WhoScored のシュート・ゴール・カード・xG、選手写真は Wikimedia Commons / Wikidata(プロパティ P18)から取得しています。
見た目の各要素がそのままデータの写像になっているのが肝です。布状の地形の高さが xG、縫い目(seam)の位置がポゼッションとモメンタムの潮目、空の傾きが現在のリードチーム、地震計のようなパルスが分単位のモメンタムのスパイクに対応します。毎秒のジッタを消すためにローパスフィルタで起伏とポゼッション前線を平滑化し、時間は等速ではなく dramatic time に歪めて、ゴールや決定機は長く、平凡なプレーは早送りします。選手の位置はトラッキングデータではなくイベントストリームからの近似です。
【参考になるポイント】
・約1,500件のイベントログという、そのままでは読めない量のデータを読める地形に落とす方針。テンプレートではなく試合ごとの生成系だと明言している
・時間軸を等速で流さず重要度で伸縮させる設計。データ可視化とストーリーテリングの折り合いの付け方として分かりやすい
・データ出典(FotMob、Opta/WhoScored、Wikidata の P18)を about ページで明示している
・※Awwwards のタグは WebGL / Three.js / GLSL で、群衆音のデータ駆動生成も謳われているが、about ページ本文はレンダリング技術を明示しておらずバンドルも未確認
・※Awwwards は受賞なしのノミニー、スコアは 7.51
