バスキュール技術ブログ

バスキュールが得意とするインタラクティブエンジニアリングを、あますことなくお届け!

『Exoplanet Lander』 公開しました。

エンジニアのタケダ(@neko_300YEN)です。

先週『Exoplanet Lander』というWebコンテンツをリリースしました。

20210623013757

弊社オフィスにあるアーケードゲーム筐体のディスプレイに映し出された着陸機を操作して、目的地に着陸させるというゲームです。

ゲームが動いているのは実機なんですが、それを操作するのはネット越しの外から繋がっている人で、ZOOM的なもので現場の映像を見ながら繊細な操作を必要とするゲームができるのか? 果たして面白いのか?

そんなことを実験的にやってみたというのがこのコンテンツです。

使った機材とか実装について書いていきます。

現代に蘇る『Lunar Lander』

『Exoplanet Lander』はオリジナルというわけではなく、ゲーム自体はそもそも1979年にリリースされた『Lunar Lander』というアーケードゲームがベースになっています。

LunarLanderの良いところを踏襲しつつ、現代らしくアップデートしてみよう!!

みたいな信条を持って下記の要素を付け足してみました。

  • マルチユーザー対応
  • リモート参加
  • リアルな場で起こるインタラクティブな演出

構成

今回メインで動いていたのは自分含めたエンジニア2人。

自分は配信まわり、Web実装全般、照明とか筐体まわり。

奈良に住んでいるもうひとりのエンジニアがサーバーの実装と筐体内のゲームをUnityで作りました。

アーケードゲーム筐体に映像を映す

筐体はこちら

https://www.amazon.co.jp/Arcade1Up-%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B9%E3%82%A4%E3%83%B3%E3%83%99%E3%83%BC%E3%83%80%E3%83%BC-SPACE-INVADERS-%E6%97%A5%E6%9C%AC%E4%BB%95%E6%A7%98%E9%9B%BB%E6%BA%90%E7%89%88%EF%BC%89/dp/B07KPHF3C4/ref=sr_1_4?__mk_ja_JP=%E3%82%AB%E3%82%BF%E3%82%AB%E3%83%8A&dchild=1&keywords=arcade1up&qid=1624358543&sr=8-4www.amazon.co.jp

どうしてこれが3つもオフィスにあるのかは謎ですが、たぶん代表の私物だから壊れても大丈夫◎

キルアがバラシ屋ジョネスの心臓をくり抜いたかの如く、中から基盤をサッと抜き取ります。カエシテ…。

あとは下記のインバーターを取り付ければ完成!

HDMI入力できる17インチの液晶ディスプレイとなります。 これを3つぶん。

https://store.shopping.yahoo.co.jp/truejp/a-B08C37NB29-20210521.htmlstore.shopping.yahoo.co.jp

中継カメラ

今回カメラふたつ使ってます。

  • ゲーム画面映像 : SIGMA fpをTytpe-CでPCと接続。UVCでAgoraに映像配信。
  • 俯瞰映像 : Canon5Dの画面をHDMIで出力。キャプボで取り込んでOBSからYouTubeに配信。

Agoraの方はHDで配信しています。 レイテンシー200~300msというところでしょうか。

音質はだいぶ悪いです。デフォルトの状態だと恐らく人間の声の周波数ぐらいを境にローをごっそり削られます。 ノイズ抑制の機能でしょうか? AGCやANSもOFFの状態にしてもあまり変わらず。

Agora Web SDK API Reference - Video Call - Agora Documentation

"high_quality"で配信しているのですが全然音質良くない。 何か実装が間違っているのかも。。。

また、約1ヶ月近くずっと中継し続けないといけないので、機材の痛みも気になるところです。

なので、カメラも代表の私物を利用させてもらっています◎

あとSIGMA fpはUVCモードで使っている時に電源が切れるとフォーカスがデフォルトの状態に戻ってしまいます。 死ぬまで電源を落とさないように下記の外部電源を購入しました。

https://www.yodobashi.com/product-detail/100000001005177981/

照明

制御基盤 + 電源装置

別案件で作ったやつの流用ですが、制御基板はこんな感じ。 これをゲーム筐体の中に入れています。

5Vのスイッチング電源と分電回路。 ArtNetでデータを受けてDMX信号とLEDを光らせるための基盤「Advatek社PixLitex16 mk2 」と、ArduinoとW5100モジュールが一緒になったMCUボード「KEYESTUDIO KS0304」を使っています。 何故、制御基板を2つ使うことになったかというのは後述します。

Advatek社 PixLite16mk2

コレ便利。ArtNetで送った信号をLED16ポート+DMXout4ポートで出力できます。 設定アプリも良くできているので、今回のようなサッサと光らせたい時に最適です。

5VフルカラーLEDで一般的なWS2811~WS2815とかSK9822とかいろんなチップに対応しています。

一点ダメな点としては、5ポート以上使うとだんだん出力電圧が下がってLEDがジカジカし始めます。 5Vだから??

16ポートフルで使える方法あったら教えて下さい。

KEYESTUDIO KS0304

コレ便利。売り切れだけど。

https://www.amazon.co.jp/keyestudio-KEYESTUDIO-Arduino%E7%94%A8Ethernet-W5500%E3%82%A4%E3%83%BC%E3%82%B5%E3%83%8D%E3%83%83%E3%83%88%E9%96%8B%E7%99%BA%E3%83%9C%E3%83%BC%E3%83%89%EF%BC%88Poe%E3%81%AA%E3%81%97%EF%BC%89/dp/B079G4WDGW?ref_=ast_sto_dp

LEDについて

こちらも別案件で使った機材の余り物のSK6812のLEDテープ。 RGBWの4chです。

粒の中に黄色い部分があってそこがWhite。これがものすごく明るくなります。

なので、例えば赤色に光らせたいと思って、R=100%、G=0%、B=0%、W=33%とか、あるいはガンマ補正した値を入れてしまうと、白にうっすら赤みがあるかなぁ・・・くらいのほぼ白になります。

今回の様にゲーセンっぽい原色強めの雰囲気を作ろうとしても普通にRGBの各値からWを計算してしまうといい感じになりません。 ゲームの中で機体がクラッシュした時などにフラッシュ的な演出も入れたかったので、RBG=100%に近づいた時にだけW=100%になるようなイレギュラーな制御をするようにしました。 ソフト側で処理しても良かったのですが、今回はArtNetは3chのまま受けて、Arduinoの中でWを足してLEDに信号を流すような形にしました。

PixLite16で完結しなかったのはそのためです。

実際のコードはこちら

github.com

UV Lightについて

筐体の装飾を際立たせるために、DMX制御できるUVライトを2灯つけています。

www.gantom.com

12V動作でchogoriという防水コネクタがついています。

DMXチャンネルについては以下の通り。

  • 1ch - Master Dimmer
  • 2ch - Red
  • 3ch - Green
  • 4ch - Blue
  • 5ch - Amber
  • 6ch - Cool White
  • 7ch - Lime
  • 8ch - UV

ピンアサインはこちら。[自分用メモ]

照明制御PC

ユーザー参加時、機体のブースト時、クラッシュ時、ランディング成功時など、ユーザーのインタラクションに合わせて、LED + 警告灯 + UV Lightを良い感じに光らせます。

Unityから送出されたOSCをMaxで受けて、それをトリガーにVezerのタイムラインを再生し、アニメーションをLED制御アプリにOSCで送ってArtNetを送出しています。 今回は大雑把にしかアニメーションしてないし、Vezerの方から直でArtNetを送っても良かったかも。

WinにもVezer的な細かいOSCシーケンス組める使い勝手の良いソフトはないでしょうか。。。

誰か知ってたら教えてほしいです。

imimot.com

求む、ヒーロー!!

弊社ではただいまエンジニアやデザイナーを強く募集しております!!

ゲームとか宇宙が好きな方、工作が好きな方、企画から考えて一気通貫で制作したい方。

ポディション問わず様々な方と出会えることを望んでおります。

ゲームをクリアすると応募フォーム出てくるので、是非そこから応募してください!!よろしくお願いいたします。

↓↓ チャレンジしてみてね ↓↓

20210623013757