お話やゲームの案内を作っていて、「セリフを一度に出すのではなく、文字が少しずつ現れるようにしたい」と思ったことはありませんか。Scratchでは、全文から1文字を取り出し、表示用の文につなぎ足して、短く待つ処理を繰り返すと、この演出を作れます。
この記事では、1体のキャラクターが「たからをさがそう」と話す例を使います。複数の登場人物の会話順ではなく、ひとつの吹き出しの中で文字を増やす作り方に絞って進めましょう。
まずは「1文字を出す」と「1文字ずつ増やす」を区別する
目指す表示は、「た」→「たか」→「たから」です。「た」→「か」→「ら」と文字を入れ替えるだけでは、前に出した文字が残りません。
そこで、取り出した文字をそのまま話すのではなく、それまでの表示文の後ろにつなげてから話す形にします。Scratchの演算ブロックには、指定位置の文字を取り出すものと、文字列をつなぐものがあります。機能は公式ヘルプの文字を取り出すブロックと、文字列をつなぐブロックで確認できます。
今回の作例では、背景や音はまだ加えません。最初に「文が最後まで増える」状態を作り、その後で文字の出る速さを選びます。
準備する変数は「せりふ」「文字番号」「表示文」
話すキャラクターのスプライトを選び、「変数」から次の3つを作ります。今回は、そのキャラクターの中だけで使うため、作成時に「このスプライトのみ」を選ぶ設計にします。変数の共有範囲については、Scratch公式の変数作成ヘルプに説明があります。
| 変数名 | 入れておくもの | 開始時の内容 |
|---|---|---|
| せりふ | これから表示する全文 | たからをさがそう |
| 文字番号 | 次に取り出す文字の位置 | 1 |
| 表示文 | ここまでにつなげた文 | 空欄 |
「せりふ」は材料、「文字番号」は材料を取り出す場所、「表示文」は作りかけの文、と考えると役割を分けやすくなります。
ここで大切なのは、全文を入れた「せりふ」を途中で書き換えないことです。文章を取り出す場所と、取り出した文章をためる場所を分けておきます。
「表示文」を空欄にするときは、入力欄の文字をすべて消します。「空欄」という文字や、空白、引用符は入力しません。作り始めは変数のチェックを付け、ステージで値を見ながら進めると、後の照合表と比べられます。
ブロックを組む手順：取り出す・つなぐ・話す・待つ
最初に、開始時の状態をそろえる
選んだスプライトに「緑の旗が押されたとき」を置き、その下に初期設定をつなげます。吹き出しも、文字を入れない「と言う」でいったん消す設計です。空の「と言う」で吹き出しを消せることは、公式ヘルプの吹き出しの説明で確認できます。
繰り返しの中で、表示文を育てる
以下は、ブロックを組む順番を文字で表した作例です。角括弧は変数名、丸括弧は値やブロックを入れる位置を示しています。コードとして貼り付けるものではありません。
緑の旗が押されたとき
[せりふ] を [たからをさがそう] にする
[文字番号] を (1) にする
[表示文] を [] にする
[] と言う
((せりふ) の長さ) 回繰り返す
[表示文] を ((表示文) と ((せりふ) の (文字番号) 番目の文字)) にする
(表示文) と言う
(0.1) 秒待つ
[文字番号] を (1) ずつ変える
「表示文」を更新する行では、緑色の「○と○」ブロックを使います。左側にオレンジ色の「表示文」、右側に「せりふの文字番号番目の文字」を入れてください。「文字番号」と文字を入力するのではなく、同名の変数ブロックを差し込みます。
繰り返す回数には、全文の「長さ」を入れます。公式ヘルプでは、長さのブロックは文字列の文字数を返すと説明されています。また、「回繰り返す」は指定回数だけ内側の処理を実行するブロックです。この組み合わせなら、セリフを別の長さの文に替えても、回数を手で数え直す必要がありません。
待ち時間の「0.1秒」は、この作例で試すための設定値です。推奨値や、どの端末でも同じ見え方になる保証ではありません。「秒待つ」は指定時間待ってから次の処理へ進むため、文字をつなぎ足す間に間隔を入れられます。
秒数付きの「と言う」は、今回は使わない
似たブロックに「○と○秒言う」がありますが、この作例では秒数のない「と言う」を選び、待つ処理を分けます。秒数付きのブロックは、表示中、そのスクリプトの次の処理を待たせるためです。違いは公式ヘルプの秒数付き吹き出しの説明に記載されています。
途中の値を比べると、直す場所が見つかる
旗を押したら、最初の数文字を次の表と比べてみましょう。これは、先ほどの作例を順にたどったときの値です。「文字番号」は、その回で文字を取り出す時点の数を示しています。
お子さまに合う学び方診断
正解・不正解を決める診断ではありません。今の様子から、取り組みやすい学び方の入口をご案内します。
| 取り出す時点の文字番号 | 取り出す文字 | つないだ後の表示文 |
|---|---|---|
| 1 | た | た |
| 2 | か | たか |
| 3 | ら | たから |
| 4 | を | たからを |
一瞬で進んで見づらい場合は、確認用として待ち時間を「0.5秒」などに替える方法があります。仕組みを確かめる時間と、作品として見せる速さは、別に選んで構いません。
- 1文字ずつ入れ替わる：「表示文」に取り出した文字だけを入れていないか確認します。「前の表示文と、新しい1文字」をつなぐ形に戻します。
- 同じ文字が増え続ける：繰り返しの内側に「文字番号を1ずつ変える」があるか確かめます。
- 先頭の文字が抜ける：開始時の文字番号が1か、文字を取り出す前に番号を増やしていないか、作例の順序と比べます。
- もう一度動かすと前の文が残る：旗を押した直後に「表示文」を空欄に戻しているか見ます。
確認する対象は、この3つの変数と繰り返しの中だけです。背景やキャラクターの動きを同時に直さず、表と違う値が最初に現れる場所を探しましょう。
速さを選ぶときは、同じ文で待ち時間だけ替える
最後まで表示できたら、作品に合う間隔を試します。ここでは比較用に「0.05秒」と「0.2秒」を用意し、セリフは変えずに見比べる方法を提案します。どちらも正解として指定する数値ではありません。
比べたいのは、「速い方が上手か」ではなく、その場面でどう見せたいかです。宝物を見つけた場面なら勢いよく、秘密を打ち明ける場面ならゆっくり、という選び方もできます。
ただし、長い操作説明まで少しずつ出す必要はありません。演出したいセリフは1文字ずつ、すぐ読んでほしい操作案内は全文表示、と使い分ける案もあります。子どもの作品では、まず短いひとことだけに使ってみると、比較する対象を絞れます。
幼児と一緒に試す場合は、大人がブロックの準備を担当し、子どもは表示する言葉や間隔を選ぶ形でもよいでしょう。文字を読むことや変数を扱うことまで、同時に任せる必要はありません。
よくある質問（FAQ）
表示が終わったら、吹き出しを消せますか？
消せます。今回の作例に追加するなら、繰り返しの外側に、読み終えるための待ち時間と、空の「と言う」を置きます。空の「と言う」を繰り返しの内側に入れると、文を育てている途中で消すことになるため、置き場所を分けてください。
別のセリフに替えるとき、繰り返す回数も変えますか？
この作例では、開始時の「せりふ」の内容を替えれば、長さを使って回数を決められます。まずは、ひらがな中心の短い文で試してください。絵文字や特殊な記号を混ぜた場合の見え方は、この作例では確認していません。
ステージに出ている変数の枠は消してよいですか？
表示の確認が終わったら、変数一覧のチェックを外して隠す使い方で構いません。変数そのものを削除するのではなく、画面に出す枠だけを隠します。作業中は値を見える状態にしておくと、照合表と比較しやすくなります。
2人のキャラクターを交互に話させる方法と同じですか？
分けて考えます。この記事は「ひとつのセリフをどう表示するか」を扱っています。「誰がいつ話すか」を調整したい場合は、会話が重なるときのメッセージの使い方を参照してください。まず1体で文字表示を完成させてから、会話全体につなげる順序をおすすめします。
セリフの演出を、次の作品づくりにつなげる
今回の完成の目安は、「旗を押すと空の状態から始まり、全文が先頭から順に増え、最後まで表示される」ことです。そこまでできたら、言葉や間隔を替えて、自分のお話に合う表現を選んでみましょう。
南青山のCotoMiraiでは、年齢・興味・理解度に合わせた個別指導で、プログラミングやロボットなどの制作に取り組めます。指導方針はCotoMirai公式サイトで案内しています。「物語のセリフを少しずつ出したい」のように、作ってみたい場面を伝えると、相談したい内容を具体化できます。
年中以上のお子さまは、無料体験からの入会案内があります。この演出を体験で扱えるかは、希望内容として事前にご相談ください。
参考にした情報
関連する記事
お子さまに合う学び方診断
正解・不正解を決める診断ではありません。今の様子から、取り組みやすい学び方の入口をご案内します。