セルリストのパーツを、レイアウトに配置しよう！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜　part4

2017.07.25

Notes

スプライトスタジオ

どうも！（・∀・）やじキチです。

イチから学ぶ！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜の連載ブログです！

前回のpart3では、セルマップからパーツを切り出し、「セルリスト」に登録しました。

今回は、セルリストのパーツを、レイアウトに配置したいと思います！

イチから学ぶ！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜のPart4です！
- まとめ
  - - やじキチ
    - 最新記事 by やじキチ (全て見る)

イチから学ぶ！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜のPart4です！

スプライトスタジオ http://www.webtech.co.jp/spritestudio/

夢を描いて、動かそう。
インディーゲーム開発に無料で使える
アニメーション作成ツール

セクション1：新規アニメーションの作成！

まず、現状ではレイアウトが使えません。

レイアウトにパーツを配置するには、それ用のファイルを作ることが必要です。

左上の「アニメーション」を右クリックしてください。

次に「新規作成」をクリックしてください

「アニメーションの新規作成」ウィンドウが開くので、

1）ファイル名を設定します。

2）保存先を「.sspj」や「.ssce」と同じフォルダに設定します。

3）「保存」をクリックします。

左上に「anime_1」というアニメーションができ、「レイアウト」が使えるようになりました！

セクション2：サイズは適切に！セルマップサイズの変更

さっそくセルリストのパーツをレイアウトに配置したいのですが、一つ問題があります。

セルリストの「body」を「レイアウト」にドラッグ&ドロップすると……

灰色の範囲が書き出しの時の範囲なのですが、
「body」の大きさがその範囲以上になっているのです。

これではアニメーションを動かしても、途中で見切れてしまいます！

なので、セルマップを適切なサイズに変更する必要があります。

変更はスプライトスタジオ上ではなく、グラフィックツールなどで行います。

現在「2048×2048」で制作している「tech.png」を「512×512」に変更します。

もちろん、これだけですと前回のセクション1のような、読み込みエラーが発生してしまいます。

なので、前回と同様に、セルマップを変更しましょう。

再びスプライトスタジオにもどり「tech.ssce」を右クリックします。

次に参照イメージの変更をクリックします。

1）名前は変更されていませんが、サイズを「512×512」に変更した「tech.png」を選択します。

2）「開く」をクリックします。

すると、「警告」がでてきます。

この警告は「セルマップのサイズを変更するにあたり、セルリストの切り出しサイズも同じだけ変更しますか？」という確認です。

ここで「はい」を押さないと、前回せっかく切り出したセルリストのパーツサイズが大きいままで、うまくパーツ化されないので注意してください！

間違って「いいえ」や「キャンセル」を押してしまった場合は、保存せずにスプライトスタジを終了しましょう！！

では、「はい」をクリックします。

次は「確認」が出てきます。

この確認は「セルマップのサイズを変更するにあたり、アニメーションサイズも同じだけ変更しますか？」という確認です。

これも、さっきの「警告」と同様に「はい」をクリックしてください！！

これでセルマップのサイズが「512×512」に変更されました！

セクション3：セルリストのパーツを、レイアウトに配置！

1）レイアウトへの配置は、パーツのドラッグ&ドロップで出来ます。

2）レイアウトにパーツが配置されると、同時にフレームコントロールにも配置したパーツが読み込まれます。

「レイアウト」でアニメーションの動きの確認、
「フレームコントロール」でキーフレームを設定して、アニメーションの動きを作成します！