2020年度インタラクティブメディア概論A 第2回

      2020年度インタラクティブメディア概論A 第2回 はコメントを受け付けていません

データ・ヴィジュアライゼーションについて考えてみる

今回は、ソフトウェアデザインの一分野である、データ・ヴィジュアライゼーションについて考えてみたい。

データ・ヴィジュアライゼーションとは、データや情報をグラフなどの視覚的な形式で表現したものである。これにより、傾向とパターンをより簡単に確認できるため、近年ますます重要度が増している。

しかし、データ・ヴィジュアライゼーションはデータ・サイエンティストやデータ・アナリストにとって重要であるだけでなく、どのような分野の人間でも素養として理解しておく必要がある。特に財務、マーケティング、技術、デザイン、その他多くの分野でデータの視覚化は現象を概観する手法として必須となっている。

データ・ヴィジュアライゼーションの歴史

この分野は1800年代のグラフ表示に始まり現代のインタラクティブな視覚化に至るまで、様々な手法が生まれてきた。簡単ではあるが、データ・ヴィジュアライゼーションが生まれて発展してきた過程を概観してみる。

近代(1800年代)

●ウィリアム・プレイフェア(William Playfair)

ウィリアム・プレイフェア(1759 – 1823) は近代グラフの発明者である。この時点で現代のグラフの基礎の多くが提示されてる。彼は、棒グラフ、線グラフ、円グラフを発明したが、その時代の彼のグラフと現代とでは基本的にほとんど変わっていないと言える。

棒グラフ
1565年から1821年の間での、英国における穀物の値段と労働者の賃金を比較している。棒グラフと線グラフの組み合わせ。

column_chart

線グラフ
デンマーク・ノルウェーに対する英国の輸出入の遷移。1755年ごろから英国の輸出が輸入を上回り始めている。
点と点を結んでいるというよりは、なめらかな曲線になっているのが面白い。

line_chart

円グラフ(棒グラフとの組み合わせ)

pie_chart

横軸は時間の棒グラフで、縦軸は貿易額を表したグラフ。
大国の力の推移を読み取ることができる。

multiple_chart

●フローレンス・ナイチンゲール(Florence_Nightingale)

有名なナイチンゲールのローズ・ダイアグラム(もしくはスパイラル・ダイアグラム)。クリミア戦争時の兵士の死亡原因が、不衛生な環境による感染症等が大きな要因であることを示している。1850年代のクリミア戦争中において兵士の死亡率は高かった。しかし、ナイチンゲールはその死亡率が戦闘のためだけではなく実際には病院の衛生状態の悪さによって引き起こされていることを明らかにした。

Nightingale-mortality

●シャルル・ジョゼフ・ミナール(Charles Joseph Minard)

ロシア戦没地図: この作品も、データヴィジュアライゼーションの歴史資料として必ず出てくる。ナポレオンのロシア遠征における兵士の人数の減少傾向を視覚化している。ベージュの色がロシアに向かうときの兵士の人数、黒が戻るときの人数。急激に減少していることがよく分かる。

Minard

上記の地図をインタラクティブにしたもの

地図と円グラフの組み合わせ

Minard-carte-viande-1858

1920~30年代

●オットー・ノイラート(Otto Neurath)

データ・ヴィジュアライゼーションの歴史を語る上で、最重要人物の1人。オットー・ノイラートは、ウィーン生まれの哲学者、社会経済学者だが、彼が提唱したピクトグラム(図像によるシンボル)を使った統計データの視覚化手法は、アイソタイプ(International System of Typographic Picture Education)と呼ばれ、その後のインフォ・グラフィックスの歴史に大きな影響を与えた。彼自身がデザインしているわけではなく、その完成度の高いグラフィックスは、ゲルト・アルンツ(Gerd Arntz)との共同作業によって生み出されている。
これらの功績は現代のインタフェースデザインにおける、アイコンのデザインにも影響を与え続けていると言っていいだろう。

otto_neurath009
siekman-_strip
thetransformer4

●ウィラード・C. ブリントン(Willard C. Brinton)

Graphic methods for presenting facts

地図内の地域ごとの数値を様々なデザインで表記する。現代でも使われている一般的な方法。

methodsfo00bringraphicrich_bw_pdf__page_235_of_398_ 2
methodsfo00bringraphicrich_bw_pdf__page_235_of_398_
methodsfo00bringraphicrich_bw_pdf__page_236_of_398_

1960~70年代

●ジャック・ベルタン(Jacques Bertin)

ジャック・ベルタンは、デザイナーというよりも、データヴィジュアライゼーションの研究者としての功績が大きい。感覚的になりがちな視覚化の過程を詳細に分析し、構造的な解釈を与えている。
下図は、視覚化の際の方法論。非常に簡潔にまとまっている。静止画についてはこの方法論でほとんどの視覚化が説明できるいってもいいだろう。

biblio-33-bertin

地図上での定量的データの視覚化パターン。一般的な方法よりはむしろ実験的なスタディ。

Jacques_Bertin

視覚化のパターンを表にしている。

retinal-variables

1970~80年代

●ナイジェル・ホームズ(Nigel Holmes)

ナイジェル・ホームズは、グラフィックデザインの要素の強いインフォグラフィックスを多数生作成している。データの視覚化は、ただ数値を形や色に変換するだけでなく、そこに楽しさ、インパクト、親しみやすさなどを盛り込むことによって、人の注意を引きつける役割も必要だということがわかる。

chap5healthxfinal
imagen (2)
taschen-poster

1980年代

●エドワード・タフティ

エドワード・タフティは、統計、政治科学、コンピュータサイエンスなど多岐にわたる分野に精通している。情報デザインやデータ視覚化のパイオニアとの評価が高い。デザイナーというよりも理論家、研究者としての功績が多い。
情報デザインに関する以下の4冊の著書がある。

 The Visual Display of Quantitative Information
 Envisioning Information
 Visual Explanations: Images and Quantities, Evidence and Narrative
 Beautiful Evidence

1990年代:インターネットにおける表現(ネットアートなど)

1990年代以降は、インターネットの普及やその関連技術の劇的な進歩によって、データヴィジュアライゼーションの展開は新しい時代に入った。主にウェブブラウザ上で見ること可能なコンテツンが多数発表された。この中で特筆すべきは静止画を主体としたインフォグラフィックスとは違い、アニメーショアニメーション、インタラクションがその視覚化において重要な役割を担っているという事実だろう。このことによって、それまでは主にグラフィックデザインの問題だった視覚化に、プログラマーが積極的に関わってくることになる。
http://internet-map.net

2000年代以降:ビッグデータ、オープンデータ、データジャーナリズム

●ビッグデータ

ビッグデータとは、従来のデータベース管理ツールやアプリケーションなどで処理することが困難な、巨大なデータ集積物を指す。
例としては、ソーシャルネットワーク、インターネット文書、天文学、大気科学、ゲノミクス、生物地球化学などの大規模データを挙げることができる。
だが、どういったデータをビッグデータと呼ぶのかは、実は明確な定義はない。

●オープンデータ

オープンデータとは、特定のデータが著作権や特許などの制限なしで、すべての人に提供されれるべきという考え方。近年は特に各国の政府や自治体が積極的に提供している例が多い。
オープンデータとは(Wikipedia)

●データジャーナリズム

オープンデータなどを積極的に利用し、データを分析し視覚化することによって、特定の社会問題を論じる手法。報道機関などが近年この手法を用いてニュースや記事などを書いているケースが多い。

日経新聞の取り組み
https://vdata.nikkei.com/

2012年から行われてているデータ・ジャーナリズムのコンペティション。歴代の受賞作品を見ることができる。
Data Journalism Awards
Information Is Beautiful Awards

データ・ヴィジュアライゼーションの例

●Radiation & Food Map in Japan

http://foodradiation.org/map/

福島第一原発事故後から現在に至るまでの日本全国の食品中放射性物質検査の結果をインタラクティブマップにしたもの。約157万件(2017年1月現在)の検査結果が視覚化されている。

2016_10_03_19_09

●パスケットボールにおけるシュートポイントの視覚化

http://www.nytimes.com/interactive/2012/06/11/sports/basketball/nba-shot-analysis.html

マイアミ・ヒートとオクラホマシティ・サンダーの選手のシュートパターンは、彼らがコートで最も危険なポイントを視覚化している。このヴィジュアライゼーションでは、コート内で彼らがシュートを打った場所を分析して、各プレーヤーの特徴や強みを比較している。

2016_10_03_19_10

●ガンジス川の水質汚染

https://graphics.reuters.com/INDIA-RIVER/010081TW39P/index.html

インド政府は、10億のヒンズー教徒が崇拝し4億人の水源のガンジス川を救うために闘っている。このプロジェクトは、川が日常的に処理しなければならない汚染と、水質がいかに悪いかを視覚化している。

●オバマ政権における2013年の国家予算提案の内訳

http://www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html

2013念のオバマ氏の予算案は3.7兆ドルの支出が予定されていて、9,100億ドルの赤字を予測している。その予算案を「全ての支出」「支出の種類」「変化」「部門別」という4つの切り口で視覚化している。

2016_10_03_19_13

●アメリカにおける伝染病の拡散とワクチンの関係を視覚化したマップ

http://graphics.wsj.com/infectious-diseases-and-vaccines/

70年以上の罹患者数のデータが州ごとに色分けされている。このような手法は一般的にヒートマップと呼ばれる。これらのヒートマップでは、麻疹、A型肝炎、おたふく風邪、百日咳、ポリオ、風疹、天然痘という代表的な感染症が、ワクチンの提供とともにどのように収束に至ったかを表している。

2017_01_02_17_52

●イギリスのエネルギー消費

http://www.evoenergy.co.uk/uk-energy-guide/

イギリスのエネルギー消費

1970年から2010年までのイギリスのエネルギー消費を、インタラクティブなデータ視覚化によってわかりやすく伝えている。2010年、イギリス全体の一次エネルギー消費量は、石油換算で2億1,850万トンであり、2009年よりも3%高くなっている。

2016_10_03_19_16

●プラスチックに溺れる

人間はペットボトルから水を飲むことに夢中だが、この行為は大きなゴミ問題となっている。このロイターによる視覚化では、有名なランドマークや街並みとペットボトルの山を比較している。

https://graphics.reuters.com/ENVIRONMENT-PLASTIC/0100B275155/index.html

課題

このレジュメを全て読み、データ・ヴィジュアライゼーションについての基礎的な知識を得た上で、以下の課題を行うこと。

  1. このレジュメの後半の「データ・ヴィジュアライゼーションの例」を丁寧に見て体験し、この中から一番印象に残ったヴィジュアライゼーションを選びその理由を述べる。400字以上。
  2. 最近は様々なニュースサイトなどが新型コロナウィルスの感染状況の感染状況を伝えるデータ・ヴィジュアライゼーションを作成している。それらの中から3つの事例を選び、それぞれの長所と短所を分析して記述する(例:わかりやすさ、操作性、美しさ、面白さ、など)。400字以上。

提出方法:

  • パソコンで課題を作成できる学生は「ドキュメント」を作成して提出すること。パソコンがない学生はスマートフォンのClassroomからでも提出可。その場合は「限定公開コメント」で提出すること

注意事項:

  • 1については英語のサイトが多いので、苦手な人はブラウザの翻訳機能を使うといい。
  • 2については、引用したサイトのURLを文章の最後に記載すること。URLは400字に含まない。
  • レポートは100点満点で採点する。
  • 提出期限は6/8(月)23:59