Google Glass XE17版

Google Glass

わかめ まさひろ@v vakame

GAE

Android?

TypeScript

AngularJSGlass

• Google App Engine!• Android!• Google Apps!などなど、!

Google!技術に特化した会社です!

Google Glassのできること

本セミナーはXE17.2に基づきます

Google Glassとは？

Google の開発している メガネ型のウェアラブルデバイス

写真・動画を撮る

＼ｶｼｬ／

情報を見る

誰かと話す

＼もしもし？／

外観

http://goo.gl/J4vqo より

外観

ディスプレイ視界の右上にサブモニタが 置いてあるイメージです

景色と画面を同時に見るのは 人間には難しいです

外観

タッチパネル

下方向にスライドが AndroidでいうBackキー

外観ジャイロセンサー

センサー類は他にも色々！

外観

上部についてます 長押しで録画

シャッターボタン

カメラ

インカメラ(内側)

外観

普通のAndroid端末と同じで

DDMSでスクリーンキャプチャしたりできます

microUSB

電源ボタン(裏

外観

耳の裏がスピーカが来るので 聞き取りにくいです

バッテリー

骨伝導スピーカ(裏

画面表示

画面表示

指や動作で操作• ちょんとタッチでスリープから復帰!• 上むいてスリープから復帰!• スワイプで横方向に画面移動!• タップで選択

後ろにスワイプ 前にスワイプ

声で操作

この画面で Ok, glass から開始

声で操作• ok glass,!

• google!• take a picture!• record a video!• get directions to!• send a message to!• make a call to!• make a video call to!• take a note with!• post an update with!

手でも同じ操作ができます

GDK(Nativeアプリ)で 無限のバリエーション！

操作早見表起動

上を見上げる!側面タッチパッドを1回触る

キャンセル 側面タッチパッドを下に撫でる

選択 側面タッチパッドを左右に撫でる

決定 側面タッチパッドを1回触る

ボイストリガ 時計の画面 で “ok glass”

写真撮影 “ok glass” の後に “take a picture”

スペック• Android KitKat (4.4.2) !• 画面解像度!

• 640x360!• 電池容量 570mAh!

• スマホの1/3ぐらい…!• 普通に使うと8時間程度もつ!• 写真・動画撮るともりもり減る

Google Glass FAQ

Google Glassの位置づけ

ブティックのような場所で受け渡し

眼鏡ユーザは？

純正フレーム 売ってます！goo.gl/Jn7PYp

便利？便利です！

しかし、インターネットに接続されていないとパワー半減です

着けてて疲れない？大丈夫です！

ずっと動画撮ると熱くなって困りはします。

着用できないほどではない

日本語への対応？対応され始めた！

表示や音声認識, 読み上げも一部可能 まだ力技での設定変更が必須

XE16より 英語 or 日本語 日本、めっちゃ特別扱いされてます

Androidアプリとの互換性GDK (Glass Development Kit) という ツールが昨年末リリース！ 配布ルートは超限定的

Androidスマホにある

Playアプリが入っていません

MyGlass経由でインストールhttp://goo.gl/cgPxPJ

プライバシーは？今後の課題です。

撮影する時は音が鳴ります。 ディスプレイも光ります。

http://goo.gl/bCoZp

KickStarterにて

3Dプリンタで 蓋を作った人も

他人の声にも反応する？

します。 ただし、時計の画面の時のみ。

直近のバージョンだと 音声入力できるタイミング増えてます

通信方式は？

Glassが自力でWi-Fi。

AndroidでBluetoothテザリング。

Android, iOSに専用アプリがあります。http://goo.gl/pfzc8http://goo.gl/GMbrXh

道に迷わない？たぶん迷いません。

頭の向きにあわせて地図も動くので、青い線を歩いていけば良いです。

スマホでも同じ事 できますけどね

ARっぽく使える？!

現実の何かに 映像重ねたりは難しいです ハード的な制約が…

サブディスプレイが視界の隅にあるだけ

Weak!本当は猫の気持ちいい

ポイントを オーバーレイしたい

頑丈？

箔が剥がれる 折れる

が2大パターン

誰でも開発できる？誰でも開発はできます！

Mirror APIもGDKも一般公開 しかしハードは出回ってません

Google Glassの開発は Google Glassがないと なかなか難しいです

iOSユーザにAndroidアプリを 作らせるのに等しいです

アプリ開発手法

方法？

Mirror API GDK

Mirror API

• 情報配信用のAPI!

• Webサーバ上で動作する!

• Google Glass上で直接動作しない

GDK• Glass Development Kit!

• Androidアプリが書ける！!

• GlassらしいLook & Feel！!

• Card(後述)が表示できる！!

• LiveCardも作れる！

どちらがいいの？• 静的コンテンツの配信!

• →Mirror API!• インタラクティブなアプリの作成!

• →GDK!• 迷ったら…!

• →とりあえずMirror API

Mirror APIのできること

Glassware とは？

↓ Glass アプリのこと

スキルセット

• Android開発できます！!

• Webアプリ開発できます！!

• on Webサーバ！!

• on ブラウザ！即座に開発可能！

要点

Webシステム！

GoogleServer

Glassware Server Glass

RESTful API

必要な知識

Mirror API以外のGoogle APIで練習する

と良いです

• Webサービスの作り方!

• OAuth2周り!

• AccessTokenの取得 & scope など!

• GoogleのAPIの使い方!

• Cloud Console!

• API Explorer

Reference曰く…

• Timeline!

• Subscriptions!

• Locations!

• Contacts4つ！

Timeline

Timeline

概念図です！

↑ 時計が基準 ←新しい　　古い→

↓Glass上ではこの単位で表示

メモ

↓ピン留めされたカードは更に左に

Timeline

メモ

↓sub timeline

←ドッグイア

タップで潜る スワイプダウンで戻る

Timelineが行うこと• ユーザの作成したアイテムの表示!• ユーザに情報の配信を行う!

• テキスト・HTMLの配信!• 利用できるHTMLタグは限定的!• JavaScript・音声・動画はダメ!

• 画像・動画の配信!• ユーザのリアクションを受ける

ユーザによるアイテム＼take a picture／＼record a video／

＼take a note with／

GoogleServer

Glassware Server

ユーザが望めば 後述のSubscriptionsを使って

Glasswareに通知できます

ユーザへの配信• HTML, テキスト, 画像, 動画 など!• 公式にPlaygroundがあります！!

• 雰囲気をつかむのに最適!• http://goo.gl/L4t6y9

PCのWebブラウザで使える

CSSも配布されています！

ユーザへの配信• 複数ページに渡るアイテムも配信可能です。!• Gmailの場合

ユーザのリアクション• 配信時にメニュー設定を行う!• Subscriptions経由で通知が来る!

• REPLY, REPLY_ALL!• DELETE!• SHARE!• READ_ALOUD!• VOICE_CALL!• NAVIGATE!• TOGGLE_PINNED!• OPEN_URL!• PLAY_VIDEO!• CUSTOM

全てのリアクションは Subscriptionsを使って、

Google Server経由で 伝わってきます。

つまりリアルタイム性は低いです。

Subscriptions

更新通知のAPIです

Subscriptions • 事前指定のURLにコールバック!• 2種類あります!

• Timeline の挿入・更新・削除!• Locations の挿入・更新・削除!

• 注意点!• 登録時に自システム固有のuserTokenを指定していないと誰についてのコールバックか判別できない

Locations

Locations

• 位置情報が取れます!

• 過去の位置情報が時系列で取れる!

• 最新の位置情報のみも取得可能

10分間隔で 新しい位置が更新されます

Contacts

Contacts

• だいたいアドレス帳みたいなもの!

• 単体の何か(人物)!

• グループ!

• Glassware もここに表示される

アプリも人も同じ

That’s all

あなたは Mirror APIの

全てを理解しました

GDKのできること

スキルセット

• Android開発できます！!

• Webアプリ開発できます！!

• on Webサーバ！!

• on ブラウザ！少しの予習で 開発着手可能！

Glass Development Kit • Google Glass用ネイティブアプリ開発が行える開発キット!

• GlassらしいUI, Experienceに!

• Android SDK+α!

• Voice Trigger 利用可能！

注意

• APIが度々改廃される!

• 新しいリリースでアプリが壊れる!

• まだまだ安定させる気がなさそう

開発手法 • Static Card!

• Mirror APIと似た表現が簡単に!

• Live Card!• 動的なコンテンツが作成可能!

• Immersions!• 没入感のある体験！

Static Card

• ようするに普通のCard!

• Mirror APIでいいじゃないか！!

• Static Card以外のものと組み合わせるパターンがあるかも…!

• 作るのは非常に簡単

Live Card • 時計の左側に常駐する!

• Serviceを作って動作させる!

• Low-Frequency Rendering!• 何秒かに1度画面更新をする!

• High Frequency Rendering!• 1秒に何回も画面を更新する

Live Card (Low Frequency)

• 低頻度描画!

• RemoteView を使うのでその制限を受ける!

• 使えるViewの種類が限られる

Live Card (High Frequency)

• 高頻度描画!

• SurfaceHolderを使う!

• 高速だけどViewは使えない

Immersions

• 普通のAndroidアプリのこと!

• アプリ閉じたら消えちゃう!• 明示的にユーザが操作するアプリに向いている

デモ • 拡大鏡アプリ (拙作)!

• Immersions で実装!• 当初 Live Card(High Frequency)で制作するが挫折!• #286 として報告!

• まだまだ発展途上!• #232 , #287 両方カメラ周り

WORD LENS • http://questvisual.com/!

• カメラ画像中の英文を翻訳

開発ガイドラインhttps://developers.google.com/glass/guidelines

Glassのためのデザイン

• Google Glassは既存のモバイルプラットフォームとは違う!

• GlasswareはGoogle Glass専用に作ろう!

• テストもかならず実機上で行おう

邪魔をしない

• あるべき時に起こることをユーザは望んでいる!

• 頻繁であったり、期待に反する通知をしないようにする!

• ユーザが通知を無視しても問題ないように作る

ナイスタイミング！

• 最新の情報を小気味よいサイズで届ける!

• ユーザの反応にも、予測可能なタイミングで、タイムリーに行う

びっくりを避ける

• どのプラットフォームでも言えることですが、ユーザの期待しない動作で驚かさないこと!

• 何かをユーザに変わって行う前に、明示的に許可をとること

デザインガイドライン

http://goo.gl/yqLZu推奨されるデザインについての

記述があります。 画像素材の推奨されるサイズも。

Google Glassとアップデート

月1 Version Up • XE5 → XE17 まであがっている!

• eXplorer Edition の略？!• XE6!

• ビデオストリーミング再生対応!• 写真共有時にキャプション追加!

• XE7!• 共有先を明示的に登録しなくてよくなった

月1 Version Up • XE8!

• Glasswareでボイスコマンドを受けられるようになった!• Take a note with...　!• Post an update...　!

• WebSiteを開けるようになった!

• アイテムにURLを添付できる

月1 Version Up • XE9!

• XE6で追加されたビデオのストリーミング再生のやり方が変わった!

• 古い方法はdeprecatedに!

• ビルトインのアクションの表示名が変更できるようになった

月1 Version Up

• XE10!

• Timeline itemがURLを持つ時自動的にリンクに変換される!

• シェアする時にキャプションをつけてもらえるようになった

月1 Version Up • XE11!

• GDKのサポート？!

• Voice Trigger のサポートと言い換えてもいい!

• VIEW_WEBSITEが使用不可に!

• 今後はOPEN_URIを使う

月1 Version Up • XE12!

• GDKの改変!

• ずぱっと変えてきた…！!

• 作ったやつ動かない…!

• iOS用MyGlassアプリ!

• スクリーンロックの導入

月1 Version Up • XE12!

• Google Play Music への対応!• HangoutsのGlasswareの追加!• YouTubeのGlasswareの追加!• ウィンクによる撮影(新機種のみ!• ゲストモードの削除!• 食品のカロリー検索

月1 Version Up • XE16!

• KitKatに改装!• Bluetooth LE!• 日本語対応!• http://goo.gl/fjeZJR!

• screenrecord他も利用可能に!• APIの改廃…

月1 Version Up

• XE17!• バグフィクスアップデート

まとめ

• AR(拡張現実) ではない!

• Google Glassは気の利いた情報を摂取するためのもの!

• Mirror API と GDK で今すぐ開発着手可能！

宣伝

TypeScriptリファレンス

紙･電子共 好評発売中！

Amazon(紙, Kindle)達人出版会(PDF)

Androidをほぼ全て忘れつつ 書いた入魂の一冊！

ご清聴ありがとうございました。教育請負や技術コンサル 受託開発の依頼承り〼

www.topgate.co.jp/contact