タブレットで横スクロールアクションゲームを作ろう①
タブレットを使ってScratchでプログラミングをしてみましょう!
キーボードがなくても大丈夫!
iPadなどのタブレットがあれば、プログラミングできますので、小学生のお子さんでもどなたでも作れちゃいますよ👍
今回は、スクラッチで横スクロール型のアクションゲームを作っていきたいと思います。
まずはSafariなどのブラウザでScratchのホームページにアクセスしましょう。
※このブログではiPadを使用した画面で説明をしています。
スクラッチの説明やアカウントの登録方法については、
マジラボYoutubeを参考にしてくださいね。
今回の目標は、
・背景を設定する
・キャラクターを表示して動かす
の2つです。
さっそくやってみましょう!
まずはスクラッチのホーム画面から、「作る」をタップ。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image1-1024x179.jpg)
はじめに背景を設定してみましょう。
画面右下の「背景を選ぶ」ボタンをタップ。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image2-1024x681.jpg)
「宇宙」のジャンルの中から「Stars」を選択。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image3-1024x677.jpg)
背景の設定ができました!
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image4_2-1024x679.jpg)
つぎにキャラクターを表示します。
今回はネコは使わないのでゴミ箱ボタンで削除しておきましょう。
新しくキャラクターのスプライトを追加します。
右下の「スプライトを選ぶ」ボタンをタップ。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image5_2-1024x686.jpg)
スプライトの「人」のジャンルの中から「Ripley」を選択。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image6-1024x620.jpg)
このままだと少し大きいので、「大きさ」を50に変更します。
数字の入力は、iPadキーボードの「.?123」キーを押すと入力しやすいです。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image7-1024x677.jpg)
つづいて移動用のボタンを配置します。
右下の「スプライトを選ぶ」ボタンから「Button1」を選択したら、
画面の左側あたりに配置。
ボタンの「大きさ」も50に変更するのを忘れずに!
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image8-1024x461.jpg)
他にボタンをあと2つ作りたいので、
Button1のスプライトを長押しして「複製」をタップ。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image9-1024x675.jpg)
同様にしてボタンを3つ並べよう。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image10-1024x661.jpg)
わかりやすいように、ボタンの名前を変更しておきましょう。
上のボタンから順番に「上ボタン」「中ボタン」「下ボタン」にしましょう。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image11-1024x327.jpg)
ボタンの配置ができました!
しかしまだボタンを押しても何も動きません。
ボタンを押したらキャラクターが動くようにしましょう。
スプライトから「上ボタン」を選択。
「イベント」から「このスプライトが押されたとき」のブロックと、
「メッセージ1を送る」のブロックを配置。
メッセージ1をクリックし、「新しいメッセージ」をタップ。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image12_2-1024x701.jpg)
「新しいメッセージ名」に「上にいく」と入力し、OKボタンをタップ。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image13-1024x500.jpg)
これで上ボタンのプログラムはOKです。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image14-1024x743.jpg)
同様に中ボタン、下ボタンのプログラムも作成してください。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image15-1024x753.jpg)
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image16-1024x746.jpg)
つづいて、キャラクターのプログラムを作ります。
スプライトから「Ripley」を選択。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image17-1024x746.jpg)
左側のブロックリストから次のように配置していきます。
「イベント」の「○○を受け取ったとき」のブロックを配置。
メッセージを「上にいく」に変更。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image18-1024x631.jpg)
その下に、「動き」の「x座標を○、y座標を○にする」のブロックを配置
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image19-1024x630.jpg)
x座標の数値を-125、y座標の数値を140に変更します。
その下に、「音」の「popの音を鳴らす」のブロックを配置。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image20-1024x634.jpg)
これで上にいくボタンが押されたときのプログラムができました。
これをコピーして、残りのプログラムもつくります。
一番上の「上にいくを受け取ったとき」のブロックを長押しして、複製します。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image21-1024x632.jpg)
複製したブロックのメッセージを「中にいく」に変更。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image22-1024x633.jpg)
y座標の数値を10に変更します。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image23-1024x633.jpg)
同じように複製して、メッセージを「下にいく」、y座標の数値を-125にします。
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image24-1024x631.jpg)
これでキャラクターの動きが完成しました!
ためしにそれぞれのボタンを押して、キャラクターが動くか確認してみてくださいね!
![](https://magilabo.com/blog/wp-content/uploads/2022/01/image25.jpg)
次回は敵(いんせき)を作っていきたいと思います!