【オンライン講座+作り方解説】Viscuit新機能の連結メガネで作る「得点機能付きワニワニパニック」のチュートリアル公開!

KIDSPROは、2025年6月14日(土)に「Viscuitの新機能で得点機能付きワニワニパニック」オンライン講座を開催します!
今回は、新しくなったViscuitの【メガネ連結】機能を使って、ワニをタップできると★が増える得点機能の仕組みをつくりました!生徒だけでなく、指導用の教材としてもご自由にご利用下さい!

【Viscuit新機能】連結メガネで得点機能付きワニワニパニックをつくろう!

🎉 Viscuitがアップデートされ、メガネを連結して動作を組み合わせる新機能が追加されました!
「メガネの連結機能」により、これまで以上に複雑な動作がシンプルに作れるようになりました。
今回のオンライン講座やチュートリアル動画では、Viscuit初心者の方でも楽しみながら「得点機能付きワニワニパニック」を一緒に作っていける構成となっています。

 

🔍 講座やチュートリアル動画で学べること

Viscuit新機能:メガネ連結の使い方

ランダムにワニが巣から顔を出すメガネの作り方

ワニをタップするとイテと言い、★が増えるメガネの作り方

ゲームクリアのメガネの作り方

 

📅 開催日:2025年6月14日(土)
🕔 時 間:各日 17:30 ~ 18:30
💻 開催形式:オンライン(Zoom予定)
🎓 対 象:KIDSPROスクール生、およびeラーニング受講者の方
📱 準備物:Viscuitをインストールしたタブレット端末
💰 参加費:無料

📺 チャプター目次 :
00:00 はじめに(これから作成するワニワニパニックの説明)
00:12 初期設定(歯車ボタン)
00:24 必要なキャラクターを描く

00:59 ステージにキャラクターを配置
01:38 ワニが巣から顔を出すメガネの作り方
05:09 ワニをタップするとイテと言い、★が増えるメガネの作り方

09:04 ゲームクリアのメガネの作り方
09:59 まとめ

初期設定

STEP.1
歯車マークをタップして設定画面を開く
STEP.2
方眼紙の設定を「あり」にする
STEP.3
設定完了

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

キャラクターを描く

キャラクターを描く

以下の7個のキャラクターを描く。

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

STEP.1
ワニワニパニック用のキャラクターを置く

☑️普通のワニ4対を配置
☑️普通のワニの上に巣を配置
☑️グレーを左側、赤を右側に配置(※グレート赤の◀は同じ行に配置して下さい)

STEP.2
キャラクター設置の拡大画面

ワニが巣からランダムに顔を出すプログラム

STEP.1
巣からワニが顔を出すメガネを作る
STEP.2
顔を出したワニが巣に戻るメガネを作る

※顔を出したワニが巣に戻るメガネを作ることにより、ワニが巣から出たり入ったりするようになります。
STEP.3
ワニが巣にとどまるメガネを作る

※ワニが巣にとどまるメガネを作ることにより、ワニが巣からランダムに出てくるようになります。

👇️その理由は


※Viscuitでは、左側の条件が同じメガネが複数ある場合、その中のいずれか1つがランダムに実行されます。上図の2つのメガネのように設定すると、ワニが巣にとどまる場合もあれば、顔を出す場合もあり、結果的にワニがランダムに巣から顔を出すようになります。

STEP.4
巣から顔を出したワニが、そこにとどまるメガネを作る
※巣から顔を出したワニがその場にとどまるようにするメガネを作ることで、ワニがすぐに巣に戻る場合もあれば、少しとどまってから戻る場合もあるようになります。

👇️その理由は


※Viscuitでは、左側の条件が同じメガネが複数ある場合、その中のいずれか1つがランダムに実行されます。上図の2つのメガネのように設定すると、ワニが巣にすぐに戻る場合もあれば、少ししてから巣に戻る場合もあり、結果としてワニが巣から顔を出している時間にばらつきが出るようになります。ここではゲームの難易度を調整しています。

STEP.5
ワニが巣からランダムに顔を出すプログラム完成

ワニをタップするとイテと言い、★が増えるプログラム

ワニをタップしたら悲しい顔でイテと言うプログラム

STEP.1
巣から顔を出したワニをタップしたらという条件のメガネを作る
STEP.2
STEP.1で作った条件が成立したら、ワニがイテと言うメガネを作る

※このメガネにより、巣から顔を出したワニをタップすると、ワニが悲しい顔のワニになり、イテと言う吹き出し文字が表示されます。
※タップの機能は、画面右側の遊ぶボタン(拡大ボタン)をタップして拡大画面(あそぶ画面)に切り替えないと有効になりません。ご注意ください。
STEP.3
悲しい顔のワニが巣に戻るメガネを作る

※巣から顔を出したワニをタップして、悲しい顔+イテという吹き出し文字になったとき、ワニは巣に戻るようになります。
Viscuit新機能:めがねを連結するやり方
STEP.1
メガネの矢印部分をタップ
STEP.2
設定画面が開いたら両メガネをタップ

※連結するメガネは、「片メガネ」か「両メガネ」
STEP.3
両めがねが追加されたら決定ボタンをタップ

※両メガネが追加されたら設定画面左下の決定ボタンをタップする。
STEP.4
メガネが連結される!

ワニをタップしたら◀の左に★が現れるプログラムに修正する

STEP.1
ワニをタップしたらイテというメガネに両メガネを連結する
STEP.2
連結メガネを使って、グレー◀の横に★が現れるように設定する

※メガネを連結することで、巣から顔を出したワニをタップすると、ステージ上の◀が◀に変わるようになります。このとき、◀の位置が左に1マスずれるように設定されているため、ワニをタップするたびにが1つ増えます。その結果、ワニをタップできた回数との数が一致します。
STEP.3
ワニをタップしたら◀の左に★が現れるメガネの完成

ゲームクリアのプログラム

STEP.1
ワニを8匹タップしたらゲームクリアにしよう!

※ワニをタップすると、◀の位置にが現れ◀は左に1マスずれるので、本ゲームの設定では8匹タップして◀が8マス右にずれると◀はの隣に位置に移動します。このことを利用して、STEP.2でクリアのプログラムを作ります。
STEP.2
◀がの隣まで移動したらクリアを表示するメガネを作る
STEP.3
ゲームクリアのメガネの完成
ビスケット(Viscuit)とは?

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