SpriteStudio Ver.6.x 移行事例紹介(2) /GTMF2019
•Download as PPTX, PDF•
0 likes•389 views
まだ Ver.5 で消耗してるの？ じゃあ、SpriteStudio Ver.6 に変えるだけで2Dアニメーションはうまく...いく？ のかな？ ボーンやメッシュ、デフォームが使えるようになった Ver.6 に移行したいけど...ちょっと心配。 そんな皆さんに、SpriteStudio を Ver.4 時代からお使いのベテラン、Happy Elements株式会社さんに、Ver.5 から Ver.6 への移行エピソードを。そして Ver.6 で作った『とっておき』のデータをご紹介いただきます。
Recommended
Recommended
More Related Content
More from Game Tools & Middleware Forum
More from Game Tools & Middleware Forum (20)
Recently uploaded
Recently uploaded (9)
SpriteStudio Ver.6.x 移行事例紹介(2) /GTMF2019
- 2. 自己紹介 Happy Elements株式会社 （Happy Elements K.K）カカリアスタジオ メルクストーリアチーム エンジニア 上田 悟 2012年入社。エターナルクロニクルズチーム、あんさんぶるガールズ！チームを経て、現職。 サーバー・クライアント両方を担当 アニメーションデザイナー 稲葉 彩華 2012年にイラストレーターとして入社。その後アニメーションデザイナーに転向。あんさんぶ るガールズ！を経てメルクストーリアの開発に携わりながら、現在は新規開発と後進育成にも従 事。 1
- 4. リリース中のタイトル一覧 (全てSpriteStudioを使用) メルクストーリア (2014年1月31日〜) 凶暴化したモンスターを鎮める力「癒術」に目覚めた無気力な少年と、不 思議な瓶詰め少女「メルク」の記憶を取り戻す物語。 3 あんさんぶるスターズ！ (2015年4月28日〜) アイドルたちとともに成長していく青春譚！メインシナリオ担当は「ささ みさん@がんばらない」、「狂乱家族日記」などを手がけた人気作家の日日 日(あきら)先生! 2019年7月からアニメ放送しています！ ラストピリオド (2016年5月10日〜) 絶望とともに死した魂が、<<スパイラル>>と呼ばれる魔物へと転生する世 界。浄化の力を持った少年はある決意をした。この物語は…14歳の少年と 少女が絶望の輪廻に<<終止符>>を打つ最後の物語。
- 5. ？ 今後リリース予定のタイトルでもSpriteStudioを使用予定 ©Happy Elements K.K 4 あんさんぶるスターズ！！music（仮） (2019年度後半以降) 新たにリズムゲームというこれまでにないゲームスタイルであんスタの世 界をお楽しみいただけます。豊富な楽曲やハイクオリティな3DCGを駆使 したMVなど、ここにしかない魅力的なコンテンツをお届けする予定です。 ？ その他開発中アプリ 情報公開前のため詳細はお伝えできませんが、SpriteStudioを使用予定です。
- 7. 今回、お話させていただく内容 1. メルクストーリア紹介 2. メルクストーリアにおけるSpriteStudio ver.6への移行事例 3. メルクストーリアにおけるSpriteStudio ver.6への移行手順 4. 弊社におけるPSDtoSSへの取り組み 5. SpriteStudio ver.6.3新機能について(浅井さんによるSpriteStudio ver.6.3～6.4解説 後、稲葉よりお話させていただきます) 6
- 11. メルクストーリアにおけるアニメーション 4種類の方法でアニメーションを実現しています。 1. uniSWF 2. SpriteStudio 3. After Effects 4. パーティクル 10
- 12. uniSWF UnityでFlashを再生させることができるAssetです(http://uniswf.com/) あんさんぶるガールズ！を元々HTML5で作成しており、アニメーションがFlashでした。 その名残で初期はアニメーションがFlashで作られていました。 ©Happy Elements K.K 11 例えば、クエストでボス出現前のアニ メーションなどで使用しています。 現在、新規でuniSWFを使用してアニ メーションを作ることはしておりません。
- 14. メインストーリーの第一部完を受けて動画でスタッフロールを作った際などに使 用しています。 動画作成(mp4)の用途として使用しています。 After Effects ©Happy Elements K.K 13
- 19. 移行のメリット・デメリット メリット ・新しいMac OSでも動く (アニメーターさんのMacが壊れたら買い直せない) ・新しい表現方法が使えるようになる (マスク、ボーン、デフォームなど) ・実際に使用しているアニメーター「リリースノートみてると、今までこの不具合早く直らない かなぁ・・・って思ってたものが、SpriteStudio ver.6に上がってからはすごい頻度で修正され てますね。」 デメリット ・置き換えの工数がかかる ・AssetBundle全て書き出し直し(ユニット・モンスターあわせて3500体 x 3プラットフォーム) 18
- 21. SpriteStudioはそのまま動くのかな Unity2017へ移行後、動作確認してみたところ、一応ユニットやモンスターのアニメーションは 問題なく動いてそうでしたが・・・wikiには、対応外とあります。 そしてメルクストーリアで使用しているのはSS5Player For Unity v1.2.x、かつ、自社で一部 コードを書き換えているもの・・・(パフォーマンス対応版) 20
- 23. 開発担当者に確認いたしました。 SS5Player は、Unity2017 上でも恐らく問題なく動作するだろうとのことです。 ただし動作保証外のバージョンですので、この組み合わせのみで発生する固有の問題についてはサポートい たしかねる点ご了承いただければと思います。 サポート予定について SS5Player の Ver.1.6.0 と Ver.1.5.17 が Unity2017 で動作した実績があるようです。 SS5Player から SS6Player へ移行する場合 スクリプト及びインポートして生成されるSSアニメのアセットの互換性が無いため、運営中のプロジェクト で移行するのは困難ではないか、との見解でした。 返事 22
- 27. 互換表の確認 https://docs.google.com/spreadsheets/d/1mdBaMO6QUVNh6cpvN7WeA5BDknqBg twkl2QUUFTEuEE/edit#gid=957117457 「SS5P for Unity」から「SS6P for Unity」で◯から✖️になっているアトリビュートを 確認。 26
- 28. アニメーターさんに該当アトリビュートを使っているか確認 使っているやつあります！とのこと。 そこでssaeファイルを確認することにしました。 左右反転：FLPH => flip horizonのkey/valueが1であるもの 上下反転：FLPV => flip verticalのkey/valueが1であるもの カラーブレンドはVCOLがあるもの 正確な数は覚えていなくて申し訳ありませんが数百体ありました。 27
- 33. 段々と要求はエスカレート コンバートツールありがたい でも一つ一つプロジェクト開いて変換してられない (3500体ありますし) 「バッチ組みたいのですが、コマンドラインから動くようにしていただけないでしょう か？」 => 人間の欲求とは恐ろしいですね (だんだん図々しくなっていく) ウェブテクノロジ様「こちらで一括変換対応しますね！」 「神様かな？ (言ってみるものですね、、、！)」 32
- 34. 実際の移行の作業について(Mac版での解説となります) ©Happy Elements K.K 33 SpriteStudio ver.6を起動します ツールバーの[プロジェクト]=>[指定フォルダ内の全データの非推奨機能をVer.6互換に変換する]を選択
- 35. 実際の移行の作業について2 設定ダイアログが表示されるので、適切な設定を選択してからOKボタンを押します。 弊社ではデフォルトの設定のまま変換して問題ないようです。 ©Happy Elements K.K 34 設定ダイアログで不明な点が あれば、この「？」を押してください
- 40. C#での色補間コード(透明部分を隣の色で塗りつぶす) void UnitBorderFix(Texture2D texture) { int w = texture.width; int h = texture.height; var source = texture.GetPixels32(); var result = new Color32[source.Length]; for (int x = 2; x < w - 2; x++) { for (int y = 2; y < h - 2; y++) { result[y * w + x] = GetN(source, x, y, w, h); } } texture.SetPixels32(result); } 39
- 41. C#での色補間コード(透明部分を隣の色で塗りつぶす) 40 Color32 GetN(Color32[] source, int x, int y, int w, int h) { if (source[y * w + x].a != 0) { return source[y * w + x]; } foreach (int i in new[] {0, -1, 1, -2, 2}) { foreach (int j in new[] {0, -1, 1, -2, 2}) { var c = source[(y + j) * w + (x + i)]; if (c.a != 0) { return new Color32 {r = c.r, g = c.g, b = c.b, a = 0}; } } } return source[y * w + x]; }