Scratch

スクラッチプログラミング - 3Dテニスゲームのつくりかた

Scratch でテニスゲームをつくる方法(ほうほう)を紹介(しょうかい)します。マウスやタッチでプレイヤーをうごかすので、キーボードなしのタブレットなどでもあそぶことができるモバイル対応(たいおう)のゲームです。

Pyxofy

09 Nov 2025 • 9 min read

テニスのラリーをつづけよう

Scratch (スクラッチ)でテニスゲームをつくってみましょう。

今回(こんかい)つくるのは、コンピューターと対戦(たいせん)するテニスです。自分(じぶん)で操作(そうさ)するプレイヤーは、マウスまたは画面(がめん)のタッチでうごかし、相手(あいて)プレイヤーは自動(じどう)でうごくようにします。3D 風(ふう)にみせるために、ボールのサイズやスピードを変化(へんか)させながらうごかすところが、スクリプトのポイントになります。

サンプルプロジェクト

下(した)にあるのは、テニスゲームのサンプルプロジェクトです。記事(きじ)をよみすすめる前(まえ)に、ボールやプレイヤーのうごきを確認(かくにん)しておいてください。

ボールは、サイズとスピードをかえながらうごく
手前(てまえ)のプレイヤーを、マウスで左右(さゆう)に操作(そうさ)する
奥(おく)にいる相手(あいて)は、自動(じどう)でうごく

テニスコートの背景(はいけい)をつくろう

最初(さいしょ)に、テニスコートの背景(はいけい)をつくりましょう。

ボールがインになるエリアとアウトになるエリアで、色(いろ)をわけてコートをえがいてください。色(いろ)をわける理由(りゆう)は、ボールがアウトになったかどうかを色(いろ)で判定(はんてい)できるようにするためです。

上(うえ)の画像(がぞう)では、わかりやすいように色(いろ)をハッキリとわけていますが、実際(じっさい)にえがくときは、色(いろ)のちがいはすこしでかまいません。

プレイヤーを用意(ようい)しよう

次(つぎ)に、プレイヤーのスプライトを２つ用意(ようい)しましょう。今回(こんかい)は、Scratch の中(なか)にあるスプライトを編集(へんしゅう)してつかっていきます。

自分(じぶん)で操作(そうさ)するプレイヤーは、 Jordyn をえらびます。
うしろむきにするために、顔(かお)をぬりつぶします。コスチュームは２つつくってください。
- ① ボールをうつ前(まえ)
- ② ボールをうった後(あと)

相手(あいて)のプレイヤーは、Casey をえらびます。
ゲームは毎回(まいかい) Casey のサーブからはじまるようにしていくので、コスチュームは３つつくってください。
- ① サーブをするとき
- ② ボールをうつ前(まえ)
- ③ ボールをうった後(あと)

ここでは Jordyn と Casey を編集(へんしゅう)してつかっていますが、ほかのスプライトでも、もちろん自分(じぶん)でえがいたものをつかってもOKです。

プレイヤーのスクリプト

プレイヤーを用意(ようい)できたら、スクリプトをつくっていきましょう。Jordyn と Casey のスクリプトは構成(こうせい)がほぼおなじなので、ブロックのちがいがわかりやすいように、まとめて解説(かいせつ)していきます。

位置(いち)とサイズ

緑(みどり)の旗(はた)がおされたとき の下(した)に、プレイヤーの位置(いち)とサイズをきめるためのブロックをつなげましょう。

Jordyn は、ステージの下側(したがわ)、一番(いちばん)手前(てまえ)です。
Casey は、ステージの上側(うえがわ)です。Jordyn と、この後(あと)追加(ついか)するテニスボールより奥(おく)になるようにします。

ゲームスタート

今回(こんかい)つくるゲームは、ボールがアウトになってもくりかえしゲームをつづけられるよう、メッセージを合図(あいず)にしてゲームをスタートさせます。ゲームスタートをうけとったとき の下(した)に、最初(さいしょ)のコスチュームと、プレイヤーをうごかすためのブロックをつなげましょう。

Jordyn は、マウスで左右(さゆう)にうごかせるようにします。
Casey は、ボールの位置(いち)にあわせて、自動(じどう)で左右(さゆう)にうごくようにします。

Jordyn のスクリプトに、もし　ゲーム中(ちゅう)？=はい　なら という条件(じょうけん)をつけている理由(りゆう)は、Jordyn をうごかせるのはゲーム中(ちゅう)だけで、ボールがアウトになったときなどは操作(そうさ)できないようにするためです。

また、上(うえ)のスクリプトからわかるように、Casey はかならずボールのところへ移動(いどう)するようにしてあるので、Casey がうちかえしに失敗(しっぱい)することはありません。

ボールをうつとき

ボールをうつときは、それぞれメッセージを合図(あいず)にしてコスチュームをきりかえます。

以上(いじょう)で、プレイヤーのスクリプトができました。

テニスボールのスクリプト

ここからは、ゲームのメインとなる、テニスボールのうごかしかたを説明(せつめい)していきます。テニスボールのスプライトを用意(ようい)してから、スクリプトをつくっていきましょう。

ゲームをはじめる準備(じゅんび)

緑(みどり)の旗(はた)がおされたとき の下(した)につなげるのは、次(つぎ)の３つです。

Casey より手前(てまえ)に表示(ひょうじ)されるようにします。
メッセージをおくって、ゲームをスタートさせます。

ゲームスタート

ゲームをスタートさせるメッセージは、 Jordyn と Casey だけでなく、ボール自身(じしん)もうけとります。ゲームスタートをうけとったとき の下(した)に、ブロックをつなげていきましょう。

ゲーム中(ちゅう)？ を はい にして、Jordyn をうごかせるようにします。
サーブをうつのは Casey なので、ボールの y 座標(ざひょう)を Casey のところにします。横(よこ)の位置(いち)はランダムです。
ボールのおおきさは、Casey の y 座標(ざひょう)とボールの y 座標(ざひょう)をつかって計算(けいさん)するようにします。

ボールのサイズを計算(けいさん)するのは、Casey にちかいときはちいさく、Casey からはなれるにつれておおきくなるようにするためです。こうすることで、ゲーム全体(ぜんたい)に 3D のような奥(おく)ゆきをかんじられるようになります。

つづけて、トスをあげるためのブロックをつなげていきましょう。

すこしまってから、ボールを上下(じょうげ)させてトスをあげます。
トスをあげおわったらメッセージをおくって、Casey のところからボールがうごくようにします。

ここでは、ボールのはやさ という変数(へんすう)をつかってトスをあげています。変数(へんすう)をつかう理由(りゆう)は、ボールをなめらかにうごかすためです。ボールのはやさ は、この後(あと)、ボールをうちあうときにも使用(しよう)します。

うごきをたしかめよう

では、緑(みどり)の旗(はた)をおしてここまでのうごきを確認(かくにん)してみましょう。

緑(みどり)の旗(はた)をおして、ゲームを開始(かいし)
ボールは、Casey のところでトスのうごきをする
Casey のコスチュームは、ボールをうったように変化(へんか)する
Jordyn は、マウスで左右(さゆう)にうごかすことができる

Casey がうったボールのうごき

ここからは、 Casey がうったボールのうごきを説明(せつめい)していきます。

方向(ほうこう)とスピード

Caseyがうつをうけとったとき の下(した)に、ボールの方向(ほうこう)とスピードをきめるためのブロックをつなげましょう。

変数(へんすう) ななめの量(りょう) で、ななめにうごく量(りょう)をランダムにします。
ボールのはやさ で、うったときの最初(さいしょ)のいきおいを指定(してい)します。下方向(したほうこう)へうごかすので、値(あたい)はマイナスです。
はやさの変化量(へんかりょう) は、ボールのいきおいを変化(へんか)させるための変数(へんすう)です。ランダムにして、うつたびにスピードのちがうボールになるようにします。

変数(へんすう) ななめの量(りょう) は、Casey のいる位置(いち)、つまり、ボールの x 座標(ざひょう)におうじて乱数(らんすう)を調整(ちょうせい)してください。これは、ボールがななめにうごきすぎて、すぐにアウトにならないようにするためです。

ボールをうごかす

上(うえ)で設定(せってい)した変数(へんすう)の値(あたい)をつかって、ボールをうごかしましょう。

Jordyn のコートのまん中(なか)あたりまでうごかします。
回転(かいてん)させながら、ななめにうごかします。
だんだんはやくうごかします。
サイズを変化(へんか)させます。

Jordyn にちかづくにつれてボールのスピードやサイズをかえるのは、3D らしさを表現(ひょうげん)するためです。

つづけて、コートのまん中(なか)あたりまでうごかしたら、一回(いっかい)バウンドさせましょう。

Jordyn のコートまでボールがうごいたら、そのときに Jordyn がいる位置(いち)を、変数(へんすう) Jordynの位置(いち) に保存(ほぞん)しておきます。
Jordyn のコートで、バウンドさせます。

Jordyn の位置(いち)を変数(へんすう)に保存(ほぞん)しておくのは、Jordyn がうつときに、この変数(へんすう)の値(あたい)をつかってボールをななめにうごかせるようにするためです。これについては、この後(あと)、「Jordyn がうったボールのうごき」のセクションでくわしく説明(せつめい)します。

バウンドするときにメッセージをおくるのは、ボールの影(かげ)を表示(ひょうじ)するためです。ボールの影(かげ)については、この後(あと)、「ボールの影(かげ)」のセクションで説明(せつめい)します。また、0.03秒(びょう)まつ をつかって一瞬(いっしゅん)だけボールのうごきをとめることで、バウンドした様子(ようす)をあらわしています。

つづけて、バウンドした後(あと)のボールのうごきをつくっていきましょう。

ボールをステージの下側(したがわ)までうごかします。
ステージの下(した)にいきすぎる前(まえ)に Jordyn にふれたら、Jordyn がうちかえすようメッセージをおくります。Jordyn がうちかえす場合(ばあい)は、この下(した)につなげているブロックは実行(じっこう)しません。
Jordyn にふれなかった場合(ばあい)は、メッセージをおくってゲームをとめます。

ボールがステージの下(した)までうごいた場合(ばあい)にゲームをとめるのは、Jordyn がうちかえすのに失敗(しっぱい)した、ということだからです。このメッセージをうけとったときのうごきは、この後(あと)、「ゲームをとめる」のセクションで説明(せつめい)します。

Casey がうったボールをうごかすスクリプトは以上(いじょう)です。

Jordyn がうったボールのうごき

ここからは、 Jordyn がうったボールのうごきを説明(せつめい)していきます。

方向(ほうこう)とスピード

Jordynがうつをうけとったとき の下(した)に、ボールの方向(ほうこう)とスピードをきめるためのブロックをつなげましょう。

ななめにうごく量(りょう)をきめる変数(へんすう) ななめの量(りょう) は、Jordyn の現在(げんざい)の位置(いち)と、ボールがバウンドしたときにいた位置(いち)をつかって計算(けいさん)するようにします。
ボールのはやさ で、うったときの最初(さいしょ)のいきおいを指定(してい)します。上方向(うえほうこう)へうごかすので、値(あたい)はプラスです。
はやさの変化量(へんかりょう) は、ボールのいきおいを変化(へんか)させるための変数(へんすう)です。ランダムにして、うつたびにスピードのちがうボールになるようにします。

さきほど、Casey がうつときは、ななめの量(りょう) を乱数(らんすう)にしましたね。なぜ、Jordyn の場合(ばあい)はこのように計算(けいさん)するのかというと、うちかえす方向(ほうこう)を自分(じぶん)でコントロールできるようにするためです。どういうことか、下(した)の画像(がぞう)で確認(かくにん)してみましょう。

バウンドしたときに Jordyn がボールの正面(しょうめん)にいる場合(ばあい)、うちかえす方向(ほうこう)はまっすぐです。
バウンドしたときに Jordyn がボールより左側(ひだりがわ)にいて、そこからすぐに右(みぎ)へ移動(いどう)してうちかえすと、ボールは右(みぎ)ななめにうごきます。
左(ひだり)ななめにうちかえしたい場合(ばあい)は、バウンドの位置(いち)より右側(みぎがわ)にいて、そこから一気(いっき)に Jordyn を左(ひだり)へ移動(いどう)させます。

また、Jordyn がうったボールは、Casey の場合とは逆(ぎゃく)で、うったときのいきおいが一番(いちばん)はやく、だんだんスピードがおそくなるようにします。

ボールをうごかす

ボールの方向(ほうこう)とスピードを設定(せってい)したら、Casey のコートまでボールをうごかして、バウンドさせましょう。

Jordyn がうったボールは Casey にふれるまでうごかしつづけます。そして、Casey がうちかえすようにメッセージをおくりましょう。

Jordyn がうったボールをうごかすスクリプトは以上(いじょう)です。

ブロック定義(ていぎ)でまとめよう

さて、ここまで説明(せつめい)してきた、Casey がうったボールのうごきと、Jordyn がうったボールのうごきには、「おなじブロックのかたまり」があることに気(き)がつきましたか？

このように、おなじうごきを構成(こうせい)している部分(ぶぶん)は、ブロック定義(ていぎ)でまとめることをおすすめします。スクリプトがよみやすくなり、後(あと)で修正(しゅうせい)したくなった場合(ばあい)の対処(たいしょ)が簡単(かんたん)になるからです。

ボールの影(かげ)をつくろう

ここからは、ボールがバウンドするときの影(かげ)をつくっていきましょう。

さきほど、テニスボールのスクリプトの中(なか)で、「バウンドするときにメッセージをおくるのは、ボールの影(かげ)を表示(ひょうじ)するためです」と説明(せつめい)しました。影(かげ)を表示(ひょうじ)するのは、バウンドしたことをわかりやすくすると同時(どうじ)に、アウトになったこともわかりやすくするためです。

ボールの影(かげ)のスプライトは、下(した)のようにつくってください。