非Flashのアニメーション制作ツール

Question

お世話になります

iphone以前の時代ではweb上でアニメーションを表現するのであれば
ADOBE社のFlashが長い間使われてきました

iphone以後ではセキュリティの懸念の多いFlashは次第に廃れていき
アニメーションの代替技術としてhtml5+JavaScriptが提唱されましたが
Flashのような複雑な動きのするアニメーションを手打ちで制作するには敷居が高く
それから複雑なアニメーションを表現するサイトは少なくなってきました

そして最近になって以下のような
旧Flashのような複雑な動きをするアニメーションのサイトがぽつぽつ出て来たのですが

https://event.rakuten.co.jp/halloween/
（PCのみで動きが確認できます）

動きが複雑すぎるのでhtml5+JavaScriptを手打ちで作っているとは思えず
あきらかに何かしらのGUIツールを使って作っていると思われるのですが
ポストFlashのようなアニメーション制作ツールが出て来たのでしょうか？？

上記サイトのアニメーションがなんのツールで作られたか
予想が出来る方いらっしゃいましたらご教授くださいますと幸いです。

Answer 1

ブラウザ開発ツールのElements（GoogleChromeの場合）で指定してみるとある程度動きが追えるので見てみてください。
「予想できる方」とは仰いますが、作った本人でない限りは上記の手順で動きを追うことになります。つまり、質問者さんでも確認できる内容はあるということになります。

---

canvasって本当に色々な表現が可能になりますね。
もともとのFlashもActionScriptでゴリゴリ作っていくものなので（機能で作っても裏では動いているはず）それぞれオブジェクトとして動作を指定していけばできないことはないと思います。

Comments

[tesopgmh]

ありがとうございます！
私もFlashのactionscriptの世代からの技術者で実際に書いていました

ランダムでダイナミックな数学的な動きなどはASは得意ですが、
やはりA君が飛び出てB君がしゃがむなどのアニメーションを表現するのには
手打ちでASを書いていくよりGUIのタイムラインを駆使して作っていくのがはやいですね

[m.ts10806]

ASと勝手は同じかなとは思います。
タイムラインくし駆使だとできることが限られるので複雑なオブジェクトの制御となるとやはりscriptをゴリゴリ書いていくしかないです。
とはいえ、CSSでもアニメーションが可能になってきているので
素材さえ準備できれば合わせ技で結構スイスイ作れないこともないと思います。

[m.ts10806]

実際は「なに使っても実現可能」なので、「これじゃなきゃできない」ってことはありません。
見ている方は何でできているかとか関係ありませんしね。

Answer 2

Flashの後継という意味では現在の位置づけはAdobe animateでしょうか?
Adobe Animate
ただし、最近はhtml5+canvasでかなりいろんな事できるようになってる話ですから、
何らかのSVGアニメである可能性も。

ゲーム系やアニメ系で本格的に動かすのならこちらでしょうか?
Live2D

ネット広告からソフト特定は、クリエイテッド~とでも出てないと難しいんじゃないでしょうか?

Comments

[tesopgmh]

ありがとうございます！
Flashの後継が出ていたんですね！！みんなこれを使って作っていたのか！
ちょっと確認してみたいと思います、ありがとうございました

[hectopascal1013]

ただ、もうそろそろ、こちらも順次縮小停止予定のようですｗ
SVGアニメが簡単に作れるツールが色々と生まれてきそうな機運はありますが、まだまだどれが制覇するかわかりません。
何を作りたいのか?で適切なツールは変わってくるかと思われます。
Web中心のワンポイントやエッセンス程度の動きならば、SVGからかける時代です。

[hectopascal1013]

蛇足かもしれませんが追記です。
https://www.palmie.jp/courses/145/lp?aff_id=twitter_palmie

10日まで無料講座らしいです>Live2D