2023/03/17(金) [n年前の日記]
#1 [anime] 「ジャンプSL」とはなんぞや
アニメ関係の記事を眺めていたら、「ジャンプスライド」なる言葉が目に入った。ソレって一体なんぞや。
_「もはや『ジャンプスライド』の素材の作り方がわかる人がいなくなった印象... / Twitter
_「ジャンプスライドの素材は作れるけど、ジャンプスライドでお願いしますって演出さんに言われること自体がめったにない... / Twitter
_【アニメ撮影】デジタル撮影でジャンプ・SLのメリットはあるのか？ - Togetter
_【アニメ撮影】ジャンプSLは海外出ししても大丈夫なのか？ - Togetter
ググってみたところ、「ジャンプSL」「ジャンプタップSL」「ジャンプスライド」と呼ばれている技で…。アニメキャラを歩かせたり走らせたりする時に使える、見た目を改善できる技の一つ、らしい。
例えば、左から右に、画面を横切るようにキャラが歩いていくカットでは、左から右まで移動する様子を全部動画で描き起こしたら大変なことになるから…。2歩分だけ歩くループアニメ(ループ動画？)を作って、撮影時に位置を少しずつ変えて、ずっと歩き続けているように見せたりするそうで。そういう時に使えるテクニックの一つが「ジャンプSL」なのだとか。
ちなみに、宮崎駿監督が「アルプスの少女ハイジ」を作っていた頃に発明したらしい、という話も見かけた。ホントかどうかは知らんけど。 *1
せっかく知ったので、一応メモしておこうかなと。もし間違ったことを書いてたらその時はツッコミよろしくなのです。
余談。「ジャンプスライド」でググるとゲームのアクションの話ばかりが出てくる…。
_「もはや『ジャンプスライド』の素材の作り方がわかる人がいなくなった印象... / Twitter
_「ジャンプスライドの素材は作れるけど、ジャンプスライドでお願いしますって演出さんに言われること自体がめったにない... / Twitter
_【アニメ撮影】デジタル撮影でジャンプ・SLのメリットはあるのか？ - Togetter
_【アニメ撮影】ジャンプSLは海外出ししても大丈夫なのか？ - Togetter
ググってみたところ、「ジャンプSL」「ジャンプタップSL」「ジャンプスライド」と呼ばれている技で…。アニメキャラを歩かせたり走らせたりする時に使える、見た目を改善できる技の一つ、らしい。
例えば、左から右に、画面を横切るようにキャラが歩いていくカットでは、左から右まで移動する様子を全部動画で描き起こしたら大変なことになるから…。2歩分だけ歩くループアニメ(ループ動画？)を作って、撮影時に位置を少しずつ変えて、ずっと歩き続けているように見せたりするそうで。そういう時に使えるテクニックの一つが「ジャンプSL」なのだとか。
ちなみに、宮崎駿監督が「アルプスの少女ハイジ」を作っていた頃に発明したらしい、という話も見かけた。ホントかどうかは知らんけど。 *1
せっかく知ったので、一応メモしておこうかなと。もし間違ったことを書いてたらその時はツッコミよろしくなのです。
余談。「ジャンプスライド」でググるとゲームのアクションの話ばかりが出てくる…。
◎ 「SL」について :
「ジャンプSL」についてメモする前に、只の「SL(スライド)」についてメモしておく。
要するに、以下のような、2歩分のループアニメを作って…。
上記のループアニメを、撮影処理時に、以下のように動かしてやれば、ずっと歩いてるように見えるよね、と。これが「SL(スライド)」。らしい。たぶん。
まあ、見た通り、分かりやすいなと…。しかし、この方法は、足が地面の上を滑ってるように見えてしまう問題があるそうで。 *2
そこで考え出されたのが、「ジャンプSL」「ジャンプタップSL」「ジャンプスライド」と呼ばれるソレなのだとか。
要するに、以下のような、2歩分のループアニメを作って…。
上記のループアニメを、撮影処理時に、以下のように動かしてやれば、ずっと歩いてるように見えるよね、と。これが「SL(スライド)」。らしい。たぶん。
まあ、見た通り、分かりやすいなと…。しかし、この方法は、足が地面の上を滑ってるように見えてしまう問題があるそうで。 *2
そこで考え出されたのが、「ジャンプSL」「ジャンプタップSL」「ジャンプスライド」と呼ばれるソレなのだとか。
◎ 「ジャンプSL」について :
「ジャンプSL」は、以下のようなループアニメを作る。2歩分歩く動画を作るのは「SL」と同じだけど、実際に動画上で、足が動いた分を移動させてしまう。
そして、撮影時は、以下のように位置をずらす。
こういう作り方をすることで、足がちゃんと地面についた状態で歩いてるように見せることができるのだとか。いやまあ、上記の動画は、自分のようなド素人が作ったサンプルなので、その効果が全然出てないと思うけど…。プロのアニメーターさんが描けばバッチリな結果になるのだろうなと。 *3
ただ、この「ジャンプSL」、海外のアニメスタジオに色々と頼ってる現在では、ほとんどの場面で使えないという話も…。
まあ、視聴者側も、足が滑ってるか滑ってないかなんて気にしてないだろうし…。どうせアイツラ、キャラの首から上しか見てねえよ、SLで十分やろ、という気もしますな…。
そして、撮影時は、以下のように位置をずらす。
こういう作り方をすることで、足がちゃんと地面についた状態で歩いてるように見せることができるのだとか。いやまあ、上記の動画は、自分のようなド素人が作ったサンプルなので、その効果が全然出てないと思うけど…。プロのアニメーターさんが描けばバッチリな結果になるのだろうなと。 *3
ただ、この「ジャンプSL」、海外のアニメスタジオに色々と頼ってる現在では、ほとんどの場面で使えないという話も…。
- 海外のアニメスタジオ/動画マンに発注すると、珍妙な中割りになって帰ってくる。
- 国内のアニメスタジオ/動画マンでも、やり方を知ってる人と知らない人が居る。
- 社内の動画マンに説明しても分かってもらえなかった事例アリ。
- 「動画ミスや撮影ミスが起きやすいのでジャンプSLは禁止にしてください」と釘を刺されちゃった事例アリ。
まあ、視聴者側も、足が滑ってるか滑ってないかなんて気にしてないだろうし…。どうせアイツラ、キャラの首から上しか見てねえよ、SLで十分やろ、という気もしますな…。
◎ TVゲームにも関係しそう :
ところで。この「SL」と「ジャンプSL」、TVゲームにも関係してくる話なのだろうなと。
と言うのも、昔、Unityというゲームエンジンを少し触っていた際、サンプルのモーションデータを眺めて「アレ？」と思ったことがあって。その場で走り続ける「SL」的なループモーションと、一定距離を実際に移動して走る「ジャンプSL」的なループモーション、その2つが混在していて、「コレって一体どっちを使えばいいんだ？」と悩んだ記憶が…。
プログラマーからすると「SL」方式のほうが扱いは楽。後から移動速度を変えてくれと言われても数値を弄るだけで済んじゃうし。 *4 でも、見た目は不自然だろうなと。やはり、地面の上を足が滑っているように見えちゃうことが多いはず。
となると、「ジャンプSL」的に、足が動いた分実際に移動するようなモーションを作ったほうが良いだろうけど…。でも、それはそれで問題が色々ありそう…。
でもまあ、最初のバーチャファイターですら、モーション再生中にダメージを受けても、ちゃんとそれらしい位置でダメージモーション出してるし…。妙な位置まで急に戻ってダメージモーション再生したりしないですよね…。どんなゲームもフツーにどうにかして解決してるよな…。たぶん。
2Dゲームの頃も、基本的には「SL」で動かしつつ、一時的に「ジャンプSL」が使われていたのではないかと想像したりもして。例えば悪魔城シリーズでプレイヤーキャラが階段を登る時は、足の位置と階段の位置がずれてしまうと見た目がおかしくなりそうだし、そういう時だけはジャンプSL的なアニメパターンの持ち方になっていたのでは…。いや、作ったことないから分からんですけど。あくまで想像ですけど。 *5
というか、たぶん2D格ゲーなども、どこかしらの場面でジャンプSL的なことをしないと作れない気がする。ケースバイケースでアニメパターンの持ち方を考えていかないといかんのだろうな…。
と言うのも、昔、Unityというゲームエンジンを少し触っていた際、サンプルのモーションデータを眺めて「アレ？」と思ったことがあって。その場で走り続ける「SL」的なループモーションと、一定距離を実際に移動して走る「ジャンプSL」的なループモーション、その2つが混在していて、「コレって一体どっちを使えばいいんだ？」と悩んだ記憶が…。
プログラマーからすると「SL」方式のほうが扱いは楽。後から移動速度を変えてくれと言われても数値を弄るだけで済んじゃうし。 *4 でも、見た目は不自然だろうなと。やはり、地面の上を足が滑っているように見えちゃうことが多いはず。
となると、「ジャンプSL」的に、足が動いた分実際に移動するようなモーションを作ったほうが良いだろうけど…。でも、それはそれで問題が色々ありそう…。
- 移動速度を変えたい時は、モーションを作ったアニメーターさんまでわざわざ戻って修正作業をお願いするの？
- アタリ判定はどうなるの？ アタリ範囲がずれたりしない？
- 移動中にダメージを受けたらどうなるの？ どの位置でダメージモーションが再生されるの？
- 複雑な地形があったらどういう動きになるの？
でもまあ、最初のバーチャファイターですら、モーション再生中にダメージを受けても、ちゃんとそれらしい位置でダメージモーション出してるし…。妙な位置まで急に戻ってダメージモーション再生したりしないですよね…。どんなゲームもフツーにどうにかして解決してるよな…。たぶん。
2Dゲームの頃も、基本的には「SL」で動かしつつ、一時的に「ジャンプSL」が使われていたのではないかと想像したりもして。例えば悪魔城シリーズでプレイヤーキャラが階段を登る時は、足の位置と階段の位置がずれてしまうと見た目がおかしくなりそうだし、そういう時だけはジャンプSL的なアニメパターンの持ち方になっていたのでは…。いや、作ったことないから分からんですけど。あくまで想像ですけど。 *5
というか、たぶん2D格ゲーなども、どこかしらの場面でジャンプSL的なことをしないと作れない気がする。ケースバイケースでアニメパターンの持ち方を考えていかないといかんのだろうな…。
◎ 2023/03/18追記 :
APNG画像を貼ってたけど、アニメgif画像に変更しておいた。これでどんなブラウザでもアニメしてるように見えるはず。
*1: 昔の東映動画で、先人達が生み出した技の数々は、何故か「宮崎駿が初めてやった」と言われてしまうことがチラホラあるので、そういう話は疑ってかからないとマズいよなと。宮崎駿監督にだって、先輩や同世代が居るのだし、皆で喧々諤々しながら次第に固めていったアレコレが多々あるはず。その手柄を宮崎駿監督が全部持っていくのは、それはちょっとどうかなあ、と。もちろん、「誰が発明したのか今となっては分からんのだけど、その普及に宮崎駿監督が大きく貢献した」「宮崎駿監督が広めてくれた」という言い方なら全然OKだよなと思うのですが。
*2: 更にフィルム撮影時代は、セルを固定してるタップの位置を少しずつ動かしつつ、撮影するセルを変えていく作業になるので、撮影作業ミスが起きやすいという問題もあったらしい。
*3: 加えてフィルム撮影時代は、セルの交換回数は「SL」と同じだけど、タップ位置を動かす回数が激減できるので、ミスが起きにくくなるメリットもあったらしい。
*4: ゲームエンジンを使って作ってるなら、別の作業者でも移動速度を容易に変更できるように、あらかじめパラメータ入力欄を用意しておくだろうなと…。そのくらい、扱いが楽。
*5: 気になってその手の動画をコマ送りしてみたら、PCエンジン版だけ完璧に足と階段の位置が合っていた。それ以外の版、ファミコン、スーパーファミコン、メガドラ版は、足と階段の位置がめっちゃずれてた…。自分の中ではPCエンジン版の印象が強く残ってたんだな…。ちなみにAC版は、階段上で雑に瞬間移動してるように見えるけど、実はちゃんと足と階段の位置を合わせてあった。
*2: 更にフィルム撮影時代は、セルを固定してるタップの位置を少しずつ動かしつつ、撮影するセルを変えていく作業になるので、撮影作業ミスが起きやすいという問題もあったらしい。
*3: 加えてフィルム撮影時代は、セルの交換回数は「SL」と同じだけど、タップ位置を動かす回数が激減できるので、ミスが起きにくくなるメリットもあったらしい。
*4: ゲームエンジンを使って作ってるなら、別の作業者でも移動速度を容易に変更できるように、あらかじめパラメータ入力欄を用意しておくだろうなと…。そのくらい、扱いが楽。
*5: 気になってその手の動画をコマ送りしてみたら、PCエンジン版だけ完璧に足と階段の位置が合っていた。それ以外の版、ファミコン、スーパーファミコン、メガドラ版は、足と階段の位置がめっちゃずれてた…。自分の中ではPCエンジン版の印象が強く残ってたんだな…。ちなみにAC版は、階段上で雑に瞬間移動してるように見えるけど、実はちゃんと足と階段の位置を合わせてあった。
[ ツッコむ ]
#2 [cg_tools] APNGの作成についてメモ
Windows10 x64 22H2上で、APNG(アニメーションPNG)画像を作る際に利用したツールをメモ。
APNGについては、以下が参考になりそう。
_Chromeの対応で活用の幅が広がりそうなアニメーション画像「APNG」についてまとめてみました | OPTPiX Labs Blog
今回は APNG_Assembler GUI (apngasm) を利用した。
_APNG Assembler
_APNG Assembler - Browse Files at SourceForge.net
_APNG アニメーション （APNG Assembler CUI版） | 東京大学 佐々木淳 研究室 沿岸環境学 海岸工学 環境水工学 水環境学
コマンドライン版、apngasm.exe でも生成できる。
APNGについては、以下が参考になりそう。
_Chromeの対応で活用の幅が広がりそうなアニメーション画像「APNG」についてまとめてみました | OPTPiX Labs Blog
今回は APNG_Assembler GUI (apngasm) を利用した。
_APNG Assembler
_APNG Assembler - Browse Files at SourceForge.net
_APNG アニメーション （APNG Assembler CUI版） | 東京大学 佐々木淳 研究室 沿岸環境学 海岸工学 環境水工学 水環境学
- apngasm_gui-2.91-bin-win32.zip か apngasm_gui-2.91-bin-win64.zip を入手して解凍。
- apngasm_gui.exe か apngasm_gui64.exe を実行。
- APNGにしたいpng画像群を、ウインドウ上にドラッグアンドドロップ。
- 再生速度その他を設定して「Make Animated PNG」をクリックすれば生成できる。
コマンドライン版、apngasm.exe でも生成できる。
apngasm output.png input*.png 1 24上記の例は、input00001.png 〜 inputXXXXX.png を output.png に変換する。最後の「1 24」は再生速度の指定。1/24 FPS、1秒間24コマで再生するように指定してる。
◎ APNG対応ビューワ :
生成した APNG を、IrfanView 4.62 32bit で表示してみたのだけど、どうも再生速度がおかしい…。Firefox上で表示したソレと比べると、再生速度が違う…。
そこで今回は、ViW 4.1 というビューワで表示確認させてもらった。ありがたや。
_ファイラ連携型画像表示器『ViW』
ViW64v41.zip を入手して解凍。ViW64.exe hoge.png といった形で呼び出す。ViW なら意図した速度で再生された。
そこで今回は、ViW 4.1 というビューワで表示確認させてもらった。ありがたや。
_ファイラ連携型画像表示器『ViW』
ViW64v41.zip を入手して解凍。ViW64.exe hoge.png といった形で呼び出す。ViW なら意図した速度で再生された。
[ ツッコむ ]
#3 [moho] Mohoで画像シーケンスをループ再生
アニメーション作成ソフト、Moho 13.5.5 で、画像シーケンスをループ再生させる方法が分からなくて悩んでしまった。
分かってしまえば簡単だった。画像シーケンスレイヤーのプロパティ？ レイヤー設定？ を表示して、イメージ → 「ムービーを無期限にループ」にチェックを入れるだけで良かった。
久しぶりに触ったものだから、使い方をかなり忘れてた…。
分かってしまえば簡単だった。画像シーケンスレイヤーのプロパティ？ レイヤー設定？ を表示して、イメージ → 「ムービーを無期限にループ」にチェックを入れるだけで良かった。
久しぶりに触ったものだから、使い方をかなり忘れてた…。
[ ツッコむ ]
以上、1 日分です。