軽量化を制するものはサイトを制す！！

遅かれ今年初エントリーなので、改めまして明けましておめでとうございます！

今回はデータの軽量化についての策を出していこうと思います。

アニメーションベースのサイトを制作すると、いつも頭を悩ますのが”重さ”です。

せっかくアニメを作って組み上げたはいいもの、サーバに上げてみると重くて観れたものじゃないってことがあります。

その原因は大きく分けて3つ…

【素材】 ①サイズの大きいビットマップ ②アンカーポイントの多いベクターデータ ③アウトラインが線 ④シンボルに変換せず素材を使用 【タイムライン】 ①モーショントゥイーンを同じ時系列で複数配置 ②フェイドイン・アウト ③キーフレーム 【フィルターの使用】 ①ぼかし・ドロップシャドウなど

そしてこれらの問題を改善する方法とは…

【素材】 ① ・画質を若干落とし、劣化した場合にはスムージングで対処 （ビットマッププロパティで設定） ・GIF画像に変換しても支障がないものはGIFへ ・ベクターの方が軽い場合はベクターを使用 ② ・アンカーポイントを減らす （修正→シェイプ→最適化） ・ビットマップの方が軽い場合はビットマップを使用 ・アウトラインを塗りに変換 （修正→シェイプ→線を塗りに変換） ・ムービークリップもしくはグラフィックに変換してそのオブジェクトを使用 （デザイン修正のときも1つを修正するだけなので楽に対応できる） 【タイムライン】 ① ・モーショントゥイーンの部分を選択しキーフレームに変換、そしてモーショントゥイーンの削除をする ② ・アルファでの表現を避ける ・①での対処 ③ ・不要なキーフレームは削除する 【フィルターの使用】 ① グラフィックソフトで処理しビットマップなどのデータとして扱う 【番外編】 極め付けの対処法ですがアニメーションを省略するという方法。 せっかく作ったアニメを省くのは辛いですが処理が重くてストレス感じるよりはいいので、 思い切ってみるのも1つの方法です！

ここであげた例以外にも処理速度を上げる方法はいくつかあります。

またasで対処することも可能ですので色々と試してみてください！

ですが制作する前にデザイナーとちゃんと打ち合わせて構想・設計を立てて制作することが1番ですね！！