Logical thinking

プログラミングで育む論理的思考力

Scratch(スクラッチ):シンプルなアナログ時計の作り方

今回は実技として、Scratch(スクラッチ)でシンプルなアナログ時計を作ってみたいと思います。

Scratch(スクラッチ)で作るシンプルな時計
Scratch(スクラッチ)で作るシンプルな時計

推奨年齢

小学4年生~

必要な算数知識

このプロジェクトでは、時計の針を動かすプログラムを作るにあたり、角度小数点かけ算わり算を使います。

学べる Scratch(スクラッチ)についての知識

このプロジェクトを作成すると、スプライトX座標Y座標背景描画について学べます。

おさらいクイズ

もしサポート役として子ども達と一緒にプログラミングをされる場合は、以下の内容を理解できているか 是非確認してあげてくださいね。

Q1. 1時間は何分?
Q2. 1分は何秒?
Q3. 長い針がぐるっと一周回ると、角度は何度?
Q4. 短い針の1時間分の角度は何度?
Q5. 1分、または1秒に進む角度は何度?

おさらいクイズ答え

A1. 1時間は 60分
A2. 1分は 60秒
A3. 360度
A4. 360度 ÷ 12時間 = 30度
A5. 360度 ÷ 60分 = 6度、360度 ÷ 60秒 = 6度

アナログ時計の作り方

では、早速作っていきましょう!

スプライトを作成しよう

図1:スプライトを作成しよう
図1:スプライトを作成しよう

まずは、図1の①にあるネコマークの「スプライト追加」アイコンから「描く」を選び、新しいスプライト「みじかいはり(じかん)」を作成します。

次に、新しいスプライト「みじかいはり(じかん)」で、②にある「コスチューム」タブで時計の針の絵を ③の「四角形」で塗りつぶして描きます。

描画する際のポイントは、回転軸を真ん中ではなく端に寄せたいので、キャンバスの中心点より右側に針を描きます。

図2:中心点
図2:中心点

中心点とは図2にあるマークのことで、キャンバスの中心にありますが、小さくて見えにくい場合は、⑤の「拡大虫めがね」を使って真ん中あたりを確認してくださいね。

同じ方法で、「ながいはり(ふん)」、「びょうしん」を作成しましょう。

X軸とY軸について

X軸とY軸を指定することで、針の位置を調整することができます。図3にある星マークが、「X軸 0、Y軸 0」となる中心ポイントです。ここでも描画する際に中心点を針の端に寄せていることがポイントとなります。

図3:X軸とY軸
図3:X軸とY軸

角度について考えよう

コードを書く前に、角度について確認しておきましょう。図4は、おさらいクイズの Q.4 にあった「短い針の1時間分の角度は何度?」という部分ですね。Scratch(スクラッチ)では、12の針位置を 0度と考えます。なので、時間を表す短い針の場合は、1時で「1 × 30度 = 30度」、2時で「2 × 30度 = 60度」で計算すれば良いということですね。

図4:時計の角度
図4:時計の角度

では、分や秒の場合はどうでしょうか。おさらいクイズの Q.5 です。360度を60分(または60秒)で割るので、1分間(または1秒間)は6度となりますね。では、これを踏まえてコードを書いていきましょう!

ブロック コードを書こう

では「みじかいはり(じかん)」スプライトのコードを見てみましょう。

図5:「みじかいはり(じかん)」ブロック コード
図5:「みじかいはり(じかん)」ブロック コード

「*」は「×(かける)」、「/」は「÷(割る)」という意味です。

((現在の時 × 30)+(現在の分 × 0.5))度に向ける

(現在の時 × 30)は、前項の角度の部分で説明した通りですね。(現在の分 × 0.5)というのは、短い針に「分」の分も足す必要があるため、「30度 ÷ 60分 = 0.5度」で、1分間に短い針は 0.5度 進んでいるということになります。0.5 を掛けるということは、2で割ると同意なので、以下に置き換えることもできますね。

((現在の時 × 30)+(現在の分 ÷ 2))度に向ける

では「ながいはり(ふん)」と「びょうしん」のブロックコードを見てみましょう。

図6:「ながいはり(ふん)」ブロック コード
図6:「ながいはり(ふん)」ブロック コード

図7:「びょうしん」ブロック コード
図7:「びょうしん」ブロック コード

背景に文字盤を書こう

図8:背景に文字盤を書こう
図8:背景に文字盤を書こう

最後に背景で時間の文字盤を追加しましょう。図8の①にある「背景」をクリックし、②の「背景」タブを開きます。 ③の「テキスト」で数字を入力し配置していきます。

まとめ

いかがでしたか?以上で、Scratch(スクラッチ)で作るシンプルなアナログ時計の出来上がりです。プロジェクトは以下のURLで共有していますので、ご参考くださいね。 https://scratch.mit.edu/projects/325889544