Web

Ovenでチンして快適な画像アセット生成ライフ

main

YAH MAN!ジミーです。

前回のブログで画像アセットについて書きましたが、今回はその延長線上で画像アセット作業をグンと早く便利にしてくれる、フォトショップのエクステンションovenを紹介します。

Ovenのインストール方法

早速、http://oven.chrometaphore.com/へ行き、ovenをダウンロード。
※Photoshop CC / 2014~対応

ダウンロードしたZIPファイルを解凍

D:\Downloads\Oven_1.0.7\Oven 1.0.7\Photoshop CC 2015\の中にあるZIPファイルOven.zipをまた解凍

D:\Downloads\Oven\をフォトショップのエクステンションフォルダ(C:\Program Files (x86)\Common Files\Adobe\CEP\extensions)に入れます

フォトショップ再起動

Ovenで素早く画像アセット生成

画像アセットを作りたいPSDを開いて、ファイル→生成→画像アセットにチェックを入れておきます。
そして、ウィンドウ→エクステンション→Ovenをクリック

01
画像アセットを生成したいレイヤーフォルダに名前を入れ、Ovenをポチッと押すと、、、

02
自動で拡張子がついて、画像アセットが生成されます

Ovenで倍の画像アセット生成

複数サイズの画像もボタン一つで生成してくれます。

03
Output @ を全て有効にしてポチッと、、、

04
するとこんな感じで、640×247で作った画像が、2倍(main@2x.jpg)3倍(main@3x.jpg)のサイズで画像アセットが生成されます
※OvenのDocument resolutionの設定を2xに変更すれば1/2、1.5倍のサイズで生成されます

Retinaディスプレイ用画像を生成するのに重宝すると思うので、Ovenは持っていて損はないでしょう。