Scratchで写真素材[そざい]をつかってみよう

• スクラッチで使える画像[がぞう]を探[さが]そう
• 画像[がぞう]をトリミングしてみよう
• 写真の拡大[かくだい]縮小[しゅくしょう]

スクラッチで使える画像[がぞう]を探[さが]そう

著作権[ちょさくけん]表示[ひょうじ]ナシで使える写真を探[さが]すには

ほかの人がとった写真や、ほかの人が描[えが]いた絵をスクラッチで使うには
その人の許可[きょか]が必要[ひつよう]です。

その許可[きょか]をとらなくてもOKな
「CC0（著作権[ちょさくけん]フリー）」という素材[そざい]ばかりを集めたサイトがあります

今回はそこから写真素材[そざい]を探[さが]してみましょう。

写真素材[そざい]サイト「PEXELS」
https://www.pexels.com/

どうやってさがすの？

たとえば、「木」とか「森」とか自然[しぜん]の風景[ふうけい]の写真を探[さが]したいときは
検索[けんさく]マドに「nature」という単語[たんご]を入力してみましょう。

英語[えいご]で検索[けんさく]すると探[さが]しやすいので
翻訳[ほんやく]サイトなどで検索[けんさく]したい単語[たんご]を調べてみましょう。



「自然[しぜん]」の写真がたくさん出てきました。
このなかから使いたい写真を選[えら]んで、クリックしてみましょう。




写真をダウンロードするページが開きます。
ページの右側[みぎがわ]にある「Free Download」というボタンをクリックすると
ダウンロードできるのですが、そのままのサイズだと大きすぎるので



ダウンロードボタンの右側[みぎがわ]にある「▼」ボタンを押[お]してみましょう。
画像[がぞう]のサイズを選[えら]ぶことができます。

スクラッチの画面サイズは「480×360」なので
「Small」のサイズでよさそうですね、これを選[えら]びましょう。

大きい画像[がぞう]の一部だけ使いたいときは
もう少し大きいサイズのほうがいいかもしれませんが
今回はSmallでダウンロードしてみましょう。

「Download」ボタンをクリックします。



ダウンロードがおわると、画面の下にダウンロードした画像[がぞう]の名前が
表示[ひょうじ]されます。

どの場所にダウンロードされるかは、ブラウザの設定[せってい]によって違[ちが]いますが
だいたいは「ダウンロード」フォルダにダウンロードされます。

このままでスクラッチにとりこんでみると……？

ダウンロードした画像[がぞう]を、背景[はいけい]に取[と]り込[こ]んでみましょう。
「新しい背景[はいけい]」の「ファイルから新しい背景[はいけい]をアップロード」
をクリックして、さきほどダウンロードした画像[がぞう]をとりこみます。

すると



こんな感じで、上下に余白[よはく]が入ってしまいました。
スクラッチは、タテヨコの比率[ひりつ]が違[ちが]う画像[がぞう]を取[と]り込[こ]むと
こんなふうに余白[よはく]が入ってしまうのです。

ちゃんと480×360のサイズにして取[と]り込[こ]まないといけませんね

写真をトリミングしてみよう

オンラインツールをためしてみよう

写真加工用[かこうよう]のソフトをダウンロードしてもいいですが
今回は、オンラインのツールを使ってみましょう。

いろいろ試[ため]してみましたが、このサイトが使いやすいです。
Online Image Editer

・日本語で表示[ひょうじ]される
・大容量[だいようりょう]の画像[がぞう]をあつかえる
・画像[がぞう]をみながら編集[へんしゅう]できる
・トリミングの枠[わく]を自由に設定[せってい]できる

さっそく、さきほどダウンロードした画像[がぞう]を加工[かこう]してみましょう。


画面下にある「アップロード」というところで
「ファイル選択[せんたく]」ボタンを押[お]して、素材[そざい]となる写真を選[えら]びます。

アップロード中に変換[へんかん]：PNGにチェックを入れておくと
どんなファイル形式でもPNGにしてくれるので
好[この]みにあわせてチェックしておきましょう。

「アップロード」ボタンを押[お]すと、写真を加工[かこう]する画面になります。



画面上の「トリミング」というハサミマークをクリックすると
画面左にトリミング用のメニューが現[あらわ]れます。

トリミングとは、画像[がぞう]を切りぬいてくれるツールです。
今回はスクラッチの画面サイズ「480×360」にしたいので
幅[はば]のところを480・高さのところを360と入力しましょう。

写真のところに赤いワクが表示[ひょうじ]されています。
このワクの中が、切りぬいてくれる部分になります。
マウスでドラッグすると赤いワクを動かせるので
ゲームで使いたい部分にあわせて切[き]り抜[ぬ]きましょう。



画面左のトリミングメニューのなかから
「適用[てきよう]」のボタンを押[お]すと、赤いワクのなかだけ切[き]り抜[ぬ]かれました。



あとは、画面上のメニューから「保存[ほぞん]」ボタンをクリックして
「イメージをローカルに保存[ほぞん]」のフォルダマークをクリックすると、
編集[へんしゅう]した画像[がぞう]を保存[ほぞん]することができます。



これで、スクラッチぴったりサイズの画像[がぞう]にすることができました。

写真の拡大[かくだい]縮小[しゅくしょう]

画像[がぞう]のURLから直接[ちょくせつ]編集[へんしゅう]することも

今回は写真をいったんダウンロードしてから
トリミングするためにアップロードしていましたが

画像[がぞう]のURLがわかれば、ダウンロードしなくても
編集[へんしゅう]することができます。

画像[がぞう]のURLを知るには


写真をダウンロードするページの写真をクリックします。


フルサイズの写真がひらくので
「Ctrl + C」で写真のURLをコピーしましょう。




オンラインイメージエディタを開き
アップロードするときに「URLから」というタブを選[えら]びます。

先ほどコピーしたアドレスを、テキストボックスに
「Ctrl + V」で貼[は]り付[つ]けます。

写真はjpegなことが多いので
アップロード中に変換[へんかん]：PNGにチェックを入れておきましょう。

もとのサイズはかなり大きいので
アップロード中にリサイズにもチェックを入れた方がいいかも。

画像[がぞう]をリサイズしよう

「アップロード」を押[お]すと編集[へんしゅう]画面が開きます。
画像[がぞう]が大きいと開くのにも時間がかかります。

開くと、こんなに大きいサイズの画像[がぞう]になってしまいました。


これでは使いづらいので、縮小[しゅくしょう]しましょう。
画面上のメニューから、「リサイズ」を選[えら]びます。



画面の左に、画像[がぞう]の大きさを変[か]えるメニューがあらわれました。
スライダーを左に動かすと、画像[がぞう]を小さくすることができます。

幅[はば]や高さを入力してもOK

大体の大きさが決まったら「適用[てきよう]」ボタンを押[お]しましょう。

あとは縮小[しゅくしょう]した画像[がぞう]をもとに、スクラッチの画面サイズに合わせて
トリミングすれば、スクラッチのプロジェクトで使うことができますね。