Scratch – インクループ株式会社|神奈川県相模原市 ホームページ制作、WEBマーケティング https://incloop.com インクループ株式会社は、お客様の顧客獲得をマーケティングを活用して支援する会社です。 データ分析、市場調査に基づく企画立案、コンテンツ制作、運用を通じてお客様の目標を実現します。 Thu, 19 Nov 2020 00:59:16 +0000 ja hourly 1 https://wordpress.org/?v=4.9.19 初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-7/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-7/#respond Fri, 25 Aug 2017 05:43:50 +0000 https://incloop.com/?p=13752

幼稚園児用のプログラミングアプリ「Scratch Jr」 Scratchは8歳以上を対象としていますが、それ以 […]]]>

幼稚園児用のプログラミングアプリ「Scratch Jr」

Scratchは8歳以上を対象としていますが、それ以下はないの? となったときにご紹介されるのが多いのが「Scratch Jr」です。対象年齢が5歳から7歳までとなっており、Scratchよりも簡単な操作方式となっており、難しい条件分岐なども存在しません。イラストアイコンベースになっていますので、画面を見るだけで直観的に操作ができます。

https://www.scratchjr.org/

タブレットのみのアプリ、ってところがオシイですが、お子さんがさらっと遊ぶにはやっぱりタブレットサイズがよいのでしょうね。

これからの情報端末機器は、だいたいが「直観的に」「説明書がなくとも」操作ができるようにデザインされていくことと思います。iPhoneなんてすでに説明書ないですし、android系も端末の中に説明書がある時代。「手元に説明書がないと落ち着かない……」なんて人には酷かもしれませんが、落ち着くと落ち着くまいと、分厚い説明書は淘汰されていってしまうでしょう。説明書作るコスト考えたら、そのコストを機器を洗練させる方に回した方がよいですしね。

あらゆる機器を直観的に使える能力を培うには、やっぱり実践することが第一。これからは「習うより慣れろ」というよりも「習いながら慣れろ」のほうがいいのかもしれません。

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを3回まで終えてわかったこと初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、こ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを4つまでやってScratchのStep by Stepは2017年6月9日現在で13項目あります。一つ一つの項目に反復作業と新規学習項目...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その5【ミュージックを作ろう!】 - incloop.com
これまでのシリーズはこちらゲーム要素の入ったScratch六回目ともなってくるとやはりやることが高度ですね!けれど六回目でもうゲームが作れるというのはやはりすごいな...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その6【ゴールまで競争しよう】 - incloop.com
これまでのシリーズはこちらScratchのチュートリアルの折り返し本日のScratchのチュートリアルで丁度半分となります。ということはScratchの機能の半分はほぼ習得してい...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その7【かくれんぼをしよう】 - incloop.com
これまでのシリーズはこちらScratchチームとスクラッチャーズの取り組みこちらがスクラッチチームのTwitterアカウント。https://twitter.com/scratchツイートは当然すべ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その8【オシャレをしよう】 - incloop.com
これまでのシリーズはこちら夏休みのプログラミング体験。様々なキットも登場で自由研究に最適。小学校でプログラミングが必須科目になるかも、という話がありますが、...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その9【物語をつくろう】 - incloop.com

本日の課題:ポンゲームを作ろう!

ポンゲームというのは「Pone Game」のことで、ボードを操作してボールをバウンドさせ、それによってブロックを崩すようなゲームのことを言います。インベーダーゲームみたいなもの、といったほうが日本ではわかりやすいのかもしれませんね。

手順はこちら。

  1. 背景を選択
  2. ボールを選択
  3. ボールを動かす
  4. 動かしてバウンドさせる
  5. パドルを選ぶ
  6. パドルをあやつる
  7. パドルで跳ね返す
  8. 音を追加する
  9. チャレンジの追加
  10. 拡張とカスタマイズ
  11. ゲームを共有

ここでいう「パドル」とはカヌーの「櫂」のことで、意味合い的には「自分で操作してコントロールできるもの」くらいに受け取っておくのがいいかもしれませんね。

背景を追加する・ボールを選択

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】 背景やスプライトの設置

まずはいつも通り「背景を追加する」をクリックして背景を配置した後、ゲームの中心となるボールを配置します。Scratch上での図やイラストのことを「スプライト」と呼ぶのはもうお馴染みですね。

ボールを動かす・動かしてバウンドさせる

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】 ボールを動かす

「動き」のスクリプトから「~歩動かす」を選択後、「もし、端についたら跳ね返る」というスクリプトを組み合わせ、これを「制御」のスクリプトにある「ずっと」で囲います。

さてお気づきでしょうか。このポンゲームのマニュアル、日本語対応がガッチリされているのです。
Scratch、どんどんリニューアルされております……いまやこれまでやっていたマニュアルがすべてきちんと日本語化されているという……。英語のハードルが下がった分、Scratch自体とっつきやすくなっていますね!

このスクリプトだと壁に向かって跳ね返った瞬間同じ方向にしか跳ね返らないのですが、これに角度をつけるには以下のようにスクリプトを組みます。
緑のフラッグもつけて体裁を整えましょう。

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】 角度をつける

パドルを選ぶ・パドルをあやつる・パドルで跳ね返す

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】パドルの設定

スプライトからパドルを選んで配置したら、これをマウスポインタに追従させるように上記のようなスクリプトを組みます。
あまりにもマウスポインタが好きすぎて動きがめんどうくさくなるパドルになります。

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】 マウスポインタとパドル

パドルにあたったらボールが跳ね返るようにするために、上記のようなスクリプトを組みます。
ここで大事なのは「1秒待つ」というスクリプト。これを除いてしまうとボールがパドルに接触した瞬間ものすごく妙な動きをします。

○ 音を追加する・チャレンジの追加
子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】跳ね返り

スクリプトに音を追加して、跳ね返る瞬間に音が鳴るようにします。「音」タブから任意の音を追加し、適応させましょう。

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】チャレンジの追加

背景画像をクリックした後、タブで「背景」を指定します。選んだ背景の一番下にラインを引きましょう。単色です。シフトを押しながらドラッグをするときれいに引けます。

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】ストップするためのスクリプト

さきほど引いた赤いラインにボールが触れたら、すべてを停止させるスクリプトを組みます。
「調べる」スクリプトの中から「■色に触れた」いうブロックを選んで、■を一度クリックした後、マウスポインタが指に代わりますので該当のカラーの上でクリックします。

……が、パドルをマウスポインタに追従、という指定をしていると何回やっても緑しか取れない。
当たり前と言っては当たり前なんですが、困ったら一度パドルのスプライトをクリックして、「緑フラッグ」をブロックから外しておきましょう。後でもとにもどせば、自然と同じ動きをするようになります。

その他オプション

効果を追加…パドルにボールが当たったとき、ボールの色を変えるスクリプト

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】ボールの色を変える

スタートの位置を設定

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】スタート位置の設定

・ポイントの追加

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】スコアの追加

右上にしか行かないから角度はいじってみる

カスタマイズには載っていなかったのですが、やはり決められた数値だとボールの軌道が読めてしまうオトナのめんどくさい脳みそのため、「そうか乱数入れればいいのか」という結論により、緑の「演算」スクリプトから乱数を突っ込んでみました。

子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その10【ポンゲームを作ろう】演算

結果、跳ね返りの角度が未知数になって、時々運ゲーになるようになりました。ううんデンジャラス。

緑のフラッグを押してスタート、マウスポインタで動くパドルでボールを操作できます。赤のラインにボールが触れるとアウトです。ゲームをリセットして再度チャレンジしてください。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-7/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その9【物語をつくろう】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-6/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-6/#respond Fri, 04 Aug 2017 05:05:38 +0000 https://incloop.com/?p=13542

これまでのシリーズはこちら 夏休みのプログラミング体験。様々なキットも登場で自由研究に最適。 小学校でプログラ […]]]>

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを3回まで終えてわかったこと初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、こ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを4つまでやってScratchのStep by Stepは2017年6月9日現在で13項目あります。一つ一つの項目に反復作業と新規学習項目...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その5【ミュージックを作ろう!】 - incloop.com
これまでのシリーズはこちらゲーム要素の入ったScratch六回目ともなってくるとやはりやることが高度ですね!けれど六回目でもうゲームが作れるというのはやはりすごいな...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その6【ゴールまで競争しよう】 - incloop.com
これまでのシリーズはこちらScratchのチュートリアルの折り返し本日のScratchのチュートリアルで丁度半分となります。ということはScratchの機能の半分はほぼ習得してい...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その7【かくれんぼをしよう】 - incloop.com
これまでのシリーズはこちらScratchチームとスクラッチャーズの取り組みこちらがスクラッチチームのTwitterアカウント。https://twitter.com/scratchツイートは当然すべ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その8【オシャレをしよう】 - incloop.com

夏休みのプログラミング体験。様々なキットも登場で自由研究に最適。

小学校でプログラミングが必須科目になるかも、という話がありますが、それに伴って各所でScratchを使ったプログラミング講座が流行しています。中にはこんなキットも。

株式会社スイッチエデュケーションは、子供向けプログラミング言語「Scratch」につないで遊べるセンサーボード「いぬボード(税込み1,944円)」とその関連キットを2017...
スイッチエデュケーション、子供向けプログラミング言語「Scratch」につないで遊べる センサーボード「いぬボード」&関連キット発売 - iotnews.jp

いぬボード。
かわいいけどまんまですがな。

相模原市産業会館パソコン教室では、夏休み限定でこんなものも作成しています。

うきうきロボットプログラミング
どこでも●ア~。
これが意外とできると楽しい。
でも、プログラミングどころかパソコンさえ触ったことのないうちの子が、そんな講座に行ってもなぁ、と思うお母さまお父様もいらっしゃるかと思います。
ブラインドタッチ、どころかキーボードって何……? マウスって? エンターキーって何?
あんまり詳しいことは教えられない、不安だ……となったときは、パソコン教室に頼ってもいいと思うのです。
初心者どころのレベルじゃない! って言ってもみんな大概初めてってそんなもんですよね。

宣伝!

相模原市産業会館パソコン教室

子ども向けプログラミング教室

本日の課題:物語をつくろう! ~ノベルゲームの作成~

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】

パソコンで見ることのできる絵本みたいな感じですね。自分で作っているオトナの方でも、これができるとちょっと創作の幅が広がったりするのでしょうか。これはちょっとわくわくしますね。

手順はこちら。

  1. 背景を選択
  2. キャラクターの選択
  3. 物語を開始する
  4. 新しいキャラクターが登場
  5. 場面を追加する
  6. 場面をスイッチする
  7. おしゃべりをはじめる
  8. 何か言い返す
  9. 別の所にずらす
  10. 場面を追加する
  11. 場面に登場する
  12. 操作できるようにする
  13. 物語を改良する

背景を用意してキャラクターを置き、物語を開始する

復習するところはどんどん端折っていきますが、工程3まででこんな感じ。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】背景を用意してキャラクターを置き、物語を開始する

背景を追加したり、キャラクターを設定したり、しゃべらせたりするところはほぼほぼ前までの復習ですね。Scratchにおけるキャラクターなどの図は「スプライト」であるということはもはやお馴染みです。

ナビゲーションのなかに入っている「I want to explore!」は「私は探検したいです」という意味。これからこの少女、どうやら冒険に出るようです。うまいことナビしてあげられるとよいのですが。

新しいキャラクターが登場する

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】新しいキャラクターが登場する

音を鳴らす、というところで「音タブ」を開いて音の種類を追加するところは復習ですね。新しく「見た目」のスクリプトで「隠す」と「表示する」というのを使っていくようになりました。フラッグを押して2秒経ったら音がなって表示されるようです。

探検するのにユニコーン呼び出しちゃうとか夢ありますね。

次の場面を追加して場面をスイッチする。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】次の場面を追加して場面をスイッチする。

次の場面を追加しましょう。背景を追加すると自動的に上記のような画面になります。この状態をつくれたら、改めてユニコーンのスプライトをクリックして表示しましょう。「コスチューム」タブになってしまう場合は「スクリプト」タブをクリックしてブロックのある画面に移行します。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】次の場面を追加して場面をスイッチする。

フラッグを押して確認してみましょう。なかなかいい感じに切り替わっています。「スイッチ」は画面を切り替えることであってぽちっとなするアレではないです。

おしゃべりをはじめる、何か言い返す。「メッセージを送る」の使い方

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】次の場面を追加して場面をスイッチする。

画面が切り替わった=スイッチしたときに吹き出しを出すことができます。これに「メッセージを送る」英語でいうところの「broadcast:放送」を使うと、確定していないスプライトにメッセージを送ることができます。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】次の場面を追加して場面をスイッチする。

受取型の設定はこのような感じ。スムーズな会話が成立します。

別のところにずらす、場面を追加する

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】おしゃべりをはじめる、何か言い返す。「メッセージを送る」の使い方

移動のブロック設置はちょっとややこしいことになっています。

  1. スプライトを選択する
  2. スプライトの現在の座標を確認する(座標Aとする)
  3. スプライトを移動したい場所において、座標を確認する(座標Bとする)
  4. スプライトをもとの座標に戻す(座標Aを記入して、ブロックをクリックする)
  5. 移動させるためスクリプトのブロックをエリアに配置する。
  6. エリアに配置したスクリプトに座標Bを記入する

これが一連の流れになります。

「スプライトの最初の座標」と「スプライトの移動先の座標」の両方を取得しておかないと、「どこから」「どこまで」を指定できなくなってしまうのですね。この辺本当にちょっと理解が難しい。ナビ通りにやるとたぶん一度は躓きます。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】おしゃべりをはじめる、何か言い返す。「メッセージを送る」の使い方

移動終了後に場面を追加してスイッチします。
場面が移動した後、何かをキャラクターに発見させましょう。スプライトを追加して、「隠す」と「表示する」をうまく使っていきます。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】おしゃべりをはじめる、何か言い返す。「メッセージを送る」の使い方

操作できるようにする、物語を改良する。

最後に落ちている鍵をクリックすると、キラキラ七色に光るようにエフェクトを追加します。

子ども向け教育プログラミング言語Scratch(スクラッチ)【物語をつくろう】操作できるようにする、物語を改良する。

このほかにもいろいろな効果が期待できます。今までのことを総括してやってみたいことをためしてみましょう。

できあがったプログラムがこちら。

グリーンフラッグを押すとスタートします。最後、落ちている鍵をクリックするときらきらしますので、ためしにぽちぽちしてみてください。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-6/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その8【オシャレをしよう】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-5/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-5/#respond Fri, 07 Jul 2017 07:56:54 +0000 https://incloop.com/?p=13184

これまでのシリーズはこちら Scratchチームとスクラッチャーズの取り組み こちらがスクラッチチームのTwi […]]]>

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを3回まで終えてわかったこと初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、こ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを4つまでやってScratchのStep by Stepは2017年6月9日現在で13項目あります。一つ一つの項目に反復作業と新規学習項目...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その5【ミュージックを作ろう!】 - incloop.com
これまでのシリーズはこちらゲーム要素の入ったScratch六回目ともなってくるとやはりやることが高度ですね!けれど六回目でもうゲームが作れるというのはやはりすごいな...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その6【ゴールまで競争しよう】 - incloop.com
これまでのシリーズはこちらScratchのチュートリアルの折り返し本日のScratchのチュートリアルで丁度半分となります。ということはScratchの機能の半分はほぼ習得してい...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その7【かくれんぼをしよう】 - incloop.com

Scratchチームとスクラッチャーズの取り組み

こちらがスクラッチチームのTwitterアカウント。
https://twitter.com/scratch

ツイートは当然すべて英語ですが、動画などで非常にわかりやすく「どんなことができるのか」を見せてくれています。

また、プログラムの中にはこんなものも。
https://scratch.mit.edu/studios/1959143/

日本ユーザーとして常々Google翻訳に頼りきりの自分としては、こういった説明本当に助かります。

Scratchのアカウントをとって、プロジェクトを作り、あれこれと試しているうちに「これは初心者じゃわからないよな…」という言語によくあたります。「プロジェクト」なんて一口にいっても、大人はだいたいわかるのでしょうが、子どもはどこまで理解できるのだろうと思いつつ、ちょっと言語をまとめてみます。
大人にとって当たり前でも、子どもにとっては出会うのが初めての言葉って、結構多いんですよね。

  • プロジェクト:Scratch上では、Scratchで作る実際のプログラムのこと。「走らせる」ことができるもの。
  • キュレーション:インターネット上での情報を収集してまとめること。Scratch上では、自分で作ったプロジェクトを、一つの紹介する場所としてまとめることを示す。スタジオ、という言い方をされている。スタジオにはアカウント取得者=自分以外にも自分以外のユーザーを招待することができて、プロジェクトを共有することができる。この参加者を「キュレーター」という。

※キュレーションしたスタジオ=LINEのグループ キュレーター=LINEのグループにいる一人一人 とした方が分かりやすいかも。

  • フォロー:FacebookやTwitterと同じ概念。気になったプロジェクトを作っている人が、何かプロジェクトを新しく更新したときなど、優先的に情報を手に入れることができる。
  • コミュニティ:Scratchをしている人々のかかわりすべてを示す。フォロー、コメント、プロジェクトへの参加のほか、ディスカッションフォーラムなど、様々な形をもつ。

Scratchでのコミュニケーションは大概が英語です。コレが結構ツライ……さすがに基礎教育を受けた身とはいえ、英語の嵐だとちょっとあたまが痛くなります。
日本語ユーザーにとって、Scratchが分からなくなったときに聞く場所は、コミュニティではないのが現状です。そうでなかったらやはりプログラミングのできる塾などに行くしかないのでしょう。ネット上でもあんまりノウハウがないのが現状です。

ちなみにこちらが現在の日本語ScratchWiki。

https://jp.scratch-wiki.info/wiki/%E3%83%A1%E3%82%A4%E3%83%B3%E3%83%9A%E3%83%BC%E3%82%B8

こちらが日本語のディスカッションフォーラム。

https://scratch.mit.edu/discuss/18/

もうね、ここまで行くのが長かった!
あと質問コーナーのフォーラムの中に書いてあることが高度過ぎてもう何が何だかでした。頑張って下積みしようと思います。有志でお答えいただいている方にはホント頭が下がります……。

本日の課題:オシャレをしよう!~コスチュームの変更とスプライトの位置の設定

子どものころ、ぷちぷち厚紙のかわいいドレスをちぎって、人形の方に合わせてツメを折って重ねる、という遊びをよくしていましたが、それのプログラムバージョンです。

それではスプライトと背景を整えてスタートしていきましょう! キャラクターの選択をしていらないものを除去した状態からスタートです。

Scratch:オシャレをしよう-初めの画面

選ぶキャラクターのダニは、数パターンのコスチューム=外見を持っています。ポニテやベリーショートもいますので、好きなものを選びましょう。また、バケツを使うと各所の色が変えられます

Scratch:オシャレをしよう-キャラクターの外見変更

ついでにおさらい的にキャラクターに名前を名乗ってもらうようセリフを付けます。

Scratch:オシャレをしよう-セリフを言わせる

着替えさせるスプライトもいくつかピックアップしましょう。たまに体のサイズと合わないスプライトもあるようなのでご注意。ついでにここで、洋服の色を変えるブロックも組んでおきます。赤信号をクリックするとリセットされます。
他のスプライトにも「色を変える」を適応させたい場合は、作成したブロックを各々スプライトにドラッグ、でコピーができます。

Scratch:オシャレをしよう-色を変える

洋服のスプライトは、中に別のコスチュームを持っている場合があります。コスチュームを変えることのできるスクリプトも仕込んでいきましょう。シャツは「C」キーを押したときに変化します。

Scratch:オシャレをしよう-コスチュームを変える

キャラクターの最初の位置をブラさないために、ここもグリーンフラッグでスタート位置を固定させるようにしておきましょう。
さらに、服も色々追加して、グリーンフラッグでリセットしたときに元の位置に戻るように調整します。

Scratch:オシャレをしよう-位置を固定する

服を描いて着せることもできます。いやいや高度じゃね……?この体格にぴったり合うようなイラストを描くとなるとなかなか至難の業だと思うのですが……。ま、適当に。

Scratch:オシャレをしよう-洋服を描く

描けたスプライトの一覧にある、青い「i」ボタンを押すと、こんな画面が出てきます。
「プレイヤーがドラッグできるか」にチェックを入れましょう。

Scratch:オシャレをしよう-描画画像のコントロール

だぼっ
ちなみに微妙なストライプはただのエラーでこうなりました。

Scratch:オシャレをしよう-ダニ

背景を追加することもできます。背景アイコンをクリックして、別の背景を選択すると自動的にエリアに追加されます。これに以下のようなスクリプトを追加すると、右向き→キーで背景が変化します、

Scratch:オシャレをしよう-背景の追加

Scratch:オシャレをしよう-背景の追加2

 

出来上がりがコチラ

それぞれの衣服はドラッグすることができ、かつ、フラッグを押すことでリセットされます。
それぞれの衣裳をクリックすると色が変わり、シャツは「C」キーで見た目が変化します。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-5/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その7【かくれんぼをしよう】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-4/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-4/#respond Fri, 30 Jun 2017 02:35:21 +0000 https://incloop.com/?p=13011

これまでのシリーズはこちら Scratchのチュートリアルの折り返し 本日のScratchのチュートリアルで丁 […]]]>

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを3回まで終えてわかったこと初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、こ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを4つまでやってScratchのStep by Stepは2017年6月9日現在で13項目あります。一つ一つの項目に反復作業と新規学習項目...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その5【ミュージックを作ろう!】 - incloop.com
これまでのシリーズはこちらゲーム要素の入ったScratch六回目ともなってくるとやはりやることが高度ですね!けれど六回目でもうゲームが作れるというのはやはりすごいな...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その6【ゴールまで競争しよう】 - incloop.com

Scratchのチュートリアルの折り返し

本日のScratchのチュートリアルで丁度半分となります。ということはScratchの機能の半分はほぼ習得しているということになりますが、なんといいますか全くそんな気がしないのはなぜでしょうね……。

今回から英訳と簡単な基礎動作(スプライトの追加など)は省きながらやっていきます。

かくれんぼ

どんどん翻訳が進んでいます。本日の工程は11。
スプライトや背景を設置する工程は省きますが、その中で一つ「リミックス」という新しいものが出てきたのでご紹介します。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:工程】

リミックス|ベアベアプロジェクト

チュートリアル「かくれんぼ」をクリックすると、コミカルなムービーが一本流れます。背景を選択したあとの「スプライトの選択」項目で、こんな画面を見つけることができます。

このリンクをクリックすると、ScratchのCartoonwork提供の「しろくま」「ぱんだ」「グリズリー」と、木、背景が自動的に自分のScratchの画面にインプットされます。非常にクオリティの高いイラストで、一貫した世界観で作成することができるので、こちらもまたオススメです。なかなかに個性あるくまたちです。

スプライトを隠す、ループさせる、グリーンフラグでスタート

「見た目」のスクリプトカテゴリから「隠す」と「表示する」のブロックを選び、それぞれ1秒ずつ時間をもたせます。こんな感じですね。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:表示する/隠す】

これらをループさせます。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:ループ】

点滅か、という具合で隠れたり出てきたりします。
これにフラッグを付けて延々と隠れたり出てきたりさせましょう。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:フラッグでスタート】

クリックしたら「お話」

クリックされたらスプライトにアクションをさせましょう。「このスプライトがクリックされたとき」というイベントブロックで、図のようなスプライトを組みます。
図では表示に5秒、「見つかっちゃった!」と言っているのが5秒となっていますが、どちらも1秒で大丈夫です。5秒にしてあるのはキャプチャをとるための時間がほしかったからなのです……。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:クリック時のアクション】

タイミングをランダムにする、出現場所をランダムにする

スプライトの出現感覚をコントロールしていきます。初めて「演算」のスクリプトを使いますね!

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:変数】

数値を変えるとなかなかに本当に「かくれんぼ」の感覚です。
また、これに加えて「動き」から「~へ行く」のブロックで、出現場所をランダムにしていきます。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:出現場所の処理】

クリックしたらポイント

初めて「変数」という言葉が明確に出てきました。「スコアを保存する変数」=(入れ物)となっていますが、これだけ読むと何を言っているのかさっぱりわかりませんね。
ひとまず手順に沿ってブロックを組んでいきましょう。

 

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:変数の追加1】 初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:変数の追加2】

「変数」というものはなんとも難しい概念です。「変形する入れ物」とか「入れ物」とか言われることが多いですが、これ以外に表現のしようがないところがアレですね。アレとか言いながら私もあんまりよくわかっていないんですけどね。

このままグリーンフラッグを押してゲームをスタートしますが、判定がきつい!
制作画面なのでどうしてもスプライトをつまんでしまうようで、ちゃんとクリックができない……。

隠れる場所を作る、キャラクターを追加する

スプライトを追加して手前に置くことで、キャラクターが隠れる場所を作ることができます。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【かくれんぼ:隠れ場所の設置1】

また、スプライトにスクリプトブロックをドラッグすることにより、スプライトにブロックをコピーすることができます。これは早く知りたかったなぁ……。

完成品

グリーンのフラッグを押すとゲームスタートです。かくれんぼするキャラクターをクリックするとスコアが溜まっていきます。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-4/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その6【ゴールまで競争しよう】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-3/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-3/#respond Fri, 23 Jun 2017 13:07:07 +0000 https://incloop.com/?p=12907

これまでのシリーズはこちら ゲーム要素の入ったScratch 六回目ともなってくるとやはりやることが高度ですね […]]]>

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを3回まで終えてわかったこと初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、こ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを4つまでやってScratchのStep by Stepは2017年6月9日現在で13項目あります。一つ一つの項目に反復作業と新規学習項目...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その5【ミュージックを作ろう!】 - incloop.com

ゲーム要素の入ったScratch

六回目ともなってくるとやはりやることが高度ですね!
けれど六回目でもうゲームが作れるというのはやはりすごいなぁと思う今日この頃です。張り切っていきましょう。

ふたりのキャラクターが競い合うゲームを作る

2016年のブラジルオリンピックの準備をしよう! って書いてありますがいやぁ、そんな時期につくられたプログラムレッスンなんですね。

レースの背景を選択

Click the icon to open the Backdrop library:
Then choose the backdrop you want (such as ‘track’ or ‘beach rio’):

アイコンをクリックして背景ライブラリを開きます:
次に、目的の背景(「トラック」や「ビーチリオ」など)を選択します。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:レースの背景を選択】

動かしはじめる

Click to select the cat:
(猫をクリックして選びましょう)
スクリプトエリアに動かすブロックをドラッグします。
Then, click on that block to make the cat sprite move:
(そのブロックをクリックしてネコスプライトを移動させます:)
Scratchでは動くことができるもの(ネコのような)は、’スプライト’と呼ばれています。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:動かしはじめる】

キーを押して移動させる

Click the Events category. Drag out a when this key pressed block and snap it on top:
(「イベント」カテゴリをクリックします。「このキーが押されたときブロック」をドラッグして上にスナップします:)

キーボードのスペースキーを押すたびにネコが動きます。
ドロップダウンメニューから異なるキーを選べます。
どのくらい速く動くか変更したいですか?動くブロックの中に異なる数字を入力してみてください。

 

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:キーを押して移動させる】
スペースキーだけでなくいろんなキーで動かすことができます。青いブロックの数字をいじることで、一度押すごとの距離が決められますのでお好みで。

ゴールラインを描く

レースに向けてゴールラインを準備しましょう。
Click the paintbrush icon to draw a new sprite:
(新しいスプライトを描画するには、ペイントブラシのアイコンをクリックします)
線ツールをクリックします。カラ―パレットから好みの色を選択します。
Tip: Hold down the Shift key while drawing the line to make it straight.
(ヒント:直線を描くときにShiftキーを押しながら直線を描きます)

You can make a thicker line using the ‘Line width’ slider:
(’線幅’スライダを使用して太い線を作ることができます:)
ステージ上の好きなところにゴールラインを描けます。
Tip: You can use the eraser tool to shorten the line so it fits on the track.
(ヒント:消しゴムツールを使用して、トラックにフィットするように線を短くすることができます)

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:ゴールラインを描く】

コスチュームのブラシを選ぶことによって、自由に描画ができるようになります。シフトを押しながらマウスをドラッグすると、まっすぐな線が退けます。左下にある線画で太さが調節できます。

ゴールラインに着いたら

クリックしてネコのスプライトを強調します
スクリプトタブをクリックします。
制御カテゴリーをクリックします。「もし」ブロックをドラックします。
Snap it onto your script, like this:
(次のようにスクリプトにスナップします)
Then, click the Sensing category and drag a touching block. Insert it into the if block, like this:
(次に、センシングカテゴリをクリックして、タッチブロックをドラッグします。次のようにifブロックに挿入します)
プルダウンメニューからSprite2(一番下の行の名前)を選択します。
ネコがゴールラインに達すると、何かが起こるようにしましょう!
見た目カテゴリーをクリックして言うブロックをドラッグします。
ネコにしゃべらせたいことを入力しよう。
ネコをゴールラインに向かって走らせてみよう。

ちょくちょく誤字がありますが気にせず行きましょう。
「もしブロック」はもともと「if」ブロックですね。「もし●●の条件なら」という状態を示します。

こんな感じにブロックを組みます。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:もしブロック】

「センシングカテゴリ」は「調べる」のことで、この中には「もし●●の条件なら」の●●の部分を埋めるものがブロックとしてカテゴリ分けされています。
ここで、「猫のスプライト」が「スプライト1=ゴールライン」に触れたなら、という文章を作ります。ドロップダウンでいろいろ選べるので試してみましょう。
こんな感じにブロックはできあがります。

 

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:「調べる」のカテゴリ1】

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:「調べる」のカテゴリ2】

これで条件ができましたので、どうするか、の指示を出します。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:「調べる」のカテゴリ3】

php的に言えばこうですかね。

if(条件){
条件が真であれば実行
}

if(猫がゴールラインに触れたとき){
猫が「ゴールしたよ!」と言う
}

スタート地点に戻る

ゲームの開始する時にスプライトをリセットします。
スプライトをスタートするところにドラックして移動します。
次に動きカテゴリーをクリックします。
スクリプトエリアにx座標を○に、y座標を○にする ブロックをドラッグしblock into the Scripts area.
そのブロックをクリックして試しましょう。
Tip: When you drag a sprite to where you want it on the Stage, the go to x y blocks in the palette will update with its current x and y position.
Click the Events category.
Drag out a when clicked block and snap it on top.
グリーンフラグをクリックした時、ネコはスタート地点に進みます。

ここまでくると日本語と英語がごっちゃになってよくわかりませんね。
簡易的に訳すと、

ゲームの開始をするときに、スプライト(猫)をもとの位置に戻るように設定しましょう。
スプライトをスタートするところにドラッグして移動させます。スクリプトから「動き」カテゴリを選択し、スプライトエリア=ブロックを積む場所に、「x座標を●にして、y座標を●にする」というブロックを入れましょう。
そのブロックをクリックすると、記入した座標に戻ります。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:スタート地点に戻る】

ヒント:スプライトをステージ上のどこかにドラッグすると、パレットのx座標とy座標が更新されて、数値で座標が表示されます。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:スタート地点に戻る2】

「スクリプト」タブから「イベント」を選び、「緑の旗をクリックしたとき」というブロックをスプライトエリアにドラッグします。これで緑の旗をクリックすると、猫はいつもスタート地点に戻ります。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:スタート地点に戻る3】

レースにスプライトを追加

Choose to add another sprite:
(別のスプライトを追加します)
今度は、ネコと同じようにスプライトをコーディングします。スタート地点と押すキーは別のものを選択してください。

レースは一人じゃできませんものね!

 

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:レースにスプライトを追加】

好みのゲームにする

ちょっともう日本語が迷子になりつつあったので、ここからはTIPSとして書いていこうと思います。

このゲームに何を追加したいですか? これらのアイディアのいくつかを試してみてください。

サウンドを追加

サウンドタブをクリックして、スピーカーアイコンで’clapping’(拍手)や応援のサウンドを選ぶことができます。タブをクリックします。 音カテゴリーをクリックしてdrag out a 終わるまで音を鳴らすブロック をドラッグします。
次のように、サウンドブロックをスクリプトにスナップします。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:サウンドを追加】

スプライトを動かす

コスチュームを切り替えてネコが走っているようにしましょう。
たった次のコスチュームブロックを追加するだけです。
コスチュームを調べるため、コスチュームタブをクリックします。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:スプライトを動かす】

コンピュータとの競争

スプライトのひとつを自動的に動かします。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:コンピュータとの競争】

ペイントと飾り

新しい背景を書いたり、スプライトにコスチュームを追加してゲームを改造します。

探検と試作

どんな方法でもカスタマイズできます! 水泳やその他のレースをしてみてください。

ログインしてから作りましょう

ここまでやって「あれー共有ボタンがおせないなー」ってなっていたんですが

 

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:ログイン】

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方【ゴールまで競争しよう:ログイン】
全部消えました。

……途中でログアウトしてしまったようです……なんてこと……割と本気で途方にくれました……。

サルベージしたものを置いておきます。みなさんお気を付けください……

※操作方法:スペースを押すとネコが走りますよ!!

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-3/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その5【ミュージックを作ろう!】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-2/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-2/#respond Fri, 09 Jun 2017 23:56:58 +0000 https://incloop.com/?p=12659

これまでのシリーズはこちら ScratchのStep by Stepを4つまでやって ScratchのStep […]]]>

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com
これまでのシリーズはこちらScratchのStep by Stepを3回まで終えてわかったこと初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、こ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 - incloop.com

ScratchのStep by Stepを4つまでやって

ScratchのStep by Stepは2017年6月9日現在で13項目あります。一つ一つの項目に反復作業と新規学習項目が含まれており、段階を追って学べる仕様にはなっていますが、やはり4項目を終えてみるとちょっと復習の時間がほしいな、と思う初心者。
特に、できることとできないことの把握の幅が、4項目の「Make It Fly」で一気に広がった印象があります。基礎的な動きがどういったものなのか、というのは把握できても、これができたかもしれない、という発想にのちのち行きつくのがちょっと難しいのですね

たぶん一つのStep by Stepの項目を1つ終えたら、自己流で何かしらの似たようなScratchを組むのがよいのではないでしょうか。やっぱりお勉強と一緒で反復作業大事ですね。

Scratchの日本語化が進んでいます

ところでScratch、日本語対応がじゃんじゃん進んでいますね!

ミュージックを作ろう!

Choose musical instruments, add sounds, and press keys to play music.
楽器を選択し、音を追加し、キーを押して音楽を再生しよう!

ゲームにはグラフィック、サウンド、ストーリーの三本柱があるのですが、プログラムをエンターテインメントで覚えるにこのあたりをおさえておくと大変やりやすいということなのでしょうかね。音楽にはとんと縁のないデザイナーですがもそもそやっていきましょう。

ドラムを選ぶ

Click this icon to choose a new sprite:
Click the ‘Music’ theme and choose a drum.
In Scratch, characters and objects are called ‘sprites’.
Tip: If you don’t want the cat in your project, you can delete it using the scissors tool.
Click on the scissors, then click on the cat.

新しいスプライトを選択するには、このアイコンをクリックしてね!
「音楽」テーマをクリックし、ドラムを選択します。
(スクラッチでは、文字とオブジェクトは「スプライト」と呼ばれます)
ヒント:あなたのプロジェクトで猫を望んでいない場合は、はさみツールを使用して猫を削除することができます。
はさみをクリックし、猫をクリックしてください。

以前にやったことがあるスプライト挿入の基本ですね。

【Scratch】スプライトの挿入【Scratch】スプライトの挿入2

ナビの通りにスプライトを選びましたがこれはドラムか???

【Scratch】ねこを消す

ねこちゃんは消しちゃいましょう。

ドラムを鳴らす

Build a script to play a drum sound:
Press the space key to try it.
Click the Sounds tab to preview the sounds.

ドラムサウンドを再生するためのスクリプトを作成するよ!
Spaceキーを押して試してみてね。
[サウンド]タブをクリックしてサウンドをプレビューします。

お子さんはプレビューって言ってわかるものでしょうかね。試しに見てみようね! くらいなんですけど。

【Scratch】ドラムを鳴らす1 【Scratch】ドラムを鳴らす2 【Scratch】ドラムを鳴らす3

サウンドタブ(日本語では「音」のタブ)をクリックすると、黒い波の三角形みたいなものが横にならんで見えます。これはドラッグすることで選択できて(紫っぽい青に選択範囲に色が付きます)効果から編集が可能のようです。が、めったなことがない限りはやらないほうがよさげですね、特に私はこう、音楽というものには縁がないので……。

high low muted tap などいろいろコンガにも音の種類がありますね。

リズムをつける

Add more sounds to make a pattern. Use wait blocks to pause between sounds.
You can add more sounds and play with the timing to customize your rhythm.
Your script will look something like this:
Press the space key to try it.

さらに音を加えてパターンを作ろう! 待機ブロックを使って、サウンド間で一時停止をするよ。
あなたのリズムで変えるために、たくさんのサウンドを追加できて、タイミングを合わせて演奏することができるよ。
あなたのスクリプトは次のような感じになるよ。
Spaceキーを押して試してみてね!

【Scratch】リズムを付ける

りずみかる。
待機ブロック、というあたらしい単語が出てきましたね。秒数はコンマ以下も存分に使えるようです。

繰り返そう

Use a repeat block to make it play more than once.
Your script will look something like this:

リピートブロックを使って複数回再生させるよ!
あなたのスクリプトは次のようになります:

やっていて初めて気づいたのですが、ブロックの左上が半円っぽくまるくなっているブロック(主にイベントブロック)は、下の改装にしかリピートもブロックもつけられないんですね……まあそうか……当たり前か……。

【Scratch】繰り返す

●ドラムのアニメーション

You can animate your instrument by adding a next costume block.
Click the Costumes tab to see the sprite’s costumes.

「次のコスチューム」ブロックを追加して、楽器をアニメにすることができるよ!
コスチュームタブをクリックするとスプライトの衣装を見ることができます。

ビジュアルもリズミカル。
コスチュームのタブをクリックしてスプライトを見てンると、bのイメージにエフェクトがついていますね。たぶんここを増やすと、ネクストコスチュームなんで、あるだけのコスチュームをめぐっていくのでしょう。

【Scratch】ドラムのアニメーション2

楽器を奏でる

Click this icon to choose a new sprite:
Click the ‘Music’ category to choose an instrument (such as Saxophone or Trumpet).
Build a script to play a sound when you press a key:
Choose ‘up arrow’ or another key:

新しいスプライトを選択するには、このアイコンをクリックします。
「音楽」カテゴリをクリックして、楽器(サックスやトランペットなど)を選択します。
キーを押したときにサウンドを再生するスクリプトを作成するよ:
「上矢印」または別のキーを選択します。

【Scratch】楽器を奏でる 【Scratch】楽器を奏でる

外国では「カウベル」が普通にあるようですね。
でもエレクトーンの手の抜き方はちょっとやばいんじゃないの……。

メロディをつける

サウンドを追加しメロディを追加します。

Use wait blocks to pause between sounds.
You can add more sounds and play with the timing to customize your melody.

待機ブロックを使って、サウンドとサウンドの間で一時停止します。
あなたのメロディーをつくるために、より多くの音を加えて、そのタイミングで演奏することができます。

突然の日本語……。

【Scratch】メロディをつける

カスタマイズ、って結構いろんなところで頻繁に使われていますが、日本語にしてみるととても難しい単語になっています。

辞書で引くと「注文通りに作る」という意味なので、スターバックスのカスタマイズ、とか、自作パソコン、とかに使われるのは確かにカスタマイズなのでしょうが、ここでいうカスタマイズとは「あなたの注文通りにブロックを組み立てればあなたの思う通りに演奏できるよ」の意味になります。
クリエイトとカスタマイズはよく似ているのですが、フルオーダーメイドがクリエイトでレディメイドがカスタマイズですかね。難しいですね。詳しいとこは教えてTさん!

和音をつける

Play more than one sound at a time to make a chord, like this:
Use the dropdown menu to choose ‘down arrow’ or another key.
You can also add other chords, like this:

一度に複数のサウンドを演奏して、和音を作りましょう。
ドロップダウンメニューを使って、「下矢印」または別のキーを選択します。
次のように他のコードを追加することもできます:

ブロックを多数作って同時にキーを押すことで、ピアノのように和音になるメロディーが作れる、ということですね。

【Scratch】和音を付ける

指定された以外にもいろいろ音は追加できるので、どの音なのかわかる人はこれだけで簡易なメロディーが作れてしまいそうですね。

ランダムノートの演奏

Click this icon to choose another musical instrument sprite, such as Piano or Guitar.
Build a script like this:
To make it change color each time, add a change color block to your script like this:
Tip: Click the Sounds tab to see how many sounds are in your sprite. Type that number into the pick random block.

このアイコンをクリックすると、ピアノやギターなどの別の楽器スプライトを選択できます。
次のようなスクリプトを作成します。
毎回色を変更するには、次のように「変更カラーブロック」をスクリプトに追加します。
ヒント:[サウンド]タブをクリックして、スプライトに含まれるサウンドの数を確認します。「ピックランダムブロック」にその番号を入力します。

【Scratch】ランダムノートの演奏1 【Scratch】ランダムノートの演奏2 【Scratch】ランダムノートの演奏3 【Scratch】ランダムノートの演奏4

変更カラーブロックを利用してもギターの色はあんまりかわらないですね!!!

【Scratch】ランダムノートの演奏3

ボーカルを追加

Add any sprite you want!
Click the Sounds tab, then click :
Click the Vocals theme, then choose beatbox sounds.
Make a sequence, for example:
Or, add a script that plays a random sound:

必要なスプライトを追加してください!
[サウンド]タブをクリックし、次にこのアイコンをクリックします。
Vocalsテーマをクリックし、ビートボックスサウンドを選択します。
シーケンスを作成します。例:
または、ランダムなサウンドを再生するスクリプトを追加します。

【Scratch】ボーカルを追加1 【Scratch】ボーカルを追加2 【Scratch】ボーカルを追加3

音感なんてなかった。
乱数数値はコスチュームタブやサウンドタブに含まれる要素個数が原則のようです。コスチュームやサウンドは増やせるので、実質乱数も自分で決めている、ということですね。

サウンドの録音

If you have a microphone, you can record your own sounds.
Click the to choose a new sprite:
Click the microphone icon to record your own short sounds. Make a sound like ‘meep’, ‘bop’, or ‘zap.’
Trim the sound so it’s just one short syllable. To trim, highlight the part to delete, then press the ‘delete’ key.
Click the icon again to record another sound.
You can also record sounds using objects around you, such as by tapping a table or dropping a coin.

マイクを持っている場合は、自分で出す音を録音できます。
このアイコンをクリックして新しいスプライトを選択します:
自分の短い音を録音するには、マイクアイコンをクリックします。 ‘meep’、 ‘bop’、 ‘zap’のようなサウンドを作りましょう。
ちょうど1つの短い音節になるように音をトリムします。 削除するには、削除する部分をハイライト表示してから、「削除」キーを押します。
アイコンをもう一度クリックすると、別のサウンドが録音されます。

また、テーブルをタップするか、コインを落とすなど、周囲のオブジェクトを使用してサウンドを録音することもできます。

録音機能はついていませんのでこちらはちょっと試せないですね。

【Scratch】サウンドの録音1 【Scratch】サウンドの録音2 【Scratch】サウンドの録音3 【Scratch】サウンドの録音4

後の使い方はおおよそ一緒。そんなに長い音でなければあいさつ、ハッピーバースデーなどといった言葉も録音できそうですね。

演奏を続けよう

ADD MORE SPRITES

You can add and animate more instruments, singers, dancers, or other sprites.
背景の追加
Click the icon to open the Backdrop library:
PLAY NOTES
Another way to make music is to use the play note block.

Try a script like this:

You can choose the instrument and notes you want. You can also change the timing.

ADD A MUSIC LOOP
Choose ‘speaker’ or another sprite:

Choose a drum loop from the Sound library:
Loop your sound by adding a script like this:
HAVE A MAKEY MAKEY?
Connect your project to a Makey Makey. You can create musical instruments out of coins, clay, cardboard, and more! To find out more, see Makey Makey and Scratch.

【もっとたくさんのスプライトを加える】
もっとたくさんの楽器、歌手、ダンサー、その他のスプライトを追加してアニメをつくりことができます。
【背景の追加】
アイコンをクリックして背景ライブラリを開きます:
【プレイノート】
音楽を作るもう1つの方法は、プレイノートブロックを使用することです。
次のようなスクリプトを試してみてください:
必要な楽器と音符を選択できます。 タイミングを変更することもできます。
【音楽を追加する】
‘スピーカー’または別のスプライトを選択してください:
サウンドライブラリからドラムループを選択します:
次のようなスクリプトを追加してサウンドをループさせます:

【メイクすることができますか?】
プロジェクトをMakey Makeyに接続します。 コイン、粘土、厚紙などの楽器を作ることができます! 詳細については、Makey MakeyとScratchを参照してください。

ながい!

早い話がいろいろカスタマイズできるよーってことですね。背景をさくっと入れてみましょう。

【Scratch】背景の追加

さらにスピーカーを追加してさくっと音を適応してみましょう。そのままループするブロックを組みます。

【Scratch】スピーカーの追加【Scratch】スピーカーの追加

ここにある Makey Makey とは、ミノムシクリップでつなぐだけでいろんなものをパソコンのキーボードのキーにできるサイエンスキットです。
簡単にできそうなのでどこかの教室とかでやってないかな~~~(ちらっ ちらっ →)

できあがりがこちら!

音感なんてなかった。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9e-2/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その4【空を飛ばせよう】 https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9esc/ https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9esc/#respond Fri, 19 May 2017 08:23:48 +0000 https://incloop.com/?p=12339 子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

これまでのシリーズはこちら ScratchのStep by Stepを3回まで終えてわかったこと 初心者中の初 […]]]>
子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

これまでのシリーズはこちら

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、やってくれている人おらんでないですか。初心者はですねぇ、本を紹介されたって日本...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 - incloop.com
Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com
ん……?あなたは、Scratcherに招待されました!どういうことでしょう。Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a S...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 - incloop.com

ScratchのStep by Stepを3回まで終えてわかったこと

初心者中の初心者である私がよもや三回まで耐えられるとは思っていなかったのですが、ここまでやってわかったことをまとめてみます。

1.Scratchは「何を」「どのように」「どうする」で成り立っている

まるで日本語の「主語」「述語」のような関係ですが、Scratchにおける動作というのは基本的にこの三つの要素で成り立っています。そこにそれぞれブロックが当てはめられ、その通りに動作するわけですね。

  • 「スクリプトを」「10歩動かす」
  • 「スクリプトの色を」「25ずつ」「色を変える」
  • 「スクリプトのコスチュームを」「次のコスチュームに」「変える」

どの動作も3ワードずつくらいで1センテンスが構成されているようです。これからきっとこのセンテンスが長くなっていくんだろうなー。このワードがブロック単位で、センテンスがそれで構成された大きなブロック、ということです。視覚的に非常にわかりやすいですね。

2.Scratchは1センテンスをどうするか、というのも制御できる。

いわゆる「if文」といわれているものにあたるのでしょうが、上記で作られた1センテンスがそのまま1ワードの役割を果たすこともあるようです。

  • 「1センテンスを」「10回繰り返す」
  • 「1センテンスを」「1秒待って」「1センテンスを」「1秒待つ」

のような使い方ができるわけですね。
大きなブロックを構成した時、それもまたブロック、といわんばかりに動作を後付けすることができる、ということです。ううん言語化すると難しい。
ひとまずこの2点をおさえたうえで、色を変えたり、音を鳴らしたりすることができると理解しました。それでは本日のStep by Stepに取り掛かりましょう!

Make It Fly | 飛ばせよう!

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

Choose a character and make it fly!
キャラクターを選んで飛ばそう!

画面に出ているキャラクターアニメーションほどがっつり作りこむことはできないようですが、頑張ってユーキャンフライしてみましょう。

Choose a Character | キャラクターを選んでね

You can make anything fly!
Click the icon that looks like this to choose a character:
Click the ‘Flying’ theme, then select the character you want:
Or, click the paintbrush to draw your own character.
Want a character that looks like you? Make your own avatar on the Powerpuff Yourself website.
Then, click the folder icon to upload the image from your computer.

Want to delete a character? Click the scissors tool then click the character.

Tip: In Scratch, characters are called ‘sprites’.

どんなものでも空を飛ばせることができるよ!
こんな感じのアイコンをクリックして、好きなキャラクターを選んでね。
「フライング(Flying)」のテーマをクリックして、自分の好きなキャラクターを選ぼう!
ペイントブラシをクリックして自分のキャラクターを描いてもいいよ。
もしこんな感じのキャラクターがほしかったら、Powerpuff Yourselfのウェブサイトでアバターを作ってね。
アバターを作って自分のパソコンに保存したら、フォルダアイコンをクリックすることでScratchに画像をアップロードすることができるよ。

キャラクターを消したいときにははさみツールをクリックしたあと、キャラクターをクリックしてね。

※Scratchではキャラクターを「スプライト」って呼ぶよ!

さすがに四回目ともなると文字量がすごいことになります。ガチ日本語版になるのはまだまだ先かもしれませんね。

ちなみにPowerpuff Yourselfのサイトはこちらです。
https://powerpuffyourself.com/#!/ja

頑張って作ってみたのがこちら

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

ハグモンスターらしいです。
でも今回は使いません。
ねこちゃんフライです。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】 子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

はさみを使ってもともとのねこちゃんにご退場願いまして、絵を描く場合は参考はこちらをどうぞ

Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com

Prepare to Fly | 飛ぶ準備をしよう!

Build a script to tell your character to say something:
You can type in your own words.
Click the green flag to start your script:
Your script will look something like this:

キャラクターに何か言わせるスクリプトを組んでね!
自分の言葉で入力することができるよ。
緑の旗をクリックするとスクリプトが始まるよ。
こんなふうになるよ。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

スクリプト>イベント の中に緑のフラッグ系ブロックがあることはもう覚えておかないとだめですね。
「前に出す」ブロックはスクリプト>見た目 の下の方にあります。

こんな感じで吹き出しが出ます。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

Add Scenery | 景色を追加しよう!

Click this icon to choose a new sprite:
Pick a sprite for your character to fly by, such as buildings or trees.
Drag the building or other sprite to the right-side of the Stage, like this:

Tip: Adjust the size of a sprite by clicking with the grow or shrink tool:

このアイコンをクリックして新しいスプライトを選んでね!
キャラクターが飛ぶための、ビルや木を選んでください。
建物やほかのスプライトを右側に設置すると、こんな感じになります。

※拡大または縮小ツールを利用して、スプライトのサイズは調整できるよ!

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

ここで新しい知識。拡大縮小そこにツールあったんかい。
いままでぽちぽち「大きさを変える」ブロックを押しながら調節していました……。

右下に設置してコントロールします。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

拡大縮小ツールは、スプライトの上でクリックし続けると大きさが変化していきます。解除するときは何にもスプライトがないところで一度クリックするようですね。
また、奥行き的な並び順ですが、「動かしたものが最前面にくる」ようです。一番後ろにあるものから配置していった方が作業効率はよいですね。

スプライトをコピーするときはスタンプツールをクリックして、コピーしたいスプライトをクリックするといいようです。

Make It Move | 動かしてみよう!

Move the building or other scenery so your character will look like it’s flying.
Add a script like this to your building or scenery:

Tip: Make sure to add the script to your building, tree, or other scenery.

Your script will look something like this:
x is the position on the Stage from left to right.

キャラクターが飛んでいるように見えるように、建物や風景を移動させるよ!
こんな感じのスクリプトを建物や風景に追加してね。

※建物、木、またはその他の風景にスクリプトを追加してください。

スクリプトは次のようになります。
xはステージ上の左から右への位置です。

動かすんだ?! いやそりゃそうか……何も考えずに見た目だけガンガン追加してしまいました。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

このスクリプトをそれぞれのスプライトすべてに当てはめていきます。

えっ なんかうまく動かない
案の定何か違う何が起こったのかわからない何で詰んだの(おろおろ)すること5分。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

最初のx軸の位置のセットは、ムービーのように250でセットしてしまうと最初の位置が必ずズレます。
図のところで見えるx座標が、配置したスプライトの座標となるようです。y軸はかわらないのでx軸をそれぞれのスプライトの座標に合わせて再度チャレンジ。

動くようにはなったのですが画面外までいってくれません。こういう仕様なのかな……? と疑心暗鬼に陥りつつも、x座標の移動数値回数(リピートの回数)を1.5倍に増やして再度チャレンジ
してみたはいいけれどやっぱり左端にたまってしまうようですね。仕様ですな。

Switch Looks | 見た目を切り替えよう!

If your building or scenery has more than one costume, you can switch between looks.
Add to your script like this:

Tip: Click the Costumes tab to see the sprite’s costumes.

Click the Scripts tab.
Your script will look something like this:
Click the green flag to start your script:

建物や風景に複数の衣裳がある場合は、ルックスを切り替えることができます。
次のように追加してみてね。

※スプライトの衣裳やルックスを見るには、「コスチュームタブ」をクリックしてみてね。
タブをクリックすると、あなたのスクリプトはこんな感じになっています。
緑の旗をクリックしてスタートしてね

この移動するアクションを保持したままコスチュームを変えます。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】 子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

Step By Stepの画面を収納すると右上にxの座標が出てきますね。
こんな感じにスクリプトを作成します。

画面が切り替わりますね。
いやしかし左端に画像が溜まるのが気になる……。

Paint the Sky | 空を塗ろう!

You can change the color of the sky.
Click the icon to open the Backdrop library:
Choose a plain backdrop, such as ‘blue sky2’ or ‘purple’.
You can use the paint bucket tool to change the color of your backdrop.
Tip: Use a plain background to help make your character look like it’s flying.

空の色を変えることができるよ!
アイコンをクリックして背景タブを開いてね。
「blue sky2」や「purple」などのプレーンな背景を選択します。
ペイントバケットツールを使用して、背景の色を変更できます。
※飛行機のようにキャラクターを見せるために、プレーンな背景を使用してください。

プレーンな背景って何よ、という方のために、プレーンとはオムレツとかソーダとかの形容詞でよく使われる意味での「あっさりとした」「簡素な」のことを言っています。プレーンなベーグルとか美味しいですよね。簡素なものには簡素なものにしかない味わい深さがあります。

グラデーションだけ突っ込んでみました。

Make It Interactive | 相互的にしよう!

Make your character move when you press a key.
Select your sprite by clicking on its thumbnail:
Add these scripts to make it move up and down:

Tip: Type a minus sign (-10) to move down.

Try it! Press the up and down arrow keys on your keyboard:

キーを押したときにキャラクターを移動させるよ!
サムネイルをクリックして動かすスプライトを選択してね。
これらのスクリプトを追加して、上下に移動させます。

※マイナス記号で入力すると下に移動するよ!

キーボードの上下を押して試してみてください!

インタラクティブ! なるほど、イマイチかみ砕きにくかったのですが、つまりこちらがアクションしたときにあちらもアクションしてくれるように結びつけることを英語的にインタラクティブというわけですね、なるほどなるほど。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

Add Things in the Sky | 何か空に追加しよう!

Add clouds, hearts, unicorns, or other floating things in the sky!
Click this icon to choose a new sprite:
To make it float, build a script like this:
Click the green flag to try it out:
Here’s an example with clouds floating across:

空に雲、心、ユニコーン、その他の浮遊物を追加してみよう!

新しいスプライトを選択するには、このアイコンをクリックします。
それを浮かせるには、次のようなスクリプトを作成します。
緑色の旗をクリックして試してみてください:

雲が浮かぶ例があります:

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】 子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

なんだかとても微妙な気持ちになる……左端に溜まるのが気になる……。

Customize and Enhance | カスタマイズと強化

What else do you want to add? Try some of these ideas.

・MOVE LEFT AND RIGHT
Add these scripts to move your character using the left and right arrow keys:

・COLLECT THINGS
Make a sound every time you touch something.
Click the green flag to try it out.

・ADD SCORE
Create a variable for keeping score.
Then add the score blocks to your script:

・EDIT YOUR CHARACTER
You can edit your character to make it look more like it’s flying.
Click the Costumes tab.
Click the ‘Add’ button to add a magic carpet or other object to your character

何を追加したいかな? これらのアイデアを試してみてね!

・左右に移動
左右の矢印キーを使用してキャラクターを移動するには次のスクリプトを追加します。

・モノを集める
何かに触れるたびに音を出します。
緑の旗をクリックしてみてね。

・スコアを加算する
スコアを保持するための変数を作成します。
次に、スコアブロックをスクリプトに追加します。

・キャラクターを編集する
キャラクターを編集して飛行のように見せることができます。
「コスチュームタブ」をクリックしてあなたのキャラクターに魔法のカーペットやその他のオブジェクトを追加することができます。「追加」ボタンをクリックしてね!

ねえいきなり難易度跳ね上がってない?!( ;∀;)

左右に移動させる

追加するスクリプトは以下の通りです。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

モノを集める

モノを集めるってどういうことなのでしょうか?

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

あ、鳴った。
割とうるさい。

スコアを加算する

ここで前触れもなく変数ですよ。

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】 子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

ひとまずナビ通りに作成すると、左上のスコアの数が一つずつ大きくなっていきます。なるほどこれで横スクロールゲームを作るわけですね……。

キャラクターを編集する

子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】 子ども向けプログラミングScratchをやってみよう!【空を呼ぶ】

風船持たせてみました。これはカンタン!
はい! 今回は以上です!

ちょっとここまでできたのであれば、次は何かしら作ってみたいなぁなんて思います。

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e5%ad%a6%e3%81%b6%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e6%95%99%e8%82%b2%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e8%a8%80%e8%aa%9esc/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その3【バースデーカードを作ろう!】 https://incloop.com/%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0scratch3/ https://incloop.com/%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0scratch3/#respond Fri, 12 May 2017 08:30:12 +0000 https://incloop.com/?p=12229 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

ん……? あなたは、Scratcherに招待されました! どういうことでしょう。 Now that you’v […]]]>
子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

ん……?

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

あなたは、Scratcherに招待されました!

どういうことでしょう。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

Now that you’ve gotten to know Scratch and the Scratch community, you are ready to become a Scratcher. The next few pages describe what that means. On the last page, you can choose to officially become a Scratcher.

スクラッチとスクラッチコミュニティになれてきたので、あなたはScratcherになる準備が整いました。次のいくつかのページでは、その意味を説明しています。最後のページでは、正式にScratcherになることを選択できます。

おう……?

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

Scratchers are respectful.
Everyone should feel welcome on Scratch, so we’re careful to be respectful to everyone.

Scratcherは敬意を表します。
誰もがScratchを歓迎しているはずなので、私たちは誰にでも敬意を表しています。

We’re constructive.
Many projects are made by kids who are new to Scratch. When we comment on other’s projects, we say something we like about it, and suggest ways to make it better.

私たちは建設的です。
多くのプロジェクトはスクラッチを初めて経験した子供たちによって行われます。 私たちが他のプロジェクトにコメントするとき、私たちはそれについて好きなことを言って、それをより良くする方法を提案します。

ほう……。

Scratcherはクレジットをつけます。
Scratchで共有されている作品は、どれでもリミックスすることができます。ただしリミックスするときは、元々の作者のクレジットをつけましょう(「作品への貢献」に元々の作者の名前を載せてください)。

突然の日本語!

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

We help keep the site friendly.(このサイトをフレンドリーにしておくお手伝いをお願いします)
Scratchが楽しくてやさしい場所なのは、Scratcherたちがそうなるよう努力しているからです。もしもいじわるなコメントやプロジェクトを見つけたら、「報告」ボタンを押してください。

なるほどなるほど。
どうやらこれらがScratcherになる条件のようです。

  • 誰に対しても敬意をもち親切に
  • プロジェクトをよりよくしていくための話し合いが真剣にできて
  • このサイトをフレンドリーかつ優しい場所にできる

もしこれらに賛同できなかったら、Scratcherにはなれないようです。ちゃんとその意思確認をしてくれた上で、「もし気が変わったらいつだってこのページに戻ってきてくれていいのよ」ってねこちゃんが言ってくれてます。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

なるなるー! Scratcherなるー!

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】
ある程度Scratchに慣れてから呼びかけてくれるあたりとてもありがたいサイトですね。
子ども向け、とあるだけあって、しっかり情操教育や意思決定の大切さ、自分で選んだことに対する責任を感じさせてくれます。

Make a Birthday Card | バースデーカードを作ろう!

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

増えてる!

インタラクティブなバースデーカードを作りましょう、とありますが、まああれですよ、動くバースデーカードをつくっちゃいましょう、ってことのようです。

Add a Backdrop | 背景を追加するよ!

Click the icon to open the Backdrop library
Then choose the backdrop you want (such as ‘party’ or ‘light’)
You’ll see your backdrop appear on the Stage.

アイコンをクリックして、背景ライブラリを開いてね。
次に、希望の背景(「パーティー」や「ライト」など)を選択するよ。
そうすると背景にステージが表示されるよ。

背景を組み合わせることは難しいようです。ムービーが示す通り、アイコンをクリックして背景を追加していきます。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

Change Colors | 色を変えていくよ!

Click the Scripts tab.
Make sure the Stage thumbnail is selected.
Build this script to change the colors of the Stage when you click it:
Try it! Click on the Stage to change colors.

Tip: To reset the colors at the start, add this script:
Click green flag to reset.

[スクリプト]タブをクリックしてね。
ステージのサムネイルが選択されていることを確認してね。
このスクリプトを作成して、クリックするとステージの色が変わるよ!。
試してみて! ステージをクリックして色を変えるよ。

ヒント:最初の色にリセットするには、次のスクリプトを追加してね。
緑色のフラグをクリックしてリセットします。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

スクリプトのタブをクリックしたあと、左下の「ステージ」の部分に青い枠がついていたら選択されている状態です。
「このスクリプト」というのがこんな感じ。

 

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】
以上の作業終了後、完成画面をクリックすると、背景の色が変わっていきます。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

もし最初の色に戻したいなぁというときは、以下のようなブロックを作って緑のフラッグを押すと元に戻ります。

Choose a Character | キャラクターを選んでみよう!

Click the icon that looks like this to choose a character:
Choose any character you want (such as Giga).
In Scratch, characters are called ‘sprites’.

キャラクターを選択するには、このアイコンをクリックしてね。
任意のキャラクター(ギガなど)を選択してね。
スクラッチでは、キャラクターは「スプライト」と呼ばれます。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

この赤い子は「ギガ」というようです。まつ毛長いので女の子かな……?

Say a Greeting | お祝いを言ってもらおう!

Build a script like this to say something:
Type ‘Happy birthday!’ or your own greeting.
Try it! Click on the green flag to make your sprite talk.

Tip: You can click and drag your sprite to where you want it on the Stage.

こんな感じにスクリプトをたてて、何か言わせよう:
「お誕生日おめでとう!」と入力してね。「こんにちは」などといったあなた自身の挨拶でもいいよ。
クリックして試してみて! 緑色の旗をクリックしてスプライトをおしゃべりさせてね。

ヒント:スプライトをクリックし、ステージ上のどこにドラッグしてもかまいません。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

日本語対応ですのでこんな感じに入れていきます。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

フラッグを押すとしゃべります。
ちょっと場所を整えましょう。ドラッグするとスプライトが移動します。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

Play Music | 音楽を流そう

Click this icon to choose a new sprite:
Then select a party sprite (such as ‘Cake’ or ‘Gift’)
Build this script to play music when you click on your sprite:
Click on your sprite on the Stage to hear it play.

Tip: You can choose a new sound from the Sound library.
Click the Sounds tab, then click
Then, click the Scripts tab to drag the play sound block.

新しいスプライトを選択するには、このアイコンをクリックしてね。
次にパーティスプライト( ‘Cake’や ‘Gift’など)を選択するよ。
スプライトをクリックすると、「こういうスクリプト」を作成して音楽を再生します:
ステージ上のスプライトをクリックして、それが再生されるのを聞いてね!

ヒント:サウンドライブラリーから新しいサウンドを選択できます。
[サウンド]タブをクリックし、[サウンド]タブをクリックします。
次に、[スクリプト]タブをクリックして、再生サウンドブロックをドラッグします。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

「こういうスクリプト」は以下のような感じです。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

サウンドはさまざまな音が用意されているので、そこから選ぶこともできます。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

Add an Animation | アニメーションを追加しよう!

Click to select your sprite:
Add a script like this to make it grow big and small:
Click on your sprite to see the animation.
Your script will look something like this:

Tip: To make the sprite smaller, type in a minus sign before the number, such as -10.

クリックしてスプライトを選択してね
それを大きくしたり小さくしたりするために、「このようなスクリプト」を追加してね:
アニメーションを表示するにはスプライトをクリック!
こんな感じになるよ!

ヒント:スプライトを小さくするには、数字の前にマイナス記号(-10など)を入力します。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

「このようなスクリプト」は以下のような感じです。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

何度も繰り返す

To repeat the animation, add a repeat block to your script:
Try clicking your sprite again to start the animation.

Tip: To stop, click the stop sign (above the Stage).
Your script will look something like this:

Tip: To reset the size of your sprite at the start, add this script:

アニメーションを繰り返すには、「繰り返しブロック」をスクリプトに追加するよ。
スプライトをもう一度クリックして、アニメーションさせてね。

ヒント:停止するには、停止標識(ステージの上の赤いボタン)をクリックします。

スクリプトはこんなふうになるよ。

ヒント:最初にスプライトのサイズをリセットするには、次のスクリプトを追加します。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】 子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

うっかり背景をクリックすると背景の色が変わっていきます。

Spin Around | 回すよ

Click to select the sprite you want to spin:
Then, build a script like this:
Your script will look something like this:

Tip: To reset your sprite’s direction at the start, add this script:

スピンしたいスプライトをクリックして選択します:
次に、このようなスクリプトを作成します。
あなたのスクリプトは次のようになります:

ヒント:最初にスプライトの方向をリセットするには、次のスクリプトを追加します。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

嫌な予感がする。
このようなスクリプト、というのは上記図のような感じです。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

やはりそう回るのか、ねこ。
アクティブだな、ねこ。
リセットボタンはこんな感じです。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

カードをカスタマイズする

What else do you want to add? Try some of these ideas.

ADD MORE THINGS
You can click to choose another sprite from the library or to draw your own.

You can add a script like this:
Experiment with making your own scripts. Here are some blocks you may want to try:

TRY DIFFERENT EFFECTS!
Click on the Stage:
Choose effects from the drop-down menu:

Ready to share your card?

他に何を追加したい? これらのアイディアをいくつか試してみてね。

もっと何か追加する。
アイコンをクリックすると、ライブラリから別のスプライトを選択したり、独自のスプライトを描くことができます。

次のようなスクリプトを追加することができます:
独自のスクリプトを試してみてね。 次のブロックを試してみてください。

別の効果を試してみてください!
ステージをクリックします:
ドロップダウンメニューからエフェクトを選択します。

あなたのカードを共有する準備ができましたか?

この項目は割と自由度が高く、自分であれこれ考えるターンになっています。
まず絵が描けますということ。
具体的なあれこれについては以下の記事の「Add Your Next Letter | 次の文字を追加しよう!」で説明しています。

初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】

Scratchはオフラインでも使えます。オンラインの場合https://scratch.mit.edu/上記を押してサイトに行き「作る」を押すと始まるオフラインの場合「Scratch2.0」というエ...
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その2【自分の名前を動かそう!】 - incloop.com

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

おめでとうといわせてみました。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】
押すと音が鳴るようになります。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】
何回も押すと右方向に動きます。マイナス数値にすると逆に動くようになります。

可能性は様々あるので好きなようにどうぞ、ってことですね。
ステージも同じようにいろいろかえられるので、ドロップダウンで選んでみてください。

子ども向けプログラミングScratchをやってみよう!【バースデーカードを作る】

最終的にこんな感じになります。

いやしかし。

繰り返して覚えていく、といっても。
ちょっとチュートリアルでやってると飽きてきてしまいますね……。

だがしかし急がば回れと申します。
じっくりしっかりものにしていきましょう!

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0scratch3/feed/ 0
初心者が学ぶ子ども向け教育プログラミング言語Scratch(スクラッチ)の使い方 その1【Scratchをはじめよう】 https://incloop.com/%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0scratch/ https://incloop.com/%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0scratch/#respond Fri, 21 Apr 2017 01:06:37 +0000 https://incloop.com/?p=11947 子ども向けプログラミングScratchをやってみよう!

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、 やってくれている人おらんでな […]]]>
子ども向けプログラミングScratchをやってみよう!

なーんだかうちの社員みんなプログラミングだのITだの難しいこと言ってますけども、

やってくれている人おらんでないですか。

初心者はですねぇ、本を紹介されたって日本のITがどーのって言われたってわからんもんはわからんのですよっ! スクラッチってなんだよ宝くじか? 子ども向けプログラミングっても私にとってはオリンピックの高跳び並みのハードルですよ!

そんなわけで頑張って連載してみましょう、ど素人もいいところ、子どもよりも初心者、頭の固くなりつつあるデザイナーの、子ども向けプログラミングScratch、演習スタートです。

Scratchって何?

子ども向けプログラミング、とうたわれているブラウザ上のプログラミングシステムです。8歳から16歳対象ということですが、年齢問わず、いろんなところで使われているようです。グローバルシステム!
なんで子どもの頃からプログラミングなんて? と思う方は当社のT氏がとっても面白い記事があるのでこちらどうぞ。

火曜日ブログ担当の田中です。すでにご存じの方もいらっしゃるかもしれませんが、2017年の4月から各種助成金の助成額や条件などが変わっています。メジャーな助成金でも...
小学生からのプログラミング必修化は日本のIT化を促進させる!2017年度の助成金の変更点から見える今後の方向性 - incloop.com

プログラミングを学ぶということは、問題解決プロジェクト設計アイディア交換のための重要な手段を学ぶということです。という言葉通り、ロジカルシンキングができるということはこの先の未来に非常に役に立つということですね。

言っていることが難しい? ゲーム作れたら楽しい。そういうことです。頑張っていきましょう。

とりあえずScratchをやってみよう

Scratchのサイトはこちら
https://scratch.mit.edu/

海外のゆるキャラはスマートな子たちがいるもんですね! このひょうきんな顔をしているにゃんこ(たぶんにゃんこ)がいろいろ動いてくれるようです。名前なんなの?

子ども向けプログラミングScratchをやってみよう!

Cat……そのまんまやないかい!

子ども向けプログラミングScratchをやってみよう!

飛ぶんかい!

子ども向けプログラミングScratchをやってみよう!

トップページにいるこのかわいい子は「Tera」というようです。地球の妖精かな? グローバルフェアリーですかな?

子ども向けプログラミングScratchをやってみよう!

Gobo……ゴボウ……?

とにもかくにも「作る」の猫をクリックすると、こんな画面になります。クリックすると拡大します。(Adobe Flashが使えないようになっている方は、右クリックかインストールして使えるようにしちゃいましょう。こちら>https://get.adobe.com/jp/flashplayer/?no_redirect

子ども向けプログラミングScratchをやってみよう!

右側のほうに「Scratchをはじめよう~Want to get started with Scratch? Try this!(意訳:Scratch始めたい?やろうぜ!)」てなことが書いてあるので、右上の「BEGIN」をクリックします。英語の勉強もできるわけですか。
左上の丸いアイコンをクリックすると、「日本語」「にほんご」があるのですが、地味にあちこちに英語が出てきます。だいたい言っていることは上下一緒のようですが若干違うようなので、少しずつ意訳を入れてやってみますね。

いざ、実践。

1.動かし始める

Drag a move block into the Scripts area.
(意訳:「動すブロック」をスクリプトエリアにドラッグしてね!)

ブロックをクリックしたら猫動くの?

子ども向けプログラミングScratchをやってみよう!

子ども向けプログラミングScratchをやってみよう!

あ。なんかぴくぴくしてる
でも10歩は歩かないのね……?

そしたら次は「Now, add a sound(意訳:そしたら音いれてみようか)」をクリックします。右上の「次へ」でもいいです。

2.音を追加する

Drag out a play drum block (from Sound) and snap it onto the move block.
(意訳:「音」から「ドラムを鳴らす」ってブロックを引きずり出して動くブロックをスナップしてね!)

ブロックをクリックすると音が鳴ります。

子ども向けプログラミングScratchをやってみよう!

鳴ったわ……(地味にびっくり)

次は「Next, start a dance(意訳:次はダンスしてみよう!)」をクリック。これもまた右上の「次へ」でもOK。

3.Start a Dance

Add another move block. Click inside the block and type in a minus sign.
(意訳:ほかのブロックを加えるよ! ブロックの内側をクリックしてマイナス数値を記入してね!)

このとき「スクリプト」から「動き」を選ばないといくら待ってもブロックが出てきてくれませんのでね。ご注意ですね。

Add another play drum block, then choose a drum from the pull-down menu.
(意訳:ほかのドラムを鳴らすというブロックを加えるよ! そうしたらプルダウンメニューからドラムを選んでね!)

英語意訳してたら「何を言っているんだドラムを鳴らすというブロックを選んでいるのだからドラムは選ばれているはずだろう」と思ったんですけれども。

ドラムありすぎ。

子ども向けプログラミングScratchをやってみよう!

どうやら「ドラム」というのは日本でいうところのバンドとかで使われているドラムのみならず、「打ち鳴らす楽器全般」を言っているようですね。翻訳の難しいところです。おすすめはオープンクイーカです。
この翻訳の違いは各所で現れており、例えば「10歩動かす」というのも決して10歩動くわけではありません。おそらくこの「歩」はピクセル数か何かではないかなぁという感じです。英語としては「Step」です。「10という値のぶん、動かす」というイメージでいたほうがよさそうですね。

動かすと猫が前にでて後ろに下がる、と動きます。いい感じです。

Next, add a repeat.
(意訳:じゃあ繰り返しを入れてみようか!)(だんだんアニメの次回予告の気分に)

4.何度も繰り返す

Drag out a repeat block and drop it on top of the stack. (You want the “mouth” of the repeat to wrap around the other blocks.)
(意訳:繰り返しのブロックをドラッグして、組み立てたブロック=スタックの一番上に置いてみよう!(ブロックがパックマンみたいに口を開くからそれでほかのブロックを囲ってね!))

……パックマンわかりますかね……今の子たちはカービィと言った方がわかりやすいのだろうか……。

子ども向けプログラミングScratchをやってみよう!

そのままこの組み立てたブロック=スタックをクリックしてみると、いやぁ、動きますね……。(地味にびっくり)

Next, say something.
(意訳:何か言わせてみよう!)

5.何か言わせる

Click looks and drag out a say block.
(意訳:「見た目」をクリックして「言う」をドラッグしてね!)
Type in the block to change the words:
(意訳:ブロックに書かれた言葉を書き換えてね!)

さすがに日本語の発音はできないでしょう……と思ったら、吹き出しが出る仕様のようです。

子ども向けプログラミングScratchをやってみよう!

Then snap it on top of the stack. Click on the stack to run.
(意訳:セリフブロックをスタックの一番上に持っていこう! そのままスタックをクリックしてスタートだ!)

プログラムをスタートして動作を終了までを実行することを「Run」といいます。プログラムを「走らせる」という意味ですね。
たまに「Runしてみて」とか言語として崩壊している使い方をします。「Runしたらどうなる?」「Runしないんですよー……」これは界隈では正しい使い方なのだろうか。いや伝わればいいですね。

※M氏に確認してみたところ「言う言う~界隈では正しいよ~」とのことでした。「Go」も使うらしいです。ちょっとカッコイイですね。小学生の息子とかに「お母さんそれRunしといて~」とか言われたらどうしましょうか。

ちなみにWatch me dance! は「僕のダンス見てて!」なのでそのまま日本語に訳して突っ込んでいます。

子ども向けプログラミングScratchをやってみよう!

動きました。ようやっと動くことになれてきました。

Now,add a way to start.
(意訳:それじゃ始める方法を追加しよう)

6.Gleen Flag

Drag out a when Gleen flag clicked block and snap it on top.
(意訳:「グリーンフラッグがクリックされたとき」というブロックをドラッグして、一番上に置こう!)

これを一番上に置くと、左のコンテナの右上にあるグリーンフラッグをクリックしたとき、スタック全てがRunします。

Your script will start whenever you click the green flag:
(意訳:君がグリーンフラッグをクリックしたとき、君のスクリプトはスタートするだろう!)

To stop, click the stop button
(意訳:止めるときはストップボタンを押してね)

止めるボタンはフラッグの右横の赤いボタンのようです。

子ども向けプログラミングScratchをやってみよう!

Next you can change colors.
(次は色を変えられるよ!)

7.色を変える

Now to try something different… Drag out a change effect block.
(意訳:ちょっと違うことに挑戦しよう。……「効果を変える」のブロックをドラッグしてね)

効果を変える、とは言っていますが、日本語表記だと最初に「色」があり、その他、魚眼レンズや渦巻、などといったエフェクトが存在します。使ってみればわかるのでしょうが、とりあえずテキストを守りましょう。

Click to see what it does.
(意訳:スタックをクリックしてどうなるか見てみてね)

クリックすると猫の色が超爽やかなミントグリーンになります。クリックをし続けると次々に色が変化していきます。

Now, make it interactive.
(意訳:じゃ、こいつを相互的にしよう)

8.キーを押す

Interactiveという言語の意味は「相互的に作用する」とか「対話式の」といいます。よくえらいひとが「インタラクティブなうんたらかんたら」って言っているのを聞きますが、インタラクティブって「僕も君も参加してより楽しく有意義にしようよ!」みたいな感じだと思ってもらえればいいかなと個人的には思います。一方的じゃない、というのがポイント。

Snap on a when key pressed
(意訳:「キーがおされたとき」というブロックをスナップしよう)

イベントから「キーがおされたとき」というブロックをドラッグする作業になるのですが、スタックをクリックするのではなく、キーボードを使って指示を出す、という点で「相互的」と言っているのかなぁとあいまいに理解。

Now press the space bar on your keyboard and watch what happens.
(意訳:君のキーボードのスペースキーを押すと、何が起きるか見れるよ!)

つまりいついかなる時もスペースキー一つで猫が色変わりをするという事実。

子ども向けプログラミングScratchをやってみよう!

You can choose a different key from the menu:
(メニューから別のキーを選んでもいいんじゃない?)

ブロックの中の「スペース」キーの部分を変えると、押したときにアクションするキーを変えることができます。

子ども向けプログラミングScratchをやってみよう!

Now, choose a backdrop.
(さあ、背景を選ぼう!)

9.背景を追加

You can add new backdrops on the Stage.
(意訳:新しい背景をステージに追加できるよ!)

子ども向けプログラミングScratchをやってみよう!子ども向けプログラミングScratchをやってみよう!

わーお。いっぱいある。

Click image to choose a New backdrop from the Library (such as “Spotlight-Stage”):
(意訳:ライブラリから新しい背景を選んでね!(こんな「スポットライトステージ」みたいなやつね))

画像を選んでOKを押すと、自動的に背景が追加されます。

子ども向けプログラミングScratchをやってみよう!

Next, add a new sprite.
(意訳:次は新しい図形を入れてみよう!)

10.Add a sprite.

Spriteは直訳すると「妖精」なのですが、コンピュータ言語的には「背景とは独立に動く図形」のことを言います。

Each object in Scratch is called a sprite. To add a new sprite, click one of these buttons:
(意訳:Scratchにあるそれぞれのオブジェクトは、スプライトと呼ばれます。新しいスプライトを追加するには、次のいずれかのボタンをクリックします)

子ども向けプログラミングScratchをやってみよう!

  • Choose sprite from the library:ライブラリからスプライトを選ぶよ!
  • Paint your own sprite:自分でスプライト描いちゃうよ!
  • Upload your own image or sprite:君の画像やスプライトをアップロードしちゃうよ!
  • Take a picture (from a webcam):ウェブカメラで写真撮って使うよ!

To add this sprite, click “choose sprite” then select “Cassy Dance”:
(意訳:このスプライトを追加しよう! クリックするのは「ライブラリからスプライトを選ぶ」で選ぶのは「ダンスするキャシー」だよ!)
Drag the characters to where you want them on the Stage.
(意訳:ステージ上で君が乗せたいところにキャラクターをドラッグしよう!)

もう至れり尽くせりな説明ですな。

子ども向けプログラミングScratchをやってみよう!子ども向けプログラミングScratchをやってみよう!

 

Now, explore sound or animation.
(意訳:では、音とアニメーションを考えてみよう!)

11.Explore!

You can add sound and animation to your new sprite.
(意訳:新しいスプライトにサウンドとアニメーションを追加することができるよ!)

音を追加する場合

音を追加するには「スクリプト」の隣の隣の「音」タブをクリックしてサウンドのコンテナを展開します。

子ども向けプログラミングScratchをやってみよう!子ども向けプログラミングScratchをやってみよう!

子ども向けプログラミングScratchをやってみよう!

  • Choose a Sound:Scratchから音を選ぶよ!
  • Record Your Own:自分で録音するよ!
  • Import a Sound File:音のファイルをインポートするよ!

Then, click Scripts, and drag in a play sound block. Choose the sound you want from the menu and click to play.
(意訳:そうしたら「スクリプトタブ」をクリックして、「~の音を鳴らす」のブロックをドラッグしよう。君が鳴らしたいと思った音がメニューにあるので、それを選んでからクリックすると音が鳴るよ)

アニメーション

Click the Costumes tab to see a sprite’s costumes. You can animate by switching between costumes.
(意訳:コスチュームタブをクリックすると、スプライトの衣装を見ることができるよ。衣装を切り替えることでアニメーション化することができるよ!)

Click Scripts and make a script that switches between costumes:
(意訳:スクリプトをクリックし、衣装を切り替えるスクリプトを作っちゃおう!)

子ども向けプログラミングScratchをやってみよう!

日本語だとこんな感じですね。

子ども向けプログラミングScratchをやってみよう!

Share your project.
(君のプロジェクトを公開しよう!)

12.Share!

タイトルを付けて、See Project Pageをクリックすると、ScratchのHPに作ったプログラムが公開されます。

Type in notes to explain how to use your project. Give credit to anyone who helped.
When you’re ready for others to see your project, click the Share button.
(意訳:君のプロジェクトの使い方を説明しよう! プロジェクトを他の人が見る準備ができたら、「共有」ボタンを押してね!)

あれ……Shareボタンなんぞないぞ……?
というところで気が付きました。アカウント作ってないや!

アカウントの作り方

子ども向けプログラミングScratchをやってみよう!

右上のところから簡単にアカウントを作成することができます。
本名は使わないでね! あと半角英数字でアンダーバー以外の記号は使用不可。

子ども向けプログラミングScratchをやってみよう!

そのあと生まれ年と生まれ月、性別や国などを聞かれます。しっかり情報が必要な理由も明記されていて安心ですね。
国は「Japan」表記です。

子ども向けプログラミングScratchをやってみよう!

メールアドレスを入力します。親御さんも安心な指示。

子ども向けプログラミングScratchをやってみよう!

するとようこそ。

子ども向けプログラミングScratchをやってみよう!

スクリーンショット取りながらやっても5分。簡単です。

子ども向けプログラミングScratchをやってみよう!

シェアボタンがでてきました!日本語だと「プロジェクトページ参照」らしいですね。

再び戻ってシェアの続きから!

12.Share! 続

子ども向けプログラミングScratchをやってみよう!

プロジェクトページを参照すると、使い方の説明などを書くコンテンツの他、プロジェクトを作成した際に手伝ってもらった人へお礼を言うコンテンツもあります。子ども向け、というだけあって、情操教育部分もしっかり考えてくれているんですね。
このプロジェクトの「中を見る」ボタンで再びプロジェクトを編集することができます。

アカウントを作ったらできること

まず、作成したプロジェクトを保存することができます。トップページに戻ると、少し変わっていました。メールボックスにはScratchからのお知らせが来るようです。

子ども向けプログラミングScratchをやってみよう!

フォルダを押すと、こんな感じで作品の閲覧ができます。

子ども向けプログラミングScratchをやってみよう!

 

「スタジオ」というのは、どうやらプロジェクトを多人数で共有し合えるツールのようで、カテゴリ分けが可能のようです。個人で作ったプロジェクトをグループ分けすることもできそうですね。

結論

めっちゃ面白いです。可能性は無限大じゃないですかこれ。
New ScratcherからScratcherになると、またいろいろと機能が使えるようになるらしいですが、それにはいろいろ必要なようで、精力的なScratchへの参加や役立つアイデアの提供などが必須のようです。

また、Scratchを運営するMITメディアラボ ライフロングキンダーガーテングループのScratchコミュニティーのガイドラインが素晴らしいのです。

https://scratch.mit.edu/community_guidelines

子ども向けプログラミングScratchをやってみよう!

子ども向け、とうたうのもよくわかるガイドラインです。けれど大人でも忘れがちな部分をしっかりとおさえています。
これから頑張ってひとまずStep by Stepを全部クリアしていく連載をしたいと思います!

この記事であなたの課題を解決することができましたか?

疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。

]]>
https://incloop.com/%e5%ad%90%e3%81%a9%e3%82%82%e5%90%91%e3%81%91%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0scratch/feed/ 0