今回つくるゲーム
難易度
今回つくるゲームは、もぐらたたきゲームです。
ここではもぐらのかわりに、このサイトのキャラクター”ビンゴおじさん”を叩くゲームを作ります。
緑の旗をクリックすると、ゲームがはじまります。出てきたおじさんを叩く(クリックする)と5ポイント入ります。
とても簡単なゲームですがこれからスクラッチをはじめるひとは、まずこちらからチャレンジしてみてください。
ゲームをつくる準備
まず、こちらのサイトにアクセスしてください。
始めやすいように素材を準備しています。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-15.38.27-1.png?resize=838%2C515)
このようなページになると思います
(サインインしていない人は、右上のボタンよりサインインしてください。)
右上の緑色のリミックスボタンを押してください。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-15.49.07-1.png?resize=840%2C461)
すでに”おじさん1”というスプライトが準備されています。
ためしに、コスチュームのタブをクリックしてください。
ゲームを作るのに必要な素材が一式そろっているのがわかります。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-16.40.38.png?resize=837%2C458)
素材の使い方は後から説明するのでまずはコスチューム5を選択して、コードのタブに戻ってください。これからゲームを作っていきます
おじさんをいっぱい作る
まずはウォーミングアップです。
モグラたたきゲームといえば、いろいろな場所からもぐらが出てくるのが特徴です。
以下のように”旗が押されたとき”、”どこかの場所へ行く”という指示を作ってください。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-17.00.20-2.png?resize=598%2C560)
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-17.00.37-1.png?resize=598%2C560)
緑色の旗を押してみてください。いろいろな場所にビンゴおじさんが現れるのがわかります。
しかし、この状態では1人のビンゴおじさんをいろいろな場所に表示しているだけなので、ゲームを作るためにはビンゴおじさんを何人も作る必要があります。
そこで使うのがクローンのブロックです。
まずは作ったブロックを一度捨てます。捨てるときはブロックをドラッグして左のエリアにもっていくと捨てられます
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-17.26.20.png?resize=276%2C102)
それではクローンを作っていきます。
さきほどと同じ要領でブロックを組んでいきます。
“旗が押されたとき”、”自分自身のクローンをつくる”
”クローンされたとき”、”どこかの場所へ行く”
というように指示を作ってください。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-17.34.10.png?resize=583%2C514)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-17.34.50.png?resize=583%2C514)
緑色の旗を押してみてください。自分と自分のクローンの二人表示されます。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-17.44.35.png?resize=838%2C436)
このクローンを、ゲームで登場させるおじさんの数だけつくります。
まずは10人作りましょう。そこで使うのが繰り返しのブロックです。
下のように”自分自身のクローンを作る”を”10回繰り返す”ではさみます
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-18.05.17.png?resize=838%2C436)
緑の旗を押すと、自分の他に10人のクローンが表示されるのがわかります。
数字の10の部分の数字をいろいろ変えてみてください。おじさんの数が変わるのがわかります。
次からは10人のおじさんが順番に出てくる動きを作っていきます。
順番に出てくる動きを作る
もぐらたたきゲームといえば、次々ともぐらが出てきてますのでまずその動きを作りましょう。
いまは10人のおじさんが同時に出てきてしまっていますので、2秒おきに出てくるようにします。
”1秒待つ”のブロックを”自分自身のクローンを作る”の下に持ってくる。
旗を押すと2秒ごとにおじさんが出現するのがわかります。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-18.22.36.png?resize=838%2C437)
このままではおじさんが出っぱなしなので、出てきて1秒でひっこめるようにします。
”どこかの場所へ行く”の下に”1秒待つ”、”隠す”という指示を追加します。
旗を押すと順番に出てきては消えていく動きになったのがわかります。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-18.32.24.png?resize=1024%2C535)
ここでお気づきのとおり、1人ずっといるおじさんがいます。これは自分自身です。この自分自身はゲームでは邪魔なので隠してしまいましょう。
”旗が押されたとき”の下に”隠す”の指示を追加してください。
このままではクローンも隠れたままになるので
”クローンされたとき”の下に”表示する”の指示も追加します。
旗を押してみてください。だんだんともぐらたたきゲームっぽくなってきました。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-18.39.40.png?resize=1024%2C535)
おじさんが出てくる動きはこれでもいいのですが、もう少しひょっこり出すようにしたいですね。
つぎはこのひょっこり出てくる動きをコスチュームを使うことで表現していきます。
ひょっこりした動きを作る
ひょっこりした動きをつくるためにコスチュームを使います。
コスチュームのタブを押してください。コスチューム1〜5とばくはつがあるのがわかります
コスチューム1〜5は順番にクリックして見るとおじさんがひょっこり出てきているように見えます。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-18.50.12.png?resize=1024%2C535)
この動きをコードで再現しましょう。
コードのタブにもどって、クローンの指示に”コスチュームをばくはつにする”を5回追加します。
▼ボタンを押すとコスチュームを変更できるので、コスチューム1〜5を順番に表示するように変更しましょう。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.06.31.png?resize=716%2C751)
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-18.55.33-1.png?resize=303%2C394)
次にそれぞれのコスチュームの間に”1秒待つ”を入れていきます。
旗を押すとコスチュームが変わりながら出てくるのが分かります
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.17.13.png?resize=1024%2C538)
しかし、まだ「ひょっこり」という感じではないので、コスチュームが変化するスピードを変えます。
”1秒待つ”のところを“0.1秒待つ”に変えてみてください。最後だけは”1秒待つ”のままにしておきましょう。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.26.09.png?resize=256%2C367)
旗を押してみてください、だいぶもぐらたたきゲームっぽくなってきたと思います。
次は背景に畑を描いて、もっとゲームっぽくしていきましょう。
背景を作る
背景を作るには、右下の”背景を選ぶ”にカーソルをあわせ、下から三つ目の”描く”をクリックします。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.31.50.png?resize=1024%2C553)
そうすると、自分で背景が描けるようになります。下の図の赤枠の部分が実際にゲームの背景に使われる場所になります。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.38.48.png?resize=403%2C331)
次に塗りつぶしの色を設定していきます。畑なので茶色にしましょう。
塗りつぶしの横の▼ボタンをを押すとパレットが表示されます。
色10、鮮やかさ70、明るさ70
に設定してみましょう
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.43.35-1.png?w=1256)
つぎに四角のツールを使って地面を描きます。左上からはじめて、ぐーっとひっぱると地面が描けます。
さきほどの赤枠の範囲内が塗りつぶされていれば大丈夫です。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.44.20.png?resize=403%2C331)
このままでは畑っぽくないので、すこし地面にデコボコをつけていきます。
筆マークを選んで、塗りつぶしの色を
色10、鮮やかさ70、明るさ50
に設定してください
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.45.05.png?resize=941%2C775)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.45.26.png?resize=941%2C775)
マウスをドラッグしながら適当に地面に線を描いていきます。畑っぽくなってきたと思います。
同様に、色を
色30、鮮やかさ70、明るさ50
に変えて、草を描いていくと、さらに畑っぽさが出ます。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.47.48-1.png?resize=941%2C775)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.49.07.png?resize=941%2C775)
では、緑の旗を押してみましょう、おじさんが畑からひょっこり出てくる感じが出ましたね。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-19.49.55.png?resize=1024%2C553)
次に、おじさんをたたく動きをつくっていきます。
おじさんを叩いたときの動きを作る
まずおじさんのスプライトに戻ります。おじさん1のスプライトをクリックし、コードを選択してください。元の画面に戻ります。
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-23.21.46.png?resize=1024%2C558)
おじさんをたたいたときに、おじさんを爆発させます。
おじさんをたたいたとき、というのは”スプライトが押されたとき”というブロックを使います
そしてスプライトが押されたときにおじさんの動きを止めます。
そのために”スプライトの他のスクリプトを止める”というブロックをつなげていきます
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-20.29.19.png?resize=873%2C550)
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-20.29.48.png?resize=873%2C550)
そして、おじさんのコスチュームを”ばくはつ”に変えます。コスチュームを変えることで、あたかも押されたときに爆発しているように見えます。そのままだと爆発したままになってしまうので、0.2秒待って隠します。つまり、
”コスチュームをばくはつにする”、”0.2秒待つ”、”隠す”
の順番でコードを組んでいきます。
クリックして爆発したら成功です。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-20.32.27-2.png?resize=875%2C563)
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-20.32.58-1.png?resize=519%2C489)
あとはスコアをつくって一旦完成です
スコアを作成する
ゲームなので、スコアが出るようにしましょう。
スコアを表示するために変数を使います。
”変数を作る”ボタンを押すと、新しい変数をつくるポップアップが出てくるので、そこに「スコア」と文字を入力しましょう。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-23.46.31.png?resize=684%2C551)
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-23.47.03-1.png?resize=354%2C329)
OKを押すと下のようになり、スコアの変数が追加され、画面左上にスコアの表示が追加されているのがわかります。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.07.21.png?resize=1024%2C560)
次に、おじさんを1回たたく度にスコアが増えていくようにします。今回は1回たたくと5ポイント入ることにします。”コスチュームをばくはつにする”の下に”スコアを5ずつ変える”のブロックを追加します。(デフォルトが1なのでそれを5に変更してください)
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.14.18.png?resize=1024%2C560)
旗を押してゲームを開始してください。おじさんをたたいたら爆発して5点づつスコアがあがっていくと成功です。
しかし、今のままでは1回ゲームが終わってもう一度、旗を押してゲームを再開すると、前のスコアから始まってしまいます。毎回0ポイントから始めるために、
”旗が押されたとき”の下に”スコアを0にする”のブロックを追加します。
![](https://i1.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.25.05.png?resize=679%2C490)
これで一旦完成です!おめでとうございます!
出てくるおじさんの数を増やしたり、出てくる間隔を短くしたり、出てきてからひっこむまでの時間を短くするなど工夫をしてみてください。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.45.15.png?resize=605%2C499)
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.44.50.png?resize=605%2C499)
みんなに共有しよう
ここまでできたら立派なゲームです。スクラッチを楽しむためにはみんなにどんどん共有していきましょう。まず画面上部にある”プロジェクトページを見る”をクリックしてください
![](https://i2.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-27-23.54.04.png?resize=1024%2C555)
そうすると、”共有する”ボタンが出てきますので、タイトルや使い方、メモなどを編集して共有しましょう。
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.37.55-1.png?resize=1024%2C564)
共有すると、リンクがつくれるようになります。このリンクを友達に共有して遊んでもらったり、スマホでリンクを開いて、スマホでゲームを楽しむことができるようになります
![](https://i0.wp.com/bingo-ojisan.xyz/wp-content/uploads/2021/06/スクリーンショット-2021-06-28-0.39.08.png?resize=1024%2C564)
今回は、ここまでです。
次の記事では、時間制限を設定したり、スタートボタンを作るなど、よりゲームっぽくしていきます。
もぐらたたきゲームの作り方(中級−1)