2016年10月15日土曜日

湾岸マキシ動画の技術解説

The Crewを湾岸マキシ風にプレイする動画つくりました。

https://www.youtube.com/watch?v=7uor2Oxmc6c&t=1s

動画説明文にも記載しましたが
ゲームデータに介入するMODを使用した訳ではありません。

今回はその辺の技術的なお話。

●プログラム
撮影にあたり、作ったプログラムは次の3つ。
①画像認識を用いた速度値取得
②湾岸マキシ風のタイム表示
③ウィンカー表示

各プログラムではDXライブラリを使用しました。
Windowsアプリケーション開発に付き物の
ウィンドウプロシージャ云々、ウィンドウ生成云々の
糞面倒な処理を関数1つでやってくれる便利なライブラリです。

DXライブラリ本家サイトでは初心者向けの解説ページもあり
専門知識ゼロでも、開発環境の導入からプログラム実行まで
超わかりやい解説があります。必見!

①画像認識を用いた速度値取得
後述の距離計算のために速度を取得する必要があります。
そこでThe Crewのメーターを画像としてキャプチャし
OpenCVのテンプレートマッチングを用いて数値として認識しています。

キャプチャについてはコチラが参考になると思います。
ただしThe Crewのメーターは加速度に応じて微妙に動くので
テンプレートマッチングする際の座標には注意が必要です。

マッチング処理の前に、キャプチャしたメーター画像を白黒にして
数字の左上座標を検出してからマッチングさせると精度が上がります。

ちなみにWildRunアプデ前は数字が斜体になっててもっと面倒だった。

取得した値は②のプログラムに送信する必要がありますが
私はプロセス間通信についてはよくわからなかったので(ォィ
①が.txtに値を書き出して②が読み取るという手法を用いました。

アクセス権利のデッドロックを心配しましたが、杞憂でした。

①②③どのプログラムにも言えることですが
DXライブラリは非アクティブウィンドウになると処理が止まってしまうので
SetAlwaysRunFlag(TRUE);
を用いて常に実行させてやる必要があります。

②湾岸マキシ風のタイム表示
通常Windowsアプリケーションはウィンドウを持ち
他のウィンドウの上に透過して表示はできませんが
ウィンドウ自体を取っ払い、透過して表示させることは可能です。
いわゆる「オーバーレイ」というやつ。

DXライブラリを用いてオーバーレイを実現する方法はコチラに詳細があります。
The Crewはボーダーレスモードで起動し
その上に「常に手前に表示」属性を付与した自作アプリを描画しています。

DXライブラリで作ったプログラムを手前固定にするには
SetWindowZOrder(DX_WIN_ZTYPE_TOPMOST);
をDXライブラリ初期化前に記述すればOK

フィニッシュまでの距離や矢印を表示させるタイミングを計るためには
現在位置を知る必要があります。

しかし、残念ながらThe Crewからは座標の類を取得できないので
最も原始的な『距離=速さ×時間』で計算することにしました。

湾岸アプリが60fpsで実行しているとすると
1フレームあたり1/60=0.0166[s]
速度は①のプログラムから取得。
これらをかけ算してあげれば、1フレーム当たりの距離が算出できます。
あとはフレーム毎の距離を足し算してあげれば走行距離を算出できます。

コレ、結局は速度の時間積分やっているだけです。

ただし、この手法では誤差が生じます。
激しい加減速を伴ったときに大きくズレたので
恐らく速度の取得頻度が少ないんだろうと予測。
浮動小数点の加算誤差もあるだろうし。

また雨が降るとものすごいズレます。
あのスピードメーター、ホイールの回転数から算出してるんだろうな。
だから雨で滑っている分がスピードメーターに反映されてないんだろうと推測。

なので、撮影自体は数十テイクやってますorz
ズレてもボツ。雨降ってもボツ。
WildRunアプデ後、雨降りすぎなんだよ(怒)
その中から一番ズレの少ないテイクを動画にしました。

ちなみに画像素材は全てOffice純正の図形を組み合わせて作りました。
私のような絵心のないプログラマにとってOfficeは画像処理ソフトになります。

③ウィンカー表示
これもウィンドウのオーバーレイをしているだけです。
このプログラムは普段The Crewでドライブするときに毎回使っています。
ウィンカーレバーやマイコンとPCの通信などの話題はまた今度のエントリで。

●スマホ動画
ディスプレイとは別にハンドル越しに見えるのは私のスマホです。
The Crewを起動したときに流れるロゴ映像をキャプチャして
諸々の画像を組み合わせた動画をループ再生しているだけです。

動画はPowerPoint2013を使用して制作。
短いくせに凝った映像を作るならパワポ使うと実は楽です。

アニメーション等を設定したら
「ファイル」→「エクスポート」→「ビデオの作成」
で簡単に映像化できます。

●撮影方法
アクションカムを頭に取り付けて撮影しました。
詳細はコチラのエントリで。

0 件のコメント:

コメントを投稿