ドット絵を勉強し、マウスカーソルを自作するまで
備忘録言うほどのモンでもない。
ドット絵を漠然と描いてみようか(適当)みたいな気持ちがちょっとあって、別にドット打つぐらいどのソフトでも出来るんですけど、ちょっと軽くアニメーションもしてみたいかも(適当)みたいな気持ちもちょっとあったので、AsepriteというのをSteamで買いました。
似たようなのでEDGEってソフト(こっちは無料)もあるんですけど、UIが可愛かったのと有料ソフトを買っちゃう俺イケてないっすかって思ったのでAsepriteにしました。
ドット絵を描く ~序章~
なんぞや、昔に描いた絵がここにあるんですわ。
絵のあれこれは置いといて、要はこれをドット化して、ちょこちょこアニメーションさせて、動く背景に仕上げればオシャレになるんじゃねえかと思ったわけです。
ですが、そう簡単にはいきません。
理由は2つ。
ドット絵初心者一発目としてはいきなり作業量がハードすぎる(20%)
元々が何を表してる絵なのかよく分からない(80%)
ドット絵以前に、この絵のリメイクを諦めました。
(なんだったんだこの時間は)
そこからう~~~~~~んと積みゲーなどを崩しつつ考え、結局この背景のキャラものを一個一個描くということでまとまります。
ドット絵を描く ~本編~
一個謎の工程が挟まりましたがここからが本編です。
ドット絵の描き方?
ドット絵は(絵全般そうだと思いますけど)、色々な手法がありつつも、基本的なところは共通してました。
フチ部分は、ドットとドットが辺で繋がらず、角で接するように描くとそれっぽい(アンチエイリアス)
フリーハンドそのままより、ある程度等間隔の方がそれっぽい
色をパステルっぽくするとそれっぽい
彩度高めにしてもそれっぽい
影は単なるグレーじゃなくて色をほんのり乗せるとそれっぽい
光は単に明るくするんじゃなくてちょっと黄色側に寄った色で塗るとそれっぽい
キャラものを描いていく
そういうわけで、まずはこのド真ん中の鳥?みたいななにかを描きました。
結構可愛く仕上がったなという印象です。
アニメーションについてはこいつは2コマなので、超簡単なつくりです。ただ羽ばたくときに、全体を1ドット上にずらすとそれっぽいなってことがやっていくうちに自分で発見しました。
ちなみに24×24で描いてます。16だと細部があんまり描き込めず、かと言って32だと今度は自分の技量的に細部を描き込みきれないので。
まだ描いたのはあるんですが割愛してサメに移ります。
こいつが結構苦戦しました。24×24でどうサメ感を出すのか・・・?
結局「サメ ドット絵」で検索してヒットしたコレをほぼほぼパクりました。
そして次なる難関。アニメーションです。動いてる時に全体を1ドット上にずらすとこまでは良いんですが、尾ひれの表現に死ぬほど時間かかりました。
というのも、何かしら見本があればある程度パクりゃあ一発で済むんですが、ドット絵のサメが動くGIF画像なんか無かったので、こればっかりは現実のサメが泳ぐGIF画像とにらめっこしながら、無理矢理やりました。コマ数は9コマでした。
続いて貝的ななにか。
斜めになってる丸ってなんだよむずかしーなーとか思いながらやってました。
とりあえず絵は完成して、この模様みたいなやつを動かしたら面白いんじゃないかと思ってやってたらなんか3コマで上手いことループしました。これにはビックリ。自分の脳ミソでは10コマぐらいかかるかなとか思ってたんですが、見せ方の技術なんでしょうねコレ。(それを自ら発見していくスタイル)
で、思いついたんですね。
どうせならマウスカーソルとかやっちゃいますか、自分。
マウスカーソルを自作する
32×32にして、この画像ぶちこんで、残ったスペースに矢印とか描けばちょうどいいじゃん!
全てが繋がりました。
一回未来が見えたので後はひたすら作業でした。
ちなみに自作マウスカーソルについてはこちらの記事を参考にしました。ありがとうございました。
一応この人と同じように、出来上がったやつをGoogleDriveに置いておきますので使われる方はどうぞ。(リンク)
元々自分用なので、わざわざgif化してサンプル置いたりとかはしてません。領域選択と移動も無いです。
終わりに
てなわけでマウスカーソルまで完成したわけですが、当分ドット絵は満足したかなという感じです。創作ものは得てしてそうですけど、アイデアが浮かばんことにはみたいなところはありますね。また何か思いついたら描いていこうかな。
・・・一番最初に話した動く背景はって?
あれはもういいかなあ。