Photoshopからサイズの異なる複数のPNGのエクスポートを自動化する方法は?


18

96 px×96 pxの解像度のPSDファイルがあります。これを、36 px×36 px、48 px×48 px、72 px×72 px、96 px×96pxなどの異なる解像度の4つのPNGファイルとして保存したいと思います。画像サイズを手動で4回調整してオプションとして保存する代わりに、これを何らかの方法で自動化できますか?


@NickBeusが与えた答えを試してみてください。それがあなたに役立つ場合は、緑色のチェックマークを付けてください。この答えはとても助かりました。一度だけ出力サイズを変更するために「Web用に保存」ダイアログを開いた回数はわかりません。[画像アセット]ウィンドウでは、必要なすべてのサイズとファイル名のサフィックスを追加して、それらすべてをエクスポートできます。
rgb_life

回答:


13

完全な解決策ではありませんが、これはGoogleから来た人を助けるかもしれません。

[ファイル]→[Web用に保存]で保存すると、保存プロセス中にサイズを変更できます。オプションは右側の[ 画像サイズ]にあります。

他の回答が指摘しているように、アイコンをデザインしている場合、ベクターを使用すると、画像にいくつかの異なるサイズが必要なときにこれを非常に頻繁に行います。


3
びっくりしました。Save for Webのサイズ変更オプションに実際に気づいたことはありませんでした:o
Yisela

また、CS6でダイアログAlt+Ctrl+Shift+Sを起動するためにも使用できますSave for Web
ムハンマドサキブ

5

Photoshop CCには、複数の画像を作成するために設計されたPhotoshop Generatorという機能があります

ジェネレータについてはこちらをご覧ください

抜粋:

Generatorを使用すると、作業中にリアルタイムで画像アセットを作成できるため、各レイヤーを手動でコピー、スライス、エクスポートする面倒な手順が不要になり、時間を節約できます。レイヤーまたはレイヤーグループの名前にファイル拡張子を追加するだけで、PhotoshopはそのレイヤーのコンテンツからJPG、PNG、またはGIFを自動的に作成します。そのレイヤーに変更を加えると、ファイルはすぐに更新されます。これは、Photoshopデザインで常に最新の画像のフォルダーがあることを意味します。


4

アイコンを何回エクスポートする必要がありますか?アイコンが1つだけの場合、おそらく、ベクトルとレイヤースタイルを使用してすべてを描画し、ドキュメントのサイズを変更し、必要な調整を行い、PNGを保存するのが最善の選択肢です(オプションで、将来のエクスポートのためにPSDを保持します)。

このプロセスを何度も繰り返す必要がある場合は、すべてをスライス付きのスプライトシートとして設定することをお勧めします。

このトピックについて書きました(多くのエクスポートテクニックを含む):Photoshopからエクスポートします。

アイコンを設計するとき、小さなサイズを個別に手動で微調整する必要があることがよくあります。すべてのサイズを作成する際には、このことを覚えておく価値があります。


3

上記のMarcで述べたように、おそらくドキュメント内のベクトルのスケーリングとスプライトシートの使用をお勧めします。

避けるべき1つのことは、Maxismが示唆しているように、Web用に保存する際のスケーリングです。さまざまなテクニックの結果と、Save for Webで一貫して生成されたアセットをアーティファクトとハーフピクセルで比較する投稿を書きました。Photoshopでアセットを縮小してエクスポートします。

また、これらのアセットをエクスポートするプロセスを自動化するPhotoshopスクリプトを作成しました:EXPORT TO ANDROID PHOTOSHOP SCRIPT

お役に立てれば。


1

96から36に自動的に移行する良い方法はありません。48でさえ、デザインがばらばらになり始めるのを見るでしょう。

唯一の利点は、この方法でエクスポートするアイコンがたくさんあり、戻ってそれらをクリーンアップする予定がある場合です。必要に応じて、アクションとして記録するか、jsxを使用できます。

特定の設計では、段階的にダウンするか、元の96pxバージョンから各バージョンをエクスポートして実験します。通常は手順が最適ですが、一部の設計では漸進的な歪みが発生する場合があります。


1

mdpiでアイコンを作成し、このPhotoshopアクションを使用して、ldpi、hdpi、xhdpiにエクスポートします。mdpiからxhdpiまでは問題なく動作しますが、ldpiとhdpiは少しぼやけています。

記事へのリンク Photoshopアクションの
ダウンロード



1

Photoschop CC 2014には新しいオプションがあります。「Generate Assets」と呼ばれ、「file」の下にあり、0.25x、0.5x、2x、3xを選択でき、自己の寸法を設定できます。レイヤーを任意のファイル形式にエクスポートし、異なる次元で(必要に応じて)エクスポートします。


この答えはまあまあです。まず、「ファイル>生成」に移動して、「画像アセット」をチェックする必要があります。次に、「ファイル>エクスポート>エクスポートAS」に移動すると、Photoshopでこれまで使用した中で最高のメニューが表示されます。サイズを追加して、それぞれにカスタムサフィックスを付けることができます。もちろん、これはAdobe Photoshop CCにあります。私のCS4はMac OSXのアップデートで死亡したため、現在使用しているバージョン以外のバージョンについては知りません。
rgb_life

1

これはまさにあなたが望むものだと思います。

https://github.com/austynmahoney/mobile-export-scripts-illustrator

あなたは、それぞれを開く慣れている場合.psdIllustrator可能な複数のサイズに出力を容易にスケーリング係数を微調整することにより、あなた.jsxのファイル。

Androidに使用されるベースラインイメージはxhdpi、iOSの場合は@ 2xです。スクリプトはこれらのサイズから拡大縮小します。


0

「Ship it」と呼ばれる素敵なMacプログラムは、まさにあなたが求めていることをします。画像を複数のサイズ/フォーマットにエクスポートします。私はそれを使用しました。Mac App Storeのリンク:https : //itunes.apple.com/us/app/shipit! / id492043869


このアプリは、カナダおよび米国のiTunesストアでは利用できなくなりました...またはAppStore ...
PatTheBeast

0

アドビの土地では、これを行うのに簡単なことは何もありませんでした。ImageMagickをインストールしているか、インストールする意思があり、コマンドラインに慣れている場合は、convertCLIツールが最適です。

数字を入力せずにEnterキーを押すまで、幅を受け入れて画像のサイズを変更するこのシェルスクリプトを作成しました。

#!/bin/sh

oot=${1%.*}
while read -p 'width: ' -r && [ "$REPLY" != '' ]; do
    convert "$1" -resize "$REPLY"x "$oot-$REPLY.png"
done

私は私の名前multi-resize.shを付けて、~/bin/どこにでもあるようにそれを入れました。

次に、元の解像度のPNGで次のようにシェルで実行します。

$ multi-resize.sh foo.png
width: 96
width: 72
width: 48
width: 36
width: 
$

foo-72.png同じディレクトリになどがあります。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.