デジタルプラクティス Vol.8 No.4 (Oct. 2017)

新しいデータ可視化表現が自発的かつ継続的に開発されるシビックテック活動の設計: E2D3におけるアプリケーション・オープンソース・ハッカソンのデザイン

五十嵐 康伸1  壹岐 崇2  江畑 彩3  大曽根 圭輔4  小副川 健5  小野 恵子6  河野 麻衣子  佐藤 奈津紀  澤 徳彦7  篠原 剛 清水 正行7  鈴木 典子8  竹内 秀行9  長久 武10  西野 貴志11  林 由佳  久住 裕司  平河 広輝12  槙田 直木  松崎 剛13  宮内 元  山田 祐資14  山本 智15  山本 優16  綿貫 順一17

1パーソルキャリア(株)  2エン・ジャパン(株)  3(株)アットウェア  4(株)Gunosy  5(株)富士通研究所  6国際基督教大学  7(株)日本経済新聞社  8日本IBM(株)  9(株)ユーザベース  10オートリブ(株)  11YAMAGATA(株)  12(株)トラス  13日本マイクロソフト(株)  14Mishima.syk  15日本放送協会  16ピタリ(株)  17NTTアドバンステクノロジ(株) 

データ活用の主体者が第三者にデータを伝え,意思決定させ,行動を起こさせる目的に対して,データ可視化(データビジュアライゼーション)は重要な役割を持つ.そして従来のデータ可視化表現では解決できなかった課題を解決する目的を持って,新しいデータ可視化表現は開発されてきた.本稿では,「市民によって新しいデータ可視化表現が自発的かつ継続的に開発」されることを目標に設計(デザイン)した「一つのハッカソンで作られたデータ可視化表現を元に,別のハッカソンで別の市民が新しいデータ可視化表現を開発できる連鎖の仕組み」を紹介する.より具体的には,オープンソースのデータ可視化アプリケーションE2D3(Excel to D3.js)と一連のハッカソンの設計のプラクティスと,「市民によって実際に自発的かつ継続的に開発された新しいデータ可視化表現」の事例について紹介する.

1.はじめに

データ活用の過程を大別すると,データの計測,解析,可視化の順となる.その中でデータ可視化(データビジュアライゼーション)は,データ活用の主体者が,計測もしくは解析されたデータを第三者に伝え,意思決定させ,行動を起させるために重要な役割を持つ.そして従来のデータ可視化表現では解決できなかった課題を解決する目的を持って,新しいデータ可視化表現が開発されてきた[1], [2].

たとえば,技師William Playfair(ウィリアム・プレイフェア)(1759〜1823年)は1786年に著書「Commercial and Political Atlas(商業と政治の地図)」の中で棒グラフや線グラフというデータ可視化表現を開発し,スコットランドの輸出入量(貿易赤字,黒字)を明快に示した[3].疫学の創設者,John Snow(ジョン・スノー)(1813〜1858年)は1854年,コレラの感染経路の特定と対策のために,コレラの発症数を地図上に小さな黒い棒で付加した「ロンドンのコレラ地図」というデータ可視化表現を開発した[4].このデータ可視化作品を時間経過とともに更新していくことで,発症密度が高い地域が分かるようになり,問題の抑制措置を取ることができた.看護研究者,統計学者,Florence Nightingale(フローレンス・ナイチンゲール)(1820〜1910年)は1858年,クリミア戦争における兵士の死因と死者数を時系列に沿って可視化する鶏頭図と呼ばれるデータ可視化表現を開発した.この鶏頭図によって,戦闘よりも疾病によって亡くなっている人の数の方が圧倒的に多いことを示し,その後の陸軍の衛生改革を実現した[5], [6].

従来,データ可視化は人の手によって開発されてきた.しかし近年,D3.jsに代表されるJavaScriptを用いたグラフィックライブラリの進歩により,ICTを用いてダイナミックかつインタラクティブなデータ可視化表現の開発が主流となっている[7], [8], [9].また,第四次産業革命といった産業構造の変化に沿ったデータ可視化ツールの急速な進歩により,プログラム言語やグラフィックライブラリの知識を持たない人でも,新しいデータ可視化表現を簡単に再利用できるようになっている.データ可視化の表現の種類と対応する有名な作成ツールを大別すると表1のようになる.

表1 データ可視化の表現の種類と対応する有名な作成ツール
参考文献:[10],[11],[12],[13],[14],[15],[16],[17],[18],

新しいデータ可視化表現の開発の主な担い手としてメディア,大学,市民等がある.メディアとしては海外ではNew York Times・Washington Post[3], [20],国内ではNHK[21]・日本経済新聞[22]・News Picks[23], [24]等が有名である.大学では,首都大学東京の渡邉英徳研究室[25],東海大学の富田誠研究室[26], [27],佐賀大学の杉本達應研究室等が有名である[28].これら,メディアや大学は業務・研究の一環として新しいデータ可視化表現を開発している.

その一方,2011年の東日本大震災以降の日本においては,テクノロジーを用いた行政・公共サービスへの市民参画,つまりはシビック・テクノロジー(シビックテック)が盛んになってきた[29].そしてシビックテック活動におけるサービス開発の過程では,イノベーションを生み出す共創の場としてハッカソンが多く開催され,ハッカソンの中で市民が新しいデータ可視化表現を開発することも活発になっている[30], [31].Mashup Awards[32],Linked Open Data Challenge [33], [34],アーバンデータチャレンジ[35], [36],RESASアプリコンテスト等の団体はコンテストの開催を通じて,優れたシビックテック活動を表彰し支援している[37], [38].しかし,ハッカソンで作られた作品を継続開発するためのエコサイクル(ビジネス化支援環境や寄付)が日本ではまだ十分でないため,ハッカソン参加者が作品開発を止めてしまい,プロトタイピングからサービスリリースにつなげられなかったり,サービスリリース後のメンテナンスをできなかったりすることが問題視されている[39], [40], [41], [42], [43].

そこで我々は,「市民によって新しいデータ可視化表現が自発的かつ継続的に開発される」ことを目標に,「一つのハッカソンで作られたデータ可視化表現を元に,別のハッカソンで別の市民が新しいデータ可視化表現を開発できる連鎖の仕組み」を設計(デザイン)した.その仕組みは次の2つの要素から構成される.一つ目の要素としては,我々自身でデータ可視化アプリケーションE2D3(Excel to D3.js)を設計し,オープンソースとして公開した[19],[44].二つ目の要素としては,我々で一連のハッカソンを設計し,公に参加を募り,ハッカソンを開催した.本稿では第2章において新しいデータ可視化表現を市民が簡単に再利用できるようにする「アプリケーションの設計」,第3章においてデータ可視化表現の開発を容易にする「オープンソースの設計」,第4章においてデータ可視化表現の開発が連鎖する「場(ハッカソン)の設計」に関して,それぞれのプラクティスを述べる(図1).そして,第5章では,「市民によって実際に自発的かつ継続的に開発された新しいデータ可視化表現」について述べる.第6章で全体をまとめる.

図1 ユーザ・コントリビュータ・運営メンバの関係,および アプリの利用とソースコードの修正の流れ

2.ユーザーの再利用を容易にする アプリケーションの設計

E2D3を一言で表現すると「Microsoft OfficeのExcel上で動作するデータ可視化のアプリケーション」であり,現在Officeアドイン(アプリケーション)として無料で提供している[45], [46].E2D3は,Excelで標準搭載されているグラフ機能だけではハードルの高かったダイナミックかつインタラクティブなデータ可視化を,誰もが簡単に表現できることを目指している(付録).そこで,データ可視化表現をE2D3のテンプレートとして,ユーザがExcelから呼びだすことができるようにした.さらに,テンプレートに付属しているサンプルデータフォーマットに可視化したいデータを上書きするだけで,従来のExcelでは表現できなかったデータ可視化表現を実現できるようにした.これら2つの工夫により,E2D3はすでに存在するデータ可視化表現をユーザが再利用する敷居を下げている.E2D3では,このようなテンプレートを複数用意しており,ユーザは自身の目的に沿ったテンプレートを選んで利用することができる.E2D3のテンプレートはRecommended,Statistics,Map,Marathon,Hackathon,NagoyaHack,KurashikiHack,KanazawaHack,Globe,To Be Developed,Uncategorizedの11カテゴリに分類され,現在88種類公開されている(図2).

図2 E2D3のテンプレート群

3.コントリビュータの開発を容易にする オープンソースの設計

E2D3では,さまざまな市民による開発を容易にすることを目的に,ソースコードはクローズドではなく,Apache ver. 2.0ライセンスでオープンにした [47], [48], [49].数あるオープンソースライセンスの中でApache ver. 2.0を選んだ理由は,利用者の要求に応じたソースコードの開示が必須ではなく,企業での商業利用でも使いやすいからである.その他のオープンライセンスの例として GPL ライセンスも考えられる.しかし,この場合,商業利用の際に利用者の要求に応じたソースコードの開示が必須となるため,企業は使いにくいことになる.

E2D3の開発には,GitレポジトリのホスティングサービスであるGitHubを用いている[50], [51].E2D3ではGitHub上のソースコードを修正するプログラマをコントリビュータ(貢献者)と呼んでいる.E2D3のユーザ・コントリビュータ・運営メンバの関係,およびアプリケーションの利用とソースコードの修正の流れを図1に示した.コントリビュータはGitHub上からE2D3の開発環境を取得(Clone)し,その環境で新規のテンプレート(データ可視化表現)を開発する.その後に,自身が開発したグラフのソースコードをGitHub上に公開されているソースコードに取り込んでもらう依頼(Pull Request)をする.Pull Requestの後に,運営メンバにより正常に動作することがテストで確認されると,修正されたソースコードが取り込み(Merge)される.MergeされたことはGitHubのAPI(Application Programming Interface)を用いてサーバに通知される.Mergeされたコードが自動的にサーバにDeployされることで,ExcelアプリケーションとしてのE2D3に反映され,すべてのE2D3ユーザがグラフを使用することができるようになる.またプログラマは自身の開発したコードがMergeされて初めて,コントリビュータと呼ばれるようになる.運営メンバがコントリビュータとして,ソースコードを修正することもある.

E2D3のテンプレートを構成する7種類のファイルを表2にまとめた.main.jsの中では,Excelでデータが更新されるごとに変数dataを引数として呼び出すupdate関数を使うことができる.dataはExcelのセルの情報を格納した2次元配列である.たとえばdata[0][0]には1行目1列目のセルの内容が格納されている.そして,dataをD3.js等で扱いやすいように転置したり,リスト形式・マップ形式・ネスト形式に変換したりする関数を用意している.

表2 E2D3のテンプレート を構成するファイル群

E2D3を開発するための環境構築の詳細はGitHub上で公開しているマニュアルを参照していただきたい[52].通常,Webサービスやアプリケーションを開発するには,サーバサイドやクラアントサイドの複数の言語の知識が必要な場合が多い.しかし,E2D3の開発においては,コントリビュータがデータ可視化の開発にのみ集中できるための工夫として,JavaScriptだけで開発できるようにしている.

コントリビュータが用いるライブラリは,D3.jsであることが多い.D3.jsはJavaScriptのライブラリの一つで,名前のD3(Data Driven Document)が示すとおり,データに基づいてドキュメントを操作するためのライブラリである.データを制御する関数や描画の関数が多く含まれており,自由な表現をすることが可能である[8], [9].D3.jsのWebサイト上にはサンプルも多く存在する[7].E2D3という名称は,ExcelからD3.jsで作られたこれらのサンプルを,プログラミングをしなくても直接呼びだせることを目指してつけられている.ただ近年では,D3.js以外の可視化ライブラリなども増えてきているので,テンプレート開発の際にはD3.js以外のライブラリを選択し利用することもできる.

また,プログラミングを行うコントリビュータだけでなく,ユーザも開発に参加しアプリケーションの改善に貢献する方法がある.E2D3を利用している際に,追加したほうがよい新たな機能に気づいた場合や,バグを発見した場合には,その機能やバグの内容をGitHub上に「Issue」として登録することができる.GitHubにアカウントを作った人であれば誰でもすべてのIssueを閲覧することができる.コントリビュータは,ソースコードの修正対象を決めるためにIssueを参考にすることが多い.

4.データ可視化表現の開発が連鎖する場の設計

我々は,E2D3への新たなデータ可視化表現(テンプレート)追加を目的とするハッカソンをこれまでに10回開催した.ハッカソンでデータ可視化表現を作り,その後のハッカソンではそれを元に別の市民が新しいデータ可視化表現を開発する.イベント名称に勉強会とついているものもあるが,内容はハッカソンである(表3)[53].

表3 ハッカソンの開催履歴

ハッカソンは第1回目を除き,すべてパートナ団体と共同で運営した.より具体的には,課題を持っているパートナと,その課題をデータ可視化によって解決できるか話し合い,解決できる見込みがあると双方が判断したときのみハッカソンを実施するという施策を取った.また,多様な課題に対する新しいデータ可視化表現が開発されることを目的に,できる限り多くのパートナ団体とハッカソンを開催した.パートナは大学,民間企業,任意団体とさまざまであった.そして,選挙・政治,教育,経営・経済,メディア,自然・アウトドア,地方創生の課題解決をデータ可視化表現の開発目的としてきた.

ハッカソンはすべて1日で行った.基本的なスケジュールは次の通りである.10時から11時まで,課題・データ可視化に関する先行事例・E2D3自体の紹介を参加者へのインプットとして行った.このインプットには,参加者全員に最低限の基礎知識を持ってもらう目的と,ハッカソンの成果物であるデータ可視化の方向性を参加者全員で共有する目的がある.課題の紹介は,E2D3メンバではなく,課題を持つ主体者であるパートナに行ってもらった.これには,ハッカソンを通じてどんな人(ペルソナ)の課題を解決したいのかを,参加者に具体的に認識・想像してもらい,開発意欲を高める狙いがある.先行事例とE2D3自体の紹介は,主に運営メンバが行った.先行事例は第1章で記載した,国内外のメディア・大学・市民が過去に作成したデータ可視化表現から選ぶことが多かった.

アイディア出し作業であるアイディアソンのアウトプットの種類や数を増やす方法としては,少量のインプットを材料に詳細に設計したフレームワークを用いる方法や,大量のインプットを材料に自由にチームメンバと議論をしてもらう方法が考えられるが,我々は後者の方法を選んだ.座った席が近い参加者同士が四人程度集まって1チームとすることを,チーム分けのルールとした.チームメンバとの自由な議論を通じて,自分が開発したいと思ったテンプレートのアイディアを,各々参加者が参加者全員に発表した.その発表を聞いて,参加者は自分が作りたいテンプレートのアイディアに集まり,チームを作成した.エンジニアが必ず1人いることを,チーム成立の条件とした.

アイディアソンからチームビルディングを,11時から12時まで行った.昼食はチーム単位で取ってもらった.13時から14時まで,GitHub上で公開しているマニュアルを用いてE2D3におけるオープンソースの仕組みを説明し,参加者に開発のための環境構築を行ってもらった[52].14時から18時まで,テンプレートを開発してもらった.開発中には,運営メンバがメンタとして参加者をサポートし,参加者の疑問を解決した.16時に各チームが中間発表した.そして運営メンバが,各チームの開発計画が18時までに実装可能かどうかと,ハッカソンの課題から乖離していないかを確認し,問題がある場合は解決策を該当するチームに提案した.そして,18時から19時まで各チームが成果発表するとともに,参加者全員と運営メンバとで質疑を行った.

また高価な賞品を用意することは意図的に行わなかった.これは参加者に,賞品目当てではなく自分たちが本当に作りたいテンプレートを作ってもらうための施策である.10回のハッカソンのうち賞品の合計額が1万円を超えたのは,「NewsPicks & SPEEDA スマートデータエクスペリエンスハッカソン powered by E2D3」と「LIGブログの勝手に1日編集長ハッカソン」の2回しかなかった.また,外部の審査員を呼ぶことも意図的に行わなかった.上記2回のハッカソンでは審査員を用意したが,その審査員は運営メンバの中から選んだ.その他の8回では,参加者同士の相互投票で優勝を決めるか,勝ち負けは決めなかった.どちらの場合でも,できるだけ多くの参加者が一度でも発言するように,質疑の場をファシリテーションした.これは,自分が作ったテンプレートの価値と今後の改善案を参加者自身で気づいてもらうための施策である.

参加費は基本的に無料で,会場費がかかる場合のみ有料とした.懇親会費は実費のみ徴収した.参加者の枠としてはエンジニア・デザイナ・プランナ以外にジャーナリスト・ライタ・教師・ワークショップデザイナ等を用意した.

5.市民によって実際に自発的かつ継続的に開発された新しいデータ可視化表現

10回のハッカソンでは数多くの新しいデータ可視化表現(テンプレート)が開発されたが,あるハッカソンで作られたテンプレートを元に,後日,別のハッカソンで別の市民が新しいテンプレートを開発した例を2つ紹介する.また,E2D3を起動しなくても簡易的にテンプレートの動きを確認できるデモモードのURLを併記する.E2D3を起動して確認すると,各テンプレートの文字と数字はExcelで変更可能なことも確認できる.

Recommendedカテゴリーの「under the sea」☆1は,第1回のハッカソン「E2D3 ハッカソン」で開発された新しいデータ可視化表現である(図3).入力するデータは漁法の種類ごとに対するえび,まぐろ,たいの漁獲量である.テンプレートの機能は漁法ごとの漁獲量の違いを示すことである.魚の位置(X軸)はExcel上におけるデータの行番号を表しており,テキストは漁法を表している.魚の位置(Y軸)は漁獲量を表している.右にあるebi・tai・tunaにテキストを選択することで,表示されるデータを切り替えることができる.その際には,魚が右から左に泳いで移動するという特性を,新しいアイコンが表現する.「under the sea」のソースコードを元に,第3回の「小学生が楽しいと思うグラフを作るぞハッカソン」において継続開発されたのが,Recommendedカテゴリーの「川上くんの徒競走」☆2である(図4).「under the sea」で開発されたアイコンの左右の移動が,人型のアイコンが左から右に移動するという形で継続されているのが見て分かる.このグラフの機能は,複数人の100m走の速さを比較できることである.入力するデータは名前,記録秒,距離,単位である.速さは自動的に100m当たりの速度に換算される.小学生が100m走を走った場合,走っている最中に,自分と周りの友人との速さの違いを俯瞰的に認識することは困難だが,「川上くんの徒競走」を使えば俯瞰的にシミュレーションすることが可能になる.また,サンプルデータには,ボルト,新幹線,マグロ等の速さが入っており,通常は競争できない相手の速さとの比較も可能になることを示している.

図3 「E2D3ハッカソン」で開発された「under the sea」
図4 「小学生が楽しいと思うグラフを作るぞハッカソン」で開発された「川上くんの徒競争」

Hackathonカテゴリの「bipartite-graph(2部グラフ)」☆3は第6回のハッカソン「LIGブログの勝手に1日編集長ハッカソン」で開発されたデータ可視化表現である(図5).入力するデータはアフター5に行う余暇の過ごし方と,目的,重要度である.通常何気なく行っている余暇を,目的の重要度から選択することができるようになる.「bipartite-graph(2部グラフ)」のソースコードを元に,第9回の「Code for Kurashiki E2D3勉強会」において継続開発されたのが,KurashikiHackカテゴリの「倉敷市の月別観光施設入場者数グラフ」☆4である(図6).グラフの目的は倉敷市の月別観光施設入場者数の割合を見ることである.入力するデータは倉敷市内の観光施設の名称,集計時期,来場者数である.テンプレートの基本的な形状は「Code for Kurashiki E2D3勉強会」と同じであるが,来場者数の絶対値と割合を自動的に計算して表示する機能(赤枠)が追加されていることが分かる.

図5 「LIG ブログの勝手に1日編集長ハッカソン」で開発された「bipartite -graph(2部グラフ)」
図6 「Code for Kurashiki E2D3勉強会」で開発された「倉敷市の月別観光施設入場者数グラフ」

また,本稿で注目している「市民による自発的かつ継続的な開発」に 準じる例としては,運営メンバがハッカソンの事前に開発したテンプレートを元にしてハッカソン中に市民が新しく開発した「継続的な」テンプレートと,Web上に存在する第三者のソースコードを参考にしてハッカソン中に市民が新しく開発した「自発的な」テンプレートがある.「継続的な」テンプレートと「自発的な」テンプレートは,合わせて 29 個以上存在する.これら29個のテンプレートを元にして,新たな「市民による自発的かつ継続的な開発」がハッカソンで生じることが今後期待できる.コントリビュータは合計で40人以上いる.コントリビュータの中にはハッカソン中のみならずハッカソン後もテンプレート改善にも協力してくれる人が多く,テンプレートに関するMergeの総回数は793回に上る.また,ハッカソンの参加者が運営メンバとなり,新たなハッカソンを主催してくれることもあった.「オープンデータでみる埼玉県知事選ハッカソン!」・「LIGブログの勝手に1日編集長ハッカソン」・「名古屋から『世の中』ビジュアライジング・ハンズオン ─ 第一夜」の3回は,それに該当する(表3).

5.おわりに

本稿では,「市民(シビックテック)によって新しいデータ可視化表現 が自発的かつ継続的に開発される」ことを目標に設計(デザイン)した「新しいデータ可視化表現開発の連鎖の仕組み」を紹介した.より具体的には,「一つのハッカソンで作られたデータ可視化表現を元に別のハッカソンで別の市民が新しいデータ可視化表現を開発できる連鎖の仕組み」を紹介した.第2章においては,新しいデータ可視化表現の市民による再利用を容易にする「アプリケーションの設計」のプラクティスとして,「E2D3 を Excel の Office アドイン(アプリケーション)としてユーザに提供し,Excel の 10 億人のユーザが誰でも簡単にかつ 無料でデータ可視化表現を再利用できる方法」を述べた.第3章においては,データ可視化表現の開発を容易にする「オープンソースの設計」のプラクティスとして,E2D3をGitHub上でオープンソースとして公開することで,コントリビュータが簡単にE2D3の開発環境を取得し,開発した新規のテンプレート(データ可視化表現)をPull Requestできることを述べた.第4章においては,データ可視化表現の開発が連鎖する「場(ハッカソン)の設計」におけるプラクティスとして,多様なパートナと,パートナが持つ課題をデータ可視化によって解決できるかを話し合うことにより,課題の解決と新しいデータ可視化表現の開発の両方を目的としたハッカソンを継続的に開催できることを述べた.第5章においては,「市民によって実際に自発的かつ継続的に開発された新しいデータ可視化表現」の例として,ハッカソンにおいて「under the sea」から継続開発された「川上くんの徒競走」と,「bipartite-graph(2部グラフ)」から継続開発された「倉敷市の月別観光施設入場者数グラフ」を紹介した.

第2章〜第5章をまとめると,第2章〜第4章の設計の結果として,第5章における2つの継続開発事例を得られたといえる.ハッカソンの回数に対する生産性を考えると,2 [継続開発事例]/10 [ハッカソン] = 1 [継続開発事例]/ 5 [ハッカソン] と評価できる.この生産性を指標として,生産性を高められるように設計を改善することが,我々の今後の課題である.第2章〜第4章で記載したプラクティスは,データ可視化以外の分野にも有効な可能性が高い.特に,地方創生,防災・減災,教育改革等の社会課題をハッカソンを通じて解決されようと試みられている方は参考にしていただきたい.

E2D3 はOfficeストアで累計 6 万回以上ダウンロードされており,さらに毎月約5,000 回ダウンロードされている.また2016年7月から8カ月間,日本・米国両方においてOfficeストアのTop画面でE2D3は紹介され続けている.さらに,これまでE2D3の開発・運営に協力してくれた市民は100人に及ぶ.これらのことは我々が,新しいデータ可視化表現の開発に対して,モノづくりだけでなくコトづくりとしても取り組んだ結果だと考える.今後は上記のプラクティスをより具体化し,社会課題をより強く解決できる新しいデータ可視化表現を市民と一緒に開発していきたい.我々は,すでにツールが充実しているTree・Network,地図,統計グラフ・チャートよりも,インフォグラフィックス・ピクトグラム・フォトビズ(写真)のデータ表現方法に開拓の余地があると考え,それらに今後注力していく予定である(表1).

 

参考文献
  • 1) マニュエル・リマ (著), 久保田晃弘(監修), 奥いずみ (翻訳):ビジュアル・コンプレキシティ─ 情報パターンのマッピング,ビー・エヌ・エヌ新社(2012).
  • 2) マニュエル・リマ(著),三中信宏 (翻訳):THE BOOK OF TREES─ 系統樹大全:知の世界を可視化するインフォグラフィックス,ビー・エヌ・エヌ新社(2015).
  • 3) http://datajournalismjp.GitHub.io/handbook/ (2017年2月6日現在)
  • 4) スティーヴン・ジョンソン(著),矢野真千子 (翻訳): 感染地図─ 歴史を変えた未知の病原体,河出書房新社(2007).
  • 5) 多尾清子:統計学者としてのナイチンゲール,医学書院(1991).
  • 6) 林 千晶:右脳×左脳が生む表現力 (特集 データの見せ方:インフォグラフィックス),Estrela (253),pp.2-9 (2015年4月).
  • 7) https://d3js.org/(2017年2月6日現在)
  • 8) 古籏一浩,データビジュアライゼーションのためのD3.js徹底入門 Webで魅せるグラフ&チャートの作り方,SBクリエイティブ(2014).
  • 9) 鈴木雅彦,鈴村嘉右:データビジュアライゼーションのデザインパターン20 ─ 混沌から意味を見つける可視化の理論と導入,技術評論社(2015).
  • 10) http://www.cytoscape.org/ (2017年2月6日現在)
  • 11) http://oss.infoscience.co.jp/gephi/gephi.org/ (2017年2月6日現在)
  • 12) http://www.esrij.com/products/arcgis/(2017年2月6日現在)
  • 13) http://qgis.org/ja/site/(2017年2月6日現在)
  • 14) https://carto.com/(2017年2月6日現在)
  • 15) https://www.tableau.com/(2017年2月6日現在)
  • 16) https://powerbi.microsoft.com/ja-jp/ (2017年2月6日現在)
  • 17) https://plot.ly/ (2017年2月6日現在)
  • 18) https://infogr.am/(2017年2月6日現在)
  • 19) http://e2d3.org/ja/(2017年2月6日現在)
  • 20) Journalism(特集 ビッグデータ時代の報道とは),朝日新聞出版(2014年7月).
  • 21) http://www.nhk.or.jp/d-navi/(2017年2月6日現在)
  • 22) https://vdata.nikkei.com/ (2017年2月6日現在)
  • 23) NewsPicks モバイル・インフォグラフィックス http://visual-times.tumblr.com/ (2017年2月6日現在)
  • 24) 荒川 拓,櫻田 潤: インフォグラフィックで見るApple,Google,Facebook,Amazonの買収戦略,ディスカヴァー・トゥエンティワン(2015).
  • 25) http://labo.wtnv.jp/ (2017年2月6日現在)
  • 26) http://tomita.me/ (2017年2月6日現在)
  • 27) 富田 誠,山本義郎: コラボレーションで実現するインフォグラフィックス,Estrela (253),pp.16-21 (2015年4月).
  • 28) https://lab.sugimototatsuo.com/ (2017年2月6日現在)
  • 29) 市川裕康:テクノロジーを活用した行政サービス効率化と市民参画のイノベーション :米国における「Civic Technology(シビックテック)」と呼ばれる新潮流(特集 オープンガバメントの新しい取り組み),行政&情報システム 50 (2),pp.14-20 (2014年4月)
  • 30) 総務省:平成25年度版 情報通信白書(2013).
  • 31) 総務省:平成26年度版 情報通信白書(2014).
  • 32) http://mashupaward.jp/ (2017年2月6日現在)
  • 33) 乙守信行,中辻 真,萩野達也:オープンデータの普及促進を加速させるコンテストの開催:LODチャレンジJapanの取組み(<特集>Linked Dataとセマンティック技術),人工知能:人工知能学会誌 30(5),pp.598-604 (2015).
  • 34) http://2016.lodc.jp/(2017年2月6日現在)
  • 35) 瀬戸寿一,関本義秀:地理空間情報のオープンデータ化と活用を通した地域課題解決の試み:「アーバンデータチャレンジ」を事例に (特集 オープンデータと情報メディア),映像情報メディア学会誌70(6),pp.840-846 (2016).
  • 36) http://urbandata-challenge.jp/(2017年2月6日現在)
  • 37) 日経ビッグデータ(編集):RESASの教科書 リーサス・ガイドブック,日経BP社(2016).
  • 38) https://opendata.resas-portal.go.jp/contest/index.html
  • 39) 木戸冬子,平本健二:大学におけるハッカソン実施の試み:ハッカソン研究会の活動,年次学術大会講演要旨集 30,pp.138-139 (2015).
  • 40) 五十嵐康伸,新田章太,山根淳平:ハッカソンを起点とした顧客との共創:「企業と友だちになれる就活アプリattache」の開発過程にみるオープンサービスイノベーション(特集:オープンサービスイノベーション),情報処理学会論文誌 デジタルプラクティス,7 (2),pp.167-174 (2016).
  • 41) 山根淳平:ハッカソンを一過性のイベントで終わらせないために,赤門マネジメント・レビュー 13 (12),pp.499-506 (2014).
  • 42) インターネット協会,インターネット白書2015 (2015).
  • 43) 月刊事業構想(特集 外部との共創で新アイデアを生むオープンイノベーション&オープンデータ),(株)日本ビジネス出版(2015年9月).
  • 44)https://github.com/e2d3
  • 45) 大曽根圭輔,佐藤奈津紀,五十嵐康伸: データ可視化とE2D3,Estrela (261) (特集 Excelでデータの可視化: 「E2D3」で新しい表現を),pp.2-9 (2015年12月)
  • 46) 佐藤奈津紀, 大曽根圭輔,五十嵐康伸: E2D3の使い方と活用事例,Estrela (261),pp.15-20 (2015年12月).
  • 47) エリック・スティーブン・レイモンド(著),山形 浩生(翻訳):伽藍とバザール ― オープンソース・ソフトLinuxマニフェスト,光芒社 (1999).
  • 48) ポール・グレアム(著),川合史朗(翻訳):ハッカーと画家 コンピュータ時代の創造者たち,オーム社(2005).
  • 49) http://www.opensource.jp/osd/osd-japanese.html
  • 50) 大曽根圭輔,佐藤奈津紀,五十嵐康伸:コミュニティでのオープンソースソフトウェア開発,Estrela (261),pp.10-14 (2015年12月).
  • 51) 大塚弘記 (著):GitHub実践入門 〜Pull Requestによる開発の変革,技術評論社(2014).
  • 52) https://GitHub.com/e2d3/e2d3/wiki/Getting-Started_ja
  • 53) http://e2d3.org/ja/activity-log/
五十嵐 康伸(非会員)yasunobu.igarashi@gmail.com

2001年筑波大学物理学専攻卒業.2006年奈良先端科学技術大学院大学情報科学研究科研究指導認定退学.2006 〜 2009年東北大学情報科学研究科産学官連携研究員,生命科学研究科助手.2009年奈良先端科学技術大学院大学情報科学研究科 特任助教.2010年バイオテクノロジー開発技術研究組合博士研究員.2010年オリンパスソフトウェアテクノロジー(株)部長付兼チーフエンジニア.2015年(株)ギブリー チーフサイエンティスト.2016年パーソルキャリア(株) Innovation Lab.エキスパート.2014年 E2D3.org Founder & PJ Leader.現在は,データ計測・解析・可視化・教育に関する研究に従事.博士(理学).

投稿受付:2017年2月28日
採録決定:2017年9月12日
編集担当:居駒幹夫((株)日立製作所)

付録. E2D3の利用方法

E2D3はMicrosoftが提供しているクラウドサービスOneDriveの「Excel Online」から使うことができる[46].OneDriveはWindows,Macintosh,Linux等からアクセスできる.Windowsのローカル環境では2013以降のExcel,Macのローカル環境では2016以降のExcelでもE2D3は使えるが,この原稿では誰でも利用しやすいOneDriveを題材に説明する.OneDriveにログイン後,「新規」から「Excel Online」を立ち上げ(図7),メニュー「挿入」-「Officeアドイン」をクリック(図8)する.図中では,操作するボタン等を赤枠で囲んでいる.「個人用アドイン」と「ストア」の選択肢が左上にでるが,はじめは「ストア」を選ぶ(図9).「Officeストア」の検索窓に「E2D3」と入れてエンターキーを押す.検索結果に表示されたE2D3のロゴをクリックし「信頼する」を選ぶとE2D3が立ち上がり,E2D3で使えるテンプレートが表示される.この時点でE2D3は個人用アドインに登録される.Excel上に開いたE2D3の画面から任意のテンプレート上でマウスオーバすると,説明書きとともに「可視化する」というボタンが現れる(図10).「可視化する」をクリックすると,サンプルデータの差し込みとテンプレートを用いて作成されたグラフの表示が行われる.

図7 OneDriveにログイン後,左上の「Microsoft サービス一覧」をクリッした画面.ExcelブックをクリックするとExcel Onlineが立ち上がる.
図8 Excel Online上の挿入とOfficeアドイン(アプリ)のアイコン
図9 E2D3が検索結果で表示された画面
図10 テンプレートをマウスオーバーした画面

E2D3が持つ主な機能を,グラフの上端にあるアイコンで説明すると表4のようになる.グラフの表示後,グラフとシートの境目にポインタを合わせると両矢印クロスに変わるので,そのままドラッグ&ドロップすればグラフの表示位置を自由に変えることができる.同様に,両矢印クロスしたポインタの状態で,四隅に合わせてドラッグ&ドロップするとグラフが拡大・縮小する.

表4 E2D3の主な機能