初心に返って王道「川下りゲーム」徹底解説！！for IchigoJam【「寺子屋Hana」開所記念】
Hana道場の横展開としてSAPジャパンが支援し寺子屋Hanaが福島県会津若松に設立しました！！2020.9.26
本日、寺子屋Hanaがオープンしました。
— CoderDojoAizu (@CoderDojoAizu) September 26, 2020
９名が参加です。
CoderDojo Aizuも運営を応援しています。
今日はIchigoJam講座とレーザーカッター・３Dプリンタのデモを行いました。
地域の子供たちのICT教育の場として機能させていきたいと思います。
メンターのみなさま、今日もありがとうございました。 pic.twitter.com/KYwLRXhQlP
Hana道場公式ブログに詳細あり
また9月26日は私、師範の誕生日でもあり、私がIchigoJamでプログラミングを始めてちょうど3年が経ちました！
とてもアニバーサリーな日なので、初心に返って王道プログラム「川下りゲーム」を徹底解説していこうと思います。
新たに子どもたちにIchigoJamプログラミングを教えたい人の一助になれば幸いです。
【目次】
1. 川下りゲームについて
川下りゲームはIchigoJamでプログラミングを始める人が最初に作る入門的プログラムです。とても短いプログラムの中に、アプリ（ゲーム）作りで大切な要素が詰まっており、1行づつ打ち込んで実行しながらゲームが出来上がっていく過程を体験できます。
（鯖江市の小学校の総合学習の授業でも川下りゲームをつくります）
2. プログラム概要
【プログラム】
10 CLS:X=15
20 LC X,5:?"0"
30 LC RND(32),23:?"*"
35 WAIT 3
36 X=X-BTN(28)+BTN(29)
39 IF SCR(X,5) END
40 GOTO 20
20 LC X,5:?"0"
30 LC RND(32),23:?"*"
35 WAIT 3
36 X=X-BTN(28)+BTN(29)
39 IF SCR(X,5) END
40 GOTO 20
(CC BY 福野泰介)
【日本語訳付きプログラム】
＜初期設定＞
10 CLS:X=15 画面を消す：変数Xに15を記憶させる
＜自分のキャラ表示＞
20 LC X,5:?"0" 横にX,縦に5の位置に：0 を表示
＜敵のキャラ表示＞
30 LC RND(32),23:?"*" 横に0〜31の中からランダム,縦に23の位置に：* を表示
＜スピード調整＞
35 WAIT 3 3(1/20秒)まつ
＜キャラの移動操作＞
36 X=X-BTN(28)+BTN(29) 自キャラを←キーを押すと左に、→キーを押すと右に移動
＜当たり判定＞
39 IF SCR(X,5) END もし 自キャラの位置に何かあったら プログラム終了
＜繰り返し＞
40 GOTO 20 20行目にいく
このように、各行で何をしているか理解できたらとりあえずOK！
ちゃんと川下りゲームのプログラムを理解したい方は続きをご覧ください。
3. 実行結果と解説（1行づつ）
＜初期設定＞10行目
10 CLS:X=15 画面を消す：変数Xに15を記憶させる
CLS 画面を消す（ショートカットキーはF1） <クリア・スクリーン>
変数 = 数 変数に数を記憶させる <イコール>
CLS で画面を消します。:で続けて
X=15 で変数Xに15を記憶させます。
?X で変数Xを画面に表示すると15を記憶していることがわかります。
＜自分のキャラ表示＞20行目
20 LC X,5:?"0" 横にX,縦に5の位置に：0 を表示
IchigoJamの画面は左上が0,0で、右方向に31、下方向に23まで座標があります。
変数Xには10行目で15を記憶させているので、横に15,縦に5の位置に表示されます。
＜敵のキャラ表示＞30行目
30 LC RND(32),23:?"*" 横に0〜31の中からランダム,縦に23の位置に：* を表示
RND(数) 0〜数-1の中からランダムに1つ数を返す <ランダム>
横に0〜31のどれかランダム,縦に23の位置に、敵のキャラ「*」を表示します。
F5（RUNのショートカット）キーを連打すると、横はランダムに、縦は23固定で敵キャラが表示されます。
＜繰り返し＞40行目
40 GOTO 20 20行目にいく
35〜39行目を飛ばして、40行目の繰り返しを入力し実行します。
＊が上方向に高速スクロールしていく様子に、子どもたちは驚き、喜びます！
コンピューターの計算速度を肌で実感してもらうためにあえて40行目を先に入力しています。
なぜ、上スクロールするのか解説します。
画面に表示するPRINT（省略形：?）命令は、表示した後に「改行」をしています。
敵キャラ＊を画面一番下の23の位置に表示して「改行」しています。
画面一番下で改行すると、IchigoJamの仕様上、画面全体を1つ上にスクロールします。
↑の改行デモの前半では、手動で＊を打ってエンターを押しています。
後半では、川下りゲームのアニメーションをWAIT60にして1秒おきに＊を表示しています。画面一番下に＊を表示して改行されて上にスクロールしていくのがわかりますね。
結論：画面の一番下に表示を繰り返すことで、改行によって画面全体が上にスクロールする
自分のキャラ「0」も上に上がるので、5個連なっているような表示になります。
＜スピード調整＞35行目
35 WAIT 3 3(1/20秒)まつ
WAITを入れることで、＊を表示する間隔が長くなります。
コンピューターの速度は人間には速すぎるので、WAITで待ってもらいましょうねと言っています。
＜キャラの移動操作＞36行目
36 X=X-BTN(28)+BTN(29) 自キャラを←キーを押すと左に、→キーを押すと右に移動
BTN(数) 数でキーを指定し、指定されたキーを押すと1、それ以外で0を返す <ボタン>
キーボードのキーにはそれぞれ番号が決まっています。
←キーは28番、→キーは29番です。
BTN(28) は←キーを押すと1に、押してないと0を返します。
←キーを押したときの36行目
36 X=X-1+0
変数Xを-1して記憶し直します。自分のキャラが左に1マス移動します。
→キーを押したときの36行目
36 X=X-0+1
変数Xを+1して記憶し直します。自分のキャラが右に1マス移動します。
＜当たり判定＞39行目
39 IF SCR(X,5) END もし 自キャラの位置に何かあったら プログラム終了
SCR(ヨコ,タテ) 指定した位置にある文字の番号を返す <スクリーン>
SCR(X,5) は自分のキャラの位置に何の文字があるか調べます。何もない時は0を返します。
（ちなみに敵キャラ＊の番号は42番です。番号表はこちら）
39行目を入れることで、
もし SCR(X,5)が何か数を返したら プログラムを終了
→ もし 自分のキャラの位置に何か文字があったら プログラムを終了
当たり判定をつけて、ゲームが完成しました！！
4. バグについて
バグの理由
実は、この状態だとバグがあります。
何人かの子どもたちはバグを見つけてニヤニヤしていることでしょう。
左右の端にいくと敵に当たらない＜無敵バグ＞が起こります。
なぜ＜無敵バグ＞が起こるのか、解説します。
結論：自分のキャラが画面外にいってしまっているから。
画面左端は0ですが、さらに←キーを押すとXがマイナスの値になります。
画面上には0の位置にいるように表示されますが、実際の座標はマイナスになっており、0〜31に表示される＊には永遠に当たらなくなります。
（右端も同じように31にいるように表示されていても実際は32以上になっています）
バグを解消しよう！
プログラムの穴（バグ）をついて、不正しているプレイヤーを「チーター」と言います。子どもたちは大体チーターという言葉を知っていて、なぜか喜びます。
チーター対策としてバグを直すのもプログラマーの仕事だよと言いながら、バグ修正のプログラムを教えます。
短いバージョンと長いバージョンの2つご紹介します。どちらも同じ動きになります。
短いプログラム
37 X=X&31
短いですが、理解するのは少し難しいです。&のリファレンス
また別の機会に解説しようと思います。
長いプログラム
37 IF X<0 X=31
38 IF X>31 X=0
38 IF X>31 X=0
2行必要になりますが、意味はわかりやすいです。
37 IF X<0 X=31 もし Xが0より小さくなったら Xに31を記憶させる
38 IF X>31 X=0 もし Xが31より大きくなったら Xに0を記憶させる
38 IF X>31 X=0 もし Xが31より大きくなったら Xに0を記憶させる
↓実行画面↓ 両端に行ってみましょう、どうなる？
無敵バグを直したがらない子どもも出てきます。
そういう時は「ワープ機能をつけよう」と言って37行目以降を入力してもらいましょう（嘘はついていません笑）
これで、川下りゲームの完成です！！
全員立ってもらって、同時にF5で実行し、敵に当たったら座っていくゲーム大会をすると盛り上がりますよ！！
5. まとめ
1つでもプログラムの原理を理解すると、他にも応用が効くようになっていきます。
あとは自分でも改造、実験（仮説と実装の繰り返し）をしながら、遊びつつ学んでいきましょう！
仮説を即実装できるのがIchigoJamの良いところ！何度間違えてもコンピューターは怒りません。
川下りゲームのおすすめの改造方法は別の記事で紹介しようと思います。
＜やってみよう＞
- 自分のキャラを変える
- 敵のキャラを変える
- スピードをゆっくりにする
- CLTとTICK()を使ってタイムを表示
CC BY shoichi1031da / @shoichi1031da
Twitterのフォローもよろしくお願いします^^
