【講演会】「モダンな」可視化アプリケーション開発とはどのようなものか?を開催しました

2017年7月8日(土)、TECHPLAY SHIBUYA(旧dots.)をお借りして、E2D3もくもく会と講演会を開催しました。 カリフォルニア大学サンディエゴ校医学部に所属するエンジニアであり、オープンソースのネットワーク可視化ソフトウェアCytoscapeのコア開発者である大野圭一郎さんをお招きして、『「モダンな」可視化アプリケーションとはどのようなものか?』と題した講演をしていただきました。 メインの講演は17:00からの予定でしたが、機材不調で参加者LT大会を先に実施。今回は総勢8名の方がLTをしてくださいました。発表者リストは以下の通り。参加者LTの振り返りは、メイン講演サマリーの後に続きます。 Vue.jsとmapboxを利用した位置情報可視化アプリケーション開発 by Kaito Kinjo データビジュアライゼーションから考える「料理とは何か?」 by 出雲翔 日用消費財の営業戦略運営で期待されるデータ可視化 by 篠原剛  E2D3の品質管理について by Junichi Watanuki データの可視化とチームの進化 by 吉田 雅史 スポーツデータビジュアライゼーション〜東京五輪に向けて〜 by 多田哲馬  D3.js バッドノウハウ集 by 清水正行 Grimoire.jsとデータビジュアライゼーション by 城山賢人 内容が濃く多岐にわたるLTで脳も身体も限界まで達したところで、メイン講演が始まりました。 スピーカーの大野圭一郎さんは、カリフォルニア大学サンディエゴ校医学部に所属するエンジニアで、オープンソースのネットワーク可視化ソフトウェアCytoscapeを開発された方です。Cytoscapeを使うと、遺伝子ネットワーク、ソーシャルネットワークが可視化できます。このソフトウェアを使って、塩基配列、たんぱく質、遺伝子の機能などのデータを統合・解析・可視化し、主に基礎医学研究者に対してデータを提供されています。研究者へのインタビュー、論文執筆、学会発表、ワークショッップの講師など様々な業務をされています。 最近では、①階層化された遺伝子群の可視化、②技術の古くなったアプリケーションの拡張、③良い技術を使いまわせるようにすること、をしていらっしゃいます。遺伝子オントロジーを機械的に生成するDeep Cell(仮)を新しいPJとして着手しています。 本日は、複雑なデータセットを可視化するアプリケーションのデザイン手法や実際の設計についてお話し頂きます。 【モダンなデータ可視化アプリケーション開発とは?】 テーマの一部でもある「モダンなデータ可視化アプリケーション開発とは?」という問いに答える前に、まず大野さんから質問。次のうちで現在使っているツールはありますか? D3.js ver.4 react BABEL webpack npm 大野さんはモダンを定義するにあたって、使用技術、開発スタイル、設計という三つの観点を挙げていらっしゃいました。使用技術が古くても開発スタイル(GitHub利用)や設計(データモデル、レンダリングレイヤーの分離)が新しいもの(Cytospaceが良い例)があることがわかりました。   モダンなデータ可視化アプリケーションの一つの定義として、以下の5点が挙げられます。 モジュール化されている よく知られた可視化のパターンや原則を利用している アプリケーションの基本設計として、データとUIの設計が構造化されている データの管理に一定のルールを持つ テスト可能 モダンであることは、特定の最新の技術を使うことではなく、アプリケーションの構造デザインと使用するテクノロジーの組み合わせが実現するものなのではないかと、大野さんはおっしゃっています。 とはいえ、無駄な労力を使わないツールを選ぶことも能力の一つ。モダンなデータ可視化アプリケーションの開発をする上で必要なツールについて、「現時点での」と条件を付けた上で、大野さんは以下のようにご教示くださいました。 Read more about 【講演会】「モダンな」可視化アプリケーション開発とはどのようなものか?を開催しました[…]

Safecast x E2D3 Data Visualization Workshop

On November 3rd, E2D3 and Safecast jointly held a collaboration workshop “Environmental Data Visualization Hands-On” The gathering kicked off with Safecast leader, Pieter’s presentation. Rob of Safecast explained ecosystem, data structure and how to use API to download data. Led by Yamamoto-san of E2D3, we started working with Safecast data on Excel and on E2D3. Read more about Safecast x E2D3 Data Visualization Workshop[…]

GEMS Math Workshop with E2D3

On October 29th, E2D3 invited a GEMS (Great Explorations in Math and Science) Japan instructor to conduct a math and numeracy workshop “Food and math”. About GEMS® : GEMS develops and publishes science and math curriculum, offers professional development, and maintains an international support network. GEMS is a program run by Laurence Hall of Science Read more about GEMS Math Workshop with E2D3[…]

データビジュアライゼーション 毎月もくもく会 vol. 9_初のLT&パネルディスカッション

2016年9月23日、渋谷dots.をお借りしてデータビジュアライゼーション 毎月もくもく会 vol. 9を開催しました。今回は、初のLT&パネルディスカッションメイン形式を採用し、もくもく会というよりはシンポジウムの様相を呈しておりました。 様々な分野の最前線でデータビジュアライゼーションと日々格闘している発表者の皆様の生の声に感化され、会場が一体になってデータビジュアライゼーションの価値や未来について語り合いました。 会は二部構成で、一部は参加者4名の方からのLT、二部はE2D3に深く関わってこられたお二人のパネルディスカッションでした。 LT大会(基調講演) テーマは、『どうやったら新しいデータビジュアライゼーション作品を作れるのか。それぞれの視点で、日頃の思いを語って頂きました。 1.    アオキさん「インフォグラフィックスとデータビジュアライゼーションの融合」 横浜のデザイナーさん。インフォグラフィックス作品に取り組んでいる。インフォグラフィックスは、一時点をとらえた静的なもの、一つの事件・インシデントを示すものであり、ニュースを伝える力が強いと考えている。 デザイナーの世界(情報が伝わるようにグラフィックスをまとめあげるが時として芸術作品)とエンジニアの世界(正確なデータを反映するが時に受け手にとって情報過多)とデータの見せ方がわかるデータサイエンティストのような人の三者がバランスを取れることが大事なのではないかと考えている。 会場からは、インフォグラフィックスの特性とは何か、凝ったインフォグラフィックスが逆に分かりにくさを産むことがある葛藤についての質問がありました。 2.    三好さん「どうやったら新しいデータビジュアライゼーション作品を作れるのか」+ 「どうやったらバズるデータビジュアライゼーション作品を作れるのか」 北海道とシロクマをこよなく愛するバズるdataviz作品の作り手。どうやったらバズる新しいデータビジュアライゼーション作品を作れるかという問いの答えは、「着想は真似事」+「自分の興味」+「自分が見たいという欲求」を重ね合わせていくことではないかと考えている。 過去に自身が作成した作品でバズったものの特徴は、見た目が美しい、1分以内に操作が理解できる、事実の再確認ができる、知らないことも含まれている、受け手が当事者になりうる、時事ネタが入っている等、だと分析している。 アーバンデータチャレンジ金賞等を受賞したが、作品を作ることで人脈が広がったことについても興味深いと感じている。 会場からは、作品作りの際の配色に対する考えについて、作品に対する世間の反応が予想と違うことについての質問がありました。 3.    内田さん「マネジメントを快適化するデータビジュアライゼーション」 SIerであり、プリザンターの使い手。仕事の進捗状況確認や平準化のきっかけ等、会社経営やプロジェクト運営の判断材料提供ツールとして、データビジュアライズに価値を見出している。 「データを集める仕組み」、「コミュニケーションの仕組み」、「ビジュアライゼーションの仕組み」。これらを合わせたものがプリザンターであると考えている。 プロジェクトマネジメントにおける実践的なデータ活用例 会場からは、ぜひ業務で使ってみたいという感想が出ました。また、ルーチンでない業務におけるプリザンターの活用方法、マネジメント自体が機能していない場合のプリザンターの活用方法について質問がありました。 4.    山崎さん「人々のニーズからデータビジュアライズを生み出し展開する」 金沢のUIUXを極めた学生さん。まちや往来の盛り上がりを可視化した作品を紹介。まちの賑わいをバスのアウトフィットに表し繁華街行きのバスであることを感覚的に理解させるバス、人間の心拍数を音楽に変えてその場の盛り上がりを表現する、等。 デザインは、対象物を美しくすることではなく、ユーザーが何を求めているかを考え抜き、ユーザーがスムーズに行動できるような状況を実現することだと考えている。 ユーザーとしての体験を中心に考えると作品の発想が広がることが多い。デバイスを超えて立体的なデータビジュアライズができるようになると感じている。データビジュアライゼーションでは数字や言語にこだわる必要がなく、直感的に理解できるということがデータビジュアライゼーションの価値なのではないかと考えている。 会場からは、他人にとっての見心地を理解し実現することの難しさについてコメントがありました。 第二部は、E2D3にいつも素晴らしいサジェスチョンを下さるデータジャーナリズムの神とE2D3発案者によるパネルディスカッション。 衝撃的な発言の連続で会場全体が盛り上がったパネルディスカッションでのトーク内容は、以下の通り。 データビジュアライゼーションとは何か データビジュアライゼーションという単語は流行語にすぎない。データを見せていくということはこれまでもこれからも重要。 データビジュアライゼーションは、紙メディアには不可能であった「データを一気に見せること」を可能にした。ただし、デザイン性やわかりやすさを追求すると結局シンプルなグラフに戻る。コストの割にメリットのないデータビジュアライゼーション。 地図という見せ方は、ストーリーを語るのに向かない。読み手に、読ませたい・見せたい場合は、人が記事や可視化されたものを読みといていくこと(読み手のアクション)に期待するよりは、書き手が視線誘導を技術として使っていく必要がある。 インフォグラフィックスとデータビジュアライゼーションの違い インフォグラフィックスとデータビジュアライゼーションの違いは、静的か動的かではなく、探索的データビジュアライゼーションVS説明的データビジュアライゼーションであり、インフォグラフィックは後者の一部だと考えている。 データ分析を体得していなければ、どんなに可視化しても何のアウトプットもでてこない。データ分析とは仮説を立てること。 データジャーナリズムとは そもそも、データビジュアライゼーションは批判である。相手が間違っていることをデータで指摘するのがデータジャーナリズム。わかりやすいデータビジュアライゼーションには本来の価値はないので、センセーショナルなものでなければならない。記事が信用されなくなってきた背景にデータジャーナリズムがあるのではないか(データを根拠にして初めて価値があるという流れが出てきた)。海外では、記者が匿名でもデータ自体の事実確認が取れれば、信用される。ただ、日本はデータで人を攻撃することはなく、データよりも人間の話の方が信用される傾向にある。 ディープラーニングとデータビジュアライゼーションの関係 ディープラーニングで出てきたものを可視化してもセンセーショナルさはない。 機械学習の中でいつデータビジュアライゼーションが利用されるかというと、データの素性を表す時や答えのあたりをつけるとき等に使う。データを基にしてその法則性をコンピューターが探し出すのがディープラーニングだが、その法則をなぜコンピュータが出したのか人間が理解する必要がある(=人間にもわかるような形にする)。その際にデータビジュアライゼーションを使う。 日本のデータビジュアライゼーションへ一言 日本のオープンデータ化は遅れているという話になりがちだが、昔はPDFを無理やりCSVに変換する地道な作業をしていることがあった。オープンデータやるほうがコストが上がるのでは本末転倒。「CSV公開されてないから作業できない」なんて甘えだ。 22:30近くまで続いたイベントの後には懇親会!終電に間に合って良かったですね。 こんな素晴らしいディスカッションができる集まりがE2D3です。もっと話したい方は、次のもくもく会に来てくださいね。

visualize the US presidential election

Upon a request from NHK, E2D3 visualized the US presidential election. This map tells us the system of the election in the United States. It also explains the points which make difference in the election. Enjoy the map which you can move with your mouse. http://www3.nhk.or.jp/…/2016-presidential-electi…/index.html

visualizing searched words for three hours from the Kumamoto earthquake

Disaster Prevention Day on September 1st Upon a request from Yahoo!NEWS, E2D3 visualized the words which were searched for three hours after the Kumamoto earthquake. What kind of information did people seek immediately after the earth quake? This word cloud give us a cue to think about the disaster prevention and the impact of data visualization. Read more about visualizing searched words for three hours from the Kumamoto earthquake[…]