「Animate」Animateでwebサイトを試作してみた
 |
当初は結構気に入っていたんですが、作って行くうちに、あーやっぱダメだと気づいたことを以下にまとめました。
HTML5でパブリッシュする
Adobe Animate（旧名Flash）で、webサイトの制作するわけなのですが、言うまでもないと思いますが、swfでパブリッシュはせず、HTML5（Canvas）でパブリッシュしております。パブリッシュでは、以下のような設定でブラウザに表示させるようにしています。
 |
| パブリッシュ設定 - レスポンシブと配置位置の設定 |
一応、レスポンシブ対応しようと思って、制作しています。。。
しかし、実際作って行くと、正直、現在主流のレスポンシブなWebサイト制作にはあまり向いていないのではないかと考えてしまいような問題が発生しています。
PCモニター（横長）とスマホ画面（縦長）での表示で、両対応しようとすると、このパブリッシュ設定だけでは納まりが悪い！！
レスポンシブとはいえ、モバイル対応されるわけではないので、今回はPCでのみ最適に表示にできればいいと決めて制作しています。
ただし、作っていく中でスマホのほうでも最適に表示できるかは検証していこうと思います。
最初にレイアウト枠を、縦長の比率で制作しておけばいいのかなぁとちょっと考え中です。
MovieClip（ムービークリップ）の取扱い
MovieClip（ムービークリップ）だけの話ではないのですが、FlashやAdobe AIRなどのAS3を使うコンテンツ制作とは、若干異なる使い方をしないといけないのかなと感じています。シーンのフレーム数をムービークリップ内のフレーム数に合わせる必要がある。
図１のように、シーンのフレーム数が１～５だとします。
ムービークリップ内のフレーム数は１～１０とします。
ムービークリップの配置位置をシーンのフレーム５に置いたとします。
 |
| 図１ |
この場合、シーンのフレーム数５に、配置したムービークリップが配置場所でアニメーションするはずだと思うじゃないですか？
ところが、ムービークリップ内ではフレーム１で止まったままになります。
最初に言ったように、シーンのフレーム数をムービークリップ内のフレーム数に合わせると、例のシーンのフレーム数は５ではなく、１５にする必要があります。
つまり、図２のように、シーンのフレーム数を増やし、ムービークリップも内包しているフレーム数分増やさなくてはならない。
 |
| 図２ |
んー、つまり、ムービークリップ意味なくね？ってことですね。
おそらく、アニメーションを含んだHTML5を制作をする場合は、シーン上で行うようにするのが良いのではないかなと結論に至りました。
スマホでは動作が重い
スマホのスペックも左右するのかもしれませんが、スマホでは動作が重く、レスポンシブもしっくりきません。面白いことに、スマホの縦向きだと動作がすごく重いけど、横向きだと比較的軽いと思いました。
どちらにせよ。これでは納得いくものにならないので、諦めました。
もちろん、ネットで情報が載ってないか調べたりもしましたが、解決の糸口は見つからずです。
と、以上で今のところ、制作中に気づいた内容です。
