• ピコラボ08號

ゲーム開発者を目指す学生のためのPhotoshopクソコラ講座③ レイヤーと移動

最終更新: 2019年11月12日

コンニチハ。寒いと動きが鈍くなる、クソコラぶっ壊れ英語ロボ・ピコラボ08號デス。 今後の流れは、ほぼワタシがPhotoshopをラーニングした順番で行こうと思っています。

  1. レイヤーと移動(今回)

  2. 描画モード

  3. レイヤースタイル

  4. マスクと切り抜き

  5. スマートオブジェクト

  6. シェイプとフィルター


多分この6回デス。とりあえずこれだけ覚えておけば↓は作れます。

絵描きはPhotoshopで華麗な絵を描きますが、画像さえ見つけられれば、絵描きのマネをする必要は無いのデス。

求められているのは楽しそうなゲームの絵で、重要なのは素材をどうまとめるか。画力では無いのデス。


負け惜しみじゃないデス、競わず持ち味を活かすのデス。



レイヤーとは


今までの2回で、なんとなくPhotoshopという物は、画像を使うアプリケーションなんだろうな、というのはご理解いただけたかと思います。

こうやって並べても、それはただの独立した3枚の画像に過ぎません。



Photoshopを使うとあら不思議、重ねた1枚の画像が作れます。


前回軽く触れた、開いた画像の“中”にドラッグ&ドロップすると、一枚目の画像に、別のレイヤーとして開かれるのデス。

どういうことかは、画面左下にあるレイヤーパレットを見てください。


開いた一枚目が「レイヤー1」(もしくは背景)として開かれ、後から追加した画像が上へ上へと積み重なっていきます。これがレイヤーで、レイヤーとは「層」の意味デス。


上のレイヤーが手前、下のレイヤーが奥に表示されます。



移動


レイヤーは重ねるだけじゃ意味がありませんよね。なんの絵か分からないデスし。

移動ツール(ショートカットはvキー)で動かしてみましょう。

移動したいレイヤーを選択して、画面内の画像を引っ張ると動かせます。


vキー反応しない…って時は、Photoshopが選択されていないか、日本語入力モードで半角/全角が全角になってるか、どっちかデス。

vキー連打して画面のどこかに↑が出てたら、半角/全角を押しましょう。それで直ります。

特にレイヤー名やファイル名を日本語で入れた後はこれになります。半角だけで操作できるよう英語を覚えましょう。

もっとも英語を覚えた所で、誰か他の日本人と共同作業れば結局混在します。半角/全角の存在を覚えた方が早いかもデス。


そろそろ移動できました?



サイズの拡大縮小・反転


もちろん、移動だけじゃあまり意味はないデスよね。

どんなに動かした所で、動くだけでは永遠に答えにはたどり着けないのデス。


サイズを変えたり、反転したりする必要があります。


レイヤーが「背景」の場合は、ロックされて動かせないので、レイヤーパレットをダブルクリックして「レイヤー0」に変更しましょう。

通常レイヤーも、レイヤーパレットの「ロック:」横の鍵アイコンでロックできますが、今は気にする必要は無いデス。

間違って押してなぜ動かん!みたいになったら、思い出してください。余談でした。


動かしたいレイヤーを選択して、「編集(E)」→「自由変形(T)」もしくは Ctrl + T

すると、バウンディングボックスが出るので、Shiftを押しながら、四隅の四角をドラッグ&ドロップしてください。サイズが変更できるはずデス。

画面からはみ出す場合は、マウスホイールスクロールをして調整ください。


Shiftを押さないと比率が変わります。

比率が変わると大体見栄えが悪くなります。比率を変えるのは、技術に自信が付いてからにしましょう。

何かしらを固定する=Shiftと覚えてください。


Shift 以外に Ctrl とか Alt とか、Ctrl + Shift とか Ctrl + Alt とか Alt + Shift とか Ctrl + Alt + Shift とかでも色々変わります。やってるウチに多分覚えるでしょう。 (上のバウンディングボックスリンク先に説明があります)


ちょうど良いサイズになったら、Enterか上の「◯」で決定します。

やっぱやーめたと思ったら、Escか上の「✕」を押してください。


自由変形の下の「変形」はダメなの?となるかもしれませんが、反転以外は自由変形でやれるし、そっちの方が早いデス。ワープはまず使いません。

いちいちメニューから選ばず、Ctrl + T、ShiftやCtrlの組み合わせで自在に変形できる人材になってください。


左右反転(水平方向に反転)、上下反転(垂直方向に反転)だけは自由変形だと面倒なので、変形メニューから選びます。

反転はキャラクターの向きを変えるとか、メチャクチャ使います。



まとめ

サイズ変更したり、反転したりすると、なんとなくゲームっぽくなるんじゃないでしょうか。

左側のヒトが叩いて、右側のヒトが吹っ飛ぶ、というストーリーが読み取れますね。

横画面のゲームは左側がプレイヤーのことが多く、うまく攻撃できると吹っ飛ぶのか、楽しそう、という印象になります。


企画書の画像は一枚一枚にストーリーを感じられると、ゲームへのイメージが膨らむので、パッと見でストーリーが伝わる絵かを考えると良いデス。


レイヤーの重ね方で絵が作れる

Ctrl + T で自由変形、ShiftやCtrlを組み合わせてバウンディングボックスを調整

反転以外は自由変形で!


今日重要なのは、この3つデス。Power Pointも同様の機能がありますが、操作は違うので忘れないようにしてください。

特に、自由変形は今後当たり前のように使っていきます。


次回からもう少しPhotoshopならではの機能に進みます。乞うご期待。

©株式会社ピコラ Picola Inc.