【オンライン講座+作り方解説】ビスケット(Viscuit)でインベーダーゲームを作ろう!インベーダーが侵略してくるやり方解説!

KIDSPROは、オンライン講座を08/18(日)に実施します。
今回は、ビスケット(Viscuit)でインベーダーゲームを作ります。インベーダーが侵略してくるやり方を解説します。

ビスケット(Viscuit)でインベーダーゲームを作ろう!

ビスケット(Viscuit)でインベーダーゲームを作ります。インベーダーが侵略してくるやり方を解説します。

 

日時: 2024/08/18(日)  17:30 ~ 18:30
場所: オンライン講座
対象: KIDSPROスクール生、KIDSPRO eラーニングをご利用の方
必要なもの: ビスケット(Viscuit)をインストールしたタブレット
費用: 無料

初期設定

STEP.1
歯車のマークをタップ
STEP.2
縦横ループをなしに設定する

STEP.3
マス目の設定を右端にする

STEP.4
マス目の設定を右端にする

設定が完了したら、画面右下の決定ボタンをタップする。

キャラクターを描く

キャラクターを描く

以下の9つのキャラクターを描く。

※メガネのプログラム完了後は、右向き矢印を消す。


※メガネのプログラム完了後は、右向き矢印を消す。

※メガネのプログラム完了後に、壁の色を変えてゲームプレイヤーから見えないように変更する。


※メガネのプログラム完了後に、壁の色を変えてゲームプレイヤーから見えないように変更する。

キャラクターをステージに置く

自機(プレイヤー機)を操作するメガネ


1. 左側のメガネには自機、その1マス左にマークを置き、右側のメガネには左側のメガネの自機の位置より1マス左にずらした位置に自機を置く。


2. 左側のメガネには自機、その1マス右にマークを置き、右側のメガネには左側のメガネの自機の位置より1マス右にずらした位置に自機を置く。


3. 左側のメガネには自機、その真上にを置き、右側のメガネに左側のメガネの自機の位置と同じ位置に自機を置き、その1マス上に自機のミサイルを置く。

4. 左側のメガネに自機のミサイルを置き、右側のメガネには左側のメガネのミサイルの位置より1マス上にずらした位置にミサイルを置く。
自機を操作するメガネ

この4つのメガネにより、自機の左右をタップすると自機は左右に動き、自機自体をタップするとミサイルが発射される。

※画面右側の遊ぶボタンをタップして、ゲームモード(拡大モード)にすると、の機能が有効になります。プログラミングモードで画面左上のステージをタップしても、ゲームがリセットされてしまい、の機能は有効になりませんので注意して下さい。

インベーダーが侵略するメガネ


1. 左側のメガネには左移動用エイリアンを置き、右側のメガネには左側のエイリアンの位置より1マス左にずらした位置に左移動用エイリアンを置く。


2. 左側のメガネには左移動用エイリアン、同じ位置に左の壁を置き、右側のメガネには左側のメガネと同じ位置に左の壁を置き、その1マス下に右移動用エイリアンを置く。

3. 左側のメガネには右移動用エイリアンを置き、右側のメガネには左側のエイリアンの位置より1マス右にずらした位置に右移動用エイリアンを置く。

4. 左側のメガネには右移動用エイリアン、同じ位置に右の壁を置き、右側のメガネには左側のメガネと同じ位置に右の壁を置き、その1マス下に左移動用エイリアンを置く。
インベーダーが侵略するメガネ

この4つのメガネにより、左移動用インベーダーは左の壁にぶつかるまで左に動き、左の壁にぶつかると1マス下に動き、右移動用インベーダーに変わる。

右移動用インベーダーは、右の壁にぶつかるまで右に動き、右の壁にぶつかると1マス下に動き、左移動用インベーダーに変わる。

※この4つのメガネにより、インベーダーは左右に動きながら、壁にぶつかると1マス下に移動するようになります。また、プログラム完了後にインベーダー下の矢印を消すとゲームデザインが良くなります。

インベーダーに対する当たり判定のメガネ


1. 左側のメガネには左移動用エイリアン、その真上に自機のミサイルを置き、右側のメガネには左側のエイリアンと同じ位置にエイリアン爆発エフェクトだけを置く。


2. 左側のメガネには左移動用エイリアン、その真上に自機のミサイルを置き、右側のメガネには左側のエイリアンと同じ位置にエイリアン爆発エフェクト、エイリアンのミサイルを1マス下に置く。

3. 左側のメガネには爆発エフェクトを置き、右側のメガネには何も置かない。

4. 左側のメガネにはエイリアンのミサイルを置き、右側のメガネには左側のメガネのミサイルの位置よりも1マス下にミサイルを置く。

5. 左側のメガネには右移動用エイリアン、その真上に自機のミサイルを置き、右側のメガネには左側のエイリアンと同じ位置にエイリアン爆発エフェクトだけを置く。

6. 左側のメガネには右移動用エイリアン、その真上に自機のミサイルを置き、右側のメガネには左側のエイリアンと同じ位置にエイリアン爆発エフェクト、エイリアンのミサイルを1マス下に置く。
インベーダーが侵略するメガネ

この6つのメガネにより、左移動用及び右移動用インベーダーは自機のミサイルにぶつかると、爆発のエフェクトを表示し、エフェクトはすぐに消える。

エイリアンの反撃がないと、ゲームプレイヤーは同じ場所で連打するだけの簡単なゲームになってしまうので、2回の1回の確率でエイリアンは爆発すると同時に反撃のミサイルを発射する。

自機に対する当たり判定のメガネ


1. 左側のメガネには自機、その真上にエイリアンのミサイルを置き、右側のメガネには左側の自機と同じ位置に自機爆発エフェクトを置く。


2. 左側のメガネには自機爆発のエフェクトを置き、右側のメガネにはなにも置かない。

3. 左側のメガネには自機、その真上に左移動用エイリアンを置き、右側のメガネには左側の自機と同じ位置に自機爆発エフェクトを置く。

4. 左側のメガネには自機、その真上に右移動用エイリアンを置き、右側のメガネには左側の自機と同じ位置に自機爆発エフェクトを置く。
インベーダーが侵略するメガネ

この4つのメガネにより、自機はエイリアンのミサイルや左移動用及び右移動用エイリアンにぶつかると、爆発して消える。

ゲームデザインをレベルアップしよう!

STEP.1
キャラクターを書き換える


左移動用及び右移動用エイリアンの矢印を消したり、左右の壁をゲームプレイヤーから見えなくしてみよう。

STEP.2
音符マークで効果音を追加
STEP.3
詳しいやり方は動画をチェック
詳しいやり方は、YouTubeにアップした動画の後半を見てください。
ビスケット(Viscuit)とは?

アニメーション、ゲーム、デジタルえほんなどが作れるビジュアルプログラミング言語です。左側のメガネの条件が成立したら(もし~なら)、右側のメガネの状態になる(~する)というメガネの仕組みを使った、ルールベースのプログラミング言語です。こちらのページからインストールすることができます。