Webデザイン

【Photoshop】【初心者】1つのPSDファイルで複数の画像を編集する方法・複数アートボードを一気に自動保存する方法

一つのタスクで画像を複数作成する場合ってありますよね。

そんなとき、一つのPSDファイルで複数画像を編集すると

効率の観点からもファイル管理の観点からも便利です。

今回はこのように、一つのpsdファイルで複数の画像を編集する方法

そこで作った複数の画像を一括保存する方法を記していきます。

1つのPSDファイルで複数の画像を編集する方法

①アートボードを新規作成

Photoshopの操作画面の右側にレイヤーパネルがありますね。

このレイヤーパネルの右上に小さくハンバーガーアイコンみたいな4本線のアイコンがありますので、そこをクリックします。

そうしたら

アートボードを新規作成

をクリック。

以下のようなウィンドウが出てきますので

  • アートボードの名前
  • アートボードのサイズ

を指定して【OK】をクリックします。

※アートボードの名前もサイズも、後で何度でも変更できます。

するとアートボードと呼ばれる、各レイヤーを束ねるフォルダのようなものが出現します。

以下画像のレイヤーパネルを見るとわかる通り

いままで表示されていた「レイヤー0」が「テスト1」というアートボードの中に入りました。

②アートボードをコピペする

ここからは実演しながら説明して行きます。

実演しながらの方がいろいろと細かな部分を説明しやすいので。

というわけで、先程作ったアートボード「テスト1」にカービィを書いてみました。

実演しながら、色違いのカービィを4体作っていきます。

まずは1枚目のカービィをコピペします。

  1. コピーしたいアートボードの名前をクリック
  2. Ctrl + C → Ctrl + V

するとこのように、名前も中身も全く同じアートボードが隣に複製されます。

今回は色だけ違うカービィを4体作りたいので

コピペした方の色だけ変えていきます。

こんな風に、アートボードで作業をすると部分的に違うデザインを効率的に作成することができます。

…この作業を繰り返して完成したのがコチラ↓

(あらかわいい…^^)

ちなみに各アートボードの名前はわかりやすくするために変えました。

【+α】複数アートボードを一気に自動保存する方法

ここまででカービィが4つできました。

それぞれ.jpgファイルで保存していきたいのですが

一つ一つ保存作業をするのはちょっと面倒です。

今回は4つだけど

もしアートボードが5つ、6つ……10…という風に増えていったら

保存作業だけでかなりの時間を消費してしまいます。

こんな時に便利なのが、レイヤーからの画像アセットの生成と呼ばれる方法です。

やり方はとってもカンタン♪

まず

  • 保存したいレイヤーの名前の最後に
  • 希望の拡張子をつける

そうしたら

ファイル 生成 画像アセット

の順にクリック。

クリックした瞬間は画面に変化はありませんが

再度【画像アセット】を見てみるとチェックマークが入っているはずです。

もしこのようにチェックマークが入っていないと、うまく画像アセットの生成の設定ができていないということなので

もう一度同じようにクリックをしてみたり、一度Photoshopを開きなおしてクリックをしてみたりしてくださいね。

チェックマークが入ったことを確認したら準備OK!

そのPSDファイルと同じ階層のフォルダ

に、アセットフォルダが置かれているはずです。

[ PSDファイル名 ] -assets

というファイルがそうです。

中を見てみると

こんな感じ!

以後、PSDファイルを保存するごとに、最新版の画像がこの場所に生成されるようになります。

もちろん、拡張子を別のものにしてもちゃんと生成されます。

関連記事