今日は個人開発中に作ったPhotoshopツールの紹介です。
ゲームでよく2D素材の容量削減のために9スライスの画像を作成しますが、作成した画像を真ん中を切って、移動してというのが面倒なので9スライス画像を作成するツールを作成しました。
そもそも９スライスって何ぞや？という方はこちらの方がまとめられている記事などをご確認ください。
スクリプト概要
今回のツールでは9スライスで使用する画像を作成するツールです。
例えば以下のようなフレーム画像を9スライス画像として要らない中心部分を切り取る時に使います。
スライスする位置の判定にはグリッドを設定して、そこを基準にスライスするようにしています。
保存形式は現状「pngのみ」です。(UIなど2Dで透過情報がないことはほぼないので…)
ちなみに今回は特にウィンドウは開きません。
使い方
【スクリプトの準備】
Commonファイルを常に最新にするためにデータを分けていますので、両方のファイルを落とすようにしてください。
- 上記2つの右上にある「ダウンロード」ボタンからスクリプトをダウンロード
- zipファイルを解凍する
- スクリプト用のフォルダに「ArtAwA」のフォルダを格納
※フォルダの階層は変えない→念のため他のファイルと競合させないため
格納場所例：
「Mac」/Application/PhotoshopCC2017/Presets/Scripts/
「Win」C:¥Program Files¥Adobe¥Adobe PhotoshopCC2017¥Presets¥Scripts
【スクリプトの実行】
- 9スライスしたい画像のpngを用意する
※psdを直接スライスするようには想定していません。
(いちおうレイヤーを強制的にマージして書き出せるようにはしていますが…) - スライスしたい箇所にグリッドを配置する
例では横だけですが、もちろん縦だけ、縦横と設定できます。
- 「ファイル」→「スクリプト」→「NineSlicer」を選択
- 9スライスしたい画像と同階層に「export」のフォルダが作成され、そこに書き出される
今後の追加予定
・スライス位置を自動で判別
この記事を書いている途中で思いつきましたが、グリッドを設定すらしなくていいといいなと思い…
例えば横にスライスしたい場合は縦方向のピクセルを配列に格納してやって、横に何個が全く同じ配列があれば、その部分をカットするようにするとかすればイケそうな気も。
【4/4追記】
処理的には出来ましたが、ピクセルを取得して判定するのはかなり重くて100px*60pxくらいのものでも1分以上かかっていたので、役に立たない…
一旦はグリッドからスライスする現状の方式でということで。
さいごに
ファイルの共有方法についてはちょっと色々と検討中。
汎用処理(Common)も1つのスクリプトの中に書いてしまえば、独立したファイルとして上げられるけどブログ用に別途普段遣いと分けて書くのは、めんどくさ、ミスが起きそうなのであまりやりたくない。
しばらくは良い方法が思い浮かぶまではCommonを別途落としてもらう形で行こうかと思います。
それでは今回はこの辺で
(´･ω･`*)ﾉｼ
コメント