スポンサーリンク

【Hour of Code】スクラッチでキャラクターを飛ばそう!

2018年8月13日

HourofCodeでスクラッチのチュートリアルを見つけました。
この記事は、スクラッチをいきなり始めるのに躊躇している方に向けて書いています。
やってみると、スクラッチでどういう手順で「キャラクターを飛ばそう」を作っていけばいいか、がていねいに解説されていてScratch初心者の方でも問題なくゲーム完成までたどり着きそうです。

【Hour of Code】スクラッチでキャラクターを飛ばそう!

【Hour of Code】スクラッチでキャラクターを飛ばそう!

Hour of Code

「コンピュータサイエンス」とは、コンピュータの考え方と、動き方を勉強することです。
Hour of Code は、「コード(プログラミング)」の謎を解き明かし、全ての人が基本を学ぶことができることを示し、コンピューターサイエンス入門として始まりました。
「なぜコンピュータサイエンスなのですか?」の問いに対し、「すべての 生徒にコンピュータサイエンスを学ぶ機会があるべきです。
それは、問題解決能力、論理的思考、創造性を育むことを助けます。
早くから始める事により、生徒は 21 世紀のキャリアで成功するための基礎を獲得します。」と答えています。

【Hour of Code】スクラッチでキャラクターを飛ばそう

飛んでるキャラクターが木やビルなどの障害物をよけていくゲームで、フラッピーバードみたいなものです。
キャラクターは左右上下の矢印キーで動かすことができます。
得点はなく、障害物に当たっても、クリアできても点数の増減はありません。

対象:初心者向け
長さ:約1時間
アクティビティ種別:自習用チュートリアル

上記のスクラッチの入門チュートリアルからも同じところに行けます。

さぁ、【Hour of Code】「スクラッチでキャラクターを飛ばそう」でプログラミングをはじめよう。

【Hour of Code】「スクラッチでキャラクターを飛ばそう」で学べる知識

  • 繰り返し(ループ)
  • 条件文(もし〇〇なら)
  • コスチュームの切り替え
  • インタラクティブ設定
  • 座標

まずは工程をかくにん

まずは動画で、「スクラッチでキャラクターを飛ばそう」がどんなものか確認してみましょう。
下にある「手順」をクリックすると、工程が出てきました。

  1. キャラクターの選択
  2. 飛ぶ準備をする
  3. 舞台背景を追加する
  4. 舞台背景を移動させる
  5. 見た目をスイッチする
  6. 空を描く
  7. インタラクティブにする
  8. 空に浮遊物を追加する
  9. カスタマイズと改善
  10. プロジェクトを共有

1 キャラクターの選択

「新しいスプライト」の横のひし形のアイコンをクリックし、テーマの「飛ぶ」のなかからお好きなキャラクターを選んでください。
最初にあった立ってるネコさんは右クリックして削除しておきます。

【Hour of Code】スクラッチでキャラクターを飛ばそう!1

2 飛ぶ準備をする

飛ぶキャラクターのスクリプトを作ります。
「旗クリック」に「前に出す」「〇〇と2秒言う」をつなげます。
○○には「飛ぶ時間だよ!」と入れました。

【Hour of Code】スクラッチでキャラクターを飛ばそう!2

3 舞台背景を追加する

飛ぶときに障害物となるものを選びます。
ビルと木を選びました、

【Hour of Code】スクラッチでキャラクターを飛ばそう!3

4 舞台背景を移動させる

ビルなどの障害物が右から左に移動すると、キャラクターが飛んで前に進んでいるように見えますね。
そこで、障害物を右端(x座標250)から徐々に動くように設定していきます。
「旗クリック」の下に「ずっと」「x座標を250にする」「100回繰り返す」「x座標を-5ずつ変える」を入れました。
試しに旗をクリックすると、ビルが右から左に移動していきます。

【Hour of Code】スクラッチでキャラクターを飛ばそう!4

5 見た目をスイッチする

コスチュームを変えることでパタパタと飛んでいるように見えるのでしたね。
キャラクターのスクリプトの「100回繰り返す」の上に「次のコスチュームにする」をはさみました。

【Hour of Code】スクラッチでキャラクターを飛ばそう!5

6 空を描く

背景に「bluesky2」を選択すると、空が出来上がります。

【Hour of Code】スクラッチでキャラクターを飛ばそう!6

7 インタラクティブにする

キャラクターが矢印キーで動くように設定していきます。
「上矢印キーが押されたとき」は「y座標を10ずつ変える」とし、「下矢印キー」のときは逆に「y座標を-10ずつ変える」とします。

【Hour of Code】スクラッチでキャラクターを飛ばそう!7

8 空に浮遊物を追加する

空に雲、ハート、ユニコーンなどの浮遊物を追加してみましょう。
今回は、雲を追加しました。

【Hour of Code】スクラッチでキャラクターを飛ばそう!8

9 カスタマイズと改善

キャラクターの動きを上下だけでなく、左右にも動けるようにしました。
浮遊物に触れた場合には、音を鳴らすようにします。
「旗クリック」を新たにドラッグし、そこに「ずっと」「もし○○なら」「音を鳴らす」をつなげます。
○○には「雲に触れたら」を入れます。
一度、ゲームを試してみます。
不具合が出た場合は、その部分を修正しましょう。

【Hour of Code】スクラッチでキャラクターを飛ばそう!9

10 プロジェクトを共有

プロジェクトに名前をつけて完成です。
共有したい人はサインアップし、共有します。

【Hour of Code】スクラッチでキャラクターを飛ばそう!10

最初は誰だって初心者です。
やりながら順番に覚えていきましょう。
さぁ、プログラミングをはじめましょう。