PenCode

ゲームをしながらプログラミングの練習が出来るiOSアプリ、「PenCode」の紹介ページです。アプリの紹介と攻略のヒントなんかも記載しています。初めて開発したアプリなので、分かりにくかったり等色々ありますが、アイデアと時間と情熱を注ぎ込んだ思い入れのあるアプリです。 現在は公開を終了していますが 最後に開発した頃の話なんかも書いているので、良ければ読んでみてください。

公開日:2013/04/01

ゲームで遊びながらプログラミングに慣れよう!

このゲームではまず、「前進」「攻撃」などの行動ブロックや「相手が見えたら」などの条件ブロックを組み合わせてプログラムを作成します。キャラはプログラム通りに 9×9のフィールドの中で動き回り、先に相手の体力をゼロにしたら勝ちになります。 「遊びながらプログラミングに慣れる」ことを目的として開発しました。

プログラミング画面

本アプリでは、ブロックを組み合わせてプログラムを作成します。プログラムは「Start」ブロックから「End」ブロックまで順番に実行され、「End」ブロックまで終わると再び「Start」ブロックに戻ります。キャラクターはこのプログラムの通りに動くので、うまく相手を攻撃して倒せるように知恵を絞ってください。

プレイ画面

手前にいるのが主人公のペンギンで、奥にいるのが相手です。ちゃんとアザラシに見えるでしょうか?このゲームでは、先に相手の体力を0にしたら勝ちです。また、キャラの使う技も色々あり、特定の条件をクリアすると新しい技が使えるようになります。ペンギンなのに火を噴いたり、某ゲームのようにバクダンを置いたりできるようになります。目指せコンプリート!

プログラミング画面の操作方法

ここでは、PenCodeのプログラミング画面の操作方法について説明します。

新しいブロックの挿入

ブロックとブロックの間を左にスワイプすることで、新しいブロックを挿入できます。

あとは挿入したいブロックの種類を選べば、入力は完了。少ないジェスチャでブロックを作成できます。

ブロックの削除

削除したいブロックの上で右スワイプ。

これでブロックを削除することが出来ます。「If」ブロックと「End If」ブロックなど、ペアになっているものは同時に消えるようになっています。

条件ブロックの説明

このアプリでは、条件ブロックの使い方が鍵になります。これを上手く使いこなせば、「状況に応じて判断して動く」ことが可能になります。ですが、それぞれの定義が分かりづらいので、図(↓)の順に説明していきます。

相手が見える/相手の位置

キャラクターの視野は上の図の13マスの範囲です。そのため、この範囲に相手がいる場合に、「相手が見える」状態となります。また、「相手の位置」はこの視野13マスの中から選択して入力します。

相手の向き

これは「自分から見た向き」になります。例えば、自分が右、相手が左向きの場合、相手の向きは「手前↓」となります。また、相手が見えていないときは「NO」となります。

相手のライフ

相手の残り体力での判定となります。こちらは相手が見えていなくても判定できます。

自分のX座標/Y座標

キャラクターがどっちを向いていても、キャラクターの向く方が「Y軸」、右側が「X軸」となります。また、X、Yの値は1~9の自然数となります。図で描くとこんな感じ。

自分の向き

これは外から見た絶対的な向きです。例えば上の図では、ペンギンの向きは右、カカシの向きは下となります。

自分のライフ

自分の体力の値です。

危険物が見える/危険物の位置/危険物の向き

キャラクターが技を使って作り出したモノをここでは「危険物」としています。見るからに害のなさそうなモノも危険物です。「見える」や「位置」、「向き」の判定は、相手の場合と同じです。危険物からは離れましょう。

攻略のヒント

ここでは、目的に応じたプログラミングの例を紹介します。

  • 相手の位置による場合分け
  • フィールド内を周回する
  • ランダムに動く

相手の位置によって場合分けをする

条件ブロックの中に「相手が見える」や「相手の位置」があります。これらを組み合わせると、 相手の位置によってキャラクターの動きを変化させることが出来ます。 下の図はその一例です。

これは、目の前に敵がいたら攻撃、2,3マス前方に相手がいたら前進、右側に相手がいたら右に移動する(左なら左)という風になっていて、相手の目の前のマスに移動するプログラムとなっています。単純に見えたら攻撃しにいく、といった作戦では有効です。

これに対するアレンジとしては、間合いを取るために一歩下がったり、横に回り込んだりといったパターンも考えられます。 ここらへんは戦う相手や技によっていろいろ工夫してみると楽しいですよ!

フィールド内を周回する

次に、フィールド内をぐるぐると周回するプログラムを紹介します。 と言っても、実はこれだけ↓↓↓↓

これだけで、下の図の要ようにぐるぐるとフィールドを動きます。なぜこのようになるかと言うと、 このゲームではキャラクターの向いている方向がY軸だからです。 キャラクターから見て、一番後ろの列がY=1、一番奥がY=9となっています。 詳しくは条件ブロックの説明をご覧ください。

ランダムに動く

何種類かの行動をランダムで行う、というプログラムを紹介します。 まずはプログラムを見てみてください。↓↓↓↓↓

上ではまず、変数aに1~5の範囲の乱数を代入しています。 次に、緑色の「場合分けブロック」を使って、変数の値による場合分けをします。 Default」はそれまでの数字(ここでは1~3)に当てはまらない場合に実行されます。 つまり、a=1なら前進、a=2なら右回転、a=3なら左回転、a=4 or 5なら攻撃[1]を実行します。

開発秘話

このアプリは、私にとって初めて開発&公開したスマホアプリです。学生時代の最後の半年ほどを使って開発したのですが、今考えると、最初に取り組むにはいきなり複雑なテーマにしすぎました。GUIでプログラミングする仕組みを考えて実装し、その通りにキャラクターが動くように実装し、キャラクターや技のドット絵も手作りをして、、、と。ゲームをひとつ作るのはものすごく大変なんだな、と改めて感心させられました。

とはいえ、途中で諦めずに公開して本当に良かったなと今では思います。一つやりきったことが自信になりましたし、会ったこともない人からフィードバックをもらったり、アプリの紹介サイトで記事にしていただいたりしたことが、その後のものづくりの原動力になりました。色々な「初めて」を経験することができた、非常に思い出深いアプリです。

本当はプログラミングをやったことがない人が練習できるように、というところから始まったのですが、蓋を開けてみればプログラミングをする人がハマるゲームになってしまいました。研究室の後輩がすごい勢いで全クリしてくれて。笑 PenCodeで遊んでいただいたみなさま、この記事を読んでいただいたあなた、本当にありがとうございました。では。