【Level1】綺麗に見える曲線の描き方【ドット絵講座】
今回はドット絵で曲線の描き方をご紹介します。曲線は何かを描く際の基礎中の基礎テクニックですので、しっかりマスターしてドット絵をスムーズに描けるようにしましょう。また、ちょっとした小技もご紹介しています。
ドットの基礎、曲線を覚えよう
ドット絵を始めた際にまず立ちはだかる壁が「曲線」の表現ではないでしょうか。かくいう私も曲線が上手く描けずにヒーヒー言っていた時期がありました。
そこで今回は、超初歩的な事ですが曲線の描き方をご紹介いたします。
…といっても、基礎は基礎。基礎がないと応用は効きませんので、しっかりマスターしましょう。
尚、今回のパレットは『24×24 pix』とします。
※グリッド付きの画像を追加しました。
過去の講座はコチラ
曲線を描く
曲線といっても色々な曲がり方があります。円形、波線、他にも直線の中に曲線が混じっていたりと、形を作るうえで曲線はなくてはなりません。
まずはいつものように見本をご用意いたしました。そちらをご覧ください。
まずはこのような大きな曲線を描いてみましょう。
円形の一部を切り取ったような滑らかに丸まった曲線です。この綺麗な丸を描けるようにすることが基礎となります。
コツとしては、1ドットずつずらしていたものを、途中から2ドットにしたり、1ドットと2ドットを交互に描いたりというように、順々にドット数を増やすことで滑らかさが表現できます。
当然ですが右側と下側は対称に描いていきます。どちらかがズレると歪んだ円形になります。逆に歪ませることで坂道や丘などを表現したりできます。
アーチ状
次にアーチを描いてみましょう。こちらも円の上部を切り取ったようなイメージで描きます。
描き方は先ほどと同様ですが、左右対称になっています。こちらも滑らかに潰していくと橋になったりします。
頭頂部の直線になっている部分は長めに取ると滑らかになります。
ここを短くするとこのようになります。レモンや卵などを描くときは敢えて頭頂部のドットを短くすることで曲線を尖らせることが出来るのです。
ちなみに変化を加えたのはわずか2px程に過ぎません。
円形というのは、それだけ1pxの重みが大きいということを念頭に置きながら、縮小プレビューを見ながら円に近づくように描いていきましょう。
波線
波形はS字を書くように作ります。まあ当然っちゃ当然ですが、ココでもコツがあります。
波を高くしたい場合は、湾曲部分を球体に近づけるとグネグネした感じに。
逆に、波を低くしたい場合は湾曲部分を滑らかにかいていくと、穏やかな波になります。
上より滑らかにした場合。
円形
ここまで来たら円を1つ描いてみましょう。
まずは練習の為に拡大円ブラシ(拡大すると円になるやつ)を使わず、自分の感覚で描いてみましょう。
次に、描き終わったものの上に、円ブラシを同じサイズに拡大したモノを別レイヤーで置きます。
そして重ねると、自分の円のズレがわかります。これが円ブラシと同じであれば正円ということになります。
さて、何故練習の為に円ブラシを使うなと言ったかというと、この円ブラシを逆に利用してアタリに使ってしまえばいいという事がわかります。(※アタリとは、絵を描く際のガイドの様な記号ないしは下書きのこと)
つまりこういうことです。
拡大した円ブラシで丸を1つ置き、その周りまたは一番外側に線を描きます。あとは塗りつぶした部分を消してしまえば円の完成です。
ね、簡単でしょ。
しかし、こればかり多用していると円に慣れないので、練習の際はあえてアタリなしで描いてみて、円の感覚を鍛えることも大切なのです。
ちなみに、この円アタリをそのまま利用すると、このような球体グラフィックだって簡単に描けてしまいます。フルカラー時代って最高だね!
アタリを活用した円の描き方
ドット絵を描く際にはシルエットから描け!というのは以前の講座でお話ししましたが、このシルエットを先に描く方法を使えばそれ自体がアタリとして機能するようになります。
そうすると一見複雑な曲線交じりのドット絵でも、かなり楽をして描くことが出来るのです。実際にゲームのグラフィックを描く際は何100個と書かないといけませんので、このようなショートカット技術は覚えておいて損はありません。最後にそれを活用した曲線の描き方を紹介します。
たとえば、このようなシルエットをブラシでぐちゃぐちゃっと描きます。
その周りを輪郭線を描くように線を引きます。
アタリ部分を消し、後は形を整えて完成です。
手で引くと面倒な形状でも、シルエットから先に描くことでアタリを作って楽に描くことができるのです。
この線画を活用してジャガイモを描きました。
「適当にブラシで塗りつぶす→輪郭線を引く→形を整える→色を塗る」という僅か4工程で簡単にモノを描くことができるのです。
ちなみにこのジャガイモは描くのに1,2分しかかかっていません。まあ形状が簡単なのはありますが、実際にゲームを作る際には大幅な時短ですね。
…という感じに、曲線を描くのになれてきたら、アタリをじゃんじゃん使って楽に曲線を描きましょう。
小技もどんどん活用しよう
以上となります。
曲線は1ドットを大切に描き、線になればなるほど滑らかな曲線に仕上がっていきます。
このドット絵の円の表現は実際に描いて、プレビューしながらやらないと、感覚として掴みづらいので、真似しながら覚えていきましょう。
同時に、実際の制作では時短の為にシルエットを用いたアタリを活用すると楽に制作が運びますので、お試しください。
では、次回もお楽しみに!
ゲーム制作講座まとめはコチラ
参考価格:¥11,760 円/年(税別)(執筆時調べ)
本格派、筆者利用のソフト。Photoshopのみを利用する場合、フォトプランの利用が単体プランよりも安く使えます。年払い、月払いともに980円ですので、使用の状況に合わせて選んでください。
「ドット絵」の関連記事
- 誰でも描ける!ドット絵講座~まとめ~ 29,741ビュー
- 簡単?難しい?ドット絵を描いてみたいと思うアナタに 27,415ビュー
- 【Level3】岩や氷をドット絵で描くコツと手順【ドット絵講座】 19,164ビュー
- 【Level3】ドット絵の立体感を出す方法。色々な立体を描いてみよう【ドット絵講座】 19,121ビュー
- ドット絵が劇的に上手くなる5つの方法【ドット絵講座】 15,620ビュー
- 【Level1】ドット絵で描くグラデーションの付け方【ドット絵講座】 15,425ビュー
- 【Level1】アイコンやUI周りで活躍!ドット文字の描き方【ドット絵講座】 12,209ビュー
- 【Level1】綺麗に見える曲線の描き方【ドット絵講座】 11,936ビュー
- 【Level5】クォータービューマップで部屋を作ってみよう【ドット絵講座】 9,393ビュー
- ドット絵を描くのにオススメのソフト 8,923ビュー
- 【Level2】ボタンをドット絵で色々な形にする方法【ドット絵講座】 8,137ビュー
- 【Level1】ドット絵の線と図形の描き方~超基礎編~ 8,025ビュー
- 【Level2】単色(1bit)で描いてデフォルメ力を鍛えよう!【ドット絵講座】 7,996ビュー
- 【Level4】簡単!アクションゲームのマップをドットで作ろう!【ドット絵講座】 7,483ビュー
- 【Level4】ドット絵で2Dのマップタイルを作ろう【ドット絵講座】 7,395ビュー
- 【Level4】ドット絵で道を描こう!【ドット絵講座】 7,326ビュー
- 【Level4】クォータービューのマップタイルの描き方【ドット絵講座】 6,405ビュー
- 【Level2】ドット文字を応用して”ネオンサイン”を描いてみよう!【ドット絵講座】 5,765ビュー
- 資料写真は縮小して使え!【ドット絵講座】 5,569ビュー
- ドット絵を描くのに向いている人 5,277ビュー
コメントを残す