フラッピーバードを自動操縦してみる！

こんにちは。プログラミングスクールTENTOで講師《こうし》をしている谷岡です。OtOMOの倉本さんが誰か書かないか？とつぶやいていたので、重《おも》い腰《こし》を上げて参加《さんか》することにしました。

TENTO : http://www.tento-net.com/
OtOMO : http://otomo.scratch-ja.org/

普段《ふだん》、教室内ではビジュアル言語のビスケットやスクラッチはあんまり教えてなくて、主にJavaScriptなどのテキスト言語を教えてるので、お高くとまって見えるかもしれませんが、結構《けっこう》フレンドリーなので、もっと気さくに話しかけてほしいです。みんなが想像《そうぞう》するよりスクラッチもできます（とおもっています）し、ちびっ子もきらいじゃないです。

とはいえ、どんくらいスクラッチできるんだよ！？と言われたらことばでは証明《しょうめい》のしようがないので、以前《いぜん》に、大人の威厳《いげん》を見せるためにつくったフラッピーバードもどきと、それを魔改造《まかいぞう》したバージョンを紹介《しょうかい》したいと思います。

フラッピーバードとは？

フラッピーバードについては、Hour of Code などでも紹介《しょうかい》されているので、わたしが説明するより、そちらを参考《さんこう》にしてもらったほうがいいですよね。Hour of Code では、全10ステージをクリアすると、自分好み《じぶんごのみ》のフラッピーバードがつくれてしまいます。（対象年齢は4歳以上となっていますが、漢字が多いので未就学児には少し難しいかもしれません。）

Hour of Code

もし、フラッピーバードがどんなものかよくわからないのであれば、スクラッチを使ってフラッピーバードをつくるまえに、一度 Hour of Code で Flappy Code（フラッピーゲーム）をつくってみることをおすすめします。

Flappy code : https://code.org/flappy

完成《かんせい》すると、URLでシェアすることができます。

Flappy ゲーム : https://studio.code.org/c/139076578

Scratch 2.0

さて、フラッピーバードがどんなものかわかったところで、スクラッチでつくってみましょう。今回のスクラッチの開発環境《かいはつかんきょう》は、Web版の Scratch 2.0 です。Webページを開いたら、「Scratchに参加しよう」でアカウントを作成し、サインインします。

Scratch : https://scratch.mit.edu/

フラッピーバードをつくる

スクラッチでの開発方法《かいはつほうほう》や、フラッピーバードのつくりかたは、ここではくわしく説明《せつめい》しませんが、「中を見る」でスクリプトの中身《なかみ》をみると、けっこう簡単《かんたん》につくれることがわかると思います。

Flappy Bat : https://scratch.mit.edu/projects/25083768/

フラッピーバードをつくる手順

開発手順《かいはつてじゅん》だけ、まとめておきますね。流《なが》れ自体《じたい》は、Flappy Code と大差《たいさ》ありません。

1. キャラクターをつくる
2. キャラクターに加速度《かそくど》をつける
3. 地面《じめん》にぶつかるとゲームオーバー
4. クリックイベントでパタパタする
5. 障害物《しょうがいぶつ》をつくる
6. 障害物《しょうがいぶつ》をクローンする
7. 障害物《しょうがいぶつ》を移動《いどう》させる
8. 障害物《しょうがいぶつ》にぶつかるとゲームオーバー

Flappy Bat

キャラクターを『とり』じゃなくて『こうもり』にしたので、Flappy Bat という名前にしました。完成《かんせい》するとこんなかんじになります。ぜひ挑戦《ちょうせん》してください！100点までいくにはそうとう練習《れんしゅう》が必要《ひつよう》ですよ。

Flappy Bat : https://scratch.mit.edu/projects/25083768/#fullscreen

自動操縦《じどうそうじゅう》とは？

さて、本家《ほんけ》フラッピーバードは、その難易度《なんいど》の高さで有名《ゆうめい》になりましたが、つくってみた Flappy Bat の難易度《なんいど》も相当《そうとう》のものです。かなりがんばっても10点とか20点くらいまでしかいかない人も多いと思います。どうにかして最高得点《さいこうとくてん》を更新《こうしん》したいので、機械学習《きかいがくしゅう》とか人工知能《じんこうちのう》(AI《えーあい》)をつかって自動操縦《じどうそうじゅう》できないか？とおもったわけです。

当時つくったプレゼン資料（修正版） : 「auto flight flappy bat」

最近《さいきん》は、人工知能《じんこうちのう》とか、機械学習《きかいがくしゅう》とか、すごくはやってて、気になっている人もおおいかもしれません。その入門編《にゅうもんへん》をスクラッチでやろう！というこころみです（でした）。（今回実装したのは、学習機能がないルールベースのオートパイロットです。）

自動操縦《じどうそうじゅう》してみる

自動操縦《じどうそうじゅう》といえば、最近《さいきん》では、Google社が実験《じっけん》している自動車《じどうしゃ》の自動運転《じどううんてん》なんかが有名《ゆうめい》ですよね。でも、じつは旅客機《りょきゃくき》などの飛行機《ひこうき》では、すでに自動操縦《じどうそうじゅう》（オートパイロット）は一般的《いっぱんてき》で、なんらかのしかけで自動的《じどうてき》に操縦《そうじゅう》されています。

というわけで、最終目標《さいしゅうもくひょう》である機械学習《きかいがくしゅう》による自動操縦《じどうそうじゅう》はいったんおいといて、まずはルールベースでやってみようというわけです。フラッピーバードの操作方法《そうさほうほう》はじつは簡単《かんたん》で、障害物《しょうがいぶつ》との距離《きょり》と高低差《こうていさ》を見ながら、クリックするだけです。自動操縦機能《じどうそうじゅうきのう》を実装《じっそう》するための入力を「キャラクターと障害物の距離」と「キャラクターと隙間《すきま》の高低差」と定義《ていぎ》し、出力をクリックするタイミングと定義《ていぎ》します。

• 《入力》
• キャラクターと障害物《しょうがいぶつ》の距離《きょり》
• キャラクターと隙間《すきまs》の高低差《こうていさ》
• 《出力》
• クリックするタイミング

定義《ていぎ》さえできてしまえば、この入力と出力のあるスクリプトをつくればいいわけです。（実際《じっさい》には、もうちょっと複雑《ふくざつ》になってしまいますが...）数式であらわすと、入力 $x$ にたいして、出力 $y$ が、式 $y = \phi(x)$ であらわされるシステムがあったとき、この $\phi$ を定義《ていぎ》することが機械学習器《きかいがくしゅうき》をつくるということです。本格的《ほんかくてき》に機械学習《きかいがくしゅう》をやろうとするなら、この枠組《わくぐ》みは、たもったほうがよいです。

Flappy Bat 0.3

そして、三日三晩《みっかみばん》、夜《よ》なべをして完成《かんせい》したのがこちら。ジャジャーン！

Flappy Bat 0.3 : https://scratch.mit.edu/projects/25295560/

HARDモードと、EASYモードがあります。また、画面左上《がめんひだりうえ》の[AUTO ON / OFF]を切り替える《きりかえる》ことで、自動操縦《じどうそうじゅう》を ON / OFF できます。自動操縦《じどうそうじゅう》に勝てるかな？

てなかんじで今回はここまでです。もうちょっとまとまった時間《じかん》と、やる気があれば人間《にんげん》の操作《そうさ》をモニタリングして、学習《がくしゅう》する機能《きのう》を追加《ついか》できると思ってますが、それはまた次回のおたのしみということで、それではよいお年を！

関連書籍案内

子どもにプログラミングを学ばせるべき６つの理由

著者： 神谷 加代　著/できるシリーズ編集部　著/竹林 暁　監修

12歳からはじめるHTML5とCSS3

TENTO (著)

略歴

TENTOスタッフ : http://www.tento-net.com/staffs

谷岡広樹（たにおかひろき）
千葉大学工学部卒。大学卒業後、プログラマーとして自然言語処理や、
情報検索のシステム開発に携わる。TENTOの設立者である草野、竹林
両氏の志に共感し、2013年3月よりTENTOをお手伝い中。