Asepriteを使ってFF風のドット絵を描いてみました。
さすがドット絵に特化したペイントソフトだけあって、こうしたドット絵も簡単にできちゃいますね。
もちろんアニメーションも簡単にできます。
ファイナルファンタジーの勝利のポーズ風にバンザイさせてみました。
FF6風に回転を加えてもかわいいかも。
さて、ここからが本題です。
ドット絵はPhotoshopなどのグラフィックソフトでもできますが、ふつうに拡大するとぼやけてしまうことがよくあります。
上で紹介しているドット絵は、もとはこんなサイズです。
そう、すごく小さいんですね。
サイトなどに使う場合はこれを拡大するわけですが、Photoshopなどのグラフィックソフトで拡大すると、こんな感じでぼやけてしまうことがあります。
この現象に困っている方もいるかと思います。
というわけで今回は、ドット絵がぼやけない拡大方法についてお届けします。
原因はリサイズの「形式」
ドット絵を拡大するとぼやけてしまう時は、リサイズの「形式」を確認します。
リサイズにはいくつかの「形式」があり、この設定によって仕上がりが変わってきます。
リサイズ形式の違い
このドット絵を2つの方法で拡大してみます。
【ニアレストネイバー】
【バイリニア】
このように、リサイズする際の処理方法で仕上がりが大きく変わってきます。
「ニアレストネイバー」のほうが、ドット絵の雰囲気そのままに拡大できていますね。それに対し、「バイリニア」はぼやけたような感じになっています。
ちなみに、Photoshopなどでよく使われている「バイキュービック法」でも、やはりぼやけた感じになります。
つまり、ドット絵を拡大する場合は、リサイズする際に「ニアレストネイバー法」に設定する必要があります。設定は、リサイズの画面でできます。
【Aseprite】「Sprite Size」でニアレストネイバーを選択
【Photoshop】「画像解像度」でニアレストネイバーを選択
こうしてニアレストネイバー法で拡大すると、ドットの雰囲気を損なわずに拡大することができます。
グラフィックソフトのリサイズ設定
現在のグラフィックソフトは、リサイズの初期設定が「バイキュービック法」になっているものが大半です。Photoshopもデフォルトでバイキュービック法になっています。
フリーソフトでは「バイリニア法」を使っているものもありますね。
どちらの方法も、写真や絵でしたら破綻の少ない形でリサイズできますが、ドット絵に使うとぼやけた感じになってしまいます。
ですので、Photoshopなどのグラフィックソフトでリサイズする時は「ニアレストネイバー法」に手動で設定してから、リサイズする必要があります。
ニアレストネイバー法を使った拡大の例
ニアレストネイバー法を使うと、元絵の雰囲気を損なうことなくドット絵を拡大することができます。
アニメーションの場合も同様です。
ドット数によって、見映えのするサイズが変わってくるかと思います。いろいろとためしてみてくださいね。
★今回の記事のドット絵は、Aseprite（エースプライト）というソフトを使っています。Asepriteについては、こちらの記事でくわしく解説しています。
おしまいに
今回はドット絵がぼやけない拡大方法でした。
ニアレストネイバーは、現在はあまり使われることのないリサイズ形式ですが、ドット絵の拡大には欠かせない方法です。
よかったら参考にしてみてくださいね。
