こんにちは、福岡のホームページ制作シンス株式会社の千年原です！

Photoshopで書き出しをする際に、便利なアセット機能はご存知ですか？
今回はアセット機能を使って、一度に複数の画像サイズを書き出す方法についてまとめていきます。

まだ使ったことのない方や、Photoshopを学び始めたばかりの方々にぜひ知っていただきたいです。

そもそも画像アセット機能とは？

レイヤーやレイヤーグループに、語尾に拡張子（jpg、pngなど）をつけた名前を入力することで、個別に画像を書き出すことができる機能です。

アセット機能の使い方

①書き出したいレイヤーに拡張子つきの名前を入力する。

レイヤーグループの場合も、同じようにレイヤーグループ自体に拡張子つきの名前を入力します。

【例】idot.png,200%idot@2x.png

「idot.png」で普通サイズの画像、「,」で区切って「200%idot@2x.png」をつけることで、2つのサイズが一気に書き出せる仕組みとなっています。

拡張子の種類

ここで選べる拡張子はPNG、GIF、JPG、SVGがあります。
書き出したいものによって変えましょう！

②画像アセットを設定

「ファイル」→「生成」→「画像アセット」 をクリックします。

これで書き出しの過程が完了しました。

保存できているか見てみましょう。

普通サイズと2倍サイズの画像が一気に書き出しされました！

まとめ

今まで、スライスで画像を書き出す時間が手間でしたが、このツールを知ってから作業のスピードが比べものにならないくらい上がりました！

皆様も今日から使ってみてください！

経営課題解決のためのWebマーケティング提案、ネットショップ構築や採用サイトの企画・制作も承っております。