mywayなプログラミング生活ブログ

プログラミング関連の記事を書いています。作る様子がわかる様に動画も作っています。

【Scratch2(スクラッチ2)】シューティングゲームをリミックス(6)

myway@おじさんです。

前回の続きで、シューティングゲームのリミックスをします。

今回は、プログラミングではなく、背景となる画像の作り方を書きたいと思います。
Scratchは、簡単な画像であれば、描く事ができます。



動作環境について
OS:MAC OS X(Windowsでも操作はほとんど変わりません)
エディタ:Scratch offline editor(ver.458)

f:id:mywayhaojisan:20171229164453p:plain

 

1.準備

前回作ったプロジェクトファイルを開いて下さい。

2.スプライトの追加

「はいけい」に作っても良いですが、後でスクロールさせる事を考えて「スプライト」で作ります。

f:id:mywayhaojisan:20171229164527p:plain
追加した結果がこちら

f:id:mywayhaojisan:20171229164615p:plain

スプライト名が「スプライト1」なので、「はいけい」へ変更します。
スプライト名を変更するには「i」アイコンをクリックします。

f:id:mywayhaojisan:20171229164635p:plain
スプライト名に「はいけい」と入れ、左上の三角をクリックします。

f:id:mywayhaojisan:20171229164713p:plain
結果はこちら

f:id:mywayhaojisan:20171229164845p:plain

3.コスチュームを変更

ここから、コスチュームを変更します。
はじめに背景色を塗ります。

f:id:mywayhaojisan:20171229164921p:plain
「緑」色を塗りました。

次に、画面右下の「ベクターにへんかん」をクリックして「ベクターモード」に変えます。

f:id:mywayhaojisan:20171229164938p:plain

次に、「林」を作りたいと思います。
画面上の「ついか」をクリックして、「木」の画像を追加します。

f:id:mywayhaojisan:20171229165000p:plain

「trees-a」をクリックして「OK」をクリック。

f:id:mywayhaojisan:20171229165016p:plain

f:id:mywayhaojisan:20171229165036p:plain
「木」が追加されました。

「trees-a」の大きさが大きすぎるので、小さくします。
追加した「trees-a」をクリックすれば、周りに枠が表示されます。
この状態が「図形が選択された」状態となります。

f:id:mywayhaojisan:20171229165105p:plain
右下の四角をドラッグして「trees-a」を小さくします。

f:id:mywayhaojisan:20171229165129p:plain
次に、小さくした木をコピーしていきますが、背景の緑が邪魔で分かりにくいので、一時的にサイズを変更しておきます。

f:id:mywayhaojisan:20171229165217p:plain
「ずけいのふくせい」を使って「trees-a」をコピーします。

f:id:mywayhaojisan:20171229165236p:plain
この「ふくせい」を使って5個つくります。

f:id:mywayhaojisan:20171229165308p:plain

この状態では、まだ「林」とは言えません。
ですが、1つずつコピーするのは面倒です。
そこで、「グループか」の機能を使います。
「グループか」は複数の図形を1枚の図形として使える様にする機能です。

f:id:mywayhaojisan:20171229165346p:plain
これで5本の木が「1枚の画像」として使えるので、「ふくせい」を使って「林」っぽくします。

今回は5本の木を5個おきました。

f:id:mywayhaojisan:20171229165416p:plain
少しずらしておくと、林っぽくなると思います。
さらに、作った「林」をグループ化して、3つ置いてみます。

f:id:mywayhaojisan:20171229165443p:plain
もとの図形も移動させて、全体的に場所を調整しました。

4.「池」を描いてみる

「木」のみでは、少し寂しいので、「池」を書きたいと思います。

f:id:mywayhaojisan:20171229165510p:plain
ベクターモードの場合、後で形が変更できるので、大まかに描いておきます。

次に、図形の形を変えていきます。

f:id:mywayhaojisan:20171229165600p:plain
線が白っぽくなりましたが、問題ありません。

次に、編集しやすくするため、画面を大きくします。

f:id:mywayhaojisan:20171229165827p:plain
ポイントとしては、線の上に丸があるのが、わかるぐらいまで大きくします。

次に、線の上にある「丸」の数を減らしながら形を整えます。

もし、描き始めと終わりが繋がっていない場合、白い丸を重ねる事で繋がります。

f:id:mywayhaojisan:20171229165903p:plain
丸の数と位置を調整しながら、池の形を決めておきます。

次に、地面の色を塗ります。

f:id:mywayhaojisan:20171229165924p:plain
これは「池のふち」を描いています。

次に、「池の水」を描きます。

f:id:mywayhaojisan:20171229165940p:plain
色々書いていますが、コピーして色を変えているだけです。

次に、「池の水」の位置と形を調整します。

f:id:mywayhaojisan:20171229170032p:plain
ポイントとしては、池の半分から下には茶色を見えない様にする事です。

これで「池」が完成です。
最後に、はいけいの「緑」を元の大きさに戻します。

f:id:mywayhaojisan:20171229170140p:plain


今回はここまでです。
簡単な絵であれば、Scratchの機能で描く事ができます。
ただし、もっと綺麗な絵を描きたい場合は、画像作成用のツールを使う必要があると思います。

それと、今回も動画がありますので、よければ、参考にしていただければと思います。

youtu.be



次回は、今回作ったスプライトをスクロールしたいと思います。


最後まで読んで頂いてありがとうございます。
皆さんに少しでもお役に立てれば幸いです。

<<シューティングゲームをリミックス(5)