FlashCS6のスプライトシート出力

2012.09.03
アドビのFlashCS6にはスプライトシート出力という新機能が搭載されました。
スプライトシートや詳しいFlashCS6での操作手順はこちらの動画をご覧ください。

スプライトシートの作成とワークフロー | Learn Flash Professional CS6 | Adobe TV


要はウディタの戦闘エフェクトアニメーションのような、アニメーションのコマを1枚の画像にまとめた状態に出力してくれるわけです。
てことはFlashでエフェクトアニメを作ったりしたときの画像出力が超ラクチンになる!と思って、いじり始めてみましたが、いくつか注意が必要でしたので、簡単にまとめておきます。



まずは、FlashCS6でシンボルを作って、シンボル内でアニメーションを作っていきます。
今回は簡単にこんなかんじのを。

spsheet-test.gif


タイムラインやレイヤーはこんなかんじ。
上のレイヤー「アニメ」に丸が変化するアニメーションので、
下のレイヤー「ガイド」に青いグラデーションの四角枠があります。
下のレイヤーに置いてある四角枠がポイントになるのですが、あとで説明します。

spsheet-test1.jpg


シンボル内でアニメーションが完成したら、ライブラリパレットからそのシンボルを選択右クリックメニューから「スプライトシートを生成」を選択します。

spsheet-test2.jpg


「スプライトシートを生成」画面が表示されますので、いくつか項目を設定していきます。
まずは「画像のサイズ」、自動調整にすると勝手に余白をつけちゃうので、ギリギリの画像にするため、手動入力します。
今回は1コマの画像サイズ240×240pixelなので、その倍数で指定します。
あとは「出力ファイル名」を入力して、「書き出し」ボタンを押せばOKです。

※↓画像をクリックすると拡大されます。
spsheet-test3.jpg


出力されたファイルはこの2点。
PNG画像ファイルとXMLファイル。XMLファイルはHTML5やFlashのアクションスクリプトなどのプログラムで制御する際に、PNG画像中のどの位置にどのサイズのコマ画像があるといった情報が記述されています。
私には今のところ用がないのでXMLファイルはゴミ箱行きになってしまいます。

spsheet-test5.jpg


さて、すんなり出力できたじゃないか。というところですが、
予め問題に対処したタネを仕込んでおいたので、簡単でした。
そのタネは最初のシンボル内のレイヤーの説明で下のレイヤーに配置した青いグラデーションの四角枠です。

FlashCS6のスプライトシートの生成では、1コマの画像サイズをそのシンボル内の画像がある領域から判断してしまうため、普通にアニメーションを作った場合は明確に指定することができません。
というわけで、1コマのサイズを明確に指定するためにアニメーションを作ったレイヤーの下に青いグラデーションの四角枠を配置したわけです。
この四角枠のサイズが240×240pixelになっています。

今回はわかりやすく枠に色をつけてありますが、スプライトシートの生成を実用する場合には枠を透明や透明色にしちゃえばいいわけです。

今回は枠をシンボル化してあるので、「カラー効果」アルファを0%にしてやれば、出力されるスプライトシートは1コマのサイズを240×240pixelのままで、この枠が画像に出力されることはありません。

また、注意事項として、この1コマサイズを決める枠の「位置とサイズ」の数値に小数を含まないように調整しましょう。
少数を含んでしまうと、出力される1コマのサイズが微妙にずれてしまうことがあります。

spsheet-test4.jpg




おまけとして、「スプライトシートを生成」以外にも便利な機能が。
同じ手順でライブラリからシンボルを選択し、「PNGシーケンスを書き出し」を選択すると1コマ1コマのバラ画像を出力することができます。
こちらは「スプライトシートを生成」みたいに面倒なことはないので、出力サイズの数値を入力して書き出せばOKです。
1コマサイズを固定するための枠を用意する必要もないです。

私が普段使っているFlashCS3ではこの機能(シンボル単体でのシーケンス画像出力)はなかったので、CS4以降かCS6で追加されたものだと思います。

spsheet-test6.jpg

spsheet-test7.jpg




さて、これでFlashで作ったアニメーションを他プログラムで使用できる画像に出力するのがとても手軽になりました。
ちょっと工夫すればウディタのキャラクター歩行画像だってFlashで作って出力できちゃいますねぇ。
今までは出力がめんどくさかったので、FlashではAfterEffectsで使用するパーツを作るぐらいしかしてこなかったけど、Flash上だけで作る新たな素材を考えてみたいと思います。
関連記事

この記事へのコメント

非公開にする :

トラックバック

URL :

プロフィール

ぴぽ

管理人:ぴぽ
フリーのグラフィックデザイナーという傍ら、「ゲームを作りたいなぁ♪」と奮闘中です!
Twitter

▼関連サイト
・ぴぽや - ゲーム画像素材販売 -
 有料素材の販売
・ぴぽや倉庫
 公開した素材のまとめ

・ぴぽやリンク
 素材配布サイトリンク集
・はじめてのウディタ
 ウディタお勉強wiki
・ニコニ・コモンズ
 動画素材を登録中

ご感想・ご利用報告・ご連絡

素材のご利用報告・ご感想をいただける場合はこちらにお願いします。

お仕事のご相談などはこちらをご覧ください。

作ってほしいゲーム用画像素材のご要望はこちらにどうぞ。
最新記事一覧
ゲーム制作&ゲーム向け素材情報 2017年6~7月分 2017/07/31
2017年6~7月 DLsite.comで発売されたゲーム向け素材紹介 2017/07/31
ファイルのダウンロードについて 2017/06/18
2017年5月 DLsite.comで発売されたゲーム向け素材紹介 2017/06/03
ゲーム制作&ゲーム向け素材情報 2017年5月分 2017/06/03
カテゴリ
最新コメント
リンク
ウディタ公式サイト
ツクールweb
Degicaツクールストア
にほんブログ村 ゲームブログ ゲーム制作へ
にほんブログ村
ビットゲームメーカー公式(ゲーム制作ができるスマホアプリ)

リンクして頂ける場合はこちらのバナー画像をお使いください。
※バナー画像なしのリンクでも全く問題ありません。

RSS
広告
おすすめ有料素材
ねくらファンタジーマップチップ素材集
ねくらファンタジーマップチップ素材集
ねくらファンタジーマップチップ素材集エクストラダンジョン
ねくらファンタジーマップチップ素材集エクストラダンジョン
SF近未来~現代 タイルセット・マップチップ素材 著作権フリー RPGツクール、ウディタ用
SF近未来~現代 タイルセット・マップチップ素材
ファミコン風RPG基本マップ素材セット
ファミコン風RPG基本マップ素材セット
どうぶつキャラクターチップセット3
どうぶつキャラクターチップセット3
1号のバトラー素材集基礎編vol.1
1号のバトラー素材集基礎編vol.1
RPG用ザコ敵(哺乳類他)48種類セット
RPG用ザコ敵(哺乳類他)48種類セット
立ち絵素材男女
立ち絵素材男女
【立ち絵素材】Aさんのバイト服
【立ち絵素材】Aさんのバイト服
【立ち絵素材】現代人まとめ (女子生徒・男子生徒・一般女性・一般男性・少女)
【立ち絵素材】現代人まとめ (女子生徒・男子生徒・一般女性・一般男性・少女)
ぴぽやゲームエフェクト素材集01-斬撃- &02-属性斬撃- セット
ぴぽやゲームエフェクト素材集01-斬撃- &02-属性斬撃- セット
みにくる背景CG素材集『ファンタジー編』part01
みにくる背景CG素材集『ファンタジー編』part01
みにくる背景CG素材集『ファンタジー編』part02
みにくる背景CG素材集『ファンタジー編』part02
みにくる背景CG素材集『ファンタジー編』part03
みにくる背景CG素材集『ファンタジー編』part03
イラストアイコン素材集Vol.1
イラストアイコン素材集Vol.1
ファンタジーゲーム向けアイコン素材1
ファンタジーゲーム向けアイコン素材1
ファンタジーゲーム向けアイコン素材2
ファンタジーゲーム向けアイコン素材2
ゲーム製作用アイコン集#01
ゲーム製作用アイコン集#01
フリー素材音楽 Vol.1・2・3バンドル (MP3で289曲収録 - Vol.2/3無限ループ再生/RPGツクールにも対応)
フリー素材音楽 Vol.1・2・3バンドル (MP3で289曲収録 - Vol.2/3無限ループ再生/RPGツクールにも対応)
RPG向けフリー素材BGMデラックスパック
RPG向けフリー素材BGMデラックスパック
著作権フリーオリジナルBGM集 Vol.1 『RPG tail』
著作権フリーオリジナルBGM集 Vol.1 『RPG tail』
ドットゲーム支援音楽集 〜中世ファンタジー編 2巻〜
ドットゲーム支援音楽集(MIDI) 〜中世ファンタジー編 2巻〜
フリー素材SE Vol.ABCバンドル (効果音1865個収録)
フリー素材SE Vol.ABCバンドル (効果音1865個収録)
SMILE GAME BUILDER
3DRPG制作ソフト SMILE GAME BUILDER
SRPG Studio
シミュレーションRPG作成ソフト「SRPG Studio」
ティラノビルダー PRO
ノベルゲーム開発ソフト「ティラノビルダー PRO」