前回は、最後までクイズをできるようにしました。
今回は、クイズ終了に結果を発表したり、ステージの設定やスプライトの位置の調整、BGMの設定など、細部を整えてゲームらしさをアップさせて、４択クイズを完成させます。
前回の記事はこちら：⑤問題を連続して出題しよう
４択クイズを作ろう トップ記事はこちら：Scratchで４択クイズを作ろうトップ記事
解説の画像が見づらい時は、画像をクリックして拡大して見てね！
バグ修正
ごめんなさい！
前回のプログラムでバグがありました。
まずは、バグの内容と原因を整理して、このバグの修正からやっていきます。
バグ内容
2回目をプレイすると、1問目のクイズを読んでいる間でも、選択肢をクリックすると回答できてしまいます。
問題文を読み終わったら回答できるようになっていないといけません。
原因
このバグの原因は、「状態」変数を初期化していないためです。
クイズの最後の問題を答えたときに、状態は「回答中」になっています。そのままゲームが終了するため、そのままゲームを実行すると、状態が「回答中」のままなので、選択肢をクリックして回答できてしまうのです。
修正
ゲーム開始時に「状態」変数に「出題中」を設定するように修正します。
①「背景1」をクリックしましょう。
②変数の中の『変数▼を0にする』ブロックをドラッグして、『緑の旗が押されたとき』ブロックの下にくっつけましょう。
③「変数▼」の部分を「状態」に変更して、「0」の部分に「出題中」を入力しましょう。
これで、バグの修正は完了です。
クイズの結果を表示する
クイズの結果は、問題を読むスプライトに「3問正解でした！」のように、正解数を言ってもらうようにします。
正解数を数える
正解数を数える必要があるため、「正解数」という変数を作って正解したらカウントアップするようにしていきます。
変数の中の『変数を作る』をクリックし、変数名に「正解数」と入力して「すべてのスプライト用」を選択して「OK」をクリックしましょう。
正解したら正解数をカウントアップするようにプログラムを作っていきます。
①「背景1」をクリックしましょう。
②『正誤判定』定義の処理の中の『正解▼を送る』ブロックの下に、変数の中の『変数▼を1ずつ変える』ブロックをくっつけましょう。
③「変数▼」の部分を「正解数」に変更しましょう。
このままだと、繰り返しゲームをしたときに正解数を正しく数えられなくなるので、ゲームを開始したときに正解数をリセットします。
①変数の中の『変数▼を0にする』ブロックを、『緑の旗が押されたとき』ブロックの下にくっつけましょう。
②「変数▼」の部分を「正解数」に変更しましょう。
これで、正解数を数えられるようになりました。
正解数を言う
クイズが全て終わったら正解数を言うようにしていきます。
①問題を読むスプライトをクリックしましょう。
②イベントの中の『メッセージ▼を受け取ったとき』ブロックをドラッグしましょう。
③「メッセージ▼」の部分を「結果発表」に変更しましょう。
①見た目の中の『こんにちは！と言う』ブロックをドラッグして、『結果発表▼を受け取ったとき』ブロックの下にくっつけましょう。
②演算の中の『りんごとバナナ』ブロックを、「こんにちは！」の部分にはめ込みましょう。
③『りんごとバナナ』ブロックを『正解数と問正解でした！』となるように変更しましょう。
これで、クイズの結果をスプライトが言うようになりました。
これで、４択クイズのゲーム部分は完成です！
細部を整える
ゲーム部分は完成しましたが、スプライトが適当に置かれていたり、背景も真っ白のままなので、見た目が良くありませんね。
ここからは、見た目を整えたり、BGMを追加したりしてゲームらしさをアップしていきます。
記事の通りにしなくても大丈夫です。できる人は自由にゲームの見た目やBGMを変更してみて、オリジナルにアレンジしてみてください。
背景を追加する
背景が真っ白なので、背景を設定しています。
①「背景1」をクリックしましょう。
②左上から「背景」タブをクリックしましょう。
③「背景を選ぶ」をクリックしましょう。
好きな背景を選びましょう。
この記事では、「Spotlight」を選択します。
少し背景を上にずらして、背景の床が見えるようにします。
自由に背景を編集してみてください。このままでも大丈夫です。
これで、背景ができたので見た目が良くなりました。
スプライトの位置を調整する
今はスプライトを適当に置いているため、ゲーム画面がごちゃごちゃしています。
いい感じになるように置きなおしていきましょう。
位置の調整
まずは、問題を読むスプライトの位置を調整します。
ゲーム画面のスプライトをドラッグして、いい感じの位置に移動させましょう。
向きや大きさなども、必要に応じて変更していきましょう。
同じようにねこのスプライトも移動させましょう。
選択肢をわかりやすくする
クイズに答えるときに、スプライトをクリックすれば答えることができますが、初めてプレイする場合はちょっとわかりにくいかもしれません。
また、スプライトでなく変数をクリックしてしまうと反応しないため、クリックしてほしい場所をわかりやすくします。
選択肢のスプライトに丸ボタンを付けて、クリックしてほしい場所をわかりやすくします。
選択肢のスプライトの「コスチューム」をクリックしましょう。
丸とテキストを追加して、クリックしてほしい場所をわかりやすくしましょう。
１つできたら、ほかの選択肢も同じようにしましょう。
ねこに考えさせる
ねこのスプライトを配置していますが、今は何もプログラムしていないため、何もしません。
消してしまってもいいのですが、せっかくなのでクイズを出題したら考えてもらうことにします。
①ねこのスプライトをクリックしましょう。
②イベントの中の『メッセージ▼を受け取ったとき』ブロックをドラッグして、『出題▼を受け取ったとき』にしましょう。
③見た目の中の『うーん…と考える』ブロックをくっつけましょう。
ねこの吹き出しとクイズの吹き出しが重なってしまうかもしれません。
重なってしまったらスプライト移動させて調整しましょう。
これで、「うーん…」と考えてくれるようになりました。
ねこに考えるのをやめさせる
このままだと、ねこがずっと考えてしまうので、選択肢を選んだら考えるのをやめさせましょう。
今のプログラムは、選択肢を選んだら「ステージ」にある、『正誤判定』定義が呼び出されて実行されるようになっています。
なので、『正誤判定』定義の中で、「回答済み」という新しいメッセージを送るようにします。
このメッセージを受け取ったときに、ねこが考えるのをやめるようにします。
①「ステージ」をクリックしましょう。
②イベントの中の『メッセージ▼を送る』ブロックをドラッグして、『正誤判定』定義の下にくっつけましょう。
③「メッセージ▼」の部分には「回答済み」という新しいメッセージを作って設定しましょう。
次にメッセージを受け取るプログラムを作ります。
①ねこのスプライトをクリックしましょう。
②イベントの中の『メッセージ▼を受け取ったとき』をドラッグして、「回答済み」メッセージを設定しましょう。
③見た目の中の『うーん…と考える』ブロックをくっつけて、「うーん…」の部分を空っぽにしましょう。
これで、選択肢をクリックしたら考えるのをやめるようになりました。
変数を隠す
変数がずっと表示されていますが、必要ないものは隠すようにします。
次の３つの変数のチェックをオフにして、表示しないようにしましょう。
- 問題数
- 状態
- 正解数
また、クイズに答えたあとも選択肢の変数が表示されっぱなしなので、次の問題を読む前に隠すようにします。
①問題を読むスプライトをクリックしましょう。
②変数の中の『変数A▼を隠す』ブロックをドラッグして、『出題』定義の『問題数▼を1ずつ変える』ブロックの下にくっつけましょう。
③同じように、ほかの選択肢の変数も隠すブロックもくっつけましょう。
これで、問題を読む前に選択肢が隠れて、問題を読み終わったら表示されるようになります。
BGMを付ける
プレイ中にBGMを鳴らすようにします。
BGMは、変数やリストの初期設定が終わってから結果を言う前まで流れるようにします。
①ステージをクリックしましょう。
②左上の「音」をクリックしましょう。
③『音を選ぶ』をクリックしましょう。
好きな音を選びましょう。
ループの中の音は繰り返し流れてもあまり違和感ないため、この中から選ぶといいと思います。この記事では「Mystery」を選びます。
音を選んだし、自由にアレンジしましょう。そのままでも大丈夫です！
音が大きいとクイズを考えるのに邪魔になるので音量を小さくします。
音の準備ができたら音を流すプログラムを作ります。
①左上の「コード」をクリックしましょう。
②制御の中の『ずっと』ブロックを、『緑の旗が押されたとき』ブロックの一番下にくっつけましょう。
③音の中の『終わるまで音▼の音を鳴らす』ブロックをドラッグして『ずっと』ブロックの間に入れましょう。
④「音▼」のところにさっき選んだ音を設定しましょう。
これで、BGMが流れるようになります。
次に、結果を言うときにBGMを止めるようにします。
①イベントの中の『メッセージ▼を受け取ったとき』ブロックをドラッグして、「メッセージ▼」を「結果発表」に変更しましょう。
②制御の中の『すべてを止める▼』ブロックをくっつけましょう。
③「すべてを止める▼」の部分を「スプライトの他のスクリプトを止める」に変更しましょう。
これで、結果を言うときにBGMが止まるようになりました。
まとめ
お疲れ様です！
これで、４択クイズは完成です！
今回は結果発表を追加したり、BGMを付けたりして細かい部分を調整しましたが、まだまだ良くできたり、アレンジできるところがあると思います。
記事内では書いていませんが、公開しているゲームではタイトル画面を追加したり、もう少し細かい調整を行っています。
気になる人は、実際にプログラムを見てみてください。
４択クイズのプロジェクトページでプログラムを見る
色々試しながらアレンジしてみて、ぜひ自分だけのオリジナルゲームにしてみてください。
スクラッチで「こんなゲーム作ったよ」とコメントしてくれたら、遊びに行くのでぜひ教えてください。
４択クイズを作ろう トップ記事はこちら↓
おすすめ
Scratchでのプログラミング学習におすすめの書籍です。
コメント