Even G2 で公式サンプルアプリを実機で表示したメモ
Even G2 で公式サンプルアプリを実機で表示したメモです。
背景

Even G2 が先日届いたのでセットアップするまで ができたので、公式サンプルアプリを実機で表示してみます。
2026 年 6 月の情報で進めてみます。
まずファームウェアのアップデート

開発に入る前に、まずファームウェアのアップデートが走りました。バージョン 2.2.4.34でした。インストール中 → 再起動中 → 完了 と進みました。

完了まで10分ほどかかりましたかね。Android の Even アプリは開いたままスマホのスリープも長めにして待つのが安心です。
開発環境をつくる

Even G2 のアプリは、Web の技術(HTML、TypeScript、Viteのような構成)で作れます。公式の開発者向けサイトの案内が分かりやすくて、ここを上から順に追っていけば迷いませんでした。

Node.js は v20 LTS か v22 以上が必要でした。
npm create vite@latest my-g2-app -- --template vanilla
cd my-g2-app
npm install
まず Vite でプロジェクトを作ります。
npm install @evenrealities/even_hub_sdk
npm install -g @evenrealities/evenhub-cli @evenrealities/evenhub-simulator
つづけて、SDK とツール類を入れます。SDK はプロジェクトに CLI とシミュレーターはグローバルに入れました。
サンプルアプリを PC (シミュレーター)で動かす

サンプルとして Hello from G2! を出すコードを書きました。やっていることはシンプルで、SDK を読み込んで、テキストの箱(576×288)を作って、起動画面に登録するだけです。特別なフレームワークは要らず、普通の JavaScript と SDK で書けました。

シミュレーターで動かすと、右の Glasses Display に緑で Hello from G2! が出ました。左の Browser が真っ白なのは正常で、表示はぜんぶ Glasses Display 側に出ます。下の Up、Down、Click、Double Click ボタンでメガネのタッチ操作もここで試せました。なんか、さっきの緑のテキストが反応してました。
スマホ(実機)に出したい
PC のシミュレーターで動いたので、次はスマホ経由でメガネに出したくなります。
最初は「ブラウザでアクセスすればスマホの Even アプリが開くのかな?」と思っていたのですが、どうも違うようでした。
まず気づいたのが、PC の開発サーバはそのままだとスマホから見えない、ということです。普通に npm run dev で起動すると localhost(PC 自身)でしか待ち受けないので、同じ Wi-Fi のスマホからはアクセスできません。

そこで --host を付けて起動します。こうすると Network: http://192.168.x.x:5173/ という、同じネットワークの他の端末から見えるアドレスが出ます。このアドレスが、あとで QR コードを作るときに使う材料になります。
npm run dev -- --host 0.0.0.0
QR ってなんだろう

--host で公開できたものの、ここで止まってしまいました。ブラウザでアドレスを開いてもメガネには何も出ないし、そもそもスマホの Even アプリのどこを見ても、アプリを読み込ませる入口が見当たりません。
よく見ると、スマホ側には QR コードをスキャンする仕組みがあるようなのですが、その QR をどこで出すのか、どう使うのかが分からない。ここで手が止まりました。
Even G2 スマートグラス開発入門(1)— 環境構築からHello Worldまで
そんなときに助けられたのが、宮浦さんのブログ記事でした。読んでみると、どうやら QR でアプリを読み込ませる前に、開発者としての登録(Developer Mode の有効化)が必要だと分かりました。普通に G2 を使うぶんには出てこない、開発者向けの一段があったわけです。
開発者登録してみる

宮浦さんの記事をヒントに Even Hub のウェブポータルにログインしました。
アカウントは G2 を買ったときと同じメールアドレスのままで、新しく作り直す必要はありません。ただ、この「ウェブハブに一度ログインしておく」というのが必要な一手間でした。
ただ、実際の振る舞いというかアカウントの扱いが正しくどうあるのかはわかりにくいですね。
で、ここはアプリを公開するための画面でもあるのですが、今回触るのは設定まわりだけです。

Settings の Edit profile から Developer name を設定します。今回は tseigo にしました。これを設定しないと、スマホ側に開発者向けのメニューが出てこないようです。
本当はしっかり検証すべきですが、こういうのを下手に途中で止めたり、ログインを繰り返すと、弾かれるようになったり怖いので、一気に駆け抜けました。
スマホアプリを再起動したら開発者メニューが出た

Developer name を設定しても、スマホの Even アプリにはすぐ反映されませんでした。
一度アプリを完全に終了して再起動すると、アカウント情報が読み直されて、ようやく自分のアカウント(tseigo)が見えるようになりました。「インストール済みのプラグインがありません」と出ていますが、まだ自分のアプリを入れていないだけなので大丈夫です。

開発者ハブに入ると、プロトタイプモードという項目があります。これが、まだ公開していない開発中のアプリを実機で試すための入口です。

プロトタイプモードに進もうとすると、Even Hub の利用規約への同意を求められます。同意するで先に進みました。
QR を生成してスキャン、そして表示
開発者メニューが使えるようになったので、いよいよアプリを読み込ませます。スキャンする QR コードは、PC のターミナルで自分で生成します。さきほど --host で公開したときに出た Network のアドレスを使って、こう叩きます。
evenhub qr --url "http://192.168.x.x:5173"
するとターミナルに QR コードが表示されます(さっき出てきたものです)。これをスマホのプロトタイプモードで読み取ります。

プロトタイプモードの QR スキャン画面です。初回はカメラの利用許可を聞かれるので、許可して進みます。

QR を読み取ると、my-g2-app の読み込みが始まりました。あとは PC → スマホ → メガネ とつながって、メガネ側にも無事 Hello from G2! が表示できました。
いやー、うまくいきました。
こうして並べると Quickstart の手順が丁寧に見えて、実際にやってみると、ところどころで途切れているように感じる瞬間がありましたね。
一番は QR をどこで出すのか分からず手が止まったあたり。Developer name を設定したのにスマホに何も変わらず「あれ?」となったり。
なにはともあれ、ちゃんと表示されてよかったです。