BDSL-2017：データの視覚化に関するTanya Bibikova

この夏、データ研究所はバイカルに出撃し、特にバイカル設計特別キャンプでデータ視覚化のマスタークラスを実施しました。 ところで、バイカルで-見事です！







マスタークラスのビデオは約束されていますが、まもなく表示されます。 それまでの間、キャンプの参加者の1人が私のスピーチの記録を解読しました。 ここでは、表示の変更を最小限に抑えた講義のデコードの最初の部分と、 データ可視化のコースで学習するΔλアルゴリズムに特化した2番目の部分の概要を示します。

データ視覚化ワークショップ、2017年7月22日、BDSL

データ研究所の Vela Tanya Bibikova

ミシャノビコフによって解読



今日は、クールな視覚化-データの性質を明らかにし、その中に隠されたパターンを明らかにする視覚化を作成する方法についてお話します。 しかし、優れた視覚化を作成する方法を理解するために、まず、どの視覚化が優れていると考えるかを考えましょう。 いくつか例を示します。



地震の歴史







1898年以降のすべての地震が地図に表示されています。 1年、地震の日付、場所、強度がある乾燥したデータを含む定期的なテーブルを取りました。 このテーブルを地図上に置くだけで、誰も見たことがなく、自分の目で見ることができない写真を示しました。地震プレートの輪郭は地震の歴史の背後に表示されます



モスクワマラソン結果







次の作品は私たちの誇りであり、マロフィエ（インタラクティブグラフィックスの名誉ある競争）で銅賞を受賞しました。



与えられた：マラソンの結果。フィールド-姓、名、年齢、国を含むテーブルのように見えます。







なぜこのデータで何かしたいのですか？ 2013年、私自身はマラソンの準備をしており、中間レースに参加しました。 私の最初のランニングは、私をとても刺激しました。なぜなら、それは、さまざまな年齢のランナー、コミュニティ、チームを運営している大勢のランナーでしたから 最も興味深いことはレース中に起こります。なぜなら、それはルートに沿って走り、グループを形成する大群衆だからです。 誰かが非常に一生懸命努力しています、彼はすべてを最高に与え、誰かはリラックスしたペースで自分のためにそれをします。 私の最初の公式レースの後、起こっていることすべてを反映していない乾燥したテーブルが与えられたとき、視覚化をしたかったのです。



モスクワの中心部全体を通る興味深いルートに沿って走っているランナーの群衆がいます。 初めは、群衆は大きくて太く、時間の経過とともに高速道路に沿って非常に広がります。 ランナーがほぼフィニッシュになったら、テールはガーデンリングを使い果たします。



この視覚化には多くのデータディメンションがあります。 群衆は色で分けられます-男性と女性、そして年齢で、それは色の濃淡で示されます-暗いほど年上です。 この視覚化から、興味深いミニストーリーを抽出できます。 たとえば、勝者に注意してください。 ここで、彼が堤防に足を踏み入れたとき、彼は7-8位のどこかにいます。すでに堤防の上で彼はぐいと動き、みんなを追い越して最初に終わります。







見てください：ドライテーブルを取得し、中間結果（10、15、21 km、30および35 km）を追加し、テーブルから抽出するのが困難な新しい情報の巨大なレイヤーを取得しました。 何が起こっているのかを完全かつ全体的に把握しました。



ランナーの位置を反映することに加えて、小さなチャートを追加し、性別と年齢別にランナーを配布しました。 フィニッシュのヒストグラムでは、フィニッシュ時間に応じて参加者がどのように分布しているかを確認し、一緒に走った相手を見つけることができます。 また、フィルター機能を持つ参加者のリストもあります（フィルターはメインの視覚化に影響します）。 そして、レース中の天候のダイナミクス、マラソンランナーの天候-これは非常に重要であり、結果に直接影響します。



聴衆への質問：この視覚化はなぜクールなのですか？

回答：

-あなたはダイナミクスで見ることができます

-テーブルになかった新しい情報が表示されます。 たとえば、プロムナードでのジャーク

-可視性により、マップとpythonは、ストーリーのシンプルさと整合性を実現し、実際に何が起こったのかを把握します。 これは、孤立したグラフのセットではなく、現実の全体的な表示です。



World Of Tanksタンクの比較

プレイヤーがいて、レベルからレベルへと移動します。 それぞれの新しいレベルで、戦車の特性が改善され、より装甲され、強力になります。 戦車の主な特徴は、攻撃、防御、速度です。



これは戦車の特性に捧げられた図であり、分析のためにゲーム愛好家の一人から送られてきました。





そして、これが私たちが実験室で行った視覚化です。





水平方向の速度、垂直方向の10秒での攻撃、装甲は戦車の画像に直接色で表示されます。 より詳細な仕様と実際のクリックスルー画像。 上記は、国およびタンククラスによるフィルターです。 乾式図の代わりに、タンクのサイズ、形状に注目します。



聴衆からの質問：しかし、同時に、すべてのパラメーターが常に表示されるわけではありません。 あなたのバージョンでは、最初のバージョンとは異なり、一目でどのタンクがよりクールであるかを見つけることができません



必要に応じて、すべてのレベルのすべてのタンクをオンにすることができます。 ただし、画面を詰まらせたり、知覚を損なわないように、意図的に標準的な外観をカットしています。 ちなみに、それらのすべてが最初のバージョンでもありませんでしたが、いくつかの未知の方法で10台だけがタンクを選択しました-各レベルに1つ。 そこで得られる主な結論-レベルの増加に伴い、指標が成長し、最も顕著な偏差-タンクの1つで、指標の1つが増加しませんでした。 視覚化では、1つのレベルと隣接するレベルのタンクを比較できます。



WOTプレイヤーのイリヤ・ルーダーマンによるコメント：

-最初の3つのレベルをポンピングするには3〜4日かかります。 しかし、4番目から10番目にポンプするには、多くの時間を費やす必要があります。 あなたは時間を大切にしているので、開発ツリーの次の戦車についてできるだけ知る必要があります。 ゲームには多くの観客がおり、戦車のパラメーターと特性のわずかな変化がゲームプレイに大きく影響します。 そのため、プレイヤーは特性に多くの注意を払っています。 仕事はクールです。 彼女には大きな可能性がありますが、いくつかの重要なパラメーターがありません。



聴衆への質問：この視覚化はどれほど良いですか？

回答：

-フィルターとパラメーターは膨大な数のスイッチに積み重なることはありませんが、きちんと間隔を空けて視覚化に組み込まれています。 視覚的なノイズはほとんどなく、各要素は知覚に役立ちますが、干渉しません

-戦車に関する最初のチャートでは、すべての戦車の能力をすべて比較しました。 これはあまり役に立ちません。 戦車が弱い場合、それを強戦車と比較するポイントは何ですか？ お使いのバージョンでは、簡単にフィルタリングして重要な情報のみを受け取ることができます。

-やる気のあるプレイヤーは最初のスケジュールを勉強しますが、あなたの視覚化は興味のある普通のプレイヤーを引き付ける可能性があります。



大都市、ジョーボーンでの生活のリズム







この図は、さまざまな都市でのユーザーアクティビティを示しています。 水平-年中365日、垂直-内訳が15分の日。 これは... 365 x 24 x 4 =〜35,000データセルx 2パラメーター：スリープとステップ。 それは1つの写真に反映される〜7万の数字であり、45の都市の45のそのような写真です。 これらはすべてのユーザーの平均値です。入力に含まれるデータの量を想像してください。



何があなたの目を引きますか？ 箸-週末、みんなが注ぎます。 顕著な沈下1月1日-新年を祝います。 元の視覚化では、毎年数秒がロードされるため、迅速な比較の可能性が排除されます。 元のグラフィックを取り、データがすぐにダウンロードされ、比較しやすいように作成しました。







私たちのバージョンを試してください。 夏にストックホルムとロンドンで何が起こるか、ロンドンがどれほどレギュラーであるかを見てください。 新年の変更のみがあります。 それでは、ロンドンとニューヨークを比較しましょう。ニューヨークでは、週末が長いです。 マドリッドを見てください。1日の1日後のシエスタが全体像をどのように変えるかを見てください。 そして今、マイアミまたはフェニックスでは、すべてが非常に均一であり、週末と営業日との間に大きな違いはありません。 ドバイでは、何らかの理由で、誰もが6月に寝ています。 おそらくこれはある種の宗教的断食の影響でしょう。



以下のバーは、1つの都市の平均週です。 たとえば、米国のシャーロットは一日の初めに強くノックアウトされることを示しています。 そして東京の夜はスムーズに夜に変わります。

ニューヨーク、ワシントン、ボストンでは、活発に表明された週と週末に多くのアクティビティがあり、平日はすべてが非常に遅いことがわかります。



追加のレベルの即時比較は、同様の写真の変化に気付くというビジョンの能力とうまく機能します（Tuftyはこれについて書いています）。 視覚化はそれ自体でクールであり、他のワイヤフレームと組み合わせてインタラクティブに接続し、より強力なコミュニケーション効果を得ることができます



NYTバスケットボールの視覚化







バスケットボールコートとリングがここに示されており、上部にはコートのさまざまなポイントからのショットの数とショットの有効性が示されています。 六角形のサイズは、位置からのスロー回数、色-赤、ここからのヒット数です。 統計は2つの異なるチームについて収集され、合計データ数、ショットあたりのポイント、ヒットの割合などの要約データもあります。



2つの写真が近くにある場合、2つのチームを簡単に比較できます。 オクラホマシティサンダーはセンターから3ポインターを投げますが、マイアミヒート-いいえ。 そこの彼らのパフォーマンスは非常に低いです。 しかし、最も興味深い部分は、プレイヤーの統計に目を向けることから始まります。 [プレイヤーの画像の上にマウスを置くと、プレイヤーは散らばって図になり、会場から熱烈なため息をつきます。]



プレーヤーによる比較はより興味深いものです。ここで、すごい効果は知覚を妨げず、グラフィックに非常に自然にフィットします。 ケビンデュラントは3ポインタースペシャルで、レブロンジェームズはリングの下から投げ出します。 さまざまなプレイヤーのテクニックを比較して確認し、ゲームのスタイルを理解することができます。 誰が左利きで誰が右利きであるかをまだ見ることができます



聴衆からの質問：これらすべてをどのように記録しますか？

現在、ますます多くのスポーツアナリストやテレビチャンネルが視覚化の力を理解し始め、そのようなデータの収集と集約にリソースを費やしています。 極端な場合、すべての目標の記録を見つけて、手動でデータセットを作成できます。



キャッシュフローの視覚化



次は、退屈なテーブル、財政です：





表には、ロシア連邦の構成エンティティと、個人/法人、居住者/非居住者による現金回転率、現金支払い/預金および回転率が示されています。 中央銀行のアナリストは、特定の時点での運用には関心がありませんが、異常や外れ値には関心があります。 たとえば、一部の企業での現金引き出しの急激な増加は、不正なスキームの疑いの理由です。







異常による色分けを行いました。 内部アルゴリズムは、異常の割合を計算し、インデックスに従ってエリアに色を付けます。



ノヴゴロド地域では、いくつかの値が平均から逸脱しており、この異常が地図上に見られます。 異常を見たとき、私たちはそれを理解し、より深く落ちるように試みることができます。 ここでの異常は引き渡しにあることが判明した。 これらは、3月、5月、1月の住民からの大規模な発作でした。 この視覚化では、さらに深く掘り下げることはできませんが、すでにここでシーズンの時間的ダイナミクスを見ることができます。 これが観光活動である可能性は低く、観光客は90億ルーブルをかき集めません。 おそらくこれが訴訟の理由です。 これは実際のデータではなく、研究所はテスト作業用の条件セットを生成しました。



以下は、形式の組み合わせの典型的な例です。 マップを操作すると、グラフがダイナミクスで活気づきます。 スケジュールを操作すると、マップが変更され、2013年4月にトムスク地域で異常が発生したことがわかります。



顧客では、これらの情報はすべてExcelの30枚のシートに保存され、そのような写真を見るために、これらの30枚のシートを移動します。 このエクセルでガイドされ、必要な情報を掘り下げる特別な人がいます。 視覚化の利点は、大量のデータを簡潔な形式にまとめることができることです。



ヴェネツィアの地図







地図上のデータと色の関係の優れた例。 色塗り領域は、異なる周波数で塗りつぶされる領域です。 一部の地域はより頻繁に浸水します。 2つのデータ型の興味深い組み合わせ。 一方では、これは水位であり、他方では、同じ規模で、洪水の頻度です。 領域を埋めるのに加えて、別の意味単位があります-自宅。 光は、洪水によって弱い影響を受けた建物、暗く、非常に破壊された建物を示しています



誰が誰と結婚しますか？





背景グリッドは、さまざまな職業で構成されています。 左側には男性の職業が多く、右側には女性の職業が多い。 職業にカーソルを合わせると、太さの異なる通信回線が表示され、この職業の人が他の職業の人とどれくらい頻繁に結婚するかがわかります。 サークルとは、1つの職業の中で人々が結婚することを意味します。 グラデーションの色は、ペア内の床を示しています。



消防士は幼稚園の先生と結婚します。 デザイナーはセールスマネージャーと結婚します。



そのようなグラフィックスは、情報表現の古典的な形式に決して結びついていません。 しかし、視覚化の根底にあるデータの特徴を最大限に考慮し、表示したいもの、つまり結婚の頻度を超視覚的にします。 それは非常にミニマリストです。 そして、この冗談は勉強するのが本当に面白いです。



聴衆からの質問：そして、どのように職業は男性的から女性的まで水平に散らばっていますか？

ほとんどの場合、専門家の近接度に応じて分散するトリッキーなアルゴリズムであるため、最終的な画像は見栄えがよくなります。



クールな視覚化、結論



聴衆への質問：すべての例は非常に異なっています。 それらを結合し、視覚化をクールにするものは何ですか？



聴衆からの回答：

-トピックが乾燥していて面白くないので、データは面白くなく活気があることをやめません。

-視覚化がうまくできたら、それを調べて質問したい。

-多次元データが接続されると、それらの比較から新しい意味が生まれます。

...



これが私の理解です。



「魔法」の感覚がある興味深い視覚化では、フラット画面には常に多くの次元があります。 知覚を便利にするために、さまざまな表現手段と方法と手法を使用します。



同時に、これらすべての測定値を示すとき、明確なままです。 これは機械的なコーディングではありません。「ああ、高さのプロパティがあり、色でエンコードします。長さのプロパティがあり、ハッチングでエンコードします。」 データの背後にある実際のものを考えてみてください。 これが戦車の装甲である場合、それが置かれている戦車に直接描画します。 現実にできるだけ近く、色に関する直感的なアイデア（男の子-青、女の子-ピンク）に近いコーディング方法を選択します。 直感的なコーディングを使用すればするほど、多くのデータディメンションが縫い込まれている場合でも、作業を認識しやすくなります。 「スケジュールの読み方」の署名やガイドを作成する必要はありません。巨大な伝説は必要ありません。 おそらく、最小限の凡例自体が図になります。 同時に、スケジュールは伝説のない生活を送っています。



これは常に機能するとは限りません。 新しいタイプの視覚化の方が適している場合がありますが、これはすぐにはわかりませんが、問題を非常によく解決します。 それもできます。 しかし、理想的には、明快さと直観性のために努力するべきです。



これらの原則が守られると、特定の全体像が生まれます。30のタブを切り替えることなく、国の都市を切り替えることなく、データ全体を一目で見ることができます。 全体像では、パターン、異常、コミュニケーションが見られます。 比較は簡単です。 全体像を把握しておらず、5つの散在グラフしかない場合、視覚化の利点と効果は完全に異なります。 パターンを見た後、さらに深く進んで探索を開始できます（キャッシュフロー、都市の顎骨）。 全体像を見て、パターンに気づき、このパターンに関するより深い質問に答えます。 これが力であり、視覚化のクールな鍵です。

アルゴリズムΔλ

クールなビジュアライゼーションの例を見てみましょう。次に、プロセスがラボ内でどのように機能するかについて話しましょう。 データを操作した結果のほとんどは、見た例とはまったく異なります。 通常、「視覚化」という言葉は、ダッシュボード、散在グラフ、円グラフ、棒グラフ、および場合によってはすぐに表示されます。



私はこれがなぜ起こるのかという仮説を持っています。 データがテーブルまたはデータベースに保存されるため、データと視覚化を扱う分析は、退屈で退屈なビジネスとして認識されることがよくあります。 そして、これらのデータシートと表は同じように見えます。 標準タイプの視覚化と同じ問題。



すべてのデータは一意です。 それらは生きており、何かが常に内部で発生します。オブジェクトが相互作用し、プロパティが変化します。 このライフをテーブルに入れると、デッドスライスで修正します。 このスライスを視覚化しようとすると、中程度の情報を提供しますが、退屈な無生物のダッシュボードが表示されます。 このような単純なアプローチは、最も論理的ではありますが、ドライで原始的な結果につながります。



それは見た目ほど簡単ではありませんが。 多くのニュアンスがあり、アナリストはデータの表示を正しく処理するために多くのお金を受け取ります。



最初の部分で説明した「魔法の感覚」を作成するには、想像力を有効にして、テーブルを超える必要があります。 これらのテーブルの背後にあるもの、このデータを生成するものを想像する必要があります。



データの現実は 、物理空間で発生し、データを生成する一連のプロセスです



ここでは、ケイティ・レデキが記録を破り、800メートルのフリースタイルでオリンピックの金メダルを獲得しています。







これは、データの現実を結び付けることで、実際に何が起こったのかを視覚化できる優れた例です。 退屈なテーブルが目を離すのが難しいものにどのように変わるか。



別の例ですが、別の領域からです。 イタリアの名物アントワーヌ・コルビーノの地図：





これをデータの視覚化と呼ぶことはほとんどありませんが、これは、戦車やバスケットボールコートの例のように、実際のオブジェクトを恐れることはないという事実の良い例です。 地図上にすべてを配置すること、それを実際の物理的な空間に結び付けることを恐れる必要はありません。



私たちは実際の「風景」を使用し、物理的現実から視覚化に要素を移そうとします。これにより、視認性が大幅に向上し、全体像に近づくことができます。



想像力やドライテーブルの背後にあるものを想像するなど、データの現実を判断し、この写真を見て、私たちは現象の本質を示すために一歩を踏み出します。データの現実は、統一されたテーブルの背後にあるデータの性質を確認するのに役立ちます。



データパーティクルはマイクロレベルからの呼び出しであり、複雑なデータのもつれを解くことができる基本的なデータブリックです。いくつかありますが、ほとんどの場合は1つです。これは、エンティティを見つけるための分析作業であり、可能な限り柔軟にデータを操作できるようにする単位です。



データの現実を提示し、データの粒子を分離することが、Δλアルゴリズムの最初のステップです。全体像を紹介し、最小のレンガを見つけます。データは、便利な方法でグループ化できるパーティクルのコレクションに変わります。



次に、画面の2次元平面に移動し、必要に応じてその上に粒子を配置し始めます。これは、アルゴリズムの2番目のステップ -フレームとビジュアルアトムの選択です。



ワイヤフレームは、画面上の2次元を整理し、画面上の位置に応じてデータパーティクルのプロパティを伝え、この位置を変更する方法です。フレームワークは、データ粒子を互いに比較できるように平面上に分散します。



視覚原子-画面上のデータ粒子の視覚的な実施形態。ビジュアルアトムは、色分け、サイズ、オブジェクトの形状、およびその他の視覚属性を使用してデータパラメーターを表示します。



フレームワークとアトムでこれらの問題が発生するのはなぜですか？粒子の空間特性と視覚的特性を分離する機能により、データ表示へのアプローチの柔軟性が大幅に向上します。視覚的な原子はどのフレームにも表示できます。グラフィックプリミティブ（点、図、線など）と組み合わせて、誰もが知っている基本的なフレームワークの小さなセットを考えても、可能な視覚化形式の印象的な表が得られます。







この素晴らしいテーブルで講義を始めてみませんか？この表は、データをそこにプッシュするために、標準パスに従って、多数のグラフからビジュアライゼーションを選択することを推奨しているように思えます。そして、事前に決められた形式でデータを突き出そうとすると、その本質、特徴を考慮に入れず、多くを失います。データから踊りたいので、最初の部分に非常に注意を払います。データは、すべての標準形式よりも複雑で興味深いものです。一般的に、データにはどのような形式がより良いかという独自のアイデアがあると感じています:)各データセットについて、内部の特徴を考慮して、それを提示する独自の最適な方法があります。この表を、データを何らかの形式にプッシュするためのツールとして認識してほしくありません。



アルゴリズムの3番目のステップ、フレームにデータをダンプした後。インターフェイス要素、フィルタリングツールを追加し始めています。おそらく、あまりにも多くのポイントを取得し、それらが波打つようになったら、それらのポイントをシェイプにマージできます。ワイヤフレームでデータを配布した後、データをどのように処理するかのシナリオに基づいてコントロールを追加できます。



アルゴリズムは、第二次世界大戦の損失 の視覚化の例に非常にクールにレイアウトされています。アルゴリズムのアクションは、目の前でリアルタイムに発生するようになります（ビデオをオンにします）。











ビデオは入門的な言葉で始まります-これがデータの現実です。今、彼らはデータの一部を選択しました-民間人と兵士。アルゴリズムの最初のステップが完了しました。視覚原子は、1000の生命がエンコードされた人間の姿です。さらに、2つの異なる人物-銃を持った兵士と武装していない民間人。個々の小さな男性から多くのデータが取得されます。ある時点で、すべてのデータは時間軸上にあります。時間の経過とともに損失の数がどのように増加し、さまざまな戦闘でどのように分配されるかがわかります。これは2番目のステップです。視覚アトムを異なるフレームに投げ込み、異なる画像を表示します。



別のグループ化方法が同じ粒子に適用されます-色によって、これは他の意味のある部分を意味します。データパーティクルは同じですが、簡単に比較して結論を​​出すことができます。シナリオの動きに注意してください-これらはすべてチャート上のポイントではなく生きている人々であるという考えが繰り返されます。



その後、スケールが大きすぎるため、ポイントが列になりました（3番目のステップ）。この例では、有名なMinarマップのように、全体像の力が現れています。そこには、あらゆる点、あらゆる死が見えます。これは、87百万という乾いた数字、またはバーよりもはるかに共鳴します。



***



アルゴリズムの詳細については、「Complex Data Visualization Algorithm」を参照してください。



メモを最後まで読んだ皆さんに、データ視覚化のコースに招待します。コースでは、リアリティとデータパーティクルの概念をさらに分析し、ワイヤフレーム、視覚的な原子、およびそれらを操作する原理にさらに精通します。さらに、コース参加者は、視覚化ツール（スコアボードとd3.jsライブラリ）を学習し、コースの最終日に教師の指導の下で独自の視覚化を作成します。5000ルーブルの割引を有効にするには。、コメントで録音する場合は、「Habrから」というメモを作成します。