◆ Live配信スケジュール ◆
サイオステクノロジーでは、Microsoft MVPの武井による「わかりみの深いシリーズ」など、定期的なLive配信を行っています。
⇒ 詳細スケジュールはこちらから
⇒ 見逃してしまった方はYoutubeチャンネルをご覧ください

【5/21開催】Azure OpenAI ServiceによるRAG実装ガイドを公開しました
生成AIを活用したユースケースで最も一番熱いと言われているRAGの実装ガイドを公開しました。そのガイドの紹介をおこなうイベントです!!
https://tech-lab.connpass.com/event/315703/

今回は遂に、Processingでゲーム開発を始めていきます。ゲームのプロットから実際の作成までと前回の記事のプロット作成の記事に則って作成していきます。

前回の記事に関してのお詫びがあります。段階に使用していた変数「fase」ですが、正しくは「phease」という英単語を書く予定でした。変数としては機能しますが、英語が使えないという恥ずかしい記事になっていますね。戒めのために残しておきます。

こちらの記事は、Techブログで連載中のProcessingシリーズの集大成となっています。環境構築から現在の流れを以下にまとめておきますね。興味があったら手を動かして参加してみてね。

それでは始めていきましょう。

1 今回の成果物
2 スカッシュゲーム
- 2.1 プロット
- 2.2 コード解説
  - 2.2.1 カウントダウン機構
  - 2.2.2 ゲーム機構
3 全体との接続
4 おわりに
5 今回のコード

今回の成果物

今回の成果物の動画を置いておきます。今回作成したゲームはブロック崩しのブロックなしバージョンですね。タイトルは語呂の良さ的に「スカッシュゲーム」としています。今回は、ゲーム作成に関する説明とゲーム全体を接続する説明の2つに分割して解説していきます。また、コピペして動くコードはこのブログの最後に記載しています。

スカッシュゲーム

ここではゲーム作成に関しての説明を行います。今回は、企画書（プロット）を作成して要件を詰めてから作成を行いました。

プロット

僕がこのプロットを作成した際に、考えていたことをそのまま文章化してみます。「いきなりゲームをするのはあれだからカウントダウン付けて、スカッシュみたいなリフティングゲームみたいな感じで、シンプルにしたいから残基1で、ちょっと難しくするためにスピードランダムにしよう」ということを考えていました。それをプロットまで落とし込むと以下の図になります。

図を見たらわかるようには作っているのですが、簡単に説明を入れておきます。

画面としては「カウント」と「ゲーム」の二つの画面で構築されています。これは、いきなり画面が切り替わって始まるとユーザがびっくりしてしまうのでカウントダウンを入れています。ゲームの要件は記載の通りです。構成要素としては、「四角」と「丸」で構築されています。そのあたりのプログラムは、前回記事の「ゲーム要素：横移動・玉の跳ね返り」で解説しています。

コード解説

ここでは、コードの具体的な説明をしていきます。

カウントダウン機構

ここでは、カウントダウン機構や得点の表示、ゲーム画面の表示を管理している部分を解説します。

行2~7は得点の文字を出力するプログラムになります。カウントダウンとゲーム画面の切り替えには、「gameStartFlag」を使用しています。「FALSE」の場合ではカウントダウン、「TRUE」の場合ではゲーム画面という切り替えです。

カウントダウン機構は、Processingの特徴を利用して秒数をカウントしています。フレームレートを知っていますか？簡単に言うと1秒間に何度画面を更新するかというものになります。つまり60回drawが実行されると、現実で1秒時間がたつという具合です。そこで、フレームカウント数を60で割ることで経過時間を計算することができます。

ゲームの画面は「moveBall」と「moveBar」で構築しています。これは次節で説明しますね。

ゲーム機構

ここではゲーム機構について説明します。根幹となる部分としては、前回の記事を参考にしています。

プログラムとして大きな変更としては、2点になります。

バーでボールが跳ね返せるようになっている部分は、四角の範囲内にボールの座標が入った際にボールのY軸方向の向きを反対にしています。また、バーに当たった際に得点となるので「score」に加算されています。

壁にボールが当たった部分には「ballSpeedlX」と「ballSpeedY」がそれぞれランダムな値に変更されます。また、下方向に入った際には、ゲームが終了します。

全体との接続

ここでは、前回記事で作成したプロットを基に作りました。ゲームに関係している部分の設計は先ほど説明したので、今回採用した画面切り替えの方法についてのみ説明します。

ゲームの遷移のきっかけとしては、「エンターキー」「スペースキー」「ゲーム失敗」の三つの条件があります。それぞれ、「phease」を変更することによって画面が切り替わる仕組みになっています。今回は、画面を切り替える方法を試しましたが、座標を変更しないことによる一時停止などいろいろな方法があるかと思います。ぜひ試してみてください。

また、ゲームを繰り返すためにスペースキーを押した際に画面が戻る必要があります。戻すのが面だけでなく、ボールやバーの位置やスコアなども初期化する必要があります。この辺りは、処理としてまとめたほうが良いです（ちなみに書いてて思ったのでまとまっていません）。作っては壊しを繰り返すことで課題が見えてきますので、ぜひカスタマイズして遊んでみてください。ネクストステップとしてはこちらの記事が良いかと思います。