琥梟週報　第６号 『 ドット絵講座SP-色編 』

お世話になります、AMBER OWL主催のRMです。

いきなりですがSwitch買いました。ラスト・ストライク分の売上金をドカーンと使っちゃいました。えへへ…
これもひとえに、記事への「いいね」やご支援・フォロー、あるいはTwitterでの反応により活力をくださった皆様のお陰様でございます。
改めて御礼申し上げます。

今回は「 第６号 『 ドット絵講座SP-色編 』 」ということで、先週号に引き続きドット絵の作成手順について書いてみます。今週号は色の使い方と作り方についてとなっております。

先週号と同様、「ドット絵講座」と銘打ってはいますが、RMはこうしてるよという程度の備忘録的なもので、これを読んでいるあなたにとってはヒントになったりならなかったりするかもしれません。寝る前や移動中のちょっとした読み物程度にお読みいただければと思います。

というわけで、今週号も開始でございます。

それでは今週の内容がコチラです。

今週の目次

• お知らせ
  -　お題箱設置
  -　ラスト・ストライク販売中
• 作業週報
  -　絵の練習・美術解剖についての学習
• ドット絵作成手順－２　『色の使い方と作り方』

お知らせ

毎度ながら、まずはお知らせからお許しくださいませ。

お題箱設置

Ci-enに書く内容のネタ切れ対策として、お題箱を設置しております。

「こんなこと書いてみて！」といったリクエストや、匿名でのご意見・ご要望、
あるいはご質問などなど、是非こちらのお題箱からお寄せくださいませ。
お題箱へ頂いた内容につきましては、週報にご返信・ご対応いたします。

ラスト・ストライク販売中

拙作『ラスト・ストライク』が現在DLsite様にて販売中でございます。
ちょっとした時間に楽しめる爽快ふっ飛ばしアクションに仕上がっております。
エロもちょろっと。
無料体験版もございますので、こちらだけでも是非一度お楽しみいただければ幸いでございます。

以上、コマーシャルでございました。

作業週報

続いて、この1週間なにをしてたのかといったお話でございます。

絵の練習・美術解剖についての学習

引き続き練習・学習を行ってい…たのですが、ゼルダが楽しすぎてかなりサボっちゃいました。えへへ…
来週から本気出します（フラグ）

ドット絵作成手順－２　『色の使い方と作り方』

さて、先週号に引きつづきドット絵作成手順のご紹介ということで、
ドット絵の作成手順と、関連する細かいtipsなんかを書いていこうかと思います。
念のため完成品のドット絵をコチラに貼っておきましょう。

先週号では線画をドット絵に落とし込むところまでをご紹介いたしました。
このあたりまで進んだわけですね。

今週はここから色を塗っていく…その前に。
色の使い方と作り方について一旦書いてみようと思います。

といっても、しっかりと理論だったものではなく
「RMはこうやって色を使って塗ってます」程度のものなので、
参考になったりならなかったりすると思います。
ついでに言えば用語とかは間違ってるかもしれないです。あしからず。

１．色の使い方

ドット絵において色を使う場合それぞれの色に役割を定義しておくと便利です。

あらかじめ「この色はここに使う」と決めておけば、色を塗るときにどうやって色を置くべきか悩むことを減らせるから、ですね。
どうでもいいですが、この色の役割を定義する手順について「色の使い方を決める」と勝手に呼んでいます。

さて、どのように役割を定義しているか、実例として今回のメルクのドット絵のうち肌色の部分で解説していきましょう。

まず、1グラデーションに使う色数は基本的には５色（＋ほかグラデーションと共通の黒を1色）です。

ベースカラー

その５色のうち、真ん中の３色目をベースカラーとして役割を定義します。
線画を塗りつぶす際にはこの色で塗りつぶし、この色をベースとして光の当たるところには明るい色を、逆に光が当たりにくい箇所には暗い色を配置していきます。

ベースカラー（明）

続いて、２色目はベースカラー（明） として役割を定義します。
３色目のベースカラーで塗った箇所のうち、光の当たるところをこの色で塗っていきます。光源にもよりますが、３色目のベースカラーと合わせて最も広い面積に塗られる色です。
また、顔においてはこの色がベースカラーとして役割を果たします。

光沢色

さらに、１色目は光沢色として役割を定義します。
２色目のベースカラー（明）で塗った箇所のうち、強く光の当たる箇所など光沢が出る箇所をこの色で塗ります。
面積的にはかなり狭いですが、肌、髪、ナイロンなどテカる材質を表現する上では必要な色です。

陰色

そして、４色目は陰色として役割を定義します。
３色目のベースカラーで塗った箇所のうち、光が当たらず陰になりそうな場所をこの色で塗っていきます。面積でいえば大きな面積は占めていませんが、立体感を表現するためには非常に重要な色です。
また、後述の色トレスを行う際に一部はこの陰色で行います。

色トレス＆ジャギ消し色

最後に、５色目は色トレス＆ジャギ消し色として役割を定義します。
線画を黒で塗っているため、内側の塗りと色の差が激しく線画が悪目立ちしてしまってます。それをごまかすために線画の一部を塗ったり（＝色トレス）ほんのちょっとボカしたり（＝ジャギ消し）するための色としてこの色を使用します。
前述の通り４色目の陰色も一部では色トレス色として使用しています。

以上、５色の役割をご紹介いたしました。

ちなみに上記の説明は肌色の部分で説明しておりますが、髪の青色やグローブの赤色についてもほぼ同様です。ただ、肌以外の部分は５色ではなく４色のみ使ってます。
面積があまり広くはないので色数多いとめんどくさいしちょっと減らしたわけですね。

色を減らす場合には１色目の光沢色が消され、次に２色目のベースカラー（明）、その次に５色目の色トレス＆ジャギ消し色が消されます。
消された色の役割については、他の色に兼任させたり、そもそも役割そのものを消します。光沢はなくてもまあまあ見れるものにはなります。

逆に増やす場合にはベースカラーあるいは陰色に幅を持たせて「ベースカラー（暗）」や「陰色（暗）」などを作ったり、あるいは光沢色とベースカラーとのあいだに緩衝材となる色を追加したりします。

基本的には
「光沢色」
「ベースカラー」
「陰色」
「色トレス＆ジャギ消し色」
…の４つの役割を割り振ります。

２．色の作り方

さて、色の役割を定義しましたので次に色を作っていきます。

ドット絵は色情報がパレットに依存するインデックスカラー方式である場合が多く、EDGEもこの方式となっており、色を塗る前にパレット内に色を作っておく必要があります。
まあ塗りながら適時適時で色を作っていってもいいのですが、解説の都合上塗り中は塗りに集中したいので先に色を作っておきます。

色を作るというと「RGB値が」「色相彩度明度が」「絵の具を混ぜまぜして大惨事」と難しいイメージがつきまといますがご安心ください。
今回は超 ★ 絶 ★ 簡 ★ 単な色の作り方をご紹介いたします。
（といってもEDGE限定な上にある程度練習は必要です…）

それでは実際に肌色を作る手順で解説していきます。

ベースカラー（明）を作る

まずは２色目のベースカラー（明）を作成します。
パレット上の上から2段目、左から2列目のマスをダブルクリックしてカラーピッカーを開きます。

カラーピッカー画面の左側にはプリセットのパレットが、右側には色を選択するためのマップなんかが並んでます。詳細は下記画像で。

ベースカラー（明）ということで、褐色よりちょっと明るめの色を作ります。
色相は赤と黄色の真ん中からちょっと赤よりのあたり、彩度は上から1/3のあたりをクリックして取ります。明度は真ん中よりちょっと上くらい。
選択したらOKをクリックします。

これでまずはベースカラー（明）が出来ました。

色トレス＆ジャギ消し色を作る

続いて５色目の色トレス＆ジャギ消し色を作ります。
パレット上の上から2段目、左から7列目のマスをダブルクリックしてカラーピッカーを開きます。
左から5列目じゃなくてもいいの？　　それについては後ほど。

色トレス＆ジャギ消し色ですので、うまくボカせるよう黒にちかい褐色を作ります。
色相は赤の部分を、彩度は上から2/3のあたりをクリック。明度は下から1/3くらい。選択したら先程と同様にOKをクリック。

これで５色目色トレス＆ジャギ消し色が追加されました。

ベースカラーと陰色をつくる

続いて、３色目のベースカラーと４色目の陰色を一気に作ります。
パレットの色選択モードを領域選択モードに切り替え、先ほど作成した２色目～５色目までの６マスを選択します。

選択したら選択したマス内で右クリックしてメニューを出し、
その中の「グラデーション作成」を選択します。

すると、2色目～5色目のあいだに自動でグラデーションを作成してくれます。
このように、始端と終端の色をつくるだけで簡単にキレイなグラデーションを作ることが出来ます。便利ですね。

いらない色を削る

ただ、こんなに色数はいらないので削ります。
まずはパレットの選択されていない箇所を右クリックして選択解除し、
色の選択モードを単色選択に戻します。
その後、パレット右上のボタンで色の移動モードを位置交換モードに切り替えます。

そうしたら、５色目（上から2段目、右から7列目）のマスから２つ左隣にドラッグして色を移動させます。

色を移動させたら右端の2色はもういらないので消えてもらいます。
色を選択してパレット下のRGBスライダーを全部ゼロにします。

光沢色を作る

最後に１色目の光沢色を作ります。
…が、光沢色については一発で綺麗に作れることはまず無いのでひとまず仮で作ります。
パレットの上から2段目、左から1列目のマスをダブルクリックしてカラーピッカーを開きます。
色相は赤と黄の中央辺り、彩度は上から1/4あたり、明度は半分よりちょっと上あたりで選択してOKを押して色を追加します。

これでひとまず５色分の色ができました。

他の色も作る

同様の手順で髪用の青のグラデーション、グローブ用の赤のグラデーションを作成し、ついでに白目を塗るための白色も追加しておきましょう。

これにてようやくパレットは完成…ではなく、
これはひとまず塗り作業をするための仮色で、つまり後ほど修正します。
ドット絵は修正修正アンド修正with修正です。

ここからゴリゴリと塗っていって完成後に色味を調整するわけですが、
ちょっと記事が長くなってしまったので、塗りと調整の手順については次回ということで。

さてさて、今週の記事はこのあたりで。
御清覧くださいましてありがとうございました。

次週はいよいよ塗りの手順について書いていこうかと思います。
そんなこんなで、また次週もどうぞよろしくおねがいします。