![見出し画像](https://assets.st-note.com/production/uploads/images/170830964/rectangle_large_type_2_a63fc9cefafc899da7d135f887d2c122.png?width=1200)
【ドット絵】顔グラフィックを作ってみる
今回の記事では、キャラクターの顔をアップで描いた『顔グラフィック』というものをドット絵で描いてみようと思います。
ゲームでよく目にする、所謂「顔グラ」ですね。
会話シーンのメッセージウインドウの近くや、ステータス画面等によく使われている画像です。
いつも通り特に何も考えず、行き当たりばったりで描いていこうと思いますので、どんな感じに仕上がるかは不明です。ゲーム用の「顔グラの作り方」がわかるような何かを学べるような内容の記事ではありませんので、予めご了承ください…。
まずは、ラフから
適当なサイズでキャンバスを用意し、とりあえず人の顔を適当に行き当たりばったりで描いてみたいと思います。
![](https://assets.st-note.com/img/1737194748-QNmKfkS5JIM8RiPDaZgqry4v.png)
何となく二人分の顔を描いてみましたが、「ギョロ目な人」と「頬のこけたおじさん」のラフができました。
なんとなく対峙して会話しているシーンをイメージし、二体を向き合わせています。
右側の「頬のこけたおじさん」が雑魚キャラっぽい感じになりましたが、まあ、あまり気にせず、このまま進めていきたいと思います。
キャラクターの設定やデザインは、まだ特に何も考えていません。二人の関係性も特に何も考えていないのですが、これから徐々にイメージを膨らませながら、仕上げていきたいと思います。
線を整えていきます
ラフのドット絵をもとにドットの並びを整理し、まずは「線画」として仕上げていきます。
個人的にはこの「ドットを整える」という作業が無心になれて一番好きです。
![](https://assets.st-note.com/production/uploads/images/170607935/picture_pc_758c373e48f9f720951b8c8d2277d971.gif)
「頬のこけたおじさん」のほうは、雑魚キャラっぽさを無くすために精悍さを出してみました。
ドットを整理するのが楽しく、ついつい「いつもの癖」で、全体的に線情報を多めに描いてしまいました…。ゲームの顔グラというよりも、劇画調の漫画のコマのようになってきましたね…。(まあ、気にせずこのまま進めてみようと思います。)
影を乗せてみる
見やすくするために、ベタで「影」をつけてみたいと思います。
![](https://assets.st-note.com/img/1737196510-2Em5Awi4kesTjfqu67cFH3ar.png)
影を入れ過ぎてしまい、右側の「頬のこけたおじさん」が、かなり「いかつく」なってしまった気がします…。とはいえ、まあ、立体感がついて見栄えは上がったように思います。
この後、「色」も軽く乗せたいと思っていましたが、この段階でもそれなりに見栄えしているので、完成でもいいような気がしてきました…。
今回は、『劇画調の漫画風「顔グラフィック」』ということにして、仕上げは一先ずここで一区切りとしておきたいと思います。(仮完成)
瞬きさせてみる
色を乗せることはあきらめましたが、何となく顔を動かしてみたくなったので、簡単に「瞬きアニメ」を作ってみたいと思います。
![](https://assets.st-note.com/production/uploads/images/170611566/picture_pc_8c2d0bc8a45ee69443c51d14f683310b.gif)
何となくちゃんと瞬きっぽい動きが作れました。
①基本の顔 ⇒ ②閉じた目 ⇒ ③少し開いた目 ⇒ ④半開きの目 (⇒①基本の顔)
という流れを基本として、「目」の画像を三枚だけ追加しています。
色を乗せていない顔グラフィックなので、短い時間で追加の画像を作りやすく、アニメーションさせやすいですね。
(色を乗せずに仮完成としたメリットが出てきました…!)
瞬き以外にも、細かく表情パーツを動かしてみたり、口パクアニメをさせてみたりすると、なかなか楽しそうな顔グラフィックになりそうな予感がします。
次回の記事で、今回作った顔グラフィックをさらに色々と細かく動かして、クオリティアップしてみたいと思います。
次回の更新にご期待くださいませー。
![](https://assets.st-note.com/img/1737158741-QDSRybsfdgqwNJcpol7FAX6U.png)
★イクシールのホームページ★
https://ixill.net/
★BOOTHのイクシール通販サイト★
https://ixill.booth.pm/