【スクラッチ】バンクシー風シュレッダーの作り方

2022年5月14日土曜日

Scratch スクラッチ プログラミング

t f B! P L




【スクラッチプログラミング】バンクシー風シュレッダーの作り方





スクラッチでバンクシー風のシュレッダーを作りました。
動画は15分ほどなのでぜひ見てください。^^


スクラッチのプロジェクトは↓です。



簡単な動作をするプログラミングですが、スプライトの表示順を意識して作品を作る練習になればと思って作りました。


動画で説明した作り方をこちらでも簡単に解説します。




背景を作る


今回「描く」で新規に作った背景はこちらです。






額縁の下地の3つが描かれています。


どんな絵でも構いません。
ボタンを台の上に乗せないのであれば台は必要ありませんし、額縁の下地も必要なければ描かなくても大丈夫です。

壁は今回は上下のグラデーションとシンプルなものにしましたが、ベクターの複雑なものやビットマップ画像のものでも構いません。





スプライトを描く


作成するスプライトは、「絵」「額縁」「シュレッダー」「ボタン」「ハンマー」の5つです。
全て「描く」で新規作成しています。






「絵」を描く




どんな絵でも構いません。
今回はバンクシーの絵に似せてみました。


風船の本体部分は「Heart Red」を編集しました。




風船のヒモ部分は、「Balloon1-a」のヒモ部分だけ取り出して編集しました。




人物は、「Goblin-b」を全選択して真っ黒にし、枠線を白にしました。
口は消しています。





座標は(x=0,Y=0)にして表示位置が合うようにしてください。




「額縁」を描く




「絵」のサイズに合わせて額縁部分を作ります。

今回は枠線だけの四角を2つ合わせただけです。

「額縁」もデザインは何でもOKです。


座標は(x=0,Y=0)にして表示位置が合うようにしてください。



「シュレッダー」を描く




「背景」の絵が出てくる部分を加工します。





今回は「背景」の壁部分だけを「シュレッダー」スプライトにコピーし、「消しゴム」で切り抜き部分を残して他の部分を消しました。





座標は(x=0,Y=0)にして表示位置が合うようにしてください。





「ボタン」を描く





今回は「Button1」を編集しました。



デザインは何でも構いません。

表示位置は「背景」の台の位置に合わせました。




「ハンマー」を描く





「四角形」ツールを使ってそれっぽく描きました。
プログラムでハンマーを動かしていますが、無くても動きます。

大きさを「ボタン」に合わせて描いておきます。
(座標はプログラムで調整します)





スプライトの表示順番をプログラミングする


スプライトの表示順は、
手前から、「額縁」> 「シュレッダー」 > 「絵」 になるようにします。





それとは別で、「ハンマー」 > 「ボタン」 となるようにします。





「絵」のコード





「額縁」のコード




「額縁」のコードはこれだけです。


「シュレッダー」のコード




「シュレッダー」のコードはこれだけです。


「ハンマー」のコード






シュレッダーを動かすコードを作る


作成するグローバル変数


「ハンマー」(初期値=OFF)



「背景」のコード




「背景」のコードはこれだけです。



「ボタン」のコード




「ボタン」をマウスでクリックするか、キーボードのどれかのキーを押すと「ハンマー」変数 ”ON” になります。

マウスを離すか、キーボードのボタンが離されたときに ”RELEASE” になります。


「ボタン」のコードはこれで完成です。



「絵」のコード





シュレッダーを動かす前の「絵」の座標は(X=0、Y=0)です。

「絵」が止まっているときにマウスかキーが押されたとき、「絵」が最初の位置(Y=0)でなければ最初の位置(X=0、Y=0)に戻します。


「ハンマー」変数”ON” もしくは ”RELEASE” になったら、「絵」を1ずつ下に移動させます。
回数指定の繰り返しを使って、丁度いいところまで下がるようにします。
(今回は85回にしました)

移動が終わったら「ハンマー」変数”OFF” に戻しておきます。




「ハンマー」のコード





「ハンマー」変数”ON” のときは「ボタン」の上に座標を移動させて表示をONにします。

「ハンマー」変数”RELEASE” になると、0.1秒でハンマーを画面端へ移動させて表示をOFFにします。

「ハンマー」変数”OFF” の間は表示はOFFにしておきます。


これで、「ボタン」が押されると「ハンマー」がボタンの上に乗り、離すと画面端まで移動して消えるようになりました。


「ハンマー」のコードはこれで完成です。


「ハンマー」を作らなかった場合、このコードは必要ありません。





音をつける


「絵」スプライトに追加するサウンド


「Muted Conga」:ボタンが叩かれたときの音
「Machine」:シュレッダーが起動するときの音
「Sewing Machine」:シュレッダーが動作しているときの音



「絵」のコード





「ボタン」が押されると、

「Muted Conga」→「Machine」→「Sewing Machine」
の順番で音を鳴らします。


「絵」の移動が終わったら全ての音を止めます



これで完成です。



短いプログラミングなので是非プロジェクトを覗いてみてください。

プレイはこちら↓


他の作品記事もよければ読んでみてください。


このブログを検索

ブログをよくする

自己紹介

自分の写真
はじめまして。はるはるです。 中2の息子と小5の娘を抱える2児の父です。今はゲーム会社で働いています。 子供のプログラミング学習に協力できるように教え方を勉強中です。 このブログでは簡単なゲームを作りながら自分が学んだことを少しずつ共有していきます。 情報処理の試験をたまに受けます。 第二種情報処理技術者 ソフトウェア開発技術者 基本情報処理技術者 応用情報処理技術者 twitter: https://twitter.com/amaruchan007

連絡フォーム

名前

メール *

メッセージ *

QooQ