ドット絵を動かしてみよう！の回 | 株式会社ヘキサドライブ | HEXADRIVE | ゲーム制作を中心としたコンテンツクリエイト会社

HEXA BLOG

ヘキサブログ

デザイン

HEXA BLOGデザイン2022.5.6

ドット絵を動かしてみよう！の回

皆さんこんにちは、新人ブログぶりの　じーつー　です！
（前回のブログはこちら）

現在GWの真っ只中かと思われますが、皆さんはいかがお過ごしでしょうか？
私はお休みは全力でぐうたらするという予定をいれるタイプの人間なので、
全力でぐうたらする日々が続いていることでしょう…😴

全力で何もしない！と意気込んでその日を過ごすと
その日の終わりに罪悪感もなく、次の日も元気に過ごせる裏技なのでおすすめです。

とはいえぐうたらし過ぎはちょっと…と思われる方に、前回からの続きで
「手隙の時間があるし、「ドット絵を動かしてみよう」！」の回をお送りさせていただきます。
※私自身、ごく稀にドットを打つ程度のため優しく見守っていただけると幸いです。

では、早速ドットを打っていきましょう。

———————————————————————————————————————

※前回、ヘキサドライブのマスコットキャラクター「グリ」を描いたのでそちらを流用します。

１．動かしたい場所を決める

グリは猫のキャラクターで、この構図だと耳やしっぽが動かしやすそう、表情も動かせそうなど…　動かせそうなところを見つけます
今回は耳を動かしてみます！

大事なことが一つ、
動かす前提の場合は、事前にパーツ分け（レイヤー分け）をお忘れなきよう…！
（一つのレイヤーにポチポチしていて、手間のかかった人の顔）

２．動かす範囲の始まりと終わりを決める

動かしたい範囲を決めます
今回だと耳がぴょこぴょこ動くようにしたいので
耳が立った状態が始まり、横向きの耳が終わりになります

３．始まりと終わりの中間の絵を用意する

始まりと終わりの間を埋める様に中間の絵を用意します

動かすスピードを調節したらこの段階でも大分動いているように見えますね

４．もう少し動きを滑らかにしたい箇所に絵を増やす

始まりと中間の間に絵を増やしてみました
動き的にも問題なさそうなので、枚数は増やさずにこれでいきます！

５、同じ絵を流用して緩急をつける

同じ動きをループにさせるのは少し寂しいので、同じ絵を流用したり表示時間を変えて変化を持たせてみます

６．細かな調整をして完成！

耳がぴょこぴょこ動くドット絵が完成しました！

———————————————————————————————————————

いかがでしたでしょうか？
一部分を動かすだけだとそんなに難しくはないけれど、動きがあるだけでリッチに見えるので、おすすめです！

＼　それではよきGWとポチポチライフを！　／