■ドットアニメーションのコツ　その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） 　
　
【その１】 【その２】 【その３】 【最終回】 　
　
　
　■戻る