動画

このページではOPTPiX SpriteStudioのHOWTO動画を集めました。

チュートリアル

基本編 (新規作成~動画の出力まで)(8:26)

OPTPiX SpriteStudioの起動からアニメーション作成までの流れを解説した動画です。

各ウィンドウの解説 (1:39)

SpriteStudioはさまざまなウィンドウが組み合わされて構成されています。
この動画ではウィンドウについて解説しています。
各ウィンドウの詳細についてはこちらをご覧ください。

起動・新規作成 (0:59)

OPTPiX SpriteStudioは複数のアニメーションや使用するssce(セルマップファイル)・セルリスト・編集情報などといった全情報をまとめて記録する「sspj(プロジェクトファイル)」が基本となります。

この動画では起動からsspjの新規作成までを解説しています。

素材作成 (3:32)

SpriteStudioでアニメーションを作成するには素材となるデータ(テクスチャ)が必要です。
画像編集ソフトでのデータ作成方法を解説しています。

素材登録 (2:06)

OPTPiX SpriteStudioに取り込んだテクスチャ画像は「ssce(セルマップファイル)」になります。
ssceからアニメーションの部品を切り出したものを「セル」と言います。
この動画ではssceとセルの登録方法を解説しています。

素材配置 (3:09)

「セル」をレイアウトウィンドウに「パーツ」として配置してアニメーションを組んでいきます。
アニメーション情報を格納しているデータのことを「ssae(アニメーションファイル)」と呼びます。

この動画ではパーツの配置とパーツの「親子関係」について解説しています。

補間アニメーション (3:53)

SpriteStudioではフレームに「キー」を設定し、キーが設定されている間のフレームについては指定された計算式で求めることでアニメーションを実現することができます。
このアニメーション方式を「補間アニメーション」といいます。

この動画ではSpriteStudioでの補間アニメーションの作成方法を解説しています。

カーブエディタ (2:39)

カーブエディタを利用することでアニメーションに変化を付けることができます。
「アトリビュート」ウィンドウのWindow_Attribute_icon04_ver5.6.1を押下することで「カーブエディタ」を表示することが可能です。
この動画ではカーブエディタと補間方法について解説しています。

参照セル (1:30)

アトリビュート「参照セル」を使用することで、パーツが参照しているセルを変更し、コマアニメの方式でアニメーションを作成することができます。

この動画では「参照セル」に関して解説しています。

選択範囲 (1:52)

フレームを範囲選択し、一括で編集を行う機能です。
パーツやフレームが増えて、1フレームずつ調整するのが大変な時に、「範囲選択」が役に立ちます。

この動画では範囲選択の活用方法について解説しています。

レンダリング (1:27)

作成したアニメーションをさまざまな形式で出力することができます。

この動画ではレンダリングの方法について解説しています。

エフェクトエディタ(2:55)

「エフェクトエディタ」では通常のアニメーションデータでは作成しにくい、ランダムな要素を持ったパーティクルエフェクトを作成できます。

この動画ではエフェクトエディタの基本的な使い方について解説しています。詳細についてはこちらをご覧ください。

PSDtoSS (2:34)

「PSDtoSS」は.psdのデータをそのままSpriteStudioで使えるようにコンバートを行うことができる、大変便利な補助ツールです。

この動画では「PSDtoSS」の使い方について解説しています。使い方の詳細はこちらをご覧ください。
「PSDtoSS」のダウンロードはこちらからどうぞ。

インスタンス機能 (2:32)

インスタンスパーツは「アニメーションを参照する」特殊なパーツです。
1つの背景上で再生タイミングの違う複数のキャラクターが別々に動作するようなアニメーションを作成するのに非常に便利な機能となっています。

本ページではインスタンスパーツの基本的な導入方法について記載しています。
インスタンスパーツに関しての詳細はこちらをご覧ください。

イラストのパーツ分割 (2:31)

SpriteStudioはイラストのパーツを分割しなくても、アトリビュートを利用することでアニメーションを作成することができますが、さまざまな動きを作りたい場合、パーツを分割する必要があります。

この動画ではパーツの分割について実例をまじえて解説しています。

実例

桜吹雪の作り方(3:31)

一枚の画像から桜吹雪を作成する流れを解説した動画です。

動画内で解説している桜吹雪のデータは「エフェクトのサンプル(エフェクト機能未使用)」のサンプルデータ内に「sakura」という名称で収録しています。

サンプルファイルのダウンロード

インスタンス機能の実例(2:16)

SpriteStudioに搭載されているインスタンス機能を使ってアニメーションを作成するまでの流れを解説した動画です。

動画内で使用しているデータは「エフェクトのサンプル(エフェクト機能未使用)」のデータを使用しています。

サンプルファイルのダウンロード

アルファドリーム社の作例(4:52)

SpriteStudioの基本操作を活用したキャラクターアニメーションの作例です。