推しアイデア
最近Unityエンジニア界隈で流行っているPLATEAU SDKを最大限活用したこと。
アロカップ
TriPly
Azure
C#
Unity
JavaScript
VSCode
ワールド内を歩き回り、お題の写真が撮影された場所を探し出せ！！！
作った背景
とにかくUnityでもこんなすごいこと・面白いことができるんだぞと「ふきょう」するために、技術モリモリのゲームを制作したかった。
推し技術
・WebGLにも対応した動的画面キャプチャ機能 ・レンダリングの処理速度向上のOcculusion Cullingの導入 ・2つの画像の類似度を計算するTemplate Matchingの実装 ・デザインは完全オリジナル ・Azure Playfabを用いたランキング機能
プロジェクト詳細
TriPly
使用技術
Unity
PLATEAU SDK
ImageProcessing[TemplateMatching]
Azure PlayFab
Illustrator
ゲームサイクル
- お題の画像が表示される
- ワールド内を散策する
- お題に近い場所を見つけたらカメラを起動し写真を撮る
- お題画像とどのくらいマッチしているかに基づいてスコアが表示される
- ランキング・SNS投稿
- 1に戻る
どうやってワールドを作ったか
PLATEAU [プラトー] | 国土交通省が主導する、日本全国の3D都市モデルの整備・オープンデータ化プロジェクト
- PLATEAU の導入
- 使いたい地域を限定（今回は新宿駅周辺）
- 座標変換で必要なファイルを検索
- 必要なファイルをインポート
- 拡張ができるように実際の座標位置にモデルを代入
- 絶対的に正しい位置に日本地図を構築しているので今後新たな場所をステージにできる
- テクスチャのファイルが別で提供されていたのでスクリプトを作成し大量のテクスチャを効率よく反映させた
- 同じく当たり判定の導入もスクリプトを作成し効率よく導入した
モデルが重たい問題の解決方法
- Occlusion Culling の導入
- カメラに写っている範囲内のモデルだけを描画するもの
- 建物の重なりも判定するので、裏側や見えていない奥の建物は全て描画されない
- MeshOptimize の導入
- 建物のポリゴン数を統合して減らす技術
お題とどのくらい似ているのかの判定
- テンプレートマッチング
- 検索画像とテンプレート画像を2次元配列に変換する
- テンプレートマッチングのアルゴリズムを実行する
- テンプレート画像との類似度の計算は、各ピクセルのRGB値の差の絶対値を合計し、テンプレート画像のピクセル数で割った平均値を用いて行う
WebGLにも対応した写真撮影機能
- 本来、Unity内で写真を撮った場合ローカル環境のみでしか写真を扱うことができない
- 画像を文字列にエンコードすることで対応
ランキング機能
- Azure PlayFab の導入
- SDKをインストールし、webで今回使用するためのプロジェクトを作成
- リーダーボードの値の設定
- APIの設定
- アクセス対象の制限
- オンラインに登録されているリーダーボードからユーザーネームとスコアを取得しUnity上で表示
SNS投稿（Twitter）
imgurが出しているAPI - 画像のアップロード、また共有・管理を行うためのAPI - 画像付きのSNS投稿を実現するために使用 - ワンクリックでwebサイトに移動し投稿内容が自動生成されるのでそのまま投稿可能 - ハッシュタグも自動でつくように設定
デザイン
- Illustrator を使用
- 完全オリジナルで作成
プロジェクト管理
仕様書（スプレッドシート） - コア機能、α機能、β機能に分け段階的に作成 - 工数を見積もりながらコア機能にブラッシュアップを加えていった
- 進捗ボード（Notion）
- それぞれに割り振られたタスクの進捗をボードで管理
- メモ
