Scratchでも使える無料イラスト

 

商用利用OK、無料のお洒落なイラスト素材サイトFLAT ICON DESIGNフラットアイコンデザインさんのイラストをダウンロードしてScratchスクラッチで使うまでの解説です。

ダウンロードの詳細、ファイルの種類、サイズなどは「Inkscapeでも使える無料イラスト」の途中までをご一読ください。ScratchでもSVG画像を使います◎

Inkscapeでも使える無料イラスト

 

 

 

JPG(JPEG)でもScratchにアップロード出来るのですが画像はガタガタしますし

 

PNGも同様、パーツの1つ1つを個別に扱えないので今回のような場合はSVGが最適と考えます。

 

「ファミコンのコントローラーアイコン」がダウンロード出来ましたら、Scratchを開きます。

 

Scratchにファイルをアップロードする

「作る」で新しいページを開いて右下の、

 

猫マークを押して一番上の「スプライトをアップロード」します。

 

先程ダウンロードした〇〇.svgファイルを選択します。

 

ファミコンのコントローラーで遊ぶ

 

コスチュームタブをクリックするとこんな状態です。右下のデフォルトのネコ(スプライト1)の横に入ったのが確認出来ます。

 

そのままでは無く、色を変えたりカスタマイズしたいので左の「選択ツール」でコントローラーをクリック>「グループ解除」を何度か繰り返します。

 

左のツールや

上のメニューの詳しい使い方は「Scratchでオリジナルキャラクターを作る_2〜4」などをご覧ください。

Scratchでオリジナルキャラクターを作る_2

Scratchでオリジナルキャラクターを作る_3

Scratchでオリジナルキャラクターを作る_4

 

 

グループ解除を何度か繰り返してこれ以上解除(細かく)出来なくなると「解除」マークの色が薄くなって押せなくなります。

 

Bボタンの色を変更したいのですが手前に斜めの薄い影があるので選択出来ません。今回はこの影はゴミ箱マークで削除してしまいましょう◎

 

ボタンの赤を選択して「塗りつぶし」で好みの色に変更します。

 

緑にしました。

 

マイク?部分はやっぱりグループにしておいた方が良さそうです。「選択」ツールでshiftキーを押しながら1つ1つクリックして「グループ化」します。グループ化するとまとめて色も変えられますし移動も楽です。

 

 

コピペで他のスプライトから持ってくる

コントローラーの十字ボタンにScratchのネコを付けてみようと思います。

右下の「スプライト1」をクリック

 

顔部分を選択して「コピー」、

 

コントローラーに戻って「ペースト」します。

 

猫のアウトラインが黒のままだと目立たないので「形を変える」ツールでアウトラインをクリック、「枠線」のスポイトでコントローラーのベージュのラインの色を拾えば、

 

コントローラーとの一体感も出ます。

 

Scratch仕様のコントローラー完成◎

 

 

続いてレスラーのマスクを使って。

レスラーのマスクで遊ぶ

再び FLAT ICON DESIGNさんのサイトへ行き「マスク」などと検索。

タイムリーなマスクもあるね

 

今度もファイル形式はSVGを選んでこんな感じの設定にして下の方にある緑のボタン「表示中の画像をダウンロード」しました。

 

先程と同じ手順でScratchに「スプライトをアップロード」

 

右下に入りました。

 

これはネコに被せたいので「選択」ツールでクリックしたら「コピー」

 

先程の様に「スプライト1」のネコに切り替えて「ペースト」します。

 

「消しゴム」ツールで穴を開ける

マスクなので目鼻口部分を開けたいですね。

「選択」ツールでベージュの目と口部分をクリック>ゴミ箱マークで削除して

 

白い模様に「消しゴム」ツールで穴を開けます。上の消しゴムのサイズを大きくすればごそっと、小さくすれば細かく消せます。

 

白い模様に穴が開いて後ろのピンクが見えました。こんな感じでもう1つの目と口も開けたら、

 

ピンクを「選択」して、

 

(手前の白が見にくいので一時黄色にしました)「消しゴム」ツールで穴を開けます(消します)。背景の市松模様が見えた事でこの部分が透明になっていると分かります◎

手前の黄色と後ろのピンクを分けるとこんな感じです

ピンクの方の穴あけは適当でも手前に黄色が来るから見えないんだね

 

手前の模様をちゃんと綺麗な形にしたい時は「形を変える」ツールでチョコチョコとやるといいと思います。右下で画面を思い切り拡大するとやり易いです。

 

水色の丸を増やしたり減らしたり動かしたりすれば自由に形が作れます。

 

 

制作中のマスクに戻ります。

 

色、形などの加工が済んだら全部を選択して「グループ」にします。

 

Scratchのネコにかぶせて微調整したら完成です。

 

闘う覆面ネコレスラー

 

 

 

 


SVG画像をもっと沢山のツールで加工したい、もっと複雑なものを作りたいと思ったらInkscapeインクスケープ(無料、フリーソフト)があります。

Inkscapeでも使える無料イラスト

 

Scratchと違ってクラウド上ではなく、自分のパソコンにインストールして使います。

Inkscape 1.0が出ました。インストール方法