初心者でもできる!なんちゃってドット絵講座

ツクールXPからアルファチャネル対応になり、MVでは1タイル48×48というかなり大きな規格になりました。 ドッターにとって、サイズが大きくなればなるほど打ち込み量が増えて地獄を見るということ…
そこで、簡単にして美麗なドット絵もどきを描く方法をご紹介します。「ドット絵なんて描けない…」というそこのあなたでも簡単に出来ちゃう裏技です(荒業とも言う)

用意するもの

  • お絵かきソフト
    • 有料ソフトならPhotoshop・CLIP STUDIO・SAIがオススメ
    • 無料ソフトならPictBearが動作が軽く高性能でオススメです
    • ドット打ち特化ツールEDGEEDGE2では今回の手法が使えないので注意
  • 参考資料
    • インターネット検索・写真集・自分で撮った資料写真などなど

ドット絵とは?

左がいわゆるドット絵と呼ばれるもの。限られた色数でいかに美しく魅せるかが問われる。
対して右は通常のイラスト。色数はほぼ無制限でサイズも上限がないため、いくらでも描きようがある贅沢な画像と言える。ツクールXP以降は右の画像が主流です。

▲今回紹介するのは右のドット絵もどきの作り方

アンチエイリアスとは、角ばったピクセル(ジャギ)を滑らかに見せる処理の事です。たくさんアンチエイリアスがあると、フルカラーで描いたように滑らかな表現になります。
試しにMVの既存素材を拡大して見てみよう。

▲プロの技をしっかり目コピしよう!

画像の色数が多くなるほど細かな表現が可能になりますが、全てを手打ちするのは大変です。色数が多いからこそできる手法で手間を減らそう!

PAGE TOP

なんちゃってドット絵を描いてみよう

前置きはここまでにして、早速ドット絵もどきを描いてみましょう。
やり方は簡単。完成サイズ(48×48)の2倍のサイズ(96×96)でイラストを描いて縮小するだけです。
まずは完成品を見て下さい。ここに3分で描いたニコちゃんマークがあります。

▲滑らかに見える?

このように単純な絵柄ですと、より綺麗な仕上がりになります。更に作業時間が減る事によって作り手の負担も半減! ドット絵初心者でも手軽に実践できるので、自作チップの入り口にもってこいではないかと思います。

PAGE TOP

縮小方法

縮小方法はお使いのお絵かきソフトによってマチマチですが、基本的に「変形ツールで縮小」「解像度で縮小」の2パターンがあります。

▲変形ツールを使って縮小
▲解像度の変更を使って縮小
PAGE TOP

なんちゃってドット絵を描いてみよう~実践編~

この方法を使って、実際にイチからマップチップを描いてみましょう。はじめにこの手法のポイントです。

1.細かく描きすぎない → どうせ潰れてしまうのではじめから描き込まない
2.陰影をつけすぎない → 2色程度に留めるのがベスト(ハイライトも同じ)

元の画像を縮小して無理やりアンチエイリアスを作り出す方法なので、細かく描き込みすぎると全部つぶれて逆に汚くなります。 「こんな単純な絵で大丈夫かな?」と心配になるくらいが丁度いいです。
細かい描き込みは縮小してから加えましょう。

1.全体像をつかむ

それでは早速描いていきたいと思います。クリスマス間近という事で「クリスマスツリー」を描きます。
インターネットで画像検索をして、ツリーの全体像を掴んだら下書き(もといあたり線)です。

▲楕円を使うと奥行きがイメージしやすい
PAGE TOP

2.線画+色づけ

普通のイラストと違うのが、ドット絵の線画はピクセルを整える作業であるという事です。
描いては削って、整えて…全体を見てズレがなければ先に進むの繰り返しです。

▲ひたすら地道な作業
PAGE TOP

3.彩色~陰影+調整

初めに言ったポイント「陰影をつけすぎない」を頭に入れて影つけしていきましょう。※反対側は反転&コピーペーストして手間を節約するので半分しか描きません。
線画で使用した色を使って、影1を描画します。レイヤーの不透明度を50%まで下げれば簡単に影色が作れます。影2は不透明度100%のままです。同じ要領で他も塗っていきます。

▲のちほど線画を追加するので消えても構わない

それぞれのパーツを結合して色味を調整したら、気になる所をトコトン修正していきます。
元絵からどんどん離れていっても構いません。より良く見えるまで修正を続けます。
修正が終わったら、コピペ反転で反対側を合体します。

PAGE TOP

4.彩色~ハイライト

全体の調整ができてからハイライトを入れます。ハイライトは不規則に入れた方が自然で綺麗なので、反対側を反転して流用したい場合は後入れしましょう。

▲ドットグラデは縮小するとグラデーションになる
PAGE TOP

5.縮小+加工

変形ツールを使って縮小します。そのままだとピンボケしたようにぼやけているので、フィルター「シャープ」をかけます。シャープフィルターは適度に調節して下さい。
私が無料ソフトのPictBearを勧めた理由に「シャープ弱」フィルターがあります。このフィルターはほど良い具合のシャープ効果を画像に与えてくれるので、通常のイラストを縮小した時にも重宝しています。

▲のっぺり感がなくなりハリができた
PAGE TOP

6.完成

加工が終われば完成です。試しにマップチップに組み込んでみました。
既存素材と並べるとややチープです。このあたりは自分の技量に左右されそう(^_^;) もし既存素材と並べたいなら素材から色を拾って描く(※同じパレットを使う)と統一感がでそうです。

結論:作業時間を短縮できるが 既存素材との併用は向かず 完全自作チップに向く

▲やりやすい方法を見つけてポチポチしようね

ただし、もしPhotoshopをお持ちであれば「画面解像度」の「再サンプル」をチェックで自然な拡大縮小を実現できます。 「バイリニア法」は通常の縮小でできてしまうぼけがでないので荒業縮小に適してます。 「ニアレストネイバー法」はピクセルを維持したまま拡大縮小してくれるので、例えばアンチなしドット絵をそのまま拡大縮小したい時などにも便利です。

SAIの最新バージョンSAI2でも「バイリニア法」が使える事を確認できました。

▲かなり自然な仕上がりに
PAGE TOP

余談ですが…

実はこれ通常のイラストでも使えます。完成サイズの倍で描いたアンチエイリアスなし線画を完成サイズまで落とすと綺麗な線画が出来上がる。 F&C塗り(いわゆるエロゲ塗り)と非常に相性がいい線画ができあがります。

▲完成サイズが大きいイラストには向かないよ
PAGE TOP

タイルチップを自作してみよう

次はタイルチップを作ってみよう。タイルチップとは、上下左右が繋がっているループ素材のことです。面倒くさそうですが意外と簡単に描けますよ。

今回はランダムな石畳を 荒業縮小で描いていこうと思います。グリッドは48に設定してあるので4マス分をやや濃い目の地色で塗りつぶしておきます。
石の配置のバランスを確かめるため、既存素材のバランスを見てみます。
▲わからない所は既存素材を参考にしてみよう
PAGE TOP

1.石のループ配置

参考画像を見つつ、適当に線を引き、整えます。この時はまだループは気にしなくてOK。縦横の石の数だけ忘れずに!

▲目地を太くしておくとそれっぽくなる

ここからがループ素材にするテクニック。下記画像のように4等分にバラした画像を交換します。そうすると上下左右は繋がった状態になるので、あとは残りのバラバラになった中央部分を修正するだけ!
修正する際に上下左右を変更する場合は、反対側とズレがないか確認しながら進めよう。

▲これで上下左右は繋がる
▲修正後
PAGE TOP

2.陰影をつける

前回同様に修正しながら陰影をつけていく。その際、途中で結合→縮小して完成図を確認しながらだと良い。

▲縮小するといい具合に混ざるよ
PAGE TOP

3.完成

縮小して、フィルタや色調補正などの加工を施したら完成です!試しに配置してみましたが、ちゃんと綺麗にループしてますね。 ループ素材は意外と簡単に作れるので、恐れずにゼヒ挑戦してみて下さい。

▲既存素材ともうまく溶け込めた!
PAGE TOP

終わりに

このページはツクールMV発売1周年記念企画「RPGツクールMV Advent Calendar 2016」にて執筆させて頂きました。企画を発案して下さいましたfftfantt様ならびに参加者の皆様に深く感謝を申し上げます。
2016年12月13日 栗下義孝

PAGE TOP
▲HAPPY ツクールライフ!
© 栗下義孝 All Rights Reserved.