こんにちは。AgWORKS代表の増本修二です。

今日は、「自宅にいながら。移動中でも。お風呂の中でも。
いつでも・どこでも・何度でも、 体験できるWEB3D EXHIBITION」をおすすめしている、というお話しです。

新型コロナウィルスの影響で、展示会、イベントが軒並み中止になる中、ウェブによる代替開催のご相談を多くいただきます。

これからどう改善されるかわからないこの状況、少しでも経済活動を、と考えたときに、ウェブでの展示会はとてもよい手段の一つだと思います。

しかし、ウェブ展示、と言っても何をするの？普通のウェブサイトと変わらないんじゃ？

そう思われる方に強くお勧めしたいのが、WEB3Dを使った「WEB3D EXHIBITION」です。

「少しでも現実に近づけ、現実にはできないことをする。」

展示会で作られるいろんなブースデザイン。それをWEB3Dで作ってしまう。

WEB3Dの空間なら、イベントスペースに制限はありません。

自由に、何の制約もなく、好きなデザインで、好きなスケールでブースの設置が可能です。

そしてそこを自由に回遊、歩き回ることで少しでも「展示会らしさ」の体験を提供、没入感を持たせることで「今これが特別なコンテンツなのだ」とユーザーに意識させる。そんなリアルな体験を提供します。

そして、WEB3D EXHIBITIONはそれだけではありません。ここに、WEBならではの施策をします。

例えば
「WEB3Dでつくったブースは、アクセスするたびに形を変える」

リアルな展示場であれば、何度訪れてもブースのデザイン、展示内容が変わることありませんよね？それがWEB3Dで作ったブースなら、アクセスしたユーザーの行動から、展示内容を次々に変えて、常に最適な表示をする、なんてことが可能になります。

例えば「A」という展示があったとします。

あるユーザーはその「A」に興味をもち、何度もその「A」を閲覧、体験しています。

WEB3Dのブースは、アクセスログとしてそのデータを保持します。
そして次回のアクセス時。そのデータを元に、「A」に関連する「B」、また類似する展示「A2」を、次のアクセス時に触りやすい、わかりやすい場所に設置する。

と、展示をインタラクティブに変化させる事で、アクセスユーザーに常に興味を持たせる、そんなことが可能になります。

…いかがでしょうか。ウェブならではの展示、WEB3Dならではの展示のメリット、ご提案できる仕組みはまだまだあります。
また次回以降、ご紹介して参ります。

WEB3D展示場開発プラットフォームについてはこちらから
http://www.ag-works.com/service/web3d_exhibition/

プロトタイプコンテンツを更新しました。

https://goo.gl/6SqSgZ

今回は「フェラーリ488スパイダー」をWEBGLで作ってみました。

Three.js、バージョンが月次で更新されて（このモデルはr82）、実装時に悩むこともありますが、どしどし新機能も追加されていい感じです。

今回はポルシェモデルよりもマテリアルを少しリアルにするため、物理シェーダーを使用してみました。

かなりリアルなWEBGL、提案時のコンテンツとして、かなりインパクトがあるのでは？などと考えると、作っていてワクワクします。

アプリよりも広くアプローチできて、アプリと同等の表現ができ、またWEBコンテンツやDBとの連携のハードルも低い（はず）。

ピッチ案件時、十分フックになるのでは、と思います。

おひとついかがでしょうか？？

WEB VRコンテンツ検証用に、ダンボール製ではないVRゴーグル買ってみました。

【amazon】VOX+　3Dメガネ 3DVR ゴーグル HMD 3D体験 焦点、瞳孔距離調節可能　4- 6.5インチのスマートフォンに適用　ゲーム、ビデオ映画適用　ブラック

値段はちょっと高い（ダンボール製が1000円ちょっと、これは2000円くらい）ですが、まぁ失敗してもそこまで後悔しないレベルです。

梱包もしっかり、値段の割には満足度高いかも？と期待が膨らみます。

開梱してみると、本体の他に、

・スマホのサイズによって差し込む調整用の板？のようなもの
・バンド
・ポーチ
・メガネ拭き

と、これだけ付属していて、ダンボール製ゴーグルとの違いを感じます。

早速iPhone6をセットします。

きちんと固定できるように、スライド式のツメのようなものがついていました。

固定してみましたが、安定感はバッチリです。

覗いてみます。

？
ちょっとボケてます。

見てみるとレンズ部分全体がネジになっていて調整できます。

！！！

うわ！ダンボール製の小さいレンズと違ってめちゃくちゃクリア！
でもちょっと狭い…?

！！！！！

本体下にレンズ幅を広げる機能が！

うぉ〜！！！

と、驚くほど、綺麗です！！！！

オキュラスほどではない（対DK2比）ですが、この金額でこれならめちゃくちゃいい！

と感動してしまいました。

これだけ綺麗だったら、もっとWEB VRも見てもらえるかも？

もちろん、ウチのデモ
WEB VR CITY DRIVE
http://www.ag-works.com/city/

を見るのにも使って欲しいですが、他にもandroidやiOS用アプリでVRコンテンツたくさんありますので、ぜひこのゴーグル手に入れていただいて、VRを楽しんでみてはいかがでしょうか？

※WEB VRコンテンツの記事はこちらです。
簡単・手軽なWEB VRコンテンツ。必要なのはスマホと千円程度のVRゴーグルだけ。
http://www.ag-works.com/blog/web-vr/

こんにちは。エージーワークス代表の増本修二です。

気軽にVRコンテンツが楽しめる　Google Cardboard。

アマゾンで1000円くらいから売ってるビューワーのボックスに、iPhoneやスマホを設置するだけで、簡単にVRコンテンツが楽しめます。

その、cardboardで見られるVRコンテンツを作ってしまおう、というお話です。

iOSやAndroid用のアプリを作るのはちょっと敷居が高いですが、Three.jsでウェブ用のコンテンツとして作ってしまえば、あとはスマホとcardboardを用意するだけ！

まずはgoogle cardboardに対応したthree.jsのコンテンツを見てみましょう。

【サンプルコードをダウンロード】
googleのcardboardサイト、
https://vr.chromeexperiments.com

ここから「DOWNLOAD CODE」でサンプルコードをダウンロードします。

このファイルをそのままローカル環境では見られないので、ウェブサーバーなどにアップしてみます。

↓下記、ダウンロードしたファイルをそのままアップしたものです。
http://web3d.ag-works.biz/cardboard/

iPhoneなどをヨコにしてみてみると…

この様に見えると思います。

あとはcardboard準拠の3Dメガネにセットして見てみましょう。

上下左右に動かして見てみれば…VRとして体験出来てるはずです！

さぁ、これでWEB3DがVR対応出来る事がわかりました。

次回は実際の制作について解説します。

facebookの新機能、「360 Photos」が楽しくて、iPhoneのパノラマムービーを撮りまくっているエージーワークス代表の増本です。

そう、ついつい撮りまくってしまうほど、「360 Photos」が楽しいのです。

iPhoneで撮ったパノラマ写真を、昔（また昔話ですみません）作ってたQuickTimeVRの様に、360°（iPhoneの場合は180°？）グルグル動かせる画像としてアップ出来るのです！
昔は三脚の雲台の角度に合わせながら、何十枚、何百枚も撮った画像を、photoshopでせっせと繋いで作ってた（大変でした…）ものが、iPhone撮影→facebookにアップするだけで出来上がるなんて！

と、その簡単な「360 Photos」ですが、一応ご説明です。

まずはiPhoneのカメラで「パノラマ」モードを選び撮影します。

そしてその画像をfacebookにアップ。

サムネイルの右下に、「地球儀」っぽいマークが付いていれば、「360 Photos」用の画像としてアップできます。

アップした画像、iPhoneで向きを変えてみてみてください！

なかなか臨場感のある感じになっていませんか？

さらに画像タップでフルスクーンで表示されます！

撮ってすぐに作れる「360 Photos」。企業facebookサイトお持ちであれば、イベントの様子などをアップしたり、不動産会社であれば物件の内観のご紹介など、使いどころたくさんありそうな気がします。

もうプロが撮影、編集しなくても手軽に出来る時代、仕事として受注することが無くなるのは寂しいですが、作り手としては楽しくてしょうがない！
テクノロジーの進化って、やっぱりワクワクしますね！

こんにちは。エージーワークスの代表の増本修二です。

ちまたで噂の「Oculus Rift DK2」が届きました！

「Oculus Rift」とは、米Oculus VR社が開発したバーチャルリアリティ用のヘッドマウントディスプレイ（HMD）。
このディスプレイを両眼で覗く事によって、バーチャルな世界で没入体験が出来るのです！

まだネット黎明期の頃からVRMLやflashで3D空間を作っていた私には、まるで夢の様なガジェット。

アプリ開発に使っているUnityとも相性がいいとの事で、オーダー後にデモ版制作に着手しておりました。
近々このサイト上で紹介したいと思います！

もうワクワクが止まりません（笑）

ちなみに、当初は納品まで数ヶ月かかっていたらしいのですが、私の場合は9/16オーダーで10/24到着。
出荷も順調の様ですね〜

ええ、わかってます。わかってますとも（笑）
いい大人がこんな事やってたら、カッコ悪くみえますきっと。

でもついやってしまうドラクエ世代（笑）エージーワークス代表の増本修二です。

やっと自分のスマホ（SO-01C）にもインストールしてみました。
なんだか周りで酷評されているUIですが、僕は全然平気です〜（笑）

iPhoneでストIVとかで遊んでるようなダメ大人だから、
こんな操作にも慣れてしまったのでしょうか（笑）

そうでもない、まともな大人のために（笑）
今回のドラクエのインターフェースがなぜこうなったか、僕なりに軽く考えてみました。

なぜポートレート（縦型）か
ゲームに集中して、しっかり操作したいのであれば、やはりランドスケープ（横型）で両手でもって操作したいと思います。
僕が一時期はまってたストIVもそう。
でも、電車での移動時（僕は徒歩通勤なのでそんなに乗らないのですが）に、常に両手が空く訳ではありません。
やっぱり、SNSのアプリみたいに、片手で操作出来れば、それだけアプリに触れる機会も増えます。

ボタン配置
そしてドラクエのような、コマンド型の、時間やタイミングに制約がないタイプのゲームなら、片手で充分操作可能。
それを自分の手で画面を隠さない様に、コントローラー部分、ボタン部分を下に、水平に配置する事で、操作しやすさを追求したのでは、と思います。
それでもこのクリック感のなさ、まぁこの感覚が慣れない人には辛いのかもしれませんね〜。

ターゲット層、使われるシーンとユーザービリティとのバランスから考えられたUI
（UI考えるなら当たり前ですが（笑））と言えると思います。が、
サイズ感や位置、音なんかは、まだまだこれから改善の余地があるかもしれませんね。

こんにちは。エージーワークス代表の増本です。

ARアプリいろいろありますが、今回は皆で楽しめるARアプリのご紹介です。

ピザハット バースデーAR
http://www.ph-ar.com

誕生日、送られて来るカードにアプリをかざすと、ピザハットのキャラクター、チーズ君がダンスでお祝いしてくれます。
さらにカメラで顔写真を撮影すると、3Dチーズ君に変身出来ます（笑）

お得なクーポンももらえるこのアプリで、皆で盛り上がっちゃってください！（笑）

もちろん、無料です！

HTML5 ウェブアプリのサンプル版をアップしました。

シンプルですが、クルマのカラー、ホイール等着せ替えが出来ます。

HTML5 ウェブアプリ サンプルコンテンツ：クルマ着せ替え

これは基本的な機能のみ実装しています。HTML5の機能を活かした、もっと凝った仕様のコンテンツも制作できます！

お問い合わせはこちらから。

http://www.ag-works.com/contact/

こんにちは。エージーワークス代表の増本です。

レスポンシブ・ウェブデザイン（いや、それ以外のウェブサイト制作時もそうですが）時には各色んな端末で、検証を重ねて行きます。

私がiPhoneを使っているからと言って、皆がiPhoneという訳でも当然ないですし（笑）

どのサイズで検証すればよいか？

最近、本当にスマートデバイスと呼ばれる端末、種類が増えて、もちろんそれによって画面サイズも増えています。

レスポンシブ・ウェブデザイン時にはデザインをいくつかのブレイクポイント毎に最適化する事もあるので、どのスマートデバイスのどのサイズがボリュームゾーンか、把握しておく必要があります。

主なサイズ感は以下のとおり。

スマートフォン
iPhone5 640×1136（320×568）
iPhone4（s） 640×960（320×480）
xperia z 1080×1920
Galaxy S III 720×1280

7インチタブレット
iPad mini 1024×768
Nexus7 1280×800
Kindle Fire 1024×600
galaxy tab 1280×800

10インチタブレット
iPad 2048×1536（1024768）
iPad2 1280×800
Xperia tablet s 1024×600
Surface RT 1366×768

等々…

シェアはAndroidが多いと聞きますが、私たちで管理しているいくつかのサイトのアクセスログを見る限り、やはりiPhone、iPadが圧倒的に多い印象です。

もちろんサイトのユーザー層にもよるとは思いますが、そういった事も考慮しつつ、最適化考えて行きたいですね。

スマートデバイスの主なサイズを画像にまとめてみました。
ご参考まで。

レスポンシブ・ウェブデザイン用スマートデバイス主なサイズまとめ