製作ツールを用いて絵系CAを作ってみたシリーズ第３弾になります。
【第１弾】【コメントアート】製作ツールを用いて絵系CAを作ってみた【積絵編】
【第２弾】【コメントアート】製作ツールを用いて絵系CAを作ってみた【フルカラー編その１】
また、今回は製作過程を動画化しました。
動画を元に解説してきます。
作業環境
動画解説の前に作業環境の説明から。
普段は下記画像のツールを用いて製作しています。
動画見れば分かる通り、テキストエディタにまとめた記号や空白文字を
ペタペタ製作ツールの方に貼り付けて完成を目指します。
また動画には登場しませんでしたが、色の抽出は「Spoitkun」というツールを用いてました。
製作種類／順番
フルカラーCAは、「輪郭線」＋「色塗り」の組み合わせか、輪郭線を作らず色塗りだけで作る、
２パターン存在します。今回は「輪郭線」＋「色塗り」のパターンになります。
また、【第２弾】で触れた「複合固定フルカラー」で製作します。
複合固定フルカラーの作り方として今回は、「medium ender」のコマンド（１４行）をベースに、
目など細かい部分は「big」コマンド（１６行）や「small ender」コマンド（２１行）等を、
組み合わせます。
0:00 ～ 1:27 輪郭線（ライン）
まず始めに輪郭線を作ります。
テクニックその１：記号の重ね合わせ
さて、0:28秒頃に下記図のように、赤と黄で組み合わせが登場します。
これは、元絵に対して当てはまる記号が見当たらない時に、
複数の記号を組み合わせて表現する一種のテクニックですね。
そして一通り作り完成した輪郭線はこんな感じ。
ここまで約１時間くらいでした。
1:28 ～ 2:48 色塗り
さてここからはみんな大好き色塗りのお時間です。
ここでは２つのテクニックを紹介します。
テクニックその２：重ね塗り
色塗りは基本的に下記赤枠内の記号を主に用います。「▁▂▃▄▅▆▇█▉▊▋▍▎▏▔▕▼▲◢◤◥◣」
ただ不便なことにUnicodeには下記黄色ような上向きの波線、左向きの縦の波線を作る記号が存在しません。
所謂、上向き、右下がりの表現作れないよ問題。
では、どうやって表現するかというと、分かり易くgif画像を用意しました。
黄色の「█」ブロック記号の上から「▁▂▃▄▅▆▇█▉▊▋▍▎▏」の記号を重ねることで、
存在しない上向きの波線や、左向きの縦の波線を疑似的に表現してます。このテクニックを重ね塗りといいます。
さて下記画像の赤丸内、水色のブロックが罫線に対し半分はみ出てます。
この場合は、重ね塗りの要領で、青色のコメントを用いて水色の下部分を隠します。
動画内、2:08～2:16を観て頂ければより理解できるかと思います。
これはoztoさんの記事（自作の絵系コメントアートをものすごく細かく解説してみる）
でも解説されていますね。絵系を作る上では必須テクニックになります。
テクニックその３：諦める
「諦め」は果たしてテクニックなのかという疑問はありますが、
諦めて別の表現方法を選択するのもある種のテクニックだと思うので紹介します。
さて、下記画像の赤丸内顎のラインですが、上向きの波線が存在せず、
またテクニックその１のように重ねて表現することも出来ません。
最初は上記画像のようにして作ってましたがどうも顎のラインに納得いかず…。
そうして僕は諦めました。
というのも諦めて全てを投げ出すのではなく、元絵をトレースせずオリジナルで表現することにしました。
顎の表現は諦め、頬のラインを伸ばすことで違和感なく表現することが出来ました。
顎のラインで悩む絵系製作者にはお勧めするテクニックです。
色塗りも約１時間で完成しました。
2:49 -3:42 目
目を一つの製作枠として設けているのは、目をどれだけ作り込めるかが、
作品を作る上での鍵だと思っているからです。
イラストを描く方にとってもやはり目がイラストの命とも言われてますものね。
参考：イラストの命！目の描き方特集。リアル系からかわいい系まで
特にテクニックというテクニックはありませんが、
肌とヘルメットの間に目のレイヤーを後から仕込むことが出来るのも製作補助ツールのお陰ですね。
製作時間は約３０分でした。
完成・・・？
というわけで、完成して静画に投稿しました。
製作時間は合計約２時間半でした。
完成後iOSアプリから確認したところ、下２行の輪郭線がぶっ飛んでました。
因みに、口元に使用してるアラビアンな記号、iOSアプリだとぶっ飛んで表示されるので修正が必須なのは内緒。 pic.twitter.com/Nw2oDkojCT
— ・M・(まー) (@x_0227) July 11, 2019
これからが本当の地獄（互換作業）だ・・・！
iOSアプリとの互換作業
結論から言いますと「ށ」←こいつ(U+0781)が悪さしてました。
輪郭線だけで比較してみると以下の通り。
PCブラウザ
iOSアプリ
iOSアプリからだとぶっ飛んでるのが分かりますね。
修正過程のキャプチャを取り忘れてしまったので修正後の画像を貼ります。
PCブラウザ
iOSアプリ
口部分に関しては、中々良い記号が無かったので
「記号の組み合わせ」＋「一回り小さいサイズのコメント」で製作しました。
「記号の組み合わせ」については、上記「0:00 ～ 1:27 輪郭線（ライン）」で説明しましたが、
もう一つ「一回り小さいサイズのコメント」を簡単にですが紹介します。
テクニックその４：小さいサイズのコメント
今回は「small ender」コマンド（２１行）の「⁃⁻¯」の記号と、
「medium」コマンド（１６行）の「㇀」を組み合わせてます。
赤色が今回ベースにしている「medium ender」のコマンド（１４行）と比較すると、
小い斜線の記号っぽくみえます。
記号の組み合わせ、コメントの大きさ次第で、可能性は無限大になるのです！
完成
というわけで完成しました。
修正前と修正後の画像を貼って終わりにします。次回もお楽しみに！
【修正前】
PCブラウザ
iOSアプリ
【修正後】
PCブラウザ
iOSアプリ
