VRPodcastのiPhoneブラウズ専用サイトを開設しました

  • comment:4
  • | trackback:0

えーっと...実はこの1ヶ月半の間、仕事が山のように詰まっていて、ニッチもサッチもいかない状況でした。
そんな中、ちょっと公言は出来ないんですが、あるところのiPhone用サイトを作成しておりまして、せっかくそのノウハウをGETしたので、ついでにウチの「VRPodcast」のiPhone専用サイトを作ってみたりしました。これ、かなり特殊なことしてるので、ココでご紹介します。


VR Podcast - 普段着の京都の360°パノラマ風景をあなたのiPodの中に(「Safari for iPhone」専用サイト)
http://pencil-jp.net/vrpodcast/i/

さて、iPhoneのデフォルトブラウザでもある「Safari for iPhone」で、上記URLを開くと、最新記事から過去50エントリーのリストページが出て来ます。
最下段には月別アーカイブ(過去1年半分)が出て来ます。
カテゴリーアーカイブもイケそうな感じですが、まだやってません(そのうちやります)。

で、投稿記事ページを開くと、タイトルの下に関連リンク先とカテゴリーがあって、その下に四角い画像が見えます。
これを指でドラッグしてみて下さいヨ。
...そう、ストリートビューのようなドラッグインターフェイスですが、パノラマVRコンテンツになってるでしょ!

後日改めてこのブログでご紹介しますが、Safari for iPhoneでパノラマVRコンテンツを実装するJavaScriptライブラリ「moblVR」の有料プロ版を導入したからです。
どんなことが出来るのか、ご覧になって下さい。

moblVR
moblVR - Go There From Anywhere
http://moblvr.com/

※iPhoneで見られるデモサイトはこちら⇒http://www.moblvr.mobi/

ちなみにココ、トップページはPCでも見られますが、投稿記事はPCでは見られません。
(今回導入した特殊なプログラム「moblVR」が入っていて、iPhone以外のブラウザでは読み込めないようになっているからだと思われますが、どうしてそんなことしたんですかねぇ?)

無料版と有料版があるんですが、ボクの場合、更新コンテンツの再生エンジンとして使用するので、いちいち同じファイルをサーバにアップしたりする無駄を極力減らしたかったので、有料版を導入したりしています。
無料版は、"取り敢えず載せる"ことしか出来ないんですが、有料版はかなり面白いオーサリングが出来ます。
ただし開発が行われたばかりで、まだまだ機能としては不完全なところが多いです。特に画面デザインのカスタマイズ性が非常に悪く、肝心なCSSのID/クラス名が分からなかったりして、今回は特にトライ&エラーでなんとか"凌いだ"んですが、今のところはこれが限界かな(開発元に教えてくれるように言ってるんですけどねぇ...なかなか答えてくれないです)。
例えば...
・コンテンツのロード時に画像が読めていないです。これ、オリジナルのロゴを貼付けられるようになっているんですが、外部フォルダから読み出すコトが出来ずに困っています。
・ピンチでの拡大縮小を「VR Podcast(Safari for iPhone)」でやると、レイアウトの関係上、なんだか変なことになってしまったり...。
ウチのサイトでは未だ"α版"と言ったところでしょうか。

但し、twitterで先行してお話してたりして、既に日本国内でも何人かが実装実験を始めています(この方とか)。
iPhoneと言えば、PangeaVRとCubeWorldによってパノラマコンテンツブラウザの地位は確立されていますが(Androidのパノラマビューワーは、ボクの友人が現在開発中だそうです...期待して待ちましょう!)、iPhoneAppをダウンロードしなくても見られるのは、とっても便利だと思います...人に伝えやすいしね。

moblVRの説明は、後日しっかり行います。
オフィシャル以外できちんと説明してるサイトは、海外でも殆ど無いので、開発元と協業して、詳細なチュートリアルを行えればと思っています。
(なんだか去年のPTGuiみたいやな)
ご期待ください!

サイト開設ついでに、WebClipアイコンも作っちゃいました。上から2段目の右端にあるのが、今回の「VRPodcast」のアイコンです。
サイトを開いた時に画面下中央の「+」マークをタップして「ホーム画面に追加」を選ぶと、ホーム画面のアイコンリストの空いているところに配置されます。お試しアレ!
ちなみにこのアイコン、陰無しフチ無しで作りたかったんですけどねぇ...Safari for iPhoneからできる陰無しフチ無しWebClipアイコンの生成方法をご存知の方、教えて下さい(アプリのアイコンの陰無しフチ無しの方法は分かったんですが、その方法はSafariでは通用しませんでした)。

トラックバック(0)

トラックバックURL:

コメント(4)

お久しぶりです。
この機能はCSS3のTransform機能を使っとるようで、現状ではwebkitが独自に拡張したcssのプロパティを使用してるよーです。

http://wiki.sohaya.com/index.php/CSSTransform#kc453581
あたりが参考になるかも。
でもこの機能、iPhone OS 3.0ではうまく動かないかも(涙)。

>takagiさん江
ご無沙汰してますー!(笑
禁断のcss3ですかぁ...でも、購入したmoblVRProのパッケージの中には、
cssファイルは存在しないんですよ。
たぶん、暗号化されたjsファイルに埋め込まれてるのでしょうか?
開発元に訊ねてるんですが、未だ返事が来ません。
twitterで公開質問してみようかな!

>開発元に訊ねてるんですが、未だ返事が来ません。
 このcss部分が公開されちゃったらmoblVRProのビジネスモデルが崩れちゃうからねぇ。隠すなら隠すで汎用のスタイルを定義してくれれば使いやすいのに...。
 ちなみにiPhone OS 3.0でうまく動かないかもしれないのは、CSS3のTransform機能ではなくて、画像をドラッグするjsの問題かも。言葉が足らずでした...。

>takagiさん江
mobileSafariって、そんな怪しいですかねー?
jsってそれなりにバージョンの互換性は保てると思うんですが...。
3.0に搭載される予定のWebKitって、
今のmobileSafariとjs周りはそんな変化無いように思いますが、どうでしょう?
(それともUI関係のjsライブラリって、ガラっと変わってましたっけ?)

それより、moblVRのアドバンテージは、
何と言ってもオブジェクトVRの実装ですよ。間違いないです。
未だオブジェクトVRの再生アプリが出てこないことを見ると、
余り需要が無いのかもしれませんが、
ECサイトのiPhone専用画面とかに使えるのは間違いないでしょう。
今後どんどん増えてくるんじゃないかなと、正直、狙っています!

コメントする

日本唯一のパノラマ画像/VRムービーに関する企画・制作から、セミナー、ソリューション開発・販売に至る、あらゆる業務を行っています。

» パノラマの知名度は今や一般大衆レベルです。

近年パノラマコンテンツは、Googleストリートビューに代表される地図の付加情報としてのパノラマVRムービーの台頭で非常に注目を浴びていますが、その表現力はそれだけに留まらず、多方面で利用されるパノラマヴァーチャルツアーコンテンツ、ギガピクセルクラスの超高解像度パノラマコンテンツ、さらには、360°全方位パノラマ動画が、ライブ配信されるまでになっています。

» 他社を圧倒する経験値が皆様をサポートします。

このような、あらゆるパノラマコンテンツを総合的にプロデュース出来るのは、15年来培ってきたパノラマ制作のノウハウと、2005年から発信してきた「QTVR Diary」での情報の蓄積の賜物です。

» 常に業界をリードし続けます。

世界でも類を見ないパノラマ関連情報専門ブログ「QTVR Diary」の知名度は、リソースの少ない日本だけでなく海外からも注目を浴びています。国内外のメーカーからの情報やソリューションサンプルの提供を受け、いち早くパノラマ業界の専門情報をお届けしています。

» 新しいソリューションを常に開拓し続けます。

今後ますます増え続けるパノラマのニーズに対応すべく、日々研鑽を重ね、多くの方々にパノラマを楽しんで頂けるよう、努力してまいります。

<サイト内リンク>

<姉妹サイト>

<連絡先>

design studio "PENCIL" 二宮 章
〒602-8237
京都府京都市上京区
 大宮通一条下ル梨木町189-5
075-417-3062 (office)
075-417-3063 (fax)
090-9628-6263 (au)
080-3832-2352 (iphone)
ninomiya@pencil-jp.net