このページの本文へ

クロス集計を直感的に操作するUIを考えてみた (1/2)

2011年09月02日 11時00分更新

文●Web Professional編集部 話し手●飯島進仁(株式会社ふむふむソフト)/アスキー総研

  • この記事をはてなブックマークに追加
本文印刷

 「MCS(メディア&コンテンツ・サーベイ)2011」は、アスキー総合研究所が2011年2月から提供を始めた国内最大のネット・コンテンツ調査だ。簡単な操作でクロス集計し、集計結果をグラフ表示できる「Web版」を用意し、2010年3月に登場した「MCS 2010」よりも大幅にパワーアップしている。Web版の開発をおもに担当したふむふむソフトの飯島進仁代表に、開発上の工夫やHTML5とアプリケーションの今後の見通しについて話を聞いた。

ふむふむソフトが開発した「MCS 2011 Web版」。直感的な操作でクロス集計ができる独自のUIが特徴だ

iPad/Androidアプリか? Webアプリケーションか?

アスキー総合研究所(以下、「アスキー総研」)「MCS 2011 Web版」の目的は、会議中にノートパソコンやiPadなどのタブレット端末で、MCSのデータを簡単にクロス集計してグラフを表示したい、というユーザーのニーズを実現することでした。開発の初期段階ではiPadやAndroidのアプリにするか、Webアプリケーションにするか悩みましたが、Webアプリケーションにした理由はなんでしょうか?

ふむふむソフト飯島進仁氏(以下、飯島):アプリの想定動作環境が、パソコンやiPad、Androidタブレットまで幅広く、それなら汎用性が高いHTMLで、なるべくシンプルに作ろう、ということでWebアプリケーションになりました。iOSとAndroid用のアプリをそれぞれ作る方法もありますが、時間もコストもかなりかかってしまいます。短期間に低コストで作るには、Webアプリケーションの方が有利です。

 ただし、MCSは法人向けのサービスです。ユーザーが使っているのはいまだにWindows XPと考えられることから、IE8以下での動作が必須になり、HTML5は使いませんでした。

アスキー総研:もしHTML5で開発していたら、どんな点が違っていたでしょう?

飯島:一番大変なのはデバッグです。HTML5が使えればCanvas機能を使ってWebブラウザー側でグラフを描画できます。ブラウザーにはJavaScript用のデバッガがありますので、たとえば「グラフのここの幅は何ドットだな」といった作業を目で確認しながら修正できます

 しかし、「MCS 2011 Web版」のターゲットブラウザーは、IE8以前を含みます。IE8以前はHTML5非対応ですので、グラフはサーバー側で描画し、画像ファイルとして書き出します。サーバー側で画像を生成すればフォントなどの違いがなくなるといったメリットはありますが、サーバー側では、画像がファイルとして壊れてないかは確認できても、IEでもFirefoxでも、意図通りに表示されるかどうかは、実際にブラウザーで確認しないとわかりません。

直感的UIはアスキー総研の小難しい説明から生まれた!

アスキー総研:「MCS 2011 Web版」は、上側の青いバーと横の黄色いバーをタッチしたりクリックしたりして集計したい項目を選ぶことで、クロス集計の結果をグラフとして表示できます。縦と横の項目の入れ替えもボタンをクリックするだけ済むように、全体的にとても直感的です。こういうUIは、どうすると発想できるのでしょうか?

集計対象を縦と横で選択すると、クロス集計されたグラフを表示できる

飯島:Web版のUIを考えるにあたっては、MCSのWindows版と似せないことを目標にしたのですが、何も思いつかず悩んでいました。基本に戻って考えようとして、アスキー総研の仕様の要望に「表頭」と「表側」( Excelなどで表を作った場合、表の上部に来る項目を「表頭」、表の左側に並ぶ項目を「表側」と呼ぶ)という言葉を見つけました。普段クロス集計を扱っていない私にとって、ある意味「小難しい」言葉で初めは戸惑ったのですが、見出し行の「頭」と見出し列の「側」という文字をきっかけに、そのまま縦と横に表示することを思いついたのです。

 クロス集計というのは、結局「表頭」と「表側」の組み合わせに過ぎず、項目を縦にするか横にするかでグラフの見え方が変わる。開発工程を進めるうちに、この私の理解が正しいと確信しました。

アスキー総研:簡単な操作であれこれ試しながら集計結果がグラフになって表示されるので、「集計」という操作が気持ちいい。「MCS 2011 Web版」はそういうWebアプリケーションに仕上がっていますよね。

飯島:凡例の細かな位置合わせのような理想は果てしなく追求できるでしょうが、元のデータがあって確立された集計方法がある以上、グラフの中身では工夫のしどころがありません。グラフの塗り色や模様で変化を付けられるとしても、たとえば、あの長い歴史を持つExcel以上の汎用グラフ描画機能を作れ、といわれても私にはやりようがない。であれば他にないUIを作ろう、ということで直感的に操作できるクロス集計アプリケーションが生まれたわけです。

 また、「MCS 2011」のデータは今回が初見でしたので、「メディアとコンテンツがこんなふうに関係しているんだな」ということをWeb版のデバッグ作業でグラフを表示しながら気づけたのも面白かったです。

iPadは40代に受けていることがわかる

前へ 1 2 次へ

Web Professionalトップへ

Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

Webディレクター江口明日香が行く