見出し画像

ばよえ〜ん！『ぷよぷよプログラミング』の遊び方

オリカ

あの落ち物パズルで超有名な『ぷよぷよ』
ハマった方も多いのではないでしょうか？

この『ぷよぷよ』を使ってプログラミングのお勉強ができます！

画像1

昔、ハマったわ〜〜　「ファイヤー」


SEGA 『ぷよぷよプログラミング』

先日、SEGAのニュースリリースで

『Monaca Education』を使用して『ぷよぷよ』をプログラミング教材として無償提供するとありました。（2020年6月26日より）

概要的なことは以下の記事を書きましたので、こちらをご覧ください。

学べる言語は以下のweb系言語です。

・HTML5
・CSS
・Javascript

記事を読むのが面倒という方もいらっしゃるかもしれませんので、
準備部分を以下にかんたんに説明します。


「ぷよぷよプログラミング」で遊ぶための準備

遊ぶためには、以下の準備をしてください。

・PC（以下のwebブラウザが入っていたらOSは何でも可）

・webブラウザ（Chrome　か　Microsoft Edge。IEは不可）

・メールアドレス

・ネット環境

・『Monaca Education』のアカウントを作る
　（こちらのサイトに詳しい手順が載っています。）

・「ぷよぷよプログラミング」公式サイトよりテキスト類をダウンロード
　（上のサイトからもダウンロードできます）

・iPhone、iPad、Android上で遊びたい場合は『Monaca for Study』をインストール


さあ、「ぷよぷよプログラミング」始めましょう！

準備が整いましたら、早速『Monaca Education』にログインしましょう！


ログインしましたら、以下のサイトの「ぷよぷよプログラミングに挑戦」にある「初級コースを始める」ボタンを押して教材を取り込みます。


取り込むと↓のような画面になります。（下画像は全レベルを取り込んでいます）

画像2


レベルは３種類あります。

・初級（ベースがあり、抜け部分を写経）
・中級（ベースがあり、抜け部分を写経）
・上級（フルスクラッチ）

初級と中級は、ほぼ出来ているプログラミングソースが用意されています。
ポイントポイントで抜けがあるので、そこを埋めていきます。（写経）

抜け量の違いが初級と中級の差です。（あと背景画像の色が違います）

上級は必要なファイルは用意されていますが、中身は白紙です。
ここに好きなようにプログラミングしていきます。
公式ページではサンプルコードも用意されています。


『ぷよぷよプログラミング」初級をやってみる

まずは「初級」をひらいてみます。
左側のプロジェクト一覧より、「ぷよぷよプログラミング初級」を選択し、
右の画面の「クラウドIDEで開く」ボタンを押します。

画像3

開くと、コードが開きます。

画像4

画面左にファイル一覧
中央にソースコード（この部分にコードを追加していきます）
右部分にプレビュー画面


どこの部分にどんなコードを入力するか、「ぷよぷよプログラミング」小冊子をみて埋めていきます。

画像5


ステップに沿ってコードを埋めていきます。

・ぷよを落とす
・ぷよを左右移動できるようにする
・ぷよを回転させる
・ぷよを消す

ぷよぷよの基本部分ですね！

そしてコード変更したところは、ファイル保存と同時に右のプレビューに反映されます。
変更された動きをすぐに見ることができます。
じょじょに出来上がっていくのをみるのも楽しいものです。


画像6

ぷよが落ちてきた！！

画像7

移動回転できない、積み上がっていくだけ…。ばたんきゅー。


また、『Monaca for Study』アプリと連携するとスマホ上でも実行することが出来ます。（ソースコードをいじることはできません）

画像8


画像9

画像10


『ぷよぷよプログラミング』いろいろいじってみた

基本的な動作部分は、冊子に書いてある通りに書けば
ゲームとして動かすことができます。

その他、画像を変えたり、大きさを変えたり、スピードを変えたりすることができます。

例えば、ステージの大きさを変えてみる

画像11

広っ！いつまでたっても、終わりそうにないです…。


例えば、「ぷよぷよ」なのにキャラクター変えてみる

画像12

アイコン画像をそのままアップロードして使っているので、見栄えは良くないですが……。


『ぷよぷよプログラミング』遊び方　まとめ


「ぷよぷよプログラミング」は誰でも無料でおこなうことができます。

ただ、こちらだけではweb言語をマスターするというのは難しいと思います。
別途書籍など必要です。


まずは、ひたすら指示通りにコードを写経して実際ゲームが動くことを体験してみましょう。

その後から、どんな命令をしているのか見ていくととても勉強になります。

ゲームってこんな感じで作られているんですね。

ぜひ、試してみてください！！

©SEGA ©Asial Corporation


プログラミングに興味を持った方は、次の記事もおすすめ


この記事が気に入ったらサポートをしてみませんか？