読者です 読者をやめる 読者になる 読者になる

ELLY'S HATENA BLOG

Webデザイナーellyのデザインとゆるふわな日常。

【Photoshop】レイヤー名を一括変換するのに便利なスクリプト「layerRenamer」

デザイン

 Photoshopで画像を書き出す時、スライスせずにアセットを使って一括で画像を書き出すことができるようになり、とても便利になりました。

拡張子の「□.png」や、Retinaディスプレイ用に「200% .png」をレイヤー名につけると、一括でレイヤーに書いた通りに、書き出してくれます。

 私はラフ画像を作る時、毎回レイヤー名を変更したり、レイヤー群をきちんとグループにわけて整理したりできなくて、いつもデザインがfixした後、コーダーさんにデータをお渡しする時に慌てて整理をします。


整理の仕方はcreative memomemoさんの俺流ルールを参考にしています。
迷ったり悩んだりしたときは、まずは先人さんたちのやり方を真似してみたほうがいいでしょう。

creativememomemo.com

 

レイヤー名、一括変更に「layerRenamer」を使ってみる

Photoshopのエクステンションでも同様の機能があって、整理できるものもありますが、一番シンプルに使いやすかったのが「layerRenamer」でした。
では導入方法をご紹介します。

1.スクリプトファイルをDLしてきます。
まずdarkwarkさんのこちらの記事の「Download」ボタンから落としてきてください。「[KAM] Layers Renamer - APR」というファイル名です。

blog.darkwark.com

2.Photoshopに格納する。
私の場合macでPhotoshop CC 2015を使っているので場所は下記の所になります。スクリプトファイルをPhotoshopファイルの中に格納してください。

/Applications/Adobe Photoshop CC 2015/Presets/Scripts

3.Photoshopを再起動
忘れがちですが再起動しないとメニューに追加されないので気をつけて下さい。 

4.立ち上げてスクリプトを起動
[ファイル]  >  [スクリプト]の中に「[KAM] Layers Renamer - APR」と表示されいればインストール成功です!

ファイル名を変えたいレイヤーを複数選択します。
レイヤーを2つ以上選択しなければ、エラー画面が出てくるので注意してください。

 f:id:elly_elly:20160530011226j:plain

レイヤー名を変更したいレイヤーを二つ以上選択し、[KAM] Layers Renamer - APR」を実行。

f:id:elly_elly:20160530011233j:plain

すると、下記のようなウィンドウが出てくるので、Textの箇所に変更したい名前を書きます。

f:id:elly_elly:20160530011245j:plain

また、Text下にあるModeの「Append」「Prepend」「Replace」とありますが、

・Append : レイヤー名の後方に追加
例)img → img.jpg
拡張子をまとめて指定するのに便利。

・Prepend : レイヤー名の前方に追加
例)img → btn_img
レイヤー名に頭にまとめて文字を追加するのに便利。

・Replace : 全部置き換える
例)img → img01.jpg
レイヤー名を連番にしたいとき便利。
記述方法は「img.jpg」→「img_%n.jpg」と書くとまとめて連番にしてくれます。

 

スクリプトをショートカットに割り当てて、もっと便利にしよう

[ファイル]メニューの[スクリプト]のサブフォルダーに表示されるスクリプトには、キーボードショートカットを割り当てることが可能です。
[編集]  >  [キーボードショートカット]で下の写真のようにショートカットの被らないものに割り当ててみました。

f:id:elly_elly:20160530215021j:plain

他にも便利なスクリプトなどあるので
いろんなものを使ってみて自分が使いやすいものを選んでみてくださいね。

 

参考にさせて頂いたサイト

cubelic3.jp

 

ELLY'S HATENA BLOG © 2016. All Rights Reserved.