Photoshopのアセット機能で一度に複数の画像サイズを書き出す方法

| カテゴリー : Webデザイン

こんにちは、福岡のホームページ制作アイドットデザインの千年原です!

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

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

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

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

アセット機能の使い方

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

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

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

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

拡張子の種類

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

②画像アセットを設定

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

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

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

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

まとめ

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

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

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

儲かる会社はやっている!小さな会社のホームページ集客の鉄則

無料の資料をダウンロード

×

お気軽にお問い合わせください!

お見積りやご相談は、メール/お電話にてお気軽にご連絡ください。専属の担当者が丁寧にご対応いたします。

Webマーケティングのお役立ち情報を発信しています!

会社資料はこちら

制作実績や各種制作プランなどの詳しい資料をご用意しております。

ダウンロードする

×

会社資料ダウンロード