ronpro2011#12

論理思考とプログラミング #12 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

2011/07/21

1 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

2011/07/21

2 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

こういうゲームをつくります

要求仕様を考えよう • タイトル画面が表示される"• 操作をするとゲーム本体がはじまる"• マウスカーソルを敵が追いかけてくる"• 捕まると点数（ライフかも）が減る"• 点数が０になったらゲームオーバー"• ゲームオーバー画面が表示される"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

3

設計に落とし込もう • タイトル画面を表示する"- タイトル画面：画像で作成し、表示する"- 画面クリックでゲームが始まる"

• ゲームオーバー画面を表示する"- ゲームオーバー画面：画像で作成し、表示する"- 画面クリックでゲームが再スタートする"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

4

設計に落とし込もう（つづき）

• マウスカーソルの位置を円で表示"• 敵の表示"- 円で表示する"- カーソルに近づくと直径が大きくなる"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

5

設計に落とし込もう（つづき） • 敵の動き"- 遠くにいるときは急加速で近づいてくる"- 近くにいるときはゆっくり近づいてくる"

• 敵の攻撃"- 敵の円とマウスカーソルを表す円が重なったら攻撃を受けている"- 攻撃を受けるたびに点数が1減る

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

6

実装する順番を決めよう 1.  敵を円で表示"2.  敵の動き"3.  マウスカーソルの位置を円で表示"4.  カーソルに近づくと敵の直径が大きくなる"5.  敵の攻撃"6.  ゲームオーバー画面を表示する"7.  タイトル画面を表示する"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

7

第9回問5を改造しよう 1.  敵を円で表示　← done"2.  敵の動き ← done"3.  マウスカーソルの位置を円で表示"4.  カーソルに近づくと敵の直径が大きくなる"5.  敵の攻撃"6.  ゲームオーバー画面を表示する"7.  タイトル画面を表示する"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

8

まとめページにあるサンプル 1.  敵を円で表示　← done"2.  敵の動き ← done"3.  マウスカーソルの位置を円で表示 ← done"4.  カーソルに近づくと敵の直径が大きくなる"5.  敵の攻撃"6.  ゲームオーバー画面を表示する"7.  タイトル画面を表示する"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

9

まとめページにあるサンプル 1.  敵を円で表示　← done"2.  敵の動き ← done"3.  マウスカーソルの位置を円で表示 ← done"4.  カーソルに近づくと敵の直径が大きくなる"5.  敵の攻撃"6.  ゲームオーバー画面を表示する"7.  タイトル画面を表示する"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

10

第10回問4を混ぜよう 1.  敵を円で表示　← done"2.  敵の動き ← done"3.  マウスカーソルの位置を円で表示 ← done"4.  カーソルに近づくと敵の直径が大きくなる← done"5.  敵の攻撃"6.  ゲームオーバー画面を表示する"7.  タイトル画面を表示する"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

11

被攻撃判定

boolean player_is_hunt() {" float d = " dist(mouseX, mouseY, hunter_x, hunter_y);" return d < (player_r + hunter_r) / 2;"}

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

12

スコアを表示したい

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

13

ココ

文字を表示するには

• 事前準備：フォントデータの作成"• プログラム"- フォントデータの読み込み"- 使用するフォントの設定"- 文字を表示するメソッドの実行"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

14

フォントデータの作成

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

15

文字の表示

PFont font;"font = loadFont("Monospaced-48.vlw");"textFont(font);"text(“text text text”, 20, 60);

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

16

スコアの表示 void draw_score() {" noStroke();" fill(255, 255, 255);" textFont(font);" text("Score: " + player_score, 20, 60);"}

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

17

ここまでできたもの 1.  敵を円で表示　← done"2.  敵の動き ← done"3.  マウスカーソルの位置を円で表示 ← done"4.  カーソルに近づくと敵の直径が大きくなる← done"5.  敵の攻撃 ← done"6.  ゲームオーバー画面を表示する"7.  タイトル画面を表示する"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

18

2011/07/21

19 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

一応、デモはできる

ゲームの状態遷移

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

20

スタート ゲーム中 ゲームオーバー

クリック

クリック

スコアが０以下

ゲームの状態を変数で表現

void draw() {" if (mode == 0) { game_intro(); }" else if(mode == 2){ game_over(); }" else { game_main(); }"}

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

21

画像の表示

• 事前準備：画像をスケッチに追加"• プログラム中"- 画像ファイルの読み込み"- 画像ファイルを表示するメソッドの実行

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

22

画像をスケッチに追加

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

23

画像の読み込みと表示

PImage img;"img = loadImage(“gameover.png”);"image(img, 0, 0);

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

24

スタート画面 void game_intro() {" image(img_start, 0, 0);" if (mousePressed) {" mode =1;" }"}"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

25

ゲームオーバー画面 " void game_over() {" image(img_gameover, 0, 0);" if (mousePressed) {" mode = 1;" game_init();" }"}"

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

26

2011/07/21

27 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

アナウンス

次回は最終発表です

• 発表時間は5分"• 必ずデモをしてください"• 要求仕様、設計、未達の機能などを説明してください"

• スライドはあってもなくても良いです

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

28

最終レポートについて • 以下のことを説明してください"- 要求仕様"- 設計"- プログラムの使い方"- 今後の展望、改良点"

• 分量はA4 7ページまでにしてください

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

29

最終レポートの締め切り

• 2011年8月1日(月) 17:00 (日本時間) "• SFC-SFSで提出"• 以下をzipファイルにまとめて提出"- レポート (PDFもしくはWordファイル)"- プログラム＋その他必要なファイル一式

2011/07/21 N. Shimizu (chiko@sfc.keio.ac.jp / @chikoski)

30