インフラエンジニアが「ぷよぷよプログラミング」をお触りする

こんんちわ。ますのです。
先日「ぷよぷよプログラミング」なるものを見つけて、ぷよぷよエンジョイ勢としては中身を知る良い機会と興味がわきましたのです。

ちなみに筆者のプログラミング能力は皆無に等しいであります。

  • 業務でプログラミングを触る機会はほぼゼロ
  • メール送信やインストール等の簡単なbatやVBS、Powershell程度をコピペして使う
  • CSS、HTML(※5じゃないよ)を学生時代に少しかじっている

恐らくお仕事でプログラミングする機会はないですが、ちょっとして興味ということで触ってみたであります。

やってみた感想:プログラミング体験をしたい人向けのコンテンツ

やることは「写経=書き写し」ということで、プログラミングのコードをマニュアル通りに入力していく感じでした。
ほぼタイピング練習ですが、回転させる時のx軸、y軸の処理をどうしているかはほんのり感じることが出来ましたね。

立ち位置として「プログラミングは身につかないけど、プログラミングの雰囲気を掴めそう」という感じでしょうか。

入力ミスがある場合は右側のプレビューで次のぷよが出てこない、移動処理が機能しない等すぐに分かるのでバグ確認がしやすかったです。
プログラミング体験をしてみたいっていう人には向いていそうなコンテンツのように感じました。

主にJavaScriptの処理部分を書き写すという仕様のようです。

Monaca Educationに登録する

「ぷよぷよプログラミング」は学習機関のMonaca Educationが提供しています。
まずはMonaca無料アカウントを作成する必要がありました。

「ぷよぷよプログラミング」サポートページ

アカウント作成手順

  1. 画面右上の「アカウント作成」をクリック>メールアドレスとパスワードを入力>「アカウント新規作成」をクリック
  2. メールが届くので「本登録はコチラ」等から本登録用URLにアクセスする
  3. 利用プラン:Freeを選択して登録を完了させる
  4. Monaca Educationのダッシュボードが作成される

ぷよぷよプログラミングの教材をインポートする

ダッシュボード内に、「ぷよぷよプログラミング」の教材が見つからなかったです。
先ほどのMonaca側の登録画面にあるリンクをクリックする必要がありました。
https://edu.monaca.io/puyo

下の方にスクロールすると「ぷよぷよプグラミングに挑戦」という項目があります。
こちらのコースで「~コースを始める」をクリックするとダッシュボード内にインポートが完了します。

初級、中級、上級どれも扱うプログラミングファイルは同じであります!
・初級:一部分だけを書き写し
・中級:動作の重要箇所を書き写し
・上級:プログラムファイルの全てを書き写しというような感じで、書き写す箇所の多さが異なる内容でした。

インポートが完了すると、先ほどのダッシュボードに追加されるので「ぷよぷよプログラミング」>「クラウドIDEで開く」をクリックすることで開始となります。

書き写し用のプログラミングソースコードをダウンロードする

続いて実際に何をやるのか?ということが記載されているソースコードマニュアルをダウンロードします。
  1. セガのぷよぷよプログラミングサイトにアクセスする
    http://puyo.sega.jp/program_2020/
  2. 初級・中級→「ぷよぷよプログラミング 小冊子」をクリックしてダウンロード
    上級→「ぷよぷよプログラミング ソースコード一式」をクリックしてダウンロード

    ※ソースコード一式は完成時の全てのコードが記載されいます。
    ※小冊子は初級、中級で穴抜けとなっている箇所の内容や動作に関する補足が書いてあります。

ソースコードを書き写して動作を確認する

初級、中級者は5つのSESSIONを順にプログラミング処理を書き写していくようになります。

SESSION 1:「ぷよぷよ」が落ちてくる
SESSION 2:「ぷよ」を左右に動かす
SESSION 3:「ぷよ」を回してみよう
SESSION 4:「ぷよ」を消してみよう
SESSION 5:「ぷよ」を変えてみよう

進め方

  1. 左カラムの「player.js」をダブルクリックで開く。
  2. 小冊子の指示箇所の行を確認する。
  3. 小冊子に記載されている通りに書き写していく。
  4. Ctrl + Sで保存すると右側のプレビューで実際に動かすことが出来る。

実際にやってみた結果を貼り付けていきます。

SESSION 1:「ぷよぷよ」が落ちてくる

落ちゲーとして機能しました。
上の境界線を越えたら「ばたんきゅー」の文字が出てゲーム終了までは元のプログラミングで書いてある様子。

 

SESSION 2:「ぷよ」を左右に動かす

想定通り横に動せました。ただ4つ積んでも消えないので積み上げだけ可能な状態。

 

SESSION 3:「ぷよ」を回してみよう
キーボードの「↑」キーを押したら一方向に回転させれましたね。
画面端で回転させてもバグなく、はみ出たぷよも落下する動きが見えます。

 

SESSION 4:「ぷよ」を消してみよう

最後は肝となるぷよ消しの処理。連鎖も問題なく機能しています。一人遊び出来る状態だったので、久しぶりにぷよぷよ遊びしたのでした。
落下先の計算と四方向の確認を入れて判定している処理を、なんとなくですが感じることが出来ました。

SESSION 5:「ぷよ」を変えてみよう

最後は背景を変えたり、ぷよの落下速度を変更したり、config周りを触る処理でした。
ぷよの色を12色にしてみましたが、内部でデータを持たせてないので4種類しか出てこなかったです。
ゲームを魔改造している皆さんは、こういったところでギリギリのラインを調整しながら遊んでいるのだなぁと少し感じた次第であります。

初めてプログラミングでゲームの処理を触ってみましたが、入力ミスばかりでバグが発生しまくりでありました。
学生時代のてぃーちゃーに、「バグが起こったほうが動きの違いが見えて面白いよ」と言われた意味が少しわかったです。インフラエンジニアとしてはこのあたりの処理と無縁でしたが、お仕事じゃなくて趣味として扱うには面白いなぁと感じましたね。
同じ「モノづくり」ではありますが、得られる感覚は全くの別物な印象です。

プログラミングが楽しいと感じるかどうか?というチェックをするには良いコンテンツであると感じました!
特にぷよぷよやテトリスがお好きであれば仕組みが少し見えるので面白いなと。ただ、プログラミング処理についてはさらに踏み込んだり、処理の意味を解読しないと覚えていかないですね。すべての物事に通ずることですが、覚えるのは大変ということで。
最新情報をチェックしよう!