地球で旅行検索 : Microsoft Virtual Earth 3D x エイビーロード WEBサービスデモサイトを公開｜Media Technology Labs (MTL) : メディアテクノロジーラボ

地球で旅行検索 : Microsoft Virtual Earth 3D x エイビーロード WEBサービスデモサイトを公開

石橋利真

2007/9/20 04:58

お知らせ

研究員の石橋利真です。こんにちは。

8月にMTLがリリースしたエイビーロード WEBサービスと、マイクロソフト社が提供する3D 地図プラットフォーム - Virtual Earth 3D - を組み合わせたデモサイトを作りました:

デモサイト - 地球で旅行検索 -

[目次]

1. デモサイトを試すにはプラグインのインストールが必要
2. コンセプト
3. マイクロソフト REMIX07 TOKYO カンファレンスでお披露目
4. 何故 Microsoft Virtual Earth で試したのか
5. 開発手法
6. Virtual Earth 3D を実際に試してみた感想
7. 各種メディア記事
8. 地球の操作方法

1. デモサイトを試すにはプラグインのインストールが必要

動作させるには Virtual Earth 3D プラグインを事前にインストールしておく必要があります。以下のリンクからインストーラー (Setup.exe) をダウンロード＆実行してください。

Virtual Earth 3D Installer をダウンロード

無事導入できたならば:

デモサイト - 地球で旅行検索 - を立ち上げる

動作環境

OS: Windows XP or Vista
Browser: IE6/IE7, Firefox

▲BACK TO TOP

2. コンセプト

キーワードを元に、オススメの旅先を、地球を使ってご紹介

どこに旅行したいか検討がついていない方が「なんとなくブラウズしているうちに、何かしらのインスピレーションを得る」事にフォーカスしたサイト。表示されているさまざまなキーワード「癒し」「登山」「紅葉」などの中から気になったワードを選択すると、該当ワードに関連するオススメ都市が、地球上にプロットされます。

「癒し」 → オアフ島、バリ島、コナキタバル？どこ？...へぇ、マレーシアなのかぁ
「聖堂」 → ローマ、パリを抑えてクライストチャーチって所が1位... へぇ、ニュージーランドにそんな場所があるのかぁ

気になる都市を見つけたら、そこを地図上で選択することで、さらにズームイン、今度はその都市付近の観光地を一覧で提示、かつ地図上の位置関係も教えてくれます。

各観光地の写真や説明文を確認しつつ、画面に大きく表示されている街の周辺風景や、建物や山岳地形などが3D表示されている様を眺めることで、旅先のイメージが沸くかもしれません。

あるいは、あっちこっち都市を訪れているうちに、お気に入りの場所が見つかるかも。各都市ごとに、AB-ROADに掲載されているツアーの一覧が表示されるので、旅費やツアー期間の相場もその場で把握できます。もし気に入ったツアーがあったら、そのままリンク先のAB-ROADサイトにてツアーの予約・問い合わせも可能です。

▲BACK TO TOP

3. マイクロソフト REMIX07 TOKYO カンファレンスでお披露目

今年(2007年)8月1日にリリースしたばかりのエイビーロード WEBサービスを使ったデモサイトを作ろうと思案していたところに、Microsoft Virtual Earth に 3D 機能があることを知り、興味を持ったのが開発着手のきっかけでした。そこから1ヶ月間の企画～実装～手直し～手直しまくり... のフェーズを経て、9月19日、REMIX07 カンファレンス基調講演にてデモの披露をさせていただきました。

当日のストリーミング映像

当日基調講演のストリーミング映像

閲覧するには Silverlight プラグインのインストールが必要になります。画面右側のパワポ画面下部にマウスを持っていくと、ページ選択が出来るUIが出てくるので、7-8回「次へ」ボタンを連打した後、唯一背景色が「白くて」、うちのラボのロゴである「木」の影絵がでっかく写っているページをクリックすると、目的の動画が始まります。ふう。

Microsoft プレスリリース

Microsoft PressPass - Webクリエイタおよび開発者向けに地図情報プラットフォーム「Microsoft(R) Virtual Earth(TM)」のテクノロジを本日より提供開始

各種メディア記事

※メディア記事の一覧はページ末尾を参照

▲BACK TO TOP

4. 何故 Microsoft Virtual Earth で試したのか

地図プラットフォームとしては先駆者である Google Maps や Yahoo! Maps 等がありますが、今回は:

ブラウザ上で動く 3D地球儀 U/I

という Virtual Earth 3D の特徴が、ひょっとしたらエイビーロードの持つ旅行情報と相性が良いのでは？組み合わせはなんか面白そうだよね？というインスピレーションから、実験的に作ってみた次第です。

同じ "3D地球儀" としては Google Earth がありますが、そちらは単体起動のアプリケーションなのに対し、Virtual Earth 3D はあくまでWebページの一部として機能し、javascriptにて手軽にコントロールが出来るという点で、Web U/Iとしての可能性を試してみたかったのもあります。

▲BACK TO TOP

5. 開発手法

メンバーは2名

MTL研究員船見と石橋の2名。どちらもエンジニア。サイト企画から実装まで、手を動かす部分はすべてアジャイル手法 / ペア企画 / ペアプログラミングで乗り切る。テストコードは一部を除いて書きませんでした。

手を動かす部分以外にも、広報やコンプライアンスチェック等の業務がありましたが、その辺りは周りのメンバーに助けてもらいました > 感謝

期間

8/13～9/13までの4週間。途中、船見は夏休みで1週間某アフリカサバンナ地方へ旅立ち、石橋も途中息切れして休息をとった場面も。なので正味3週間くらいで、ざっくり工数の内訳は:

2人日企画立案 (ペア)
6人日エイビーロード WEBサービス追加機能開発 (ペア)
1人日サイトCSSデザイン作成 (石橋)
10人日 Virtual Earth 以外の AJAX U/I 開発 (石橋)
7人日 Virtual Earth 検証＋実装 (船見)
4人日出来栄えの検証～酩酊～迷走 (ペア)

そんな配分でした。

Open Source ライブラリ

Open Source なライブラリの恩恵に授かる事でかなり開発期間が短縮できています。これらライブラリを作成・公開してくれている方々に感謝。

サーバサイドスクリプトは必要なし

Virtual Earth はクライアントブラウザで動く javascript + ActiveX プラグイン、AB-ROAD WEBサービスはJSONP出力形式に対応している事から、クロスドメインでのAJAX通信 (任意のブラウザから、直接エイビーロードWEBサービスをリクエスト可能) が実現できる... というわけで今回のデモはクライアントサイドの javascript コードのみで完結しています。開発効率・メンテナンス性が良いです。

▲BACK TO TOP

6. Virtual Earth 3D を実際に試してみた感想

これはいい

ドキュメントがきちんと書かれている: Virtual Earth Map Control v5 SDK (日本語版はこちら)
逆引きサンプル - Interactive SDK - が便利: Virtual Earth Interactive SDK - 何ができるか・できないかの大枠を把握可能、かつサンプルコードがスムーズに入手可能な為、初期の導入フェーズがすんなり進む。
無償で提供: マイクロソフトさんが、こうやってWeb界隈の慣習に従って、参入しようとしている姿勢は個人的には微笑ましく・頼もしく思っています。

今後に期待

体感レスポンスの向上が必要: ニューヨークの街並みが一通り描画されるまで、やはり待ち時間が発生します。ちょっと場所を移動すると、また同じように待つ事になります。ユーザーインターフェースとしては、待ち時間は最低限、サクサクとしたレスポンスが無いと厳しいです。
出来る事をもっと増やす: Virtual Earth 2D に比べると、出来る事と挙動の安定性がまだ不足しているかと。また、2Dで動くコードが3Dだと動かない場合もあり、余計な調査時間とコード量が増えてしまって苦戦しました。

デモサイトを触っていただければ判るとおり、初見では「おっ」と思える機会が何回かはあるものの、日常利用レベルの快適便利サイトまで昇華させるには、まだ改善が必要かと個人的には感じています。それには、今回の僕らのように実際にプラットフォームを叩いてみた開発者が、ガッツリとバグ＆要望レポートをアウトプットしていく事で、MSも我々もエンドユーザーも、皆にとって価値のある「共調・共有」の関係を築けていけるのでは、と信じています。

バグ＆要望レポート

coming soon (まとめ中)

▲BACK TO TOP

7. 各種メディア記事

Microsoftオフィシャルブログ

ブログレポート

※皆さん取り上げていただきありがとうございました。

▲BACK TO TOP

地球の操作方法

Virtual Earth はマウスでの操作が基本ですが、キーボードを使った操作の方が直感的で使いやすかったりします。場所によって、その都度使い分けていただくと良いかと。

キーボードでの操作

地球を１度クリックした (フォーカスさせた) 状態で...

■ + キー: ズームイン。より詳細な地図を表示。+キーは "L" キーの右隣。同時にSHIFTキーを押す必要はありません。
■ - (マイナス)キー: ズームアウト。より広域な地図を表示。- (マイナス)キーは右上段、数字の "0" の右隣です。
■ 左右前後の矢印キー: 任意の方向へスクロール移動。
■ Ctrl + 左右矢印キー: 左右に方向転換。
■ Ctrl + 上下矢印キー: 視点の角度変更。真上から見る～斜め上から見る～真横から見る。

▲BACK TO TOP