Freeソフトでお着替え講座：第1回目GIFファイルとレイヤーの予備知識

Freeソフトでお着替え講座

みなさんがどのような環境で作業されていて、どの程度の能力なのかわかりませんので、できるだけ簡単で、しかも、フリーソフトのみでアバターのお着替えとアニメーションの作成方法をご説明していきたいと思います。

第1回目　GIFファイルとレイヤーの予備知識

１）GIFファイルって何？
　GIFアニメ作成方法については、ファンの中のTOMOさんのブログが非常に親切に説明されていますが、和美の技術はやってみると簡単だけど、少し概念的な知識がバックに必要になるかもしれません。わからないときには、遠慮なくコメントくださいね。

アバター画像はGIFというファイル形式の画像で作られています。これはLZW法という簡単かつ効果的な圧縮方法で保存されています。使用できる色は256色で、1色を透明色に指定できる優れたファイル形式なのです。さらに、複数の画像を層状に表現され（レイヤー構造）、アニメーション化することが可能なのです。

今は透明色が使用できて、アニメーションを作成するのに良いファイル形式の１つであるというだけでいいです。

優れたファイル形式なのに公式に取り扱えるソフトが高額であるということには訳があるのです。というのがこのGIFの圧縮方法に特許権を主張していたからなのです。

GIFファイルの特許問題（雑学）：GIFのファイルでは画像データ部分を「LZW（Lempel Ziv Wilch）圧縮法」という技術で圧縮しており、この技術が米国 Unisys 社の特許になっていたのです。このため、ソフト会社は特許使用料を支払うため、gifを扱うソフトは高額である場合が多くなってしまいました。2003年6月20日、米国で特許の有効期限が切れ2004年6月20日には日本でも特許の有効期限が切れました。心配されていた存続特許の申請も無いそうで、ようやくGIFファイルを公式にサポートするフリーソフトが復活してきました。

　　
ということで、去年からフリーソフトでもGIFを取り扱えるようになってきたということです。

２）レイヤー構造
　画像処理の概念で重要となるのが、レイヤーという概念です。TVでみるアニメの作成方法はご存知のとおり透明のセルに着色し、いくつかのセル画を重ねて絵を作成し、別々に動かすことで複雑な動きを表現しています。これと同じように透明化機能を有効に使って重ねて表示させる機能がレイヤーって訳です。上下関係で見えたり見えなかったりすることもできます。また、不要ならばレイヤーを見せないようにするだけでよいわけです。GIFのレイヤーは基本的にアニメ用になっており、Photoshop等のレイヤーとは少し意味合いが違います。

なお、Windowsにはペイントというソフト付属されていますが、レイヤーという概念がないために一度決定してしまったあとで、不要な部分を削ったり、表示させたりなどを簡単にすることができません。

レイヤーという概念は、それに対応したソフトを使用することで、簡単に身に付けることができると思いますので、この辺にしておきます。

３）Ｊavascriptのレイヤー構造
　GIFとかがレイヤーをもっていて、複数を重ね合わせることで1枚の画像を作成しているのですが、大規模かつ複雑な動きを表現することが難しいのです。その点を補う形で、ホームページにはなくてはならないものとしてＪavascript言語のがあります。GIFとは別に複数の画像ファイルをレイヤーに読み込み表示させることができます。つまり、GIFアニメを幾つも重ねて表示することが可能となり、小さな画像のポジションや時間制御することが可能となり、より複雑な動きが表現できるようになっています。
　実は日本のアバターはGIFファイルをＪavascriptのレイヤーに読み込んで表示させているのです。このように、柔軟性高いシステムを作成してるのですが、残念なことに海外ではこの方法は採用されておりません。アバターのレイヤーは今のところなんと99レイヤーも使用可能なように設計されています。