■ドットアニメーションのコツ　その1（2008.09/04）
　
　
【その１】 【その２】 【その３】 【最終回】 　
　
　
ドット絵の描き方については、検索すれば いくらでもひっかかります。
ドット絵ツールに関しても、詳しく紹介しているHPは 沢山あります。
そういった類の事は他所に任せるとして…。
　
・　ドットアニメーションって敷居が高い
・　1枚1枚全部手描きとかやってられない
 　
そう感じている人、意外と多いのではないかと思います。
でも、モノによっては意外と簡単に作れてしまうのが、ドットアニメの面白い所。
そんなドットアニメーションのコツを　少しだけ紹介したいと思います。
　
　
「A」 　「B」 　「C」 　
上の図形の中で、一番簡単に回転アニメーションが作れるのはどれでしょう？
意外かもしれませんが、答えは「C」です。
説明は後回しにして、まずは回転アニメーションをご覧下さい。
　
「C」　ぐるんぐるん 　
綺麗に回っているように見えますね。エッジも滑らか、美しいドットアニメです。
でもこれ、実は1枚も描き足していません。
　
「1」 　「2」 　「3」 　「4」 　
上のアニメーションを分解すると、「1」～「4」の4パターンアニメーション
になっているのですが、よくよく見ると…
　
「1」 　「2」 　「3」 　「4」 　
「1」を　90度・180度・270度回転させただけだったりします。不思議ですね～。
折角なのでここで説明。「A」は回転させても丸のままですし、
「B」はパターンを描かないと回転しているようには見えないですね。
よって「C」が一番楽に、回転パターンが作れる図形という事になります。
正五角形や正三角形でも同じ方法が使えたりします。是非お試しあれ～。
　
中心から各頂点の角度と、90度づつ加えた時の角度を照らし合わせると
計算上正しい事は分かるのですが、あまり深く考えなくでも大丈夫です。
90度回転や上下左右反転は、意外な所で役に立ちますよ～という事で。
　
さて、回転アニメーションだけなら、ソフトウェアで回転させる方法もありますが
バイリニアフィルターの使えないハードで、この画像を回転させると…
　
「4パターンアニメ」 　「ソフト回転」 　
なんという事でしょう！ジャギりまくりで、ドット絵の美学を微塵も感じません！
ラインの整った「4パターンアニメ」が、神々しく見える位です！
　
　
上記のように、星の回転アニメーションを作るのは簡単なのですが
正確な星のドット絵を描くのには、少しテクニックが必要です。
折角なので、星のドット絵を描くコツを説明してみます。
　
「a」 　「b」 　「c」 　「d」 　
「a」　まず、32×32ドット（いくつでも可）の丸と、中心点を描きます。
今時丸の描けないドットツールはないと思ので、これ位は楽勝ですね。
「b」　次に、中央上に、点を描きます。
星の角は、必ず丸の上をなぞる事になるのがポイントです。
「c」　星は正五角形の点を結んだ形になるので、360度÷5＝72度
中央上のドットを0度として、72度、144度の場所に点を打ちます。
モニターに分度器を当てるなり、ソフトで座標を調べるなり、お好きにどうぞ（適当）
「d」　残りの点は、左右反転で描いちゃいましょう。
　
「e」 　「f」 　「g」 　
「e」　各々の点を、定規ツールで繋ぎます。
「f」　塗りつぶしをして、星の色を好みの色にして…
「g」　ギザギザだと感じる所に中間色を挟んで、出来上がり。
コツが分かれば意外と描けてしまうものです。
　
　
最後に、もう少しだけ手を加えて、上の4パターンアニメを
更に滑らかにする方法を説明しちゃいます。
　
「1」 　「2」 　「3」 　「4」 　
今は「1」→「2」→「3」→「4」→「1」→「2」→「3」→「4」…
を繰り返す4パターンアニメなのですが、
ここに中割りを挟む事で、更に滑らかな回転アニメになります。
「2」は「1」を90度回転させたもの　というのは上記で
説明しての通りですが、「1」と「2」を半透明で重ねてみると…
　
「1」＋「2」 　
星がだぶって見えますね。ずれて見えるのが「1」と「2」の差分です。
ずれて見える所の中心に、点を描いてみましょう。
　
　→　 　→　 　→　 　
後は同じ要領で、星を描けばOK。出来上がった絵を仮に「1B」とします。
　
「1」 「1B」 　「2」 　
出来上がった「1B」は、「1」と「2」の中割りになります。
　
「1B」を90度・180度・270度回転させたパターン「2B」「3B」「4B」を作って
「1」→「1B」→「2」→「2B」→「3」→「3B」→「4」→「4B」…
といった具合に、中割りとして挟んでいきます。それをアニメーションさせると…
　
「4パターンアニメ」 　「8パターンアニメ」 　
ふぉぉ…　ドット絵パターンとは思えない滑らかなアニメーションに！
8パターン全てを0から正確に描くのは大変です。しかし工夫次第で
たった2枚のドット絵で、このようなアニメーションが作れてしまうのです。
一見難しいアニメーションも、工夫とアイディア次第という事ですね。
　
　　　原寸大で、ぐーるぐる
 　
　
ドットアニメーションの面白さを、少しでも感じて貰えれば幸いです。
それでは、今回はこの辺にて～。
　
　
（2008.9/4） 　
　
【その１】 【その２】 【その３】 【最終回】 　
　
　
　■戻る