複雑な情報をどう見せる？

◆JneOA9i9vo · 2008/01/15(火) 04:43:37

複雑で多数の切り口のある情報モデルを上手く見せている
ユーザーインタフェースについての情報交換スレです。

地理情報や3Dモデル、流体などの可視化の例は検索すればいろいろ
あるんですが、概念的なモデルについては検索では探し難いのです。
＃ゲームに実例が多いと思い、ム版やシュミレーション版でなくこちらに立てました。

例えば「地下街」の3D透視マップに下水の配管やセーブ可能場所、
悪魔出現度合いの分布を表示するのは想像し易いと思います。
しかし、「軍団」などの概念的なモデルで組織構成や職種分布、
所有兵器も把握できるようなUIは中々想像が難しいと思います。

ゲームなどで上手く表現している例を御存知の方、情報提供宜しくです。

・複雑で多数の切り口のある情報モデルを表現している。
・表現する対象の情報モデルはなんでも良い。
・二次元／三次元表示を問いません。
・ゲームの例に限りません。OSのUI、ビジネスソフト、CG作品でもOK。
　動かないコンセプトモデル、自分の考えたUIの絵でもOKです。
・インタラクティブに切り口を切り替えたり操作できれば尚良し。
・なるべく画の見れるURL付きでおねがいします。

以降、例を何レスか挙げます。

◆JneOA9i9vo · 2008/01/15(火) 04:45:33

地下街の例に近い地理情報モデルの例。

モデル：鶯谷の町
切り口：ラブホテル分布、銀行、危険箇所(警察)、他の町一覧
ttp://www.lovehomap.com/uguisudani.htm

地理情報なので飲み屋街とかも加え易いですね。

◆JneOA9i9vo · 2008/01/15(火) 04:46:13

音楽PVですが、1:52～2:07に出てくる五角形の情報の空間表示と
操作は視認性が良さそうに見えます。(PerfumeのElectro World)

モデル：三人が戦っている電子世界？(多分)
切り口：不明
ttp://www.nicovideo.jp/watch/sm184039

アイコンを2D配置したページを3D空間に直交的に配置して
ページ毎に操作、殴る、などしていますね。

**名前は開発中のものです。** · 2008/01/15(火) 04:49:57

どうみてもこの板向きじゃないよね。
この板が過疎板と知っての暴挙かい？

◆JneOA9i9vo · 2008/01/15(火) 04:50:56

「先進的UI」「可視化」で良く例に挙げられるのがデスクトップUIの
Looking Glassですが、XPのUIなどに比べてそれほど情報量は増えないですね。

モデル：動作中のウィンドウ
切り口：(多分)ウィンドウの使用頻度、実行中アプリ
ttp://www.atmarkit.co.jp/news/200701/11/lg3d.html

以下、ゲームに限りませんが情報提供ヨロシクです。

**名前は開発中のものです。** · 2008/01/15(火) 04:56:36

>>3
何このCapsule、と思ったら本人かw　しかしほとんど歌手の意味がないw

スレはとりあえず面白そう。

◆JneOA9i9vo · 2008/01/15(火) 04:57:36

>>4
どこに立ててもスレ違いと言わるのは判ってますが、
多分「ＸＸゲームの全体マップの作りが良い...」と言うような話だらけに
なると思ったのでここにしました。すみません。
情報提供スレは過疎版の方が長続きしますから。

◆JneOA9i9vo · 2008/01/15(火) 05:23:38

次世代ゲーム機はドリキャスしかもっていないので
最近のゲームは殆ど知らないんですが、PS3のLittle Big Planetです。

モデル：作成済の図形、作成中の図形、図形ライブラリ(？)
切り口：作成済の図形、作成/削り中の図形を重ねている(？)
ttp://www.nicovideo.jp/watch/sm602730

操作と図形の選択を階層化してるみたいなんですが、
どうやってユーザーに理解させてるんだろ。うむむ。

**名前は開発中のものです。** · 2008/01/15(火) 07:39:57

すれ違いじゃないけど情報は集まらなさそうだｗ
でも興味深い内容だね！

◆JneOA9i9vo · 2008/01/15(火) 12:29:50

>>6
どうもです。ニコニコでPerfume見てたら、うちの６才の娘が

「えーっ！チョコレートディスコってアイマスが歌ってんじゃないの！？」

と叫んだのを聞いて色々と反省しています。。。

>>9
>情報は集まらなさそうだｗ

そ、そんなぁー　orz。

シュミレーションゲームとかに良い実装例がありそうな気がするんですが...
＃伝説のオウガバトル以来やっていない
「今のはこんなに進化してんだぜ」とか言う書き込み募集中です。

◆JneOA9i9vo · 2008/01/15(火) 16:33:49

ビジネス系など、ゲーム以外で一般的な複雑な情報モデルの見せ方だとツリー構造があります。
eclipseのJDT(Java Development Tools)を例にします。

モデル：Java開発プロジェクト
　　　　(ディレクトリツリー、ソースファイル内の構造、プラグイン、ライブラリ)
切り口：プロジェクト内のファイルをツリー構造で表示
ttp://jpf.sourceforge.net/resources/images/ide-eclipse-04.png

モデル：同上
切り口：プロジェクト内のクラス継承階層を表示
ttp://upload.wikimedia.org/wikipedia/he/c/c9/Class_Hierarchy_View_Screenshot.png

Windowsエクスプローラなどで使われているディレクトリツリー(物理的な構造)と
クラスの継承階層(論理的な構造の一つ)を切替えて使います。

ゲームだと一階層を画面全体に表示して、コマンドで階層を上下するUIで
ツリー構造を表現することが多いかと思います。

◆JneOA9i9vo · 2008/01/15(火) 16:39:26

>>11のような古典的なツリー構造だと「新人採用基準.doc」と言うファイルは
　ルート->「組織」->「部」->「課」->「人事課」
　ルート->「プロジェクト」->「新人採用」
のどちらにも置きたいんですが、ショートカットを作るなど管理が面倒です。

この問題を解決するためにファイルにタグを付けてファイルシステムを
DBっぽくしようとする動きがVistaに乗らなかったWinFSなどですね。
＃本当はBe OSみたいに本当にDBにしたかったらしいですが...

Mac OSXはかなり進んでいるようで、ファイルの拡張属性にタグを
自由に設定できるらしい。

ttp://journal.mycom.co.jp/column/osx/253/index.html

結果としてSpotlightによる検索によりディレクトリ構造に縛られない
見せ方が可能になっています。

モデル：ファイルシステム
切り口：メタデータのタグ、ファイル名、ファイル内の単語
ttp://journal.mycom.co.jp/special/2007/topstory_leopard/007.html

**名前は開発中のものです。** · 2008/01/21(月) 13:40:26

こういってしまうとあれだが、結局階層化して整理するしか無いんじゃねってのが。

つまるところ、アイコンや並べ方と言ったインターフェイスをどう工夫するか
とか、どういうポイントに注目して分類（階層化）するかといった話にならざ
るを得ないのではなかろーか、とか思ったり思わなかったり。

Spotlightは便利だけど階層構造が不要になるわけで無し。

**名前は開発中のものです。** · 2008/01/22(火) 11:42:42

階層構造は分類の一手法にすぎんだろ

**名前は開発中のものです。** · 2008/01/22(火) 18:36:41

他の方法教えてくれぃ。

**名前は開発中のものです。** · 2008/01/22(火) 21:57:42

>>15
フォルクソノミーでもいいし、クラスタリングでもいい。分野を絞ればもっといろんなのが出てくるだろう。
階層構造は木構造を用いる分類の一手法にすぎんよ。

たしかにどうやっても『階層構造が不要になるわけで無』いけど、
それは単にデフォルトで階層構造が使われてるからにすぎないし、
たとえばインターネットのページも階層構造だけど、
基本的に使うのはハイパーリンクによるグラフ構造じゃないか。
なら階層構造だけに拘らす、別の観点を探すほうがいい。

**名前は開発中のものです。** · 2008/01/23(水) 01:53:28

>>16
うーんなるほど、階層構造だけってのは言い過ぎだと言うことがよく分かったThx!