フォトリアルなPixelartのメイキング
ピクセルこんにちアート！さめにかと申します。
ところであなたは、当記事ヘッダーのピザトーストが写真ではないことに気が付きましたでしょうか。
背景の写真はぬあー（@Nuaah_box）さんに提供していただきました！
というわけで、ヘッダーのような フォトリアルな雰囲気の Pixelart について、実際のメイキングを示しながら書いてみます。
（※注: この記事は、PCが使える環境を想定して作成しています。ここに記載されていることには、Dotpictなどの環境ではまだできないことが含まれているかもしれません。）
この作品は 端ドット絵 Advent Calendar 2023 19日目 の記事となります。
（こちらもよろしくお願いいたします）
ドット絵 Advent Calendar 2023: https://adventar.org/calendars/8655
裏ドット絵 Advent Calendar 2023: https://adventar.org/calendars/8925
参考写真を準備しよう
さっそくイラストを描いてみましょう。
今回は、リアルに描けたらわかりやすく嬉しくなれるであろう、食べ物のドット絵を描いてみます。
ここで、まず最初にすべきことはなんでしょう。そう、参考写真の用意です。現実のものを模倣したいのですから、これがなければ始まりません。
今回はわかりやすく、参考写真をそのまま模写する形式でドット絵を練習していきます。
というわけで、ピザトーストの写真を用意しました。この写真は ぬあー（@Nuaah_box）さんに用意していただきました！ぬあーさんの活動はこちらから。
………ところでこの写真、全体的にぼんやりと青く見えます。おそらく、窓に映り込んだ景色が反射して、空の青色がかかっているのでしょう。ドット絵を描くにあたって、元の色を想像するという工程を挟まなければならず、雲行きが怪しいです。
しかも、このままドット絵に起こすのはなかなかイメージが湧かず、不安です。どのような色を使って、どのように配置していけばそれっぽく見えるのでしょうか。わかりません。こんなときは、さっそく奥の手を使うしかありませんね。
参考写真を加工しよう
参考写真を加工すればいいのです。まずは全体的に青みを抜いていきます。RGB調整と呼ばれる技術を使います。
こんな感じです。しかし、ここで更に模写の完成像を掻き立てるためのもう一工夫をしましょう。これは普段はほとんどやらない工程なのですが、記事として紹介するためにあえてやってみます。
いわゆる "ドット絵風" 加工です。といっても、この画像をそのまま参考にするわけではありません。簡単な画像処理だけでキレイに仕上がることは（AI とか使わない限りは）ほとんど厳しく、人の手を加えなければ作品としての鑑賞に耐えうるレベルのものにはまずなりません。といっても、色選びや見せ方に難がありつつも、ピクセルの配置に関してはかなり丁寧であるこの画像は、Pixelart を作成する際の大きなインスピレーションになります。
ちなみに、私は "主線のあるイラストを低解像度で描きたいとき" や "文字のレタリングをしたいとき" に、このような画像加工での参考資料作成を多用します。アンチエイリアシングに苦手意識があるので、意識的に他の方法で補完しているのです。
"大まかな形で捉える"ことで楽に描く
ということで、参考資料も出揃ったところでイラストを描いていきます。
まずは質感を一切無視して、大まかにガシガシと形を捉えていきます。
ここでの過程では、細かな凹凸を一切無視して食パンを"つぶれた直方体"ぐらいの認識に落とし込んでいます。こうすることで、3~4面ぐらいの単純な図形のように捉えることができます。
次は、表面の凹凸を大雑把に描いていきます。
表面にチーズのふくらみがいくつもできていて、細かなでこぼこがたくさん並んでいるというピザトーストの表面の構図は、例えるなら砂丘に近いように見えます。砂丘の凹凸の集合体は、下図のように一つ一つの凹凸を三角形の積み木のように捉えて、どこに光が当たるべきでどこに影が当たるべきかを自分の中ではっきりさせておくと意味がわかりやすいと思います。
ここから、しばらく書き進めていくとこうなりました。
そんなこんなで、参考資料との比較・細かな描き込みを繰り返して、だんだんと物体がそれらしい形を帯びているように見えてきていると思います。
このとき、先ほど加工して作成した画像が大いに表現の参考になりました。食パンの上面の端部分については、耳の色が少しだけ載るように茶色を1pxずつ配置しました。チーズのハイライトも、少し写真を真似ながら不規則に見えるように細かく入れ方を調整していきました。
でも、参考写真がすべてではない
ここで、先ほどのイラストをもう一度貼ってみます。この画像をよく見ると、写真の色や形をほとんどそのまま真似て描いたのに、気になる点がいくつか挙げられます。
まず、赤みが足りません。ピザソースがたっぷりかかっているはずのトーストは、錆びた鉄のようなくすんだ赤色を呈しています。これではソースの賞味期限が切れているようにさえ見え、鮮度が疑われてしまいます。
黄色みも足りません。このピザトーストは赤茶と白のまだら模様で構成された塊のようで、色相に全くもってメリハリがありません。チーズの黄色みを表現するために、全体的により鮮やかにする必要があります。
それに、パンの耳の部分とピザソースの部分で色味に全く差異がなく、かなり見づらいです。これでは立体構造がわかりづらく、この画像を遠くから見ても一発でピザトーストとわかる方は少ないでしょう。地面にぶちまけられた溶岩みたいにすら見えます。
さらにさらに、パンの耳の質感が物足りません。質感表現が特になにも施されておらず、単なるグラデーションがそこに鎮座しているだけです。
………というわけで、上述の点すべてに注意しながら、リタッチを施していきます。その結果がこちらになります。これにて完成です。
完成
どうでしょうか。ピザトーストの表面に強い黄色・赤が足され、どこがどのような具材であるかがよりわかりやすくなりました。さらに、オレンジ色で描かれているパンの耳との差別化もできました。パンの耳は、急遽用意した別の参考写真からざらざらした表現を足してみて、納得のいく感じにしました。
この画像に再び青系統の色調補正をかけて、作成したのがあのヘッダーの画像です。いい感じに写真に見えるのではないでしょうか。
絵が完成したのでここで記事を終わります。読んでいただきありがとうございました。
この作品は 端ドット絵 Advent Calendar 2023 19日目 の記事となります。
18日目 の記事 ≪ 19日目 ≫ 20日目 の記事
使用画像のライセンス
タイトル: Sossusvlei Dune Rippled cropped.jpg
ライセンス: CC BY-SA 3.0
ソース: https://commons.wikimedia.org/…
作者: Daniel Kraft
公開年: 2019
補足: この画像は、さめにか が加工しました。