LA-MULANA2のひみつ

～特別付録：SpriteStudioPlayer改造TIPS～

自己紹介

『OPTPiX SpriteStudio』・『～ imesta』等のセールス・マーケティングを担当。特にゲーム業界の顧客に関しては、全て担当している。が、疲れからか、不幸にも黒塗りの高級車に追突してしまう。後輩をかばいすべての責任を負った三浦に対し、車の主、暴力団員谷岡に言い渡された示談の条件とは・・・

浅井維新（Yukiyoshi Asai）

㈱ウェブテクノロジ・コムセールス・コミュニケーション部

@spritestudio / @karasuma.usb

馴れ初め

ゲーム開発ツールとミドルウェアの祭典 『Game Tools & Middleware Forum 2013』このイベントで出会ったNIGOROの楢村氏にSpriteStudioを紹介、直後に“SpriteStudio for Indie”ライセンスを提供開始したのが、きっかけ。

GTMF2013（2013.07.13）

今年のGTMF

『GTMF 2016（Game Tools & Middleware Forum 2016）』

http://gtmf.jp/2016/

大阪開催：2016/7/5（火）@コングレコンベンションセンター

東京開催：2016/7/15（金）@秋葉原UDX

入場無料！

LA-MULANA2のひみつ～特別付録：SpriteStudioPlayer改造Tips

絵： 楢村 匠お話： 鮫島 朋龍監修： 浅井 維新

お前は誰だ・・・！？

NIGOROのプログラムとサウンド担当。MSXとX68000をこよなく愛するナイスガイ（おっさん）。好きな食べ物はぼんち揚げ。値段を気にしないなら花満月。歌舞伎揚げはちょっと違う派。

名前：鮫島 朋龍 （本名）

NIGOROって何？

株式会社アスタリズムって零細企業のゲーム事業部です。LA-MULANA作った所って言うより薔薇と椿作った所って言う方がもしかして知名度高いんじゃないかとか思ったり。開発は１０年以上同じメンバー（３人）でやってます。

今日は何の話をするかと言うと・・・

現在、当社は新作LA-MULANA２をUnity5とSpriteStudio5を使って開発中なんすが、

なんでSpriteStudioでLA-MULANA2が動いてるのか良くわかんないんだよねー。そういう事やるツールじゃ無かったよねー？

とか言った人が居るので、どうやって動かしているのか、NIGOROでのSpriteStudio5の使い方とSpriteStudio5 Player for Unityの改修部分をメインに偉そうに語ってみたいと思います！

LA-MULANA2って何？特に海外でカルトな人気を誇る遺跡探索２Dアクションアドベンチャーゲーム、LA-MULANAの続編です。勿論フレームワークはUnity5を使っています。KickStarterで$260,000集めて、現在開発中！半年ほど遅れてるがな！

前作LA-MULANAはWindows版、WiiWare版、VITA版（LA-MULANA EX）が絶賛販売中です。Windows版はSTEAM GREEN LIGHTの日本通過第一号でしたっけ？

PLAYISMで現在もLA-MULANA2のバックは受け付けております！パッケージが欲しい場合はここしかないっぽいぜ。

２DゲーなのにUnityなの？Cocos2Dとかじゃないの？お前は何時からLA-MULANA2が３Dでは無いと思っていた？

どこにSpriteStudio使ってるの？

見た目は２Dですが、中身はほとんど３Dです。

アニメーションさせるキャラクタはSpriteStudioで作成しています。

今日のおしながき

・NIGORO流SpriteStudio5データの扱い方

・無いなら作れ：その１ 「ツール上で当たり判定つけれるんだよ。」

・無いなら作れ：その２ 「主人公の上半身、優先度おかしい。」

・無いなら作れ：その３ 「キャラにライト効いてない。」

・何故SpriteStudio5を使うのか

・まとめ 結局Unity5+SpriteStudio5ってどうなの？

・特別付録：SpriteStudio Player 改造Tips

＊Unityは5.3.4f1、SpriteStudio Player for Unityは1.2.29を使用しています。

何故SpriteStudio５を使うのか

まぁ、浅井氏が「LA-MULANA2で使ってよ～」って言って来たからなんですが。

・勿論NIGOROには自前の2Dモーションツールが存在してます。

・でも、２のエンジンどうするかが決まってなくてインポータが手付かずでした。

・SpriteStudio5ならUE4でもUnity5でも動くから良いんじゃない？

・他にも使用を検討しているツールはあったんですが、SpriteStudio5が一番機能とUIのバランスが良かったのです。

NIGORO流SpriteStudio5データの扱い方データは普通にインポート。インポータはバージョンチェックを外しただけで無改造。

Create Control-Prefabは不要。

Calcullate in Advanceはチェック。

Rigid-Bodyダメ、絶対。（後述）

上書き確認はどっちでも。

フォルダは作成しています。

NIGORO流SpriteStudio5データの扱い方

各スプライトキャラクタは、パラメータにSpriteStudioインポーターが作成したPrefabをセット。

これらは、シーンのロード時に初期化、待機状態にし、そのシーンが終わるまで消しません。

データはラッパクラスSpriteStudioContainerに持たせコールバック等もラッパクラスに管理させます。

SpriteStudioContainerSpriteStudio

キャラクタクラス

SpriteStudioContainerは１つのデータにつき１つなので、データが複数ならContainerも複数に。

大きな敵など１つのキャラクタがいくつもアニメPrefabを持つ事も。

なんとかしてよ！SpriteStudio5！

と、導入に関しては特に問題はありません。ただ、このまま使うには初期化タイミング等、使いづらい部分が多々あります。

そこで改修の話に入るのですが、その前にデザイナ側からツールの意見を・・・

注：年季の入った筋金入りのマカーの意見です。

では、VTRスタート。

無いなら作れ：その１楢村「ツール上で当たり判定つけれるんだよ。」

当たり判定をツール側でサポートは有り難いなぁ・・・しかし！

これ

当たり判定を入れると・・・

大空へ飛んでいきました。

・LA-MULANA2の地形は３Dメッシュで出来ていますが、１フィールド全体で１メッシュです。つまり「キャラは常にメッシュの中」だから・・・。

・当たり判定は「Unityのコライダーを設置する」機能。

・Rigid-bodyの判定はfixedUpdateで行われるので、これも超不味い。

どちらにせよ、これで攻撃やヒット判定をマッピングする事は出来ません。

・しかもインポート設定で「Attach Rigid-body to Collider」になっていた。

//ユーザデータコールバックpublic void SSCallBackUserData(GameObject ObjectControl,GameObject PartsObject,string PartsName,Library_SpriteStudio.AnimationData

AnimationDataParts,int AnimationNo,int FrameNoDecode,int FrameNoKeyData,Library_SpriteStudio.KeyFrame.ValueUser.Data

Data,bool FlagWayBack

)

解決策：当たり判定のマッピングにユーザデータを仕掛けたパーツを使う。

これがあると

ここに来る。

・「ユーザーデータ」をもったパーツがフレーム内にあると、再生時にコールバックから設定内容を受け取る事が出来る。ここにヒットデータを書き込む。

・判定の位置はパーツの位置、判定の大きさはscaleで取得。

・ただ、ツール上に表示させるには判定表示用テクスチャが必要。出力データでは非表示にしとくこと。せめて生ポリぐらい貼れても・・・。

無いなら作れ：その２楢村「主人公の上半身、優先度おかしい」

SpriteStudioの標準ではこういうのが苦手。

・独立してパラレルにアニメーションを行えるように複数のアニメグループで一つのキャラクタを構成することは良く有ります。

炎を吐く時に口を開ける羽は動きっぱなし

大技の時に腕を振る 尻尾も普段は動きっぱなし

・SpriteStudioはそれぞれのPartsRootを全て別の描画として扱うため、異なるアニメグループの優先度を交差させる事が出来ません。

何が上手く出来ないのか？

頭、上半身（＋両腕）、下半身の３グループで作られる主人公は、頭を上半身の腕と腕の間に描画する必要があります。ところが・・・

奥にある右腕とムチも頭より手前に描画される。

本当は左腕のみ手前に描画したい。

誤 正

解決策：描画時のメッシュ登録先を変更出来るようにする。・パーツごとに独立したメッシュになっているので、メッシュ結合をやっているハズ。

・調べると、結合用メッシュの登録を行う先は根本のPartsRootオブジェクト。

・Triangle2クラスも修正していますが、どちらも簡単な修正です。

・標準で持ってて良い機能だと思います。いやほんと。

・制御用とは別に描画用のPartsRootも持てるようにして、一つに合成したいアニメが全部同じ描画用PartsRoot持ってれば綺麗にソート出来るんちゃうの？

public void setTargetRoot(SpriteStudioContainer targetCont){

if (ssRoot != null){

Script_SpriteStudio_Triangle2[] trlist = ssRoot.GetComponentsInChildren<Script_SpriteStudio_Triangle2>();

foreach (Script_SpriteStudio_Triangle2 trtemp in trlist){

trtemp.setTargetRoot(targetCont.getPartsRoot());}

}}

無いなら作れ：その３楢村「キャラにライト効いてない。」

・ここでようやく自分達の使い方が何か違うっぽい事に気づきました。

・LA-MULANA2は３Dデータなのでライトが占める絵作りのウェイトは上がってます。

・光源表現は遺跡っぽさのキモです。前作もちょくちょく入れてました。

・ライトがあるのでキャラクタも炎の近くだと赤く、バリアの近くだと白くなります。

あれ？変わらない？

・SpriteStudio Player for Unityは、ミックス、加算、減算、乗算の４種類の描画をサポートしていますが、全てライトを計算していません。（２Dなら問題無いと思います。）

近づくと・・・

解決策：・Assets/SpriteStudio/shader/の中のシェーダを書き変えてしまえばOKです。今回はミックスのみ書きかえました。

・LA-MULANA２はメインカメラが平行投影なのでライトはforwardのみになります。

シェーダを書き換える。

当然、背景にキャラの影も落とせますが、２Dに見せる為の立体としてはウソ部分が影でバレてしまうので、現段階では影はOFFにしています。

近づくと 白くなります。

普通に３Dで行うような正直なライト計算式だとすぐ白飛びしたり真っ黒になります。なので多少のウソ計算を入れています。

解決していない問題： SpriteStudioデータはレイヤ分けが出来ない。

・SpriteStudio Player for Unityは、各パーツがPartsRootに自分を登録し、それを元にCombineMeshを作成し、Script_SpriteStudio_DrawManagerViewが描画します。

・全てのSpriteStudioのアニメーションを描画しているのはDrawManager唯一箇所、なので、全てDrawManagerのレイヤで処理されます。

カメラのCullingMaskで出来るエフェクトが封じられます。勿論ライトも。ツリー別にしてDrawManager複数もたせるかMeshRendererを複数管理出来るように改修すれば近い事は出来ると思います。が、負荷も怖いので現状はメインカメラの裏側遥かZ後方に専用カメラを置いて、適宜キャラクタをそちらに飛ばして対応してます。

改修ネタはまだまだありますが、時間も無いのでまとめに。

まとめ 結局Unity5+SpriteStudio5ってどうなの？プログラマ的に良かった所

・動作は軽い。使うデータはシーンのロードで読み込み、消さないようにすると良い。

・ツールのメンテナンスって言うめっちゃ面倒な仕事が消えた！

・当たり判定の微調整って言うめっちゃ面倒な仕事が（俺から）消えた！

・デザイナ（楢村ボス）に仕事押し付ける事に成功した！敵実装がめっちゃ楽に。

プログラマ的にあかんかった所

・元々が拡張を推奨していますが、機能不足。改修箇所が結構出ました。

・コールバックのパラメータがfloatなのにツール上は整数値のみとか意味わからん。

・特に制御がUnityのフロー任せなので、そのままだとアクションゲームは厳しい。

結論：悪くないけどアクションゲーム作るには改造必須。ロボット大戦的演出なら無改造でも可能。

・SpriteStudio5自体がアニメーションの動的制御には弱い。

・モーションブレンドも自作する必要あり。

・Unityのフロー任せなので初期化やアニメ切り替え動作が１フレーム遅延。

・でも、ソースで配布されているので、大体なんとか出来ます。懐広いぜ！

改修でわからない所もSpriteStudioユーザ助け合い所（facebookページ）で聞いたら誰か答えてくれるかも！？

・むしろUnity5に泣かされるかも・・・。

SpriteStudio Player 改造Tips

・まずはUnity中のSpriteStudio用Prefabと自分のデータの構造を比較しよう。

・アニメーションの更新処理、最終描画処理を把握しよう。

もうSpriteStudio5をUnity5で使うなら改修は必須だな、って思った人へ。

・後はやるだけだ！

大体は、SpriteStudio/Script/Script_SpriteStudio_PartsRootSpriteStudio/ScriptLibrary/Library_SpriteStudioの二箇所に集中しています。

皆でイカス２Dゲーを開発して俺にも遊ばさせてください！

・管理用クラスは自作しておいた方が何かと便利です。

SpriteStudio 5 Player が高速化したことを知っていますか？

知っていた

今、知った

SpriteStudio 5 Playerについての補足

AssetStore掲載のPlayerは、最新ではない

AssetStore：Ver.1.3.0

SpriteStudio 5 Playerについての補足

GitHub掲載のPlayerこそが、最新

GitHub：Ver.1.3.9

Ver.1.2系とVer.1.3系Player の Ver. コメント 配布場所

Ver.1.2.x ・LA-MULANA2採用版 GitHub/SpriteStudioArchive

Ver.1.3.0～ Ver.1.3.9

・パフォーマンス向上版※・エフェクト機能に対応

AssetStoreGitHub/SpriteStudio/SSPlayerForUnity

GitHub/SpriteStudio/SSPlayerForUnity(Devブランチ)

パフォーマンス比較解像度：1280 x 720px

アトラス：9枚

パーツ数：562

総フレーム数：750フレーム

パフォーマンス的に厳しいシーン

30fps60fps

60fps

SpriteStudio5Player for Unity Ver.1.3.x では、・フレームレートが高安定・メモリ使用量が大低下（約5分の1）

Ver.1.2.3 Ver.1.3.8

SpriteStudio Update for Unity

OPTPiX SpriteStudio Ver.5.7

『エフェクト機能』仕様変更

Unity上でのパーティクル再現性向上を目的としたアルゴリズム変更

UIの仕様変更（再生時の一時停止・パラメータ修正機能等追加）

ループ・途中再生（Prewarm）の追加

『キーフレーム』仕様追加

“エフェクト”アトリビュートの追加

その他、各機能別にいくつかのバグ修正

Ver.1.2系とVer.1.3系とVer.1.4Player の Ver. コメント 直前のPlayerとの互換性

Ver.1.2.x ・LA-MULANA2採用版 －

Ver.1.3.0～ Ver.1.3.9

・パフォーマンス向上版※・エフェクト機能に対応

互換※但し、要“.sspj”再インポート)

Ver.1.4 ・SS本体Ver.5.7以降専用・Ver.1.3.xがベース

互換※但し、Ver.5.6以前のSS本体で作った“エフェクト”は挙動が異なる(ので作り直し)

まとめ

プロジェクトが正念場なら

いまお使いの SpriteStudio 5 Player でそのままｺﾞｰ

“今から”SpriteStudio 5 Player を組み込むのであれば

SpriteStudio 5 Player for Unity Ver.1.3.x

https://github.com/SpriteStudio/SS5PlayerForUnity

NIGOROさんの改造Tipsも参考になるはず！

これから SpriteStudioでアニメーションを組む＆組んでる最中なのであれば

SpriteStudio 5 Player for Unity Ver.1.4

最後に

『LA-MULANA2 KickStarter』

http://playism.jp/game/241/lamulana2

Backer継続募集中！

『LA-MULANA2のひみつ ～特別付録：SpriteStudioPlayer改造TIPS～』

セッション参加者向けアンケート： https://goo.gl/pkdHuD

アンケートにご協力いただいた方に、ブースで『謎の缶詰』プレゼント

※回答した後の『ありがとうございましたページ』を見せてね