アニメーションを作成するアニメーションを作成するこのページではSpriteStudioでの基本的なアニメーションデータの作成の流れをご紹介します。各ウィンドウの解説プロジェクトを新規作成する新規プロジェクト(sspj(プロジェクトファイル))を作成する素材を作成するセルマップ・セルを新規作成・追加するssce(セルマップファイル)を新規作成するセルを新規作成・追加するパーツを配置するssae(アニメーションファイル)を作成するファイルを保存する各ウィンドウの解説SpriteStudioはさまざまなウィンドウの組み合わせで構成されています。各ウィンドウの詳細については以下のページをご覧ください。「sspj(プロジェクトファイル)」は、アニメーションデータやssce(セルマップファイル)・セルリスト・編集情報など、すべての情報をまとめて記録しているファイルです。SpriteStudioで作業する上で、基準となるファイルになります。押下することで、sspj(プロジェクトファイル)を作成することができます。保存するフォルダとファイル名を指定するフォルダとファイル名を指定するウィンドウが開きます。フォルダとファイル名を指定して「保存」をクリックしてください。ここで指定したフォルダは、この後、新規で作成されるすべてのファイルが格納されるための基準フォルダになります。ここで指定したファイル名は、ウィンドウ上部のタイトルバーに、エディット中のプロジェクト名として表示されます。「エフェクト」の区分ができます。それぞれ頭にフォルダのアイコンマークがついています。これで、アニメーションを作成するためのsspj(プロジェクトファイル)ができあがりました。このsspjに「ssce(セルマップファイル)」「セル」「ssae(アニメーションファイル)」「ssee(エフェクトファイル)」を追加していくことで、アニメーションを作成・編集することができます。プロジェクトの設定で「互換性」の設定をするsspjを作成したら、アニメーションの作成を始める前に、「互換性」について確認をしましょう。「互換性」は、メインメニューの「ファイル」から「プロジェクトの設定」を選択し、「プロジェクトの設定」ウィンドウを開き、「互換性」を選ぶことで設定できます。詳しくは「プロジェクト設定」のページをご覧ください。素材を作成するSpriteStudioでアニメーションを作成するには素材となる画像データ(テクスチャ)が必要です。画像編集ソフトを利用して、素材の作成を行います。テクスチャは基本、2の累乗、2のべき乗のピクセルサイズで作成します。このサイズでない画像でも編集は可能ですが、ゲームエンジンの仕様によっては受け付けない場合があります。SpriteStudioでは、パーツが分かれていなくても、アトリビュートを利用することで簡単なアニメーションを作成することができます。関節や装飾などを分けることで、複雑なアニメーションを作成することが可能です。使用テクスチャ(512×512)関連ページイラストをパーツ毎に分割するセルマップを作成する際のパーツ分割について、実例を交えて解説しています。セルマップ・セルを新規作成・追加する「セルマップ」は、SpriteStudio上でアニメーション作成時に使用する「テクスチャ」と、「セル」の切り出し情報を持ったデータです。拡張子は「.ssce」です。本ヘルプセンター上では主に「ssce」と表記します。このssceからアニメーションの部品を切り出したものを「セル」と言います。「セル」を「パーツ」としてレイアウトウィンドウに配置、編集することで、アニメーションを組み立てていきます。ssce(セルマップファイル)を新規作成するssceをsspjに追加するssceは画像ファイルを読み込むことで作成します。下記のいずれかの方法でssceをsspjに新規作成・追加を行います。メインメニューから「プロジェクト」-「新規ファイルの追加」-「セルマップ」を選択プロジェクトウィンドウのセルマップのコンテキストメニュー「新規作成」を選択メインメニューから「プロジェクト」-「インポート」を選択インポートと新規ファイルの追加の違いについては以下のページをご覧ください。他のプロジェクトで使用しているテクスチャやアニメーションを使用したいssceの「参照イメージ」を選択する「参照イメージ」とは、ssceが参照する「テクスチャ画像」を指します。ssceを新規作成すると、参照イメージを選択するためのダイアログが表示されますので、使用するテクスチャを選択してください。新しいssceがプロジェクトウィンドウに追加されます。複数のssceを使用する場合、このssceの新規作成の操作を繰り返して追加を行ってください。追加作業は、アニメーションを作成している途中でも行うことができます。セルを新規作成・追加するssceを登録したら、セルマップウィンドウ上で矩形で範囲選択し、アニメーションの部品となる「セル」を登録します。「セル」はアニメーションに配置する「パーツ」の元となるデータです。「セル」を登録すると「セルリスト」に表示されます。「セルリスト」は「セルマップ」ごとに管理されています。目的の「セル」の元となる「セルマップ」を選択するとセルリストウィンドウの表示も切り替わります。セルマップからセルを登録するプロジェクトウィンドウから、「セル」を作成したいssceを選択します。セルマップウィンドウに選択したssceに紐づいている「参照イメージ」が表示されます。セルマップウィンドウ上で、「セル」として指定したい矩形範囲を選択します。矩形範囲の指定が終わったら、その矩形範囲内をダブルクリックすると、新しい「セル」として「セルリスト」内に登録されます。この作業を繰り返して、必要な「セル」をすべて作成してください。セルリストウィンドウのコンテキストメニューから名称変更やタグの設定を行うことができます。セルリストウィンドウ内の「セル」をダブルクリックすることで、そのセルをアニメーションで回転・拡大・縮小させる際の原点位置を決定することができます。セル編集ウィンドウの解説はこちらをご覧下さい。1つのセルマップから複数のセルを作成する際、この作業を繰り返します。セルの追加作業はアニメーションの作成途中でも都度行うことができます。下記のツールを利用することで作業を短縮することが可能です。PSDtoSS6PSDからSpriteStudio用のデータ一式を生成するツールです。無料でご利用いただけます。TexturePackerToSSTexturePackerからssceとテクスチャ画像を作成することができるツールです。TexturePackerを使用している方にお勧めです。パーツを配置する「ssae(アニメーションファイル)」に「セル」をレイアウトウィンドウに「パーツ」として配置します。SpriteStudioでは、このパーツを動かしてアニメーションを作成します。「ssae(アニメーションファイル)」は、アニメーションに関する情報(アニメーションデータ・セットアップデータ)を格納しているファイルです。ファイルの拡張子は「.ssae」となります。本ヘルプセンターでは主に「ssae」と記述します。ssae(アニメーションファイル)を作成するまず、データを格納するssae(アニメーションファイル)を新規作成します。下記のいずれかのメニューを選択します。メインメニューから「プロジェクト」-「新規ファイルの追加」-「アニメーション」を選択または、「プロジェクト」ウィンドウのアニメーションを右クリックし、コンテキストメニューから「新規作成」を選択フォルダとファイルを選ぶためのウィンドウが開きますので、ファイル名を指定してください。ここで指定したファイル名は、「プロジェクト」ウィンドウの「アニメーション」の中に、表示される名前になります。セットアップデータとアニメーションデータの違いVer.6では「セットアップデータ」が追加されました。ssaeの中に「Setup」という名称で、必ず一つ存在します。名前の変更は行うことはできません。「セットアップデータ」はアニメーションデータのベースとなる情報を有するデータです。セットアップデータで構築したパーツ構造を元に、「アニメーションデータ」が作成されます。「アニメーションデータ」は、実際にアニメーションを作成するデータです。ssae内に複数作成することが可能で、セットアップデータを基に作成されます。SpriteStudioのメッシュ・ボーン機能を使用する際は、セットアップデータの設定から行う必要があります。メッシュ・ボーン機能を使用したアニメーションを作成する手順につきましては、以下のページをご覧ください。メッシュ・ボーン機能の使い方レイアウト情報ウィンドウでレイアウトウィンドウの設定を行うレイアウト情報ウィンドウで、「基準枠」のサイズと基準点を設定します。基準枠のサイズは作成するアニメーション全体の大きさです。基準点は基準枠の座標(0,0)となります。レイアウトウィンドウでセットアップデータにパーツを配置するセルリストウィンドウから、アニメーションに使用する「セル」を選択して、レイアウトウィンドウにドラッグ&ドロップして配置します。レイアウトウィンドウに配置した「セル」のことを「パーツ」と呼びます。プロジェクトウィンドウで「setup」を選択します。セルリストやフレームコントロールウィンドウ、レイアウトウィンドウからもデータを切り替えることが可能です。セットアップデータを選択すると、レイアウトウィンドウの背景が赤くなり、「Setup」と表示されます。レイアウトウィンドウにセルリストからセルをドラッグドロップします。「パーツ」が配置されました。この作業を繰り返し、すべてのパーツを配置します。親子関係を構築するレイアウトウィンドウ上にパーツをすべて配置したら、フレームコントロールウィンドウ上で、必要に応じてパーツの「親子関係」を設定します。「親子関係」とはパーツ同士の階層関係を表します。他のパーツを内包しているパーツを「親パーツ」、親パーツに属するパーツを「子パーツ」と言い表すことから「親子関係」と呼びます。子パーツは親パーツの編集に同期しますが、親パーツは子パーツの編集に影響されません。上図だと「UpperBody」という親パーツに「PenguinFoot」というパーツが子パーツとして属する形で親子関係が設定されています。「UpperBody」を編集すると、「PenguinFoot」がその編集に同期します。フレームコントロールウィンドウで、属したいパーツの上に、パーツをドラッグ&ドロップすることで親子関係を作成できます。親子関係を変更したい場合、フレームコントロールウィンドウ内で、子パーツを移動させたい階層にドラッグします。パーツとパーツの間の境界線が青色にハイライトされ、その階層に配置されます。セットアップデータでのパーツのレイアウト、構成が完了したら、アニメーションデータで配置したアニメーションを作成していきます。セルの原点についてセルには「原点」が設定されています。セル作成時、原点はパーツ中央に設定されます。原点の位置はセル編集ウィンドウで設定することができます。アニメーションデータを設定するセットアップデータを構築したら、次はアニメーションデータを編集し、実際にアニメーションを作成していきます。マークが付いているデータが「アニメーションデータ」です。選択することでアニメーションデータを編集することができます。フレームコントロールウィンドウの下部にあるツールバーで、アニメーションの設定や再生制御を行えます。今回は以下2項目の確認・設定を行います。総フレーム数:アニメーションの全体の長さ単位時間:1秒あたりの更新フレーム数(fps)ファイルを保存するファイルの保存方法は大きく分けて2種類存在しています。選んだssaeまたはssceだけを保存する方法です。保存したいssaeかssceを選択して「ファイル」メニューの「選択ファイルのみ保存」メインメニューの保存アイコンを押下ショートカットキーを利用Ctrl+S「sspj全体」を保存する方法sspjに属しているファイルすべてを保存します。「ファイル」メニューの「プロジェクトを保存」または「すべて保存」メインメニューのすべて保存アイコンを押下ショートカットキーを利用Shift+Ctrl+Sデータを保存し、SpriteStudioのアニメーション作成の基本的な流れは完了です。今回作成したアニメーションを実際に動かすための、さまざまな編集方法について解説しています。作成したアニメーションの出力方法について解説しています。検索する範囲を指定することができます。