【JPPGB ゲーム作成コンテスト #1】Power Labyrinth

301 Views

June 22, 24

スライド概要

【JPPGB】ゲーム作成コンテスト #1での運営枠でエントリーした作品の説明資料です。
https://jppgb.connpass.com/event/317001/

作品はこちらからダウンロードできます。
https://koruneko.github.io/JPPGB-GameContest-1/

profile-image

都内でITエンジニア頑張ってる人

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
2.

【JPPGB】 ゲーム作成コンテスト #1 • コルネ • Microsoft MVP for Business Applications

3.

自己紹介 ◼ Name コルネ ◼ Microsoft MVP Business Applications ◼ Who am I ? Power Appsでゲーム作成している人 今年はフュージョン開発の布教を目指したいと思っています ◼ X(Twitter) @koruneko32767 ◼ Blog コルネの進捗や備忘録が記されたなにか ◼ YouTube Korune Ch. コルネ ◼ connpass Japan Power Platform Game Builders 業務改善検討会 Japan Power Platform Dev User Group 3

4.

作成したもの

5.

概要 プレイヤーの皆さまには自動生成されたダンジョンを制限時間がくるまで何階まで踏破することができるのかを競っていただきます。 ゲームは2種類のモードがありますが、まずは「Normal Mode」からプレイすることをおススメします。 どのモードで何階まで踏破したかを X(Twitter) でポストすることができる機能も用意していますのでスコアの共有はそちらをお使いください。 ダンジョンはプレイするたび都度生成されますので毎回違うダンジョンをプレイすることが可能です! 皆さまの挑戦お待ちしております! 是非プレイしてみて感想など呟いてくださいね。 ゲームはこちらからダウンロードできます。 https://koruneko.github.io/JPPGB-GameContest-1/ 5

6.

タイトル画面 特に特別なことはないタイトル画面です。 こちらではゲームのモードを選ぶことができます。 ➢ Normal Mode • 通常のダンジョン踏破モードです。 まずはこちらからプレイしていただくことをおススメします。 ➢ Dark Mode • 自身の周囲しかマップをみることができない状態でダン ジョンの踏破を目指すモードです。 脳内マッピングを行いながら頑張って踏破してください。 ボタンにはモダンコントロールを利用してアイコンを挿入しています。 6

7.

階層表示画面 これからプレイする階層を表示する画面です。 対象の階層に突入時にアニメーション表示するようにしています。 7

8.

ゲームプレイ画面 -Start- ゲームプレイ画面です。 こちらの状態ではゲーム開始待機を表しています。 画面を選択するとダンジョンの生成が開始されます。 8

9.

ゲームプレイ画面 -Create- ゲームプレイ画面です。 こちらの状態ではダンジョンの生成を行っています。 ダンジョンが生成されるまでダンジョンの壁が作成されて続々と生成 される様をご確認ください。 個人的にこの状態を見るのが好きですw ダンジョンは「壁伸ばし法」という技法で生成しています。 9

10.

ゲームプレイ画面 -Playゲームプレイ画面です。 こちらの状態となったらゲームスタートです! 右下のキーアイコンを選択して、左上のTime Limitが 0 になるま でにプレイヤーをゴールまで操作してください。 青色のマスは「スタート」を、赤色のマスは「ゴール」を表しています。 黄色の丸がプレイヤーです。 お使いのデバイスやネットワーク状態によってプレイヤーの速度が異 なってきますので、左下のSpeedにてプレイヤーの速度を変更しな がらプレイしてください。 右上の「GIVE UP」ボタンを選択すると、ゲームのGive upを行い 「スタート」から「ゴール」までの順路を表示します。(タイムオーバーの 場合も順路を示すようにしています。) ゴールまで辿り着くと制限時間を+15秒して次の階層に移動します。 10

11.

ゲームプレイ画面 -Game Overゲームプレイ画面です。 こちらの状態となったらゲームオーバーです。 タイムオーバー、もしくは「GIVE UP」ボタンを選択するとゲームオー バーとなります。 マップに黄色いマスがありますが、これはスタートからゴールまでの順 路です。 答えをよく確認したい場合は「TimeLimit」の下にある「正解を確 認」トグルをオンにすることでマップだけ表示することができます。 スコアをポストする場合は「Xでポスト」を選択してください。 タイトル画面に戻りたい場合は左上のホームアイコンを選択してくだ さい。 11

12.

ゲームプレイ画面 -Dark Mode- ゲームプレイ画面です。 こちらの「Dark Mode」を選択した場合のゲームプレイ画面です。 ご覧の通り、プレイヤーのまわりしかマップを確認することができません。 頑張って脳内マッピングをしながら攻略してください。 私の最高到達階層は2Fです。 挑戦者求 12

13.

ロジック解説

14.

ダンジョンの生成 ダンジョン生成は以下ロジックで行っています 1. はじめにN2行のコレクションを作成します。 (Nは奇数) 1列目を0とし外周を壁で囲うようするには、 ブロックとなるマス`X`は、 - Mod(X, N) - RoundDown(X / N, 0) の答えが`[0, N - 1]`となる場合ですね。 2. 壁(外周)ではなく、x, yともに 偶数となる座標を壁伸ばし開始の 候補としてリストアップします。 3. “2”でリストアップした始点からランダムに 1マス選択して壁を作成します。 ここで選択されたマスは開始候補のリストから 削除します。 14

15.

ダンジョンの生成 ダンジョン生成は以下ロジックで行っています 4. 次に「壁伸ばし法」に従って壁を作成します。 現在作成中のマスから次に進行する方向を 進行可能な候補からランダムに決定します。 5. “4”の条件にマッチする拡張先がある場合 壁を拡張します。 6. “4”の条件にマッチする拡張先が無い場合 その壁はもう拡張できないので 壁の拡張を終了します。 これを”4”の条件にマッチするものが 無くなるまで実施します。 進行可能な候補の条件は以下となります。 ✓ 1つ隣のマスが通路である ✓ 2つ先のマスが現在作成中の壁でない 15

16.

ダンジョンの生成 ダンジョン生成は以下ロジックで行っています 7. “2”でリストアップした始点からランダムに 1マス選択して再度壁を作成します。 ただし選択されたマスが既に壁であった場合、 開始候補のリストから削除のみを行います。 8. “4”~”6”を繰り返します。 9. “2”でリストアップした候補が空になれば ダンジョン作成完了です。 最後に通路であるマスからランダムに スタートとゴールを設定します。 16

17.

ダンジョン生成の注意点 壁伸ばし法でダンジョンを作成することでランダム性の高いダンジョンを生成可能なのでこのロジックを採用しました。 壁伸ばし法は前述のロジックの通り、既存の他の壁に現在拡張中の壁が繋がるまで拡張を続けてあげればよいです。 しかし、拡張中の自身の壁に囲まれるかたちにより他の壁に接することができなってしまう場合があります。 現在拡張中である自身の壁と繋がってしまうと、上記のイラストからも想像できる通りと到達できない領域が生れてしまいます。 これはダンジョンとして相応しくないですね。 このような状態となってしまった場合は、 1. 緑の位置まで処理を戻してあげる 2. この拡張処理はなかったことにして再度作成をする の2通りの対策が考えられます。 最初は1つ目の方法を行っていたのですが実装方法が悪いのか、処理が速すぎてデータ操作の完了が追い付いてくれていないのか上手くいかなかっ たので、今回は後者の方法で実装しています。 17

18.

ダンジョンの回答順路の算出 ダンジョン回答順路は以下ロジックで算出しています 1. スタートのマスを起点とします。 スタートのマスに0を設定します。 2. 続いて0に隣接しているマスで 通路のマスに1を設定します。 3. 次に1に隣接しているマスで 通路のマスに2を設定… という要領でゴールに到達するまで これを実施します。 4. 最後にゴールから数値を カウントダウンさせるように スタートまで辿ります。 このルートが回答順路となります。 0 0 1 1 0 20 19 18 0 1 17 1 17 2 12 13 14 15 16 2 12 13 14 15 16 3 11 17 3 11 4 10 11 19 18 4 10 11 5 9 20 5 9 21 6 6 1 7 2 8 9 1 7 2 8 20 19 18 17 19 18 20 9 21 18

19.

Thank You! msappファイルもGitHubに置いてあります 19