推しアイデア
MIDIキーボードとオタマトーンを用いてリンクを操作する
作った背景
テーマが発表された時かつて楽しんだ「時のオカリナ」をもう一度プレイしたくなったから
推し技術
Three.js等を使用せずにGo/WASMだけで3Dエンジンを自作
プロジェクト詳細
アプリ概要
- ゼルダの伝説「時のオカリナ」をほぼ64,3DSのグラフィックで遊べるリメイクアプリ
- MIDIキーボードとオタマトーンを用いてリンクを操作することができる
使用技術
基本的には Go
楽器の繋ぎ込みに 生JS
データフロー
技術的挑戦というか工夫
1, 3DエンジンをGoで自作
three.js等を使用せずにWebGL1を直接叩くラッパーをGoで自作 全オブジェクト・HUD共通のGLSL ES 1.00シェーダーは1組だけ
2, glTF/GLBパーサーも自作
- 3Dモデル・テクスチャはgo:embedでGoバイナリに直接埋め込み、ブラウザ側の追加fetchが要らない構成にしている
- 実際に必要な色のテクスチャ、座標、ノード変換あたりの実装だけしてるのでとても軽くて、既製品と違って自分の都合で修正できる
3, フィールド単位で完全に別のWASMバイナリ
たくさんの3Dモデルとテクスチャをバイナリに埋め込んでいるので一つのwasmバイナリで全て読み込むと全てのアセットを読み込んでしまうため シンプルコンフリクト回避にもちょうどいい
Three.jsじゃなくてGoを用いたことで結果的に良かった点
ラグが圧倒的に少ない
- 特定のキャラの構造体の状態変化はGo内で直接書き換えると即座に描画される(メロディ判定と描画を纏えて行える)ため
演出を一箇所いじるだけで増やせる
- 抽象を挟まない生のstruct/スライスだからこそ、ゲーム都合のハック（uAlphaやガノン消失トリック）を副作用を読み切ったまま直接ねじ込めるためThree.jsより簡単で少ないコードの変更量で実装できる
Go testでゲームロジックをテストできる
- 一つのテストで一連の流れまでテストできる
使用した楽器概要
MIDI Keyboard
Web MIDI APIを使用することができる
オタマトーンneo
Web Audio APIで周波数と取得
使用方法
最初にMIDIkeyboardを接続(オタマトーンは最悪声でカバーできます)
ドを弾いてゲーム開始
オタマトーンでリンクを移動させ上記の楽譜を演奏するとドアが開きリンクが入っていくアニメーションが再生されページ遷移する
障害物を乗り越えられないのでmidiで演奏して馬に乗る
オタマトーンで演奏して移動して次のマップに移動
midiを演奏してガノンを倒す
同様にガノンの最終形態を倒すとゲームクリア
ゲームクリア！
