この記事の要点

Scratch ではステージのタブに「背景」がある 背景はライブラリから選ぶ / 自分で描く / 画像アップロード / カメラ撮影 の 4 つの方法 コードブロック「背景を ... にする」「次の背景にする」で切替 「背景が ... になったとき」でストーリーやゲームの場面切替 画像形式は PNG / JPG / SVG 対応 (最大 480 × 360 推奨)

Scratch の背景とは

Scratch (スクラッチ) は MIT メディアラボが開発する子ども向けプログラミング言語です。画面の主役 スプライト (キャラクター) の後ろにあるのが 背景 (Backdrop)。森・宇宙・教室・海辺など、場面 (シーン) を演出する要素です。本ガイドでは背景を変える 4 つの方法と、コードでの切り替えまでを解説します。

背景パネルの場所

画面右下、スプライト一覧の左隣に「ステージ」のサムネイルが小さく表示されています。その下に 「背景」と書かれたボタンがあります。ステージをクリックすると、左上のタブが「コード」「背景」「音」に変わります。

方法 1: ライブラリから選ぶ

1. ステージのサムネイル下にある絵の山アイコン (背景を選ぶ) をクリック
2. 背景ライブラリが開く (Forest / Castle / Beach / Underwater / Stars 等)
3. 気に入った背景にマウスを合わせるとプレビュー
4. クリックで決定 → ステージに反映

カテゴリは「ファンタジー」「音楽」「スポーツ」「屋外」「パターン」など。授業や物語に合わせて選びましょう。

方法 2: 自分で描く (Paint)

1. 絵の山アイコンの上にマウスを乗せ、表示されるメニューから筆 (描く) を選ぶ
2. 背景タブに切り替わり、空白のキャンバスに直接お絵描きできる
3. 四角・丸・線・テキストツールで自由に描画
4. レイヤー (前後) で重ね順を変えられる

方法 3: 画像をアップロード

1. 絵の山アイコン → 背景をアップロード (↑アイコン)
2. パソコンの画像ファイル (PNG / JPG / SVG / GIF) を選択
3. サイズ 480 × 360 px が標準。大きすぎる場合は自動縮小

自分が撮った写真や、Web で公開されているフリー素材を使えます。著作権に注意し、自分で撮影したものか CC0 / CC BY の素材を選びましょう。

方法 4: カメラで撮影

絵の山アイコン → カメラ アイコンで PC のウェブカメラから直接撮影できます。教室の風景や、自分の顔写真を背景にして自己紹介プログラムを作るのに便利です。

複数の背景を切り替える

1 つのプロジェクトに複数の背景を登録しておき、コードで切り替えるのが Scratch の基本パターンです。

コードブロック

ブロック	カテゴリ	動作
背景を [Forest] にする	見た目	指定した背景に切替
次の背景にする	見た目	リストの次の背景に
背景を [Forest] にして待つ	見た目	切替＋アニメ完了待ち (ストーリー向け)
背景の番号 / 背景の名前	見た目	現在の背景情報を取得
背景が [Forest] になったとき	イベント	切替時に処理を実行

基本例: ボタンで場面切替

旗が押されたとき
  背景を [Title] にする

スプライト「スタートボタン」がクリックされたとき
  背景を [Forest] にする

例: 物語で順番に切り替える

旗が押されたとき
  背景を [Scene1] にする
  3 秒待つ
  次の背景にする         ← Scene2 へ
  3 秒待つ
  次の背景にする         ← Scene3 へ

背景に応じてスプライトを動かす

「背景が ... になったとき」イベントを使うと、場面ごとにキャラクターを登場/退場させたり違う動きをさせたりできます:

スプライト「主人公」のスクリプト:

背景が [Forest] になったとき
  x座標を -100 y座標を 0 にする
  「ここは森だ」と 2 秒言う

背景が [Castle] になったとき
  x座標を 100 y座標を 50 にする
  「お城についた！」と 2 秒言う
  歩く アニメを開始する

背景と効果音をセットに

場面切替と同時に BGM を変えると臨場感が増します:

背景が [Underwater] になったとき
  すべての音を止める
  音 [Bubbles] を最後まで鳴らす
  ずっと
    音 [Underwater BGM] を最後まで鳴らす
  終わり

ゲームでの活用例

ステージクリアで次の場面へ

旗が押されたとき
  ずっと
    もし [スコア] > 10 なら
      次の背景にする
      スコアを 0 にする
    終わり
  終わり

マップ移動 (RPG 風)

主人公スクリプト:

ずっと
  もし [主人公] が [Forest扉] に触れた なら
    背景を [Castle Inside] にする
    x座標を 0 y座標を -100 にする
  終わり

  もし [主人公] が [Castle 出口] に触れた なら
    背景を [Forest] にする
    x座標を 200 y座標を -100 にする
  終わり
終わり

背景の編集

登録済みの背景は「背景」タブで編集可能です。複製して別バージョン (昼/夜) を作る、フィルター効果 (色を変える) を使うなどができます。

FAQ

Q: 背景に動画を使えますか
A: Scratch は静止画のみ対応。「動画感」を出すには複数の背景を高速で切り替えるか、スプライトを動かして表現します。

Q: 背景の解像度は
A: 480 × 360 ピクセルが基本サイズ。ビットマップは粗くなりやすいので、可能なら SVG (ベクター) で作ると拡大しても綺麗です。

Q: 「背景が ... になったとき」が反応しない
A: そのブロックはスプライト/ステージのスクリプトに置きます。背景タブのコードエリアに書いていないか確認しましょう。