スクラッチでアナログ時計を作ってみよう①（ステップ秒針）

今回、プログラミングに挑戦するアナログ時計は、こちらです。

緑の旗をクリックすると、アナログ時計が現在の時刻を示します。

素材をリミックス

まずは、アナログ時計の素材をコピーします。

下のアナログ時計の素材を置いてあるページを開いて、リミックスしましょう。

アナログ時計の素材ページを見る　＞＞

素材の確認

リミックスしたら、素材を確認しましょう。

こちらには、下の４つのスプライトがあります。

コスチュームを確認すると、「時針」「分針」「秒針」は右向き（90度）に描かれています。

また、針の●の部分は、キャンバスの中心点に置かれています。

スプライト「秒針」で、「〇度に向ける」ブロックを使って、〇に「0」「90」「180」「-90」設定すると、それぞれ何秒を指すでしょうか？

ヒントは、「スクラッチでプログラミング006｜スプライトの向き」で、針がどのように動くか、一度話をしたの覚えているかな？

・

・

・

・

・

・

・

・

・

・

正解は、「0」が0秒、「90」が15秒、「180」が30秒、「-90」が45秒でした。

針の末端を中心点に置くと、中心点を基準にぐるぐる針が回ると説明したの思い出したかな？

（▶をクリックして動画を確認してね）

今回のスプライト「秒針」「分針」「時針」は、すべて針の先端にある●をキャンバスの中心点に合わせています。

よって、この動画のように、「〇度に向ける」ブロックの〇に角度を指定すると、文字盤を中心にぐるぐる回ります。

秒針を動かすプログラムを考える

秒針とは、時刻の「秒」を指し示す針のことです。

秒針は、１秒ずつ進んでいきます。

これから、秒針を動かすプログラムを考えていきますが、プログラムの最初は何をするのか覚えていますか？

プログラムは、トリガーがないと動かなかったですよね。

今回は、緑の旗がクリックされたときに、アナログ時計を動かすようにしますので、一番最初のブロックは、「緑の旗が押されたとき」ブロックです。

また、現在の時刻を知るには、「調べる」ブロック群の「現在の▢（ローカルタイム）」ブロックを使います。

「現在の▢（ローカルタイム）」ブロックは、現在（ローカルタイム）の指定した「年」「月」「日」「曜日」「分」「秒」の値を返すブロックです。

▼をクリックすると、ドロップダウンリストが現れますので「秒」を選択すると、現在の秒の数値を返します。

「秒」を選択したらクリックしてみましょう。

すると、現在の「秒」が表示されます。

それでは、プログラミングに挑戦してみましょう！

・

・

・

・

・

・

・

・

・

・

アナログ時計の秒針を動かすプログラミングはできましたか？

まずは、スプライト「秒針」が1秒間で何度動くのかを計算しなければいけません。

秒針が、1周するまで「60秒（1分）」かかります。

1周は360度なので、1秒間で進む角度は、

となります。

1秒間で進む角度は、「6度」なので、

で、ちゃんと1周（360度）になりますよね。

つまり、現在の秒針の角度を出すには、現在の秒数に「6度」を掛けてあげれば、求められます。

現在の時間を知りたいときは、「現在の▢（ローカルタイム）」ブロックを使います。

▼をクリックすると、ドロップダウンリストが現れますので「秒」を選択すると、現在の秒の数値を返します。

あとは、「6度」を掛けるだけですが、掛け算はどのブロックを使うか覚えていますか？

「演算」ブロック群の「〇*〇(掛け算)」ブロックでしたよね。

秒針の角度を求めるプログラムが完成したら、何度かクリックしてみましょう。

1秒ごとに「6」度ずつ増えているのが分かります。

あとは、「〇度に向ける」ブロックの〇に入れて、「緑の旗が押されたとき」ブロックにくっつけますが、これだけではだめですよね？

プログラムの流れをイメージしましょう。

イメージが分からない子は、緑の旗をクリックして、プログラムがどうなるか確認してね。

・

・

・

・

・

・

・

・

・

・

分かったかな？

こちらのプログラムは、上から下へ処理される「順次処理」です。

一番下のブロックが処理されれば、そこでプログラムが終了してしまいます。

アナログ時計の秒針はずっと動いていますよね？

ずっと動かすには、どのブロックが必要だったでしょうか？

・

・

・

・

・

・

・

・

・

・

「ずっと」ブロックでしたよね。

これで、アナログ時計の秒針を動かすプログラムが完成しました。

緑の旗をクリックして、秒針がずっと動くか確認しましょう。

「〇度に向ける」ブロックの角度

「〇度に向ける」ブロックで左側の角度は、0より小さい「-（マイナス）」の角度で設定するルールだったはずと疑問に思ったこと子はするどい！

スクラッチでは「上」向きの「0度」を基準に、左右に分度器が置かれていて、左側の角度は、0より小さい「-（マイナス）」の角度で設定するルールでしたよね？

左側の角度は、0より小さい「-（マイナス）」の角度で設定するルールとなっていますが、実は、右回りで180度を超えた角度を入力しても設定することができます。

例えば、「〇度に向ける」ブロックの〇に「225」と設定すると、スプライトが225度に向きます。

（▶をクリックして動画を確認してね）

ただし、「225」と入力しても、左側の角度で「-135」と表示されます。

右回りで角度を設定できても、表示上は、「-（マイナス）」表示というわけです。

どちらを入力しても角度は同じですので、このような「〇度に向ける」ブロックの特徴を覚えておきましょう。

分針を動かすプログラムを考える

分針とは、時刻の「分」を指し示す針のことです。

・

・

・

・

・

・

・

・

・

・

アナログ時計の分針を動かすプログラミングはできましたか？

まずは、分針の動きをイメージすることが大切です。

分針が、1周するまで「60分（1時間）」かかります。

1周は360度なので、1分間で進む角度は、

となります。

1分間で進む角度は、「6度」なので、

で、ちゃんと1周（360度）になりますよね。

つまり、現在の分針の角度を出すには、現在の分数に「6度」を掛けてあげれば、求められます。

現在の分針の角度の求め方が分かれば、あとは、秒針と同じようにプログラミングしていきます。

これで、アナログ時計の分針を動かすプログラムが完成しました。

緑の旗をクリックして、分針がずっと動くか確認しましょう。

時針を動かすプログラムを考える

時針とは、時刻の「時」を指し示す針のことです。

・

・

・

・

・

・

・

・

・

・

アナログ時針の時針を動かすプログラミングはできましたか？

こちらも、時針の動きをイメージすることが大切です。

時針が、1周するまで「12時間」かかります。

1周は360度なので、1時間で進む角度は、

となります。

1時間で進む角度は、「30度」なので、

で、ちゃんと1周（360度）になりますよね。

つまり、現在の時針の角度を出すには、現在の時数に「30度」を掛けてあげれば、求められます。

現在の「時」は、0～23の値を返すブロックですので、例えば13時の場合、

で、「390度」です。

390度は、ぐるっと1周回って、

で、1時の角度と同じ「30度」になります。

ここで、ちょっと疑問に思った子は、するどい！

たしかに時針は、1時間に30度動きますが、1時間たったら、いきなり30度動きませんよね？

例えば、こちらのアナログ時計の時刻は、「08時20分00秒」を示しています。

時針は、8時の位置より少し進んでいますよね。

この進んだ角度は、20分間で動いた角度です。

つまり、スプライト「時針」が、1分間に何度動くか計算できれば、20分間で動いた角度も求められるということです。

時針が、1時間で動く角度は、「30度」でした。

1分間で進む角度は、

となります。

ということは、「08時20分00秒」の時針の角度は、

となります。

よって、現在の時針の角度は、下の式で求められます。

現在の時針の角度の求め方が分かれば、あとは、秒針と同じようにプログラミングしていきます。

これで、アナログ時計の時針を動かすプログラムが完成しました。

緑の旗をクリックして、時針がずっと動くか確認しましょう。

時針の確認は、時間がかかるので、読み進めながら、ちょこちょこ確認してね。

時針を動かすプログラム

今回の時針を動かすプログラムでは、1時間に動く角度と1分間に動く角度を足して、現在の時針の角度を求めました。

時針の1分間に動く角度が分かれば、現在の時数をすべて分数に変換して求めることもできます。

スクラッチのブロックであらわすと、このようなプログラムとなります。

こちらの方法でプログラミングしても結果は同じですので、正解です。

ただ気を付けなければいけないのが、ブロックを使った足し算と掛け算の計算です。

足し算と掛け算は、先に掛け算が計算されるルールでしたよね。

ただし、「かっこ( )」がある場合は、「かっこ( )」を先に計算します。

スクラッチの「足し算」「引き算」「掛け算」「割り算」ブロックは、それぞれが「かっこ( )」がついたブロックです。

ブロックのくっつけ方で、計算結果が変わるので注意が必要です。

（画像をクリックすると大きくなります。）

例えば、こちらの２つの例では、上の計算結果が「271」で下の計算結果が「541」になっています。

使っているブロックの種類や数は一緒ですが、くっつけ方が違うので、計算結果も変わってきます。

上のブロックのくっつけ方が、正しい計算式になりますので、「かっこ( )」を意識して、計算式を作りましょう。

アナログ時計のプログラムの流れ

すべてのプログラミングが終わったら、改めてアナログ時計のプログラムの流れを確認します。

（画像をクリックすると大きくなります。）

３つのスプライトのトリガーは、すべて「緑の旗が押されたとき」です。

そして、「ずっと」ブロックで、ぐるぐると反復処理をしています。

３つのスプライトが同時に動いている処理を何というか覚えていますか？

並列処理でしたよね。

プログラミングの世界では、処理を同時に並列して行うことを「並列処理」といいました。

今回のプログラムで言えば、「時針」「分針」「秒針」のプログラムを３つ同時に動いています。

ただし、同時といっても、スクラッチでは、一緒に処理をしているわけではなかったですよね。

スクラッチの処理について、忘れた子は、もう一度確認しましょう。

まとめ

「スクラッチでアナログ時計を作ってみよう①」では、スプライト「秒針」「分針」「時針」のプログラムを作っていきました。

完成したプログラムの中身を見たい人は、こちらから確認してください。

プログラムを確認する 　＞

それと、アナログ時計の秒針の動きには、下の２種類あることを知っていますか？

今回プログラミングした秒針の動きは、「ステップ秒針」の動きです。

連続秒針のプログラムを作りたい子は、次の「スクラッチでアナログ時計を作ってみよう！②」へ進みましょう！

---

【Step6】スクラッチでプログラミング！

• スクラッチでアナログ時計を作ってみよう①（ステップ秒針）　←今ココ
• スクラッチでアナログ時計を作ってみよう②（連続秒針）
• スクラッチでデジタル時計を作ってみよう①
• スクラッチでデジタル時計を作ってみよう②（クローン編）
• スクラッチでデジタル時計を作ってみよう③（文字の色を変える編）
• スクラッチでタイマーを作ってみよう

【Step5】「キー」「マウスクリック」のプログラムに挑戦！

• ピアノの鍵盤で楽器の音を出してみよう①
• ピアノの鍵盤で楽器の音を出してみよう②
• ピアノの鍵盤で楽器の音を出してみよう③

【Step4】歩くプログラムに挑戦！

• スクラッチでプログラミング009｜歩くプログラムを考える①
• スクラッチでプログラミング010｜歩くプログラムを考える②
• スクラッチでプログラミング011｜歩くプログラムを考える③
• スクラッチでプログラミング012｜歩くプログラムを考える④
• スクラッチでプログラミング013｜歩くプログラムを考える⑤
• スクラッチでプログラミング014｜歩くプログラムを考える⑥

【Step3】スクラッチとプログラミングの基本知識

• スクラッチでプログラミング001｜スクラッチの画面について
• スクラッチでプログラミング002｜ブロックの使い方①
• スクラッチでプログラミング003｜ブロックの使い方②
• スクラッチでプログラミング004｜コスチュームの使い方
• スクラッチでプログラミング005｜スプライトの座標
• スクラッチでプログラミング006｜スプライトの向き
• スクラッチでプログラミング007｜爆速で上達するプログラミングのコツ
• スクラッチでプログラミング008｜ブロックの結合・複製・削除方法

【Step1・Step2】スクラッチアカウント作成とログイン方法

• スクラッチアカウントの作成とログインする方法

アナログ時計のプログラム

アナログ時計のプログラムは、こちらの通りです。

（画像をクリックすると大きくなります。）

詳しい説明が必要な方は、最初に戻って読み進めてください。

「秒針」のプログラム

「秒針」は、60秒で1周（360度）。

「秒針」が、1秒間に進む角度は、

現在の「秒」から秒針の角度を求める計算式は、

「分針」のプログラム

「分針」は、60分で1周（360度）。

「分針」が、1分間に進む角度は、

現在の「分」から分針の角度を求める計算式は、

「時針」プログラム

「時針」は、12時間に1周（360度）。

「時針」が、1時間に進む角度は、

「時針」が、1分間に進む角度は、

現在の「時」「分」から時針の角度を求める計算式は、