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.
D3とE2D3の
概要説明
2015/05/10 (日)
@小学生が楽しいと思うグラフを作るぞハッカソン
自己紹介
・tiki
・Webサイトの企画
ディレクター
・苦手なこと、トラウマ
→グラフ作成
→絵心全般
→他
※プログラムが少し書けます
グラフのダサさでは、
誰にも負けない自負があります
私のビジュアライゼーションレベル
<症例>
・グラフで、人をがっかりさせることができる
・実はOffice2007から、機能についていけてない
・凝れば凝るほど、意味が分からない残念グラフになる
理想
※マッキンゼーの資料
・「分かりやすさ」と「スタイリッシュ」の融合
・もはやアート
・お金が取れる資料
・生まれ持ったセンスの壁
・そもそもExcel、パワポじゃ無理なんじゃねの壁
・グラフを作り込む時間がないの壁
勉強はしてみた。でも限度がある
樹海
もし、Excelのグラフが
もう少し綺麗でさえあれば
そこで
E2D3ですよ!
こんな私が、E2D3を使うと、、、
・Excel上で、スタイリッシュなグラフを
簡単に作成できちゃうのです!
すごく
スタイリッシュ
さて、今日のお話
D3とE2D3の概要説明
①E2D3で、できること
②D3.jsの表現力
③Excel内での使い方
④グラフ開発の流れ
⑤E2D3プロジェクトのご紹介
①
E2D3で
できること
E2D3とは
Excelの中に、D3.jpで作成したグラフを
表示するアプリ
D3.jsで作成
したグラフ
javascriptの描画特化ライブラリ。巷で話題
Excel
すごく
スタイリッシュ
すごく
オサレ
E2D3(Excel to D3)
E2D3で、できること
・グラフテンプレートを選び、Excel内に表示
・Excel内のデータをリアルタイム連動
②
D3.jsの表現力
D3.jsの表現力
D3.jsの表現力
D3.jsの表現力
D3.jsの表現力
・ハイセンスなテンプレート
・色合いもスタイリッシュ
・グラフが動く(javascriptなので)
D3.jsの表現力
javaScript グラフィックライブラリ部門
2015年ランキング第一位!
人気上昇中のJavaScriptライブラリを調べてみた【2015年版】
http://www.buildinsider.net/web/popu...
あたなに
こんなグラフが
1から描けますか?
E2D3なら
書けます!
③
Excel内での
使い方
アプリをダウンロード!
①Office用アプリを選択 ②E2D3で検索→選択
③グラフを選択 ④完了!
デモ(動くバブルチャート)
平均寿命
収入
円の大きさは
各国の
人口を表す
マウス操作で、年代を指定
④
グラフ開発の
流れ
グラフの開発方法(コントリビュータ登録が必要)
今は、ソースを「E2D3のgithub上に載せる」必要が
あります。ApacheLicence2.0ライセンスで
お願いしています(販売はまだです)
コントリ
ビューター
(D3.jsを使える
プ...
⑤
E2D3プロジェクト
のご紹介
コントリビューター
(D3.jsを使えるプログラマー)
E2D3
プロジェクトメンバー
ユーザー
E2D3は、ご覧の方々に支えられています
グラフの利用者
D3.jpを使って、
新しいグラフを作る人
もろもろの仕組みを作る人
・E2D3アプリの...
2014年12月,アプリストア登録
2014年5月,2名
1. 特別賞, 「Office用アプリ」開発コンテスト, 2014. 6. 24
2. TOP3, Office アプリ アイデアコンテスト, 2014. 9. 24
E2D3
プロジェクトメンバー
2014年9月,15名
1. Top 20,Mashup Awards 10, 2014. 11. 19
2. マイクロソフト賞,Mashup Awards 10, 2014. 11. 19
E2D3
プロジェクトメンバー
2014年11月,23名
E2D3
プロジェクトメンバー
今は50人くらいで
ゆるーく
やってます
ただ、大きな
可能性のある
プロジェクトです
ポテンシャルを感じた方
一緒にE2D3の盛り上げ行きませんか
E2D3 プロジェクトメンバー募集
E2D3参加方法
(ちょっと覗いてみたい!って人も大歓迎!)
■E2D3 公式webサイト
http://e2d3.org/
■Facebookグループ(E2D3 user group J)
https://www.facebook.com/g...
E2D3の世界へようこそ
楽しんでいきましょー♪
さいごに
今日は
小学生が楽しいと思う
グラフを作るぞハッカソン
E2D3も、少年少女の
心に残る作品になりますように
Upcoming SlideShare
Loading in …5
×

D3とE2D3の概要説明(20150510小学生が楽しいと思うグラフを作るぞハッカソン)

2,547 views

Published on

2015年5月10日に開催されました、「小学生が楽しいと思うグラフを作るぞハッカソン」内の、E2D3説明資料です

Published in: Software
  • Be the first to comment

D3とE2D3の概要説明(20150510小学生が楽しいと思うグラフを作るぞハッカソン)

  1. 1. D3とE2D3の 概要説明 2015/05/10 (日) @小学生が楽しいと思うグラフを作るぞハッカソン
  2. 2. 自己紹介 ・tiki ・Webサイトの企画 ディレクター ・苦手なこと、トラウマ →グラフ作成 →絵心全般 →他 ※プログラムが少し書けます グラフのダサさでは、 誰にも負けない自負があります
  3. 3. 私のビジュアライゼーションレベル <症例> ・グラフで、人をがっかりさせることができる ・実はOffice2007から、機能についていけてない ・凝れば凝るほど、意味が分からない残念グラフになる
  4. 4. 理想 ※マッキンゼーの資料 ・「分かりやすさ」と「スタイリッシュ」の融合 ・もはやアート ・お金が取れる資料
  5. 5. ・生まれ持ったセンスの壁 ・そもそもExcel、パワポじゃ無理なんじゃねの壁 ・グラフを作り込む時間がないの壁 勉強はしてみた。でも限度がある 樹海 もし、Excelのグラフが もう少し綺麗でさえあれば
  6. 6. そこで E2D3ですよ!
  7. 7. こんな私が、E2D3を使うと、、、 ・Excel上で、スタイリッシュなグラフを 簡単に作成できちゃうのです! すごく スタイリッシュ
  8. 8. さて、今日のお話 D3とE2D3の概要説明 ①E2D3で、できること ②D3.jsの表現力 ③Excel内での使い方 ④グラフ開発の流れ ⑤E2D3プロジェクトのご紹介
  9. 9. ① E2D3で できること
  10. 10. E2D3とは Excelの中に、D3.jpで作成したグラフを 表示するアプリ D3.jsで作成 したグラフ javascriptの描画特化ライブラリ。巷で話題 Excel すごく スタイリッシュ すごく オサレ E2D3(Excel to D3)
  11. 11. E2D3で、できること ・グラフテンプレートを選び、Excel内に表示 ・Excel内のデータをリアルタイム連動
  12. 12. ② D3.jsの表現力
  13. 13. D3.jsの表現力
  14. 14. D3.jsの表現力
  15. 15. D3.jsの表現力
  16. 16. D3.jsの表現力 ・ハイセンスなテンプレート ・色合いもスタイリッシュ ・グラフが動く(javascriptなので)
  17. 17. D3.jsの表現力 javaScript グラフィックライブラリ部門 2015年ランキング第一位! 人気上昇中のJavaScriptライブラリを調べてみた【2015年版】 http://www.buildinsider.net/web/popularjslib/2015
  18. 18. あたなに こんなグラフが 1から描けますか?
  19. 19. E2D3なら 書けます!
  20. 20. ③ Excel内での 使い方
  21. 21. アプリをダウンロード! ①Office用アプリを選択 ②E2D3で検索→選択 ③グラフを選択 ④完了!
  22. 22. デモ(動くバブルチャート) 平均寿命 収入 円の大きさは 各国の 人口を表す マウス操作で、年代を指定
  23. 23. ④ グラフ開発の 流れ
  24. 24. グラフの開発方法(コントリビュータ登録が必要) 今は、ソースを「E2D3のgithub上に載せる」必要が あります。ApacheLicence2.0ライセンスで お願いしています(販売はまだです) コントリ ビューター (D3.jsを使える プログラマー) 投稿 (Pull Request) E2D3 プロジェクトメンバー が管理 javascript css サンプルデータ 説明文 承認 全世界の ユーザー
  25. 25. ⑤ E2D3プロジェクト のご紹介
  26. 26. コントリビューター (D3.jsを使えるプログラマー) E2D3 プロジェクトメンバー ユーザー E2D3は、ご覧の方々に支えられています グラフの利用者 D3.jpを使って、 新しいグラフを作る人 もろもろの仕組みを作る人 ・E2D3アプリの開発 ・プラットフォームの開発 ・D3.jp資料の日本語訳
  27. 27. 2014年12月,アプリストア登録
  28. 28. 2014年5月,2名 1. 特別賞, 「Office用アプリ」開発コンテスト, 2014. 6. 24 2. TOP3, Office アプリ アイデアコンテスト, 2014. 9. 24 E2D3 プロジェクトメンバー
  29. 29. 2014年9月,15名 1. Top 20,Mashup Awards 10, 2014. 11. 19 2. マイクロソフト賞,Mashup Awards 10, 2014. 11. 19 E2D3 プロジェクトメンバー
  30. 30. 2014年11月,23名 E2D3 プロジェクトメンバー
  31. 31. 今は50人くらいで ゆるーく やってます
  32. 32. ただ、大きな 可能性のある プロジェクトです
  33. 33. ポテンシャルを感じた方 一緒にE2D3の盛り上げ行きませんか E2D3 プロジェクトメンバー募集
  34. 34. E2D3参加方法 (ちょっと覗いてみたい!って人も大歓迎!) ■E2D3 公式webサイト http://e2d3.org/ ■Facebookグループ(E2D3 user group J) https://www.facebook.com/groups/369091606599239/ ■twitter( Results for #e2d3) https://twitter.com/search?f=realtime&q=%23e2d3
  35. 35. E2D3の世界へようこそ 楽しんでいきましょー♪
  36. 36. さいごに
  37. 37. 今日は 小学生が楽しいと思う グラフを作るぞハッカソン
  38. 38. E2D3も、少年少女の 心に残る作品になりますように

×