Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

2018-1-23-名古屋工業大学の講義資料

134 views

Published on

名古屋工業大学 大学院「知能プログラム特論」の講義資料

http://syllabus.ict.nitech.ac.jp/view.php?id=49994

Published in: Data & Analytics
  • Be the first to comment

2018-1-23-名古屋工業大学の講義資料

  1. 1. 名古屋工業大学 知能プログラム特論 人を動かすData Viz Data Vizの文法、目的、道具 Founder & PJ Leader 五十嵐康伸、博士(理学)
  2. 2. 質問 • Data Visualization – 1 ヒートマップ – 2 バブルチャート – 3 レーダーチャート – 4 ツリーマップ – 5 サンキーダイアグラム • JavaScript • D3.js • E2D3 って使ったことありますか?
  3. 3. 質問 • シビックテック活動 って知ってますか? • アイデアソン • ハッカソン って参加したことありますか?
  4. 4. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  5. 5. データ活用のための 新技術を作り続ける研究者(博士、理学) 可 視 化 解 析 計 測 人 世 界
  6. 6. 自らもデータを楽しむ! 総務大臣賞!
  7. 7. 皆にもデータを 楽しんでもらう
  8. 8. 皆にもデータを学んでもらう 京都大学 慶應義塾大学 でも講義 https://goo.gl/Je4Sa1
  9. 9. 皆にもデータを使ってもらう http://datajournalismjp.github.io/handbook/ データ・ジャーナリズムを それ以外のジャーナリズムと違うものにして いるのは何だろう? おそらく、従来からの「ニュースをかぎつける 鼻」や人の心に訴える物語を語る力と現在利 用可能な壮大なスケール(と範囲)に及ぶデ ジタル情報を組み合わせることで開ける 新たな可能性ではないだろうか。
  10. 10. 話し手の目標 1. 見たことがない「Data Viz」の世界を見てもらう 2. 「Data Viz」って面白いって感じてもらう 3. 「Data Viz」を作りたい、って思ってもらう 作るためのツールは名称紹介まで
  11. 11. 聞き手の目標 1. Data Vizが修論の研究テーマに成りうるのか?
  12. 12. 今日は一人 1回質問することを 目指そう! 楽しくなる 聞き方のコツ
  13. 13. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  14. 14. 発表の目的 【授業の目的】 Linked Data/セマンティックWebやオープンデータに関する社会動向 や先端研究について調査し,最新研究及び技術の動向を把握習得 する. 【達成目標】 1. Linked Open Dataに関するコンテストへのアイデア応募およびデー タ可視化に関する特別講義を通じ,社会的ニーズに即したアプリケ ーションについて理解する. 2. 著名国際会議や著名論文誌の最新論文を精読し内容を理解する.
  15. 15. Data Vizはデータに基づいて 人・組織・社会を動かす方法(の一つ) 可 視 化 解 析 計 測 人 世 界 (自分自身も含む) データ関連技術の出力先は? 計測 [機械 +人間] 解析 [機械+人間] 可視化 [必ず人間]
  16. 16. 新聞社はData Vizの最先端 日経ビジュアルデータ https://vdata.nikkei.com/
  17. 17. 新聞社はData Vizの最先端 NHK DATA NAVI https://vdata.nikkei.com/
  18. 18. スポーツのData Vizを見てみよう Grammer of Sports Data Viz 1. World Record / 時間比較 2. 道具の変化とWorld Record / 時間比較 3. 自分自身 / 時間比較・ばらつき 4. 因果・相関関係/ 時間比較・ばらつき 5. 比較できないものと比較
  19. 19. Usain Bolt and the Fastest Men in the World Since 1896 – on the Same Track The Newyork Times https://goo.gl/mi9YjZ
  20. 20. Five Thirty Eight https://goo.gl/L9gxV8
  21. 21. Grammar of Sport Data Viz 1. World Record / 時間比較 2. 道具の変化とWorld Record / 時間比較 3. 自分自身 / 時間比較・ばらつき 4. 因果・相関関係/ 時間比較・ばらつき 5. 比較できないものと比較
  22. 22. Dressed for a world record? The Washington Post https://goo.gl/l1cgg
  23. 23. Grammar of Sport Data Viz 1. World Record / 時間比較 2. 道具の変化とWorld Record / 時間比較 3. 自分自身 / 時間比較・ばらつき 4. 因果・相関関係/ 時間比較・ばらつき 5. 比較できないものと比較
  24. 24. Michael Phelps vs. Himself The New York Times https://goo.gl/MYbRJb
  25. 25. How Mariano Rivera Dominates Hitters The New York Times https://goo.gl/M7G4
  26. 26. Grammar of Sport Data Viz 1. World Record / 時間比較 2. 道具の変化とWorld Record / 時間比較 3. 自分自身 / 時間比較・ばらつき 4. 因果・相関関係/ 時間比較・ばらつき 5. 比較できないものと比較
  27. 27. 年棒対パフォーマンス Fathom Information Design 左 : 日付ことの成績、 右 : 年俸合計 https://goo.gl/hqZdi5
  28. 28. Grammar of Sport Data Viz 1. World Record / 時間比較 2. 道具の変化とWorld Record / 時間比較 3. 自分自身 / 時間比較・ばらつき 4. 因果・相関関係/ 時間比較・ばらつき 5. 比較できないものと比較
  29. 29. Infographics for children: what they can learn from data visualisations https://goo.gl/tRhkFz
  30. 30. 動物オリンピック
  31. 31. Grammar of Sport Data Viz 1. World Record / 時間比較 2. 道具の変化とWorld Record / 時間比較 3. 自分自身 / 時間比較・ばらつき 4. 因果・相関関係/ 時間比較・ばらつき 5. 比較できないものと比較
  32. 32. Data Vizの基本 <Data Vizの基本は情報の比較> ・自分、他人、対象物 多い、少ない、同じ ・現在の場所、他の場所 多い、少ない、同じ ・過去、現在、未来 増える、減る、同じ <Dynamic> ・ 時間変化が観れる <Interactiveの設計> ・ 時間を進める ・ 情報を並べる順番を変える
  33. 33. Data Viz作りの例 <比較の例> 最速の球技は何か? 野球:165 km/h、大谷翔平(日本) 169 km/h、アロルディス・チャップマン(キューバ) ボウリング:55km/h サッカー:132km/h ゴルフ:328km/h バドミントン:493km/h <誰も見たことがない新しいData Vizを簡単に作る秘訣> - 皆が認知しているボールの図をアイコンにする(コピーライトは気をつけて) - 背景を舞台に変える
  34. 34. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  35. 35. Data Vizはデータに基づいて 人・組織・社会を動かす方法(の一つ) 可 視 化 解 析 計 測 人 世 界 (自分自身も含む) データ関連技術の出力先は? 計測 [機械 +人間] 解析 [機械+人間] 可視化 [必ず人間]
  36. 36. そもそも統計とは • Statistics (n.) in German Statistik(1770) • “science dealing with data about the condition of a state or community” https://goo.gl/fYxaHh
  37. 37. Data Vizの代替手段 伝え手 受け手 課題 代替手段 メディア 読者 取材 文章 国 国民 長期的視野 法律・予算 国 他国 価値観の違い 外交・戦争 自治体 市民 信頼・透明性 教育・説明会 芸術家 世間 無関心 映画、演劇、ダン ス、音楽 部下 上司 懐疑 表 革命家 独裁者 抑圧 暴力・非暴力 課題解決、目的達成、目標到達の手段の一つ その他の方法で課題が解決できるなら、無理にData Vizをする必要はない Data Vizでないと課題解決できないと判断した時にData Vizを使えば良い
  38. 38. 何のためのData Viz? 【読売新聞】 読売信条 • 真実を追求する公正な報道、 勇気と責任ある言論により、 読者の信頼にこたえる。 • Data Journalism、特にData Vizは 公正、勇気、責任、信頼の根拠になりうるか? 【日本経済新聞】 「中正公平、わが国民生活の基礎たる経済の平和的民主的発展を期す」との社是のもと、冷静で客観 的な報道姿勢を貫き、民主主義や市場の役割を重視してきました • Data Vizを使うことで 中正公平性を上げられる、冷静で客観的になりうるか?
  39. 39. KPIを作るなら? 1. 世の中、日本がどれだけよくなったか? 2. 社是や信条の実現 3. メディアにおける日経新聞のポジショニング 4. これまでリーチしたかったけど、リーチできなかった読者層へのリーチ量 5. 既存読者のLTV(Life Time Value、顧客生涯価値)の向上 6. 議論を呼ぶ ≠ バズる 10. PV
  40. 40. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  41. 41. Data Vizの機能 【百聞は一見にしかず、seeing is believing】 1. 情報→体験 2. 課題や状況の見える化 3. 情報過不足調整 4. 主体探索 5. 新規発見 6. 美
  42. 42. Data Vizの要素 データビジュアライゼーションのデザインパターン20
  43. 43. 研究対象としてのData Viz 工学 : 便利な道具 ([ヒト、モノ、カネ]、情報、自然を制御 する方法、 理論) を作る New Comp + New Dataによって • 新しい「Data Vizの機能(表現)」を作れるように • 過去の「Data Vizの機能(表現) 」をより手軽に、より早 く誰でも使えるように(ライブラリー、プラットホーム) →世界(広がり)と歴史(深さ)を”体系的”に感覚的に掴ん でくれたら、Data Vizを研究する基盤となる
  44. 44. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  45. 45. Data Vizの世界 (広がり) と 歴史 (深さ) の体系 表現種類 Tree・ Network 地図 統計グラフ・ チャート Infograhics Pictogram PhotoViz 古代 1 4 7 10 中世 2 5 8 11 現代 3 6 9 12 作成ツール Cytoscape Gephi ArcGIS QGIS Carto Tablueau PowerBI Plotly Infogram E2D3
  46. 46. Treeの世界 (広がり) [Visual Complexity]
  47. 47. Treeの世界 (広がり) [The BOOK OF TREES]
  48. 48. Networkの世界 (広がり) [The BOOK OF TREES]
  49. 49. Tree・Networkの 世界 (広がり) と歴史 (深さ) TED マニュエル ・ リマ : 人類の知識を表す視覚的表現の歴史 0 -> 2 : 50, 6 : 40 -> 8 : 20
  50. 50. Cytoscape http://www.cytoscape.org/
  51. 51. Gephi https://goo.gl/m1Qz0
  52. 52. Data Vizの 世界 (広がり) と歴史 (深さ) の体系 表現種類 Tree・ Network 地図 統計グラフ・ チャート Infograhics Pictogram PhotoViz 古代 1 4 7 10 中世 2 5 8 11 現代 3 6 9 12 作成ツール Cytoscape Gephi ArcGIS QGIS Carto Tablueau PowerBI Plotly Infogram E2D3
  53. 53. TO図 8世紀、 修道士リエバナのベアトゥス (スペイン) 経験的世界を表す地図 地中海。 ナイル川、 タナイス川 (ロシア) [https://goo.gl/8PHf63]
  54. 54. メルカトル図法 1569年 地理学者ゲラルドゥス ・ メルカトル (現ベルギー) 経線は平行、 緯線は経線に直交、 海図 ・ 航路 [https://goo.gl/wBhbEa]
  55. 55. モルワイデ図法 1805年 天文学者 ・ 数学者カール ・ モルワイデ (ドイツ) 地図上の任意の場所で実際の面積との比が等しい [https://goo.gl/tAfyQN]
  56. 56. 投影法 x 45 [https://goo.gl/gdNvhb]
  57. 57. コラム: 18世紀、19世紀の英国 • André-Michel Guerry (1802-1866, Fr) • John Snow (1813-1858, En) • William Playfair (1759-1823, Sco) • Florence Nightingale(1820-1910, En) • 18世紀には、農業生産の飛躍的向上により人口の増加をもたらした農業革命(輪作と囲 い込み)に続き、世界初の工業化である産業革命(綿織物・製鉄業の技術革新、蒸気機 関→蒸気船や鉄道 )が起こったことにより、イギリスの生産力が飛躍的に向上した。 • 産業革命の原動力のひとつに大西洋の三角貿易(奴隷貿易)に支えられた砂糖や綿花 のプランテーション、そしてそこでの労働力となった黒人奴隷の存在がある。重商主義に よりヨーロッパ各国で激しい貿易競争がおこなわれた。オランダの自由貿易は衰え、イギ リスとフランスが台頭し両国は、激しい植民地戦争を繰り広げた。 • 1854年 ロンドン 250万人、世界最大、史上最大の都市 https://goo.gl/YNop9R
  58. 58. André-Michel Guerry (1802-1866, Fr) フランスの弁護士とアマチュアの統計学者 André-Michel Guerryは、 地図に何らかの変数に応 じて、地図の各々の地域を違う色で塗り分けるとい うアイデアを最初に世に出した人物である。 彼は 1829年に、 犯罪レベルに応じてフランスの地図の 各地区を影付けをして、初めてのコロプレス (塗り 分け) 地図を作成した。 [The Data Journalism Handbook (DJH) ]
  59. 59. 犯罪レベルを示すフランスの コロプレス(塗り分け)地図 André-Michel Guerry (1802-1866, Fr)
  60. 60. André-Michel Guerry (1802-1866, Fr) 今日、これらの地図は、例えば選挙区ごとに誰が誰 に投票したかや、富の分布、その他の多くの地理的 な要因に結びつく変数を説明するときに使われてい る。
  61. 61. John Snow (1813-1858, En) イングランドの医師、 疫学の創設者 1854年、 John Snowは今日では有名な 「ロンドン のコレラ地図」 を、発症が報告された地域に小さな 黒い棒をつけて作成した。 徐々に時間が経つに連 れ、 明らかに発症密度が高い地域がわかるように なり、 問題の抑制措置が取ることができた。 [DJH]
  62. 62. John Snow (1813-1858, En) ロンドンのコレラ地図
  63. 63. 地図の歴史 (深さ) TED スティーブ ・ ジョンソン : 感染地図 2 : 40 -> 8 : 40
  64. 64. 杉浦康平、時間地図 (1932-, Jpn) https://goo.gl/Aia2W4
  65. 65. 杉浦康平、時間地図 (1932-, Jpn) https://goo.gl/Aia2W4
  66. 66. Google Earth (2005-, US) https://goo.gl/YeCJfg 世界中の衛星写真を、まるで地球儀を回しているかのように閲覧することができる。
  67. 67. Data Vizの 世界 (広がり) と歴史 (深さ) の体系 表現種類 Tree・ Network 地図 統計グラフ・ チャート Infograhics Pictogram PhotoViz 古代 1 4 7 10 中世 2 5 8 11 現代 3 6 9 12 作成ツール Cytoscape Gephi ArcGIS QGIS Carto Tablueau PowerBI Plotly Infogram E2D3
  68. 68. William Playfair (1759-1823, Sco) 多言語に通じたスコットランド人技師 William Playfairは、 今日でも同じように使われている図 やグラフのほとんど(Line, Bara, Pie)を、 たった一人で 世界に送り出した人物である。 1786年の彼の本、 「Commercial and Political Atlas (商業と政治の地 図) 」 のなかで彼は、 棒グラフという全く新しく、 視覚 的な手法を用いて、 スコットランドの輸出入量を明快に 示したのである。 [DJH]
  69. 69. William Playfair (1759-1823, Sco) • 12歳、父死去。兄 科学者、数学者が家庭教師 • 14歳:粉挽機設計家に弟子入り:エンジニア • バックル、馬鉄、スプーン:銀細工 • 雑記しの記事、新聞記者:ライター • 銀行:投資家 • 投獄 • もう夢は諦めて本を書こう、線・棒・円グラフ: • ルイ16世→蒸気機関の粉挽機設計許可→フランス革命
  70. 70. William Playfair (1759-1823, Sco) 初期の頃の線グラフ、 Export and Import of Scotland
  71. 71. William Playfair (1759-1823, Sco) 初期の頃の棒グラフ、 Export and Import of Scotland
  72. 72. 現代の統計グラフ・チャートの機能 • 新しい方法で馴染みのものを見ること • 時間と共に変化することを示す • 値の比較 • 繋がりと流れを見せること • 代替結果を想定する事 in Data Journalism Handbook book 、 slide
  73. 73. 1. 新しい方法で馴染みのものを見ること あなたのような人々のための失業率 (NYT) https://goo.gl/2tEwcT
  74. 74. 1. 新しい方法で馴染みのものを見ること 米国の失業率が9%近くでさまよっていると、 ユーザ ーは様々な人口統計や学歴フィルターによって、 米国人口を選別することが出来た。 結局のところ、 その内訳は学士号より上の学位を持つ中年女性か ら高校を卒業していない若い黒人男性の全体の半 分近くで4%未満を占められていて、 この格差は真 新しくなかった。 それを見終わったあとでさえ、 良 いDVは頭の中に入り、 事実、 傾向またプロセスの 持続的なメンタルモデルが残る。
  75. 75. 2. 時間と共に変化することを示す 飛行経路の収束 (NYT) https://goo.gl/DzwM deregulation:規制撤廃
  76. 76. 2. 時間と共に変化することを示す 時系列の変化を示している他の興味深いグラフは、 業界再編の数十年の間についての 米国の主要航 空会社の市場占有率を描画したものがある。 Carter政権が旅客飛行を規制緩和した後、 NYTが 描いたこのグラフのように、 たくさんの国債融資が 小さな地方航空会社から全国航空会社を作成しま した。 ほとんど全てのカジュアルの読者が図の水 平線 「X」 軸を時間を表すと見るとするならば、 時 には、 全てのVizが時系列での変化を表すべきだと 考えることは容易である。
  77. 77. 3. 値の比較 戦争の人的コストの計算 (BBC) https://goo.gl/3pIYfy (NG) Fatality : 死亡者 (数)
  78. 78. 3. 値の比較 BBCが実施した犠牲者のデータベースとアニメ化さ れたスライドショーのように、 イランとアフガニスタン の争い (2001-2009) と、ベトナムで殺された何千 人もの命や(1965-1973) 、 第二次世界大戦で無く なった何百万もの命 (1939-1946) と比較すること によって、 DVは読者が二つやそれ以上の値の比 較のするのを助ける分野においても輝く。
  79. 79. 4. 繋がりと流れを見せること 年棒対パフォーマンス (BenFry) https://goo.gl/hqZdi5 左 : 日付ことの成績、 右 : 年俸合計
  80. 80. 4. 繋がりと流れを見せること 二つに分けられた値を比較するために、 メジャーリ ーグベースボールチーム relative to their payrolls のパフォーマンスが計算されているBen Fryの図を 見る。 左側の列では、 チームは日付ことの成績に よってランク付けされていて、 一方右側の列は年俸 の合計である。 赤色 (標準以下) もしくは青色 (標 準以上) で描かれた線は二つの値つなぎ、 駄目に なった年俸の高い選手に後悔しているチームオー ナの便利な感覚を提供している。
  81. 81. 5. 代替結果を想定する事 現実に対する予算見通し (NYT) https://goo.gl/Atym Surplus : 黒字、 deficit : 赤字
  82. 82. 5. 代替結果を想定する事 NYTにおいて、 何年にも渡る 悲惨なほど楽観的な 米国の赤字予測のAmanda Coxの 「ヤマアラシ図」 は起こらなかったことより、 面白くないことが起きた ことがどれほどあるか示している。 戦争と減税の十 年の後に財政赤字が急増していることを示している Coxの熱線は将来の期待が起きることがどれほど 非現実的かを示している。
  83. 83. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  84. 84. Data Vizの 世界 (広がり) と歴史 (深さ) の体系 表現種類 Tree ・ Network 地図 統計グラフ・ チャート Infograhics Pictogram PhotoViz 古代 1 4 7 10 中世 2 5 8 11 現代 3 6 9 12 作成ツール Cytoscape Gephi ArcGIS QGIS Carto Tablueau PowerBI Plotly Infogram E2D3
  85. 85. Data VizのR&Dとは? 工学 : 便利な道具 ([ヒト、モノ、カネ]、情報、自然を制御 する方法、 理論) を作る New Comp + New Dataによって • 新しい「Data Vizの機能(表現)」を作れるように • 過去の「Data Vizの機能(表現) 」をより手軽に、より早 く誰でも使えるように(ライブラリー、プラットホーム)
  86. 86. ターゲット データサイエンティスト アナリスト 営業、マーケ 非エンジニア 一般事務員 小、中、高生 データ好き データに触れる 機会多い データ嫌い、触れない 良い体験がない
  87. 87. よくある数値データ
  88. 88. よくある数値データ わかりづらい 見たくない
  89. 89. どうやったら、「データって面白い!」 という体験を作れるか? データ 計測 データ 解析 データ 可視化
  90. 90. 研究の目的 Webの技術(Javascript)を使って • データをわかりやすくグラフ化 • グラフが動く、操作できる • ユーザーがグラフを通じてデータから 色々発見ができる • 「データって面白い!」と感じる体験
  91. 91. Data Vizによって データサイエンティスト アナリスト 営業、マーケ 非エンジニア 一般事務員 小、中、高生 データって 面白い!
  92. 92. Excel
  93. 93. ユーザー数は・・・ Excel
  94. 94. 10億人! Excel
  95. 95. × Mashup! E2D3 (Excel to D3.js)
  96. 96. ユーザー数10億人のExcelから GUIのみで操作可能
  97. 97. Microsoft Office App Store から 誰でも無料に利用可能
  98. 98. 現在グラフ数:93個 Twitter, FB share, Web 埋め込み可能 by 市民 ハッカソン駆動開発
  99. 99. オープンソース データビジュアライゼーション プラットホーム Win, Mac npm html, JS コミュニティ アプリ
  100. 100. 開発ドキュメント in Github https://github.com/e2d3/e2d3/wiki/Home_ja
  101. 101. E2D3ハッカソン No ハッカソンの名称 課題パートナー 課題の種類 開催日 1 E2D3 ハッカソン 2015. 2. 8 2 Political Data Visualization Hackathon Vol. 1 ~ E2D3とマニフェストスイッチで新しい政治の見せ方 を考えよう! 早稲田大学マニフ ェスト研究所 選挙・政治 2015. 4. 11 3 小学生が楽しいと思うグラフを作るぞハッカソン organized by GreenHack & E2D3 株式会社 GreenHack 教育 2015. 5. 10 4 NewsPicks & SPEEDA スマートデータエクスペリエ ンスハッカソン powered by E2D3 株式会社ユーザ ベース 経営・経済 2015. 6. 14 5 オープンデータでみる埼玉県知事選ハッカソン! 早稲田大学マニフ ェスト研究所 選挙・政治 2015. 8. 2 6 LIGブログの勝手に1日編集長ハッカソン 株式会社LIG メディア 2015. 9.12 7 【裏鎌倉×野良IT】感性ビジュアライズの世界 NORA IT 自然・アウトドア 2015. 11. 7 8 名古屋から「世の中」ビジュアライジング・ハンズオ ン – 第一夜 Code for Nagoya 地方創生 2015. 11. 14 9 Code for Kurashiki E2D3勉強会 Code for Kurashiki 地方創生 2016. 1. 16 10 参院選データジャーナリズムハッカソン−立候補者 の違いを可視化しよう! 早稲田大学マニフ ェスト研究所 選挙、政治 2016. 7. 2
  102. 102. E2D3ハッカソンの開催判断、結果として PBL • 第1回目のハッカソンを除き、全てパートナー団体と一 緒に運営 • 課題を持っているパートナーと、その課題をデータ可 視化によって解決できるか話し合い、解決できる見込 みがあると双方が判断したときのみハッカソンを実施 • 多様な社会課題に対する新しいデータ可視化表現が 開発されることを目的に、できる限り多くのパートナー 団体とハッカソンを開催
  103. 103. て 題名 Data Viz 背景 アイコ ン Sample Data = 現実 or 仮想 表頭 表側 動く Interactive & Dynamics マウス操作有り、無しの画面遷 移 UI、UX、Touch、Action 1 いつ(When) 授業、部活 2 どこで(Where) 体育館、グラウンド 3 だれが(Who) 小学生高学年-高校生 4 なにを(What) 何と何を 5 なぜ(Why) 比較して何が知りたい? 6 どのように(How) データ測定方法 Data Vizの使用状況 By 手書き、PPT、 Sketch
  104. 104. under the sea
  105. 105. 川上くんの徒競走
  106. 106. 動物オリンピック
  107. 107. 受賞、記録歴14回
  108. 108. 他のData Vizツールとの比較
  109. 109. 本当に面白いグラフは、Controlできない OSS+ハッカソンから産まれてくる 奇跡の瞬間がある!
  110. 110. 目指している風景 多様性の海、人類の実験場 https://goo.gl/q75AiA
  111. 111. 仕組みと反響 開発期間2014.4〜3年 全エンジニア 41 全メンバー 100人 アクティブメンバー 74人 DL総数:10万 ! 月次DL数:5千
  112. 112. Office Store Top Page 2016. 7〜 11ヶ月
  113. 113. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  114. 114. 縦の役割分担 データサイエンティスト アナリスト 営業、マーケ 非エンジニア 一般事務員 小、中、高生 データって 面白い!
  115. 115. 横の役割分担 in (教科横櫛の)教養
  116. 116. Data Vizがわかる 読者を育てる必要があるの? データサイエンティスト アナリスト 営業、マーケ 非エンジニア 一般事務員 小、中、高生 データって 面白い!
  117. 117. 第四次産業構造革命 誰もがデータを使って仕事をする時代に! http://scf.jp/ja/essay/a005.php
  118. 118. ここでデータリテラリー(グラフィカシー)が 高い読者を育てないと、日本経済は復活しない
  119. 119. 政府の最優先課題は三つある トニーブレア https://goo.gl/3sE2Db
  120. 120. 教育と、教育と、教育だ!
  121. 121. 教育と、教育と、教育だ!
  122. 122. 教育と、教育と、教育だ!
  123. 123. Data Viz x オープンデータ x グラフィカシー教育 (社会課題を可視化するハッカソン) マイクロソフト、NewsPicks (Uzabase)、LIG、Code for 横浜、名古屋、倉敷らと約20回開催
  124. 124. オープンソース データビジュアライゼーション プラットホーム オープンデータ x 教育 Mashup!
  125. 125. Yahoo!ニュース x E2D3 Yahoo! 社会課題アイデアソン https://kumamotojishin.yahoo.co.jp/bousai/
  126. 126. Data Viz x オープンデータ x グラフィカシー教育 (社会課題を可視化するアイデアソン) Yahoo! みんなの政治、8つの高校・大学、塾で開催、メディア掲載11回
  127. 127. 講義内容 1. 自己紹介 2. Data Vizの最新事例 3. Data Vizとは何か 4. Data Vizの機能 5. Data Vizの世界と歴史 6. Data Vizが生まれ、共有される場:E2D3 7. Data Viz教育の実践 8. Data Vizのオープンイノベーション
  128. 128. E2D3 ボランティアメンバーの所属例 会社としての公式協力ではありません
  129. 129. 朝日新聞 x E2D3 得票率1割台で政権取る可能性 グラフで見る衆院選 https://goo.gl/2uZrqZ
  130. 130. E2D3 / Recommended / dot-bar-chart http://a.e2d3.org/chart.html#dot-bar-chart!js!csv
  131. 131. goo スマホ部 x E2D3 ドコモ圧勝!iPhone 6s発売日に速度調査(大阪環状線), 2015. 8. 8 https://itlife.oshiete.goo.ne.jp/article/511 独自調査
  132. 132. E2D3 / Recommended / multi-series-radar-chart http://a.e2d3.org/chart.html#multi-series-radar-chart!js!csv
  133. 133. Yahoo!ニュース x E2D3 検索データから見る熊本地震, 2016. 9. 1(防災の日) https://kumamotojishin.yahoo.co.jp/bousai/
  134. 134. NHK x E2D3 検索データから見る熊本地震, 2016. 9. 1(防災の日) https://goo.gl/s9YW5o
  135. 135. Data Vizを通じて 「データって面白い!」と皆が体験(≠知識) 「グラフィカシー」を皆が持っている 「データの力」を皆が活用できる 日本経済がよくなる 私たち(E2D3)が描く未来
  136. 136. Enjoy Data Viz ! Data Viz で困ったこと、 分からないことがあれば、 いつでも質問ください! Founder & PJ Leader 五十嵐康伸 FB : yasunobu.igarashi、 Twitter : B_T_Budo HP http://e2d3.org/ja/ FB https://www.facebook.com/e2d3project/ Twitter https://twitter.com/e2d3org Connpass http://e2d3.connpass.com/ Github https://github.com/e2d3/e2d3-contrib
  137. 137. その他の参考文献

×