読者です 読者をやめる 読者になる 読者になる

データ可視化 HandsOn #2を開催しました

visualization d3

まだまだ、ふっくらした開催概要ですし、進め方も全然決まってなく参加者の皆様を戸惑わせながらですが、データ可視化 HandsOn #2を開催しました

テーマ

僕自身がいま関心があるものですが「コストパフォーマンス」を可視化する、というテーマで取り組んで頂きました。 検索:コストパフォーマンスを見てもらえればわかるのですが「これは!」というものがありません。

もちろん、状況によってコストパフォーマンスをどのように読み取るか、価値を見出すか変化しますが、パッと見てわかるものがないので、今回テーマとして置いて考えてみました。

進め方

最初に自己紹介やテーマを説明した後、4人ずつ2つのグループにわかれ作業を行いました。

  1. 最初に少し「コストパフォーマンス」の定義などについて議論(10分程度)
    • 19:00 - 19:30
  2. 各自でそれらの表現方法を模索(発散)
    • 19:30 - 19:45
  3. 皆で持ち寄り発表し、幾つかに絞り込んだりアイデアを補足したりして、実装開始
    • 19:45 - 20:00
  4. 各自実装
    • 20:30 - 21:00 (のはずが22:00まで)
  5. 全体で発表
    • 22:00 - 22:30
  6. 懇親会

f:id:muddydixon:20130314215943j:plain

うちの班で出したアイデアのホワイトボード

成果発表

f:id:muddydixon:20130314220637j:plain

参加者の皆さんの表現

f:id:muddydixon:20130315235426j:plain

僕の作った表現

目的

僕が今回、コストパフォーマンスを表現するときに意識したのは次の2つです。

  1. いくつかの施策・改善の結果を比較したり、前回と今回の違いを比較したかった
  2. パフォーマンスもさる事ながら、現実ラインという意味で、コストをat a glanceで理解したい

説明

radio

一番上のものは、円でコストを、広がりでコストパフォーマンスを表現しています。 この表現だとコスト・コストパフォーマンスを簡単に比較できるかと思っています。 また、利用していない表現要素として、色・弧の数などが残っており、例えば、施策の種類や施策成否までの期間などの表現が可能かと思っています。 しかしながら、なれるまで非常に理解しづらいものであるかとは思っています。

arrow

真ん中のものは、割りとアナロジーとして理解しやすいと思っています。 安直に、色+角度でコストパフォーマンスを、矢印の大きさでコストを表現しています。 もちろん、パフォーマンス自体を大きさとすることもできるかと思っています。 これはインタラクションで選択かな。 今回実装したものだと矢印の部分が小さすぎたため見づらいですが、利用しやすい表現だと思っています。

opamp

一番下のものは、コスト・パフォーマンスをinput/outputとし、オペアンプのようなイメージで作ってみました。 個人的には今回試作してみた表現の中では一番わかり易いかと思っています。 最初から数字を埋め込むことを意識しているのが強かったのかなと。

ソースコードgithub:visjp2においてあります。

パラレルチャート

f:id:muddydixon:20130314221503j:plain

@brain_apple さんのparallel chartは、傾きでコストパフォーマンスを、左の軸でコストを、右の軸でパフォーマンスを表現しています。 施策の時系列情報が落ちてはいますが、スライダーなどでコストを絞り込んだり、角度を絞り込んだり、色で施策の種類を分けたりとこちらも実務上非常に使いやすい表現ではないかと思います。

反省と今後

1回目と違いテーマを決めて取り組んだことは参加者に余計な負担を強いることなく、検討・実装・議論まで進めらることができ、大変良かったのではないかと思いました。

CROSSや雪であまり開催できていませんが、今後、月1くらいで実施していければと思います。