【spine】PhotoshopToSpine
このスクリプト PhotoshopToSpine は、Photoshopでレイヤーを画像として書き出し、
Spineで同じ位置、同じレイヤー順で取り込むJSONを書き出すことができます。
spineの制作準備段階、時間短縮で必須となってくるので
是非参考にしてください!
同じ機能ようなもので「Spine Layer ToPNG」がありますので、
そっちは別の記事を参考にしてください!
ダウンロード場所(別サイトに飛びます)(英語)
https://github.com/EsotericSoftware/spine-scripts
◆◆実行方法◆◆
2通りあります
- [PhotoshopToSpine.jsx]をPhotoshopのメニューバーもしくはツールバーにドラッグすると実行画面が開きます。
- [PhotoshopToSpine.jsx][logo.png]をPhotoshopのフォルダーに入れるとPhotoshopの[ファイル]→[スクリプト]から実行画面が開きます。
<例>
C:\Program Files\Adobe\Adobe Photoshop CC 2019\Presets\Scripts
OKを押すと、指定したフォルダにJSONが書き出されます。
書き出したJSONをspineにドラッグすると読み込むことが出来ます。
各種の機能説明は続きから!!(*^O^*)
◆◆各機能の説明◆◆
- Ignore hidden layers:非表示レイヤーを無視
- Ignore background layer:背景レイヤーを無視
- Trim whitespace:余白部分をトリム
- Write template image:全て統合した画像(テンプレート)を置く
- Scale:指定の拡大率で書き出す(100%以下)
- Padding:指定のpx数で余白部分を作る
---Output Paths---
- Images:画像書き出し場所
◆◆タグ◆◆
Photoshopのグループ名、レイヤー名に[タグ]つけることで
出力をカスタマイズすることができます。
(例:[bone]face、face[bone])
Photoshopのグループ構成画像です。
例として [bone]face としています。
上記構成でグループ名の[bone]部分を変更し、PhotoshopToSpineで書き出したらspine上でどういう風に
カスタマイズされるのか見ていきたいと思います。
- [bone]face
faceというボーンの中に、書き出された画像がスロット化されて配置されます。
ボーンの位置は画像の中心に配置されます。
- [slot]face
faceというスロットに画像が配置されます
腕や表情などの画像切り替え時に使用するといいと思います
- [skin]face
faceというスキンプレースホルダーに配置されます。
スキン機能については下記記事を見て下さい
- [merge]face
faceという単一に統合された画像が配置されます
- [folder]face
グループ内の階層がサブフォルダに出力されます。
フォルダ階層を深くできたり、ネストができます。
- [ignore] このタグを付けたレイヤーは出力されません。