Scratchで〇×クイズを作ろう 基本編①ゲームの設計図を作ろう
基本編①では、これから作る「〇×クイズ」をどんなゲームにするのか整理して、完成までの手順を明確にしていきます。
普段、Scratchで色々作っている中で、せっかく途中までがんばって作ったけど「なんか違うな」「難しすぎるな」といった問題が起きてやめてしまうことがあるかもしれません。
最初に「こんな感じにしよう」というイメージを持つことができれば、「どのように進めていけばいいのか」「どんなことをしなければいけないのか」といったことが整理できるので、問題を事前に発見できて途中でやめてしまう可能性を少なくすることができます。
また、 「どんなことをしなければいけないのか」が分かっているため、スムーズにプログラミングすることができます。
Point
どんなゲームにするか整理するときは、ノートや紙に書きながら考えることをおすすめします。
理由は次の通りです。
・書きながら情報を整理することで、足りないものや余計なものが見つかりやすい。
・考えをまとめたものがあれば、あとから見直すことができる。
頭の中で考えるだけでなく、実際に書き出してみると、新しいポイントに気付くことができたり、新しいアイデアが浮かんだりします。
頭の中だけ考えたものを、いきなりプログラムにするのは意外と難しいです。特に作ろうとするものが大きければ大きいほど難しさは増していきます。
どのようにプログラミングすれば良いのか悩んだら、紙に書きながらどんなものを作りたいのか整理してみましょう。
〇×クイズを作ろう トップ記事はこちら： 〇×クイズを作ろうトップ記事
どんなゲームにするか考えよう
まずは、どんなゲームを作るのか考えていきます。
とは言っても、今回は「〇×クイズ」を作ることは決まっているので、「〇×クイズ」で「どんな問題を出すのか」「何問出すのか」を決めましょう。
問題の内容は何でもOKなので、自由に考えてみてください。
問題が1問だけだとつまらなくなってしまうので、3問以上は出せるようにしましょう。
この記事では、「プログラミングやスクラッチに関する問題」を「5問」出すことにします。
必要な機能を考える
次に「〇×クイズ」を作るために、どんな機能が必要か考えていきましょう。
以下の機能は最低限必要ですね。
・問題を出す
・プレイヤーが答える
・プレイヤーに正解・不正解を伝える
・最後にプレイヤーの成績を伝える
それぞれの機能をどんな順番に動かすか考える
必要な機能を書き出したら、それぞれの機能をどんな順番で動かしたらうまくいきそうか考えていきます。
今回は「〇×クイズ」なので、順番は分かりやすいですね。
問題を５問出すので、「問題を出す」→「プレイヤーが答える」→「プレイヤーに正解・不正解を伝える」を繰り返します。 ５問出し終えたら「最後にプレイヤーの成績を伝える」という感じにしたいと思います。
Point
処理の順番は、文章で書くよりも絵で描いたほうが分かりやすくなります。
例えば、先ほど考えた処理の順番を絵で描いてみると↓のようになります。
どうでしょうか？
文章で書くよりも、絵で描いたほうがパッと見て分かりやすいですよね。
今回は説明するためにきれいに描きましたが、もっとおおざっぱに描いて大丈夫です。
はじめのうちは絵を描くのも大変かもしれませんが、慣れて描けるようになれば、もっとたくさん処理がある場合でも、整理しやすくなります。
どんな画面（背景）にするか考える
作ろうとしているゲームで、画面（背景）を「どんな画面（背景）にするのか」考えていきます。また、 画面（背景） をたくさん使う場合は、「どんな時にどの画面（背景）に切り替えるのか」も一緒に考えていきます。
画面（背景）のイメージを考える
まずは、問題を出す画面について考えていきます。
Scratchでは、スプライトの吹き出しを使って文字を表示させることができます。
こんな感じ↓
これを使って問題文を表示させても良いのですが、これだと文字の大きさを変えることができません。
問題文をもっと大きく表示させたいので、今回は別の方法でやります。スプライトに問題文を書いて、それを表示させる方法でやっていきます。
問題文を表示する画面のイメージはこんな感じにします↓
次にプレイヤーが答える画面を考えます。
〇×クイズなので、「〇」と「×」を画面に表示させておいて、それをクリックしてもらうようにします。プレイヤーが答えるときには、問題文が見えていたほうが親切なので、先ほどの「問題を出す画面」の下のところに「〇」と「×」を置きます。
この画面でプレイヤーが「〇」か「×」をクリックしたら、正解・不正解を伝える画面を表示することにします。
正解・不正解を伝えて、答えの解説があったら親切ですね。
こんな感じになりました↑
真ん中の「クリックして次へ」をクリックすると次の問題を出すようにします。
最後に、プレイヤーに結果を伝える画面を考えます。
プレイヤーが「何問正解したのか」を分かるようにして、簡単なメッセージを表示するようにしたいと思います。メッセージには、「おしい」「満点まであと一歩」のようなことを表示させる予定です。
こんな感じです↑
これで必要な画面は揃いました。
実際に作ってみると「やっぱりこうしたほうが良いな」などの別の考えが浮かんできたりするので、ここでは大まかなイメージを決めよう！
どんな時にどの画面（背景）に切り替えるのか
画面のイメージができたら、次はどんな時にどの画面に切り替えるのか考えていきます。
ここでは、「それぞれの機能をどんな順番で動かすか考える」で決めた順番に画面のイメージを当てはめて考えてみましょう。
こんな感じです。
赤い文字で書かれているのが、「画面を切り替えるタイミング」です。
これで、「どうなったらどんな画面を表示すればいいのか」が分かるようになったと思います。
ここまでできれば、どのように作っていけばいいのか頭の中がだいぶ整理されたと思います。
まとめ
お疲れ様でした！
今回は、これから作る「〇×クイズ」でやりたいことを整理しながら画面のイメージや画面の切り替えのタイミングなどを決めていきました。
このように、プログラミングをする前にどんな感じにするかまとめた資料を「設計書」と言います。
実際に仕事でプログラミングするときは、もっと細かくてたくさんのことが書かれた設計書を作ってからプログラミングします。
最初に設計書を作ることで、これから作るモノの「イメージがきちんとできているのか」「やりたいことが正しくできるのか」「どんなプログラミングをしなければいけないのか」など、いろんなことを確認することができます。
ちょっとしたモノを作るときは、わざわざ設計書を作らなくてもできるかもしれませんが、大きなモノを作るときは、頭の中だけで考えるのは難しいので、今回のようにノートや紙に書きながら「やりたいこと」や「必要な機能」などを整理してみましょう。
実際に作ってみないと分からい部分もたくさんあると思うので、「どんなモノを作ろうか」考えるときに頭の中を整理するためのものとして設計書を作ってみてね。
設計書の例
＜作るもの＞
〇×クイズ
＜やりたいこと＞
〇〇〇についての問題を５問出す。
＜必要な機能＞
・問題を出す。
・プレイヤーが答える。
・プレイヤーに正解・不正解を伝える。
・最後にプレイヤーの成績を伝える。
＜処理の順番＞
必要な機能をどんな順番で動かしたらいいのか、簡単な絵で描いてみる。
＜画面のイメージ＞
ゲームの画面を簡単な絵で描いてみる。
＜画面の切り替え＞
どのタイミングで画面が切り替わるのか、簡単な絵で描いてみる。
次回は、「問題を出す画面」を作っていきます。
次の記事「基本編②」はこちら↓
基本編② 問題を出そう
〇×クイズを作ろうトップ記事はこちら↓
〇×クイズを作ろうトップ記事
おすすめ
Scratchでのプログラミング学習におすすめの書籍です。