ドット絵

【千年戦争アイギス】初めて入手したガチャ黒「一角獣騎士クリッサ」のドット絵

今回はDMM GAMESから配信されているタワーディフェンスゲーム『千年戦争アイギス』のドット絵です。

頻繁に描いている感覚だったのですが、前作から半年が経過していました。

時がたつのは早いものです。

『千年戦争アイギス』といえば生放送の告知がされましたね。

新米王子に向けてのおすすめユニットプレゼン大会なんて企画も広報されています。

ユニット性能はもちろん大切ですが、プレイするモチベーションの維持も重要。

私からアドバイスするとしたら、明らかに推されていないユニットさえ避ければ見た目で選んでも全く問題ないということです。

初期戦力が全く強化されない裏目なんてほぼないですし、誰かがおすすめしているユニットなら手持ちが揃った後もスポット起用できる見込みがあります。

さて、こんな話をなぜしたのかといいますと……

描いたキャラクターがプレゼン対象ユニットの中にいるからです。

ぜひ見ていってください。

『千年戦争アイギス』から最高レアリティのワルキューレ「一角獣騎士クリッサ」のドット絵

『一角獣騎士クリッサ』

タイトル:『一角獣騎士クリッサ』

制作時間:35.9時間

「一角獣騎士クリッサ」はワルキューレというクラスに属する最高レアリティブラックのユニットです。

イラストレーターはinoshishiさん。

過去に描いたレーヴと同じ方です。

クリッサは私が初めて入手したガチャ産ブラックユニットでした。

別ユニットと同時入手なので正確には初ガチャ黒の一人、という表現になるでしょうか。

育成の余り結晶でガチャを回したら合計2体のブラックユニットを引けた思い出。

確か、ガチャに天井がない時代でした。

ワルキューレは序盤のコスト稼ぎ用ユニットで、第二覚醒により「レギンレイヴ」もしくは「ゲイレルル」に派生します。

このゲイレルルが2体足止め2体同時攻撃と優秀だったので、我が軍のクリッサにはこちらを選択しました。

瞬間的にステータスを強化するスキルを持っているクリッサは、序盤の敵をバサバサとなぎ倒してくれます。

スキルタイミングを合わせれば強敵を抱えることができるので、昔はボスを任せたりもしました。

現在はワルキューレを使う機会が少なくなったとはいえ、相性がよさそうな大討伐ミッションに出撃することが多いです。

クラス特性を無視したようなユニットが増えている昨今、まっとうに高性能ワルキューレしているクリッサは、質実剛健で好感が持てるユニットです。

ドット絵『一角獣騎士クリッサ』について

『一角獣騎士クリッサ』は2つのオマージュを含んでいます。

1つ目はクリッサのポーズ。

クリッサの画像

ゲイレルル分岐のクリッサながら、レギンレイヴのポーズで描きました。

レギンレイヴクリッサがゲイレルルクリッサよりかわいいと、最近になって気が付いたからです。(※主観です)

我が軍のクリッサはゲイレルル分岐ゆえに描くべきはゲイレルル。

同ユニ育成禁止の方針をとっているのでレギンレイヴを育てる選択肢もなし。

ならば……!

ということでレギンレイヴのエッセンスを加えたゲイレルル絵になりました。

武器を一本しか描いていませんがレギンレイヴに合わせたからであり、本来は二槍持ちです。

ご注意を。

2つ目のオマージュは背景。

ゲーム中のキャラクター確認画面を意識しました。

背景の画像

元背景には樽や武器が置かれているので、きっと兵舎内の風景なのでしょう。

中央の空間を真っ黒にしたかったので左右の壁と照明だけを描いています。

暗くしたので見えづらくてすみません。

クリッサのスカートのだまし

スカート部分の矛盾を示した画像

「スカート周りの重力どうなっとるんじゃい!」と怒られそうです。

構想段階では腰から下の布を全て垂らそうとしていました。

しかし、クリッサのズボンはチャイナドレスのように前後の布が分割された構造。

このポーズだと下着が見えてしまいます。

対策として後ろ側の布だけお尻に沿うように描いた結果、こうなりました。

絵特有のだましだと思っていただければ幸いです。

R版の寝室でパンツを確認できるので描こうと思えば余裕で描けます

こだわりポイント

衣装に花びらが透けて見えるアニメーション

衣装の黒い部分を背景色と同化させ、後ろ側を通過する花びらが見えるようにしています。

背景を黒色で塗りつぶした理由がこれで、本作における一番の「やってみたかったこと」になっています。

元イラストには黒部分にも赤いラインなどの模様を確認できますが、ドット絵では省くことになりました。

明かりアニメーションの作画方法をいまだつかめず

炎などの光源が存在すると周りがぼやっと明るくなります。

その手のアニメーションをこれまでも作ってきてはいるのですが、正攻法がいまだに分かりません。

以前も「こんな方法でいいんだろうか」なんて考えながら描いていた覚えがあります。

最近は加工ソフト?できれいなエフェクトを付けたドット絵も流行っているので、わざわざ手作業で表現しなくていいのでは感も。

そんな調子で作業していたものですから工程をすっかり忘れ、再び試行錯誤する羽目になりました。

同じ轍を踏まないように現状を記事に残したいと思います。

作画手順の概要

『一角獣騎士クリッサ』背景のたいまつを例に作画手順を説明します。

大まかには以下の通り。

  1. 背景を描く。
  2. 炎を描く。
  3. 照らす範囲をベタ塗りする。
  4. ベタ塗りを背景画像に重ねる。
  5. ベタ塗り部分を透過色に置き換える。
  6. 背景画像を重ねる。

背景を描く

最初に背景を描きます。

今回の場合はたいまつを設置する壁面が背景画像。

背景画像(壁面のみ)

暗くて申し訳ないですが、左右に壁を配置しています。

次に決めるのが明かりの階調。

たいまつの明かりの階調を示した画像

上画像のように2段階での明るさ表現を目指します。

そのために、壁色を変更した画像を2枚追加。

右へいくほど壁の色が明るくなっていきます。

3段階の明るさの壁面画像

言い換えるなら左端は明かりで照らされていない壁、真ん中は照らされている壁、右端は最も強く照らされている壁です。

アニメーションさせれば雰囲気をなんとなくつかんでいただけると思います。

壁面画像をアニメーションさせた画像

これだけだと壁面全体を照らしている状態。

たいまつの光が届く範囲に限定して色を変化させてやれば、特定範囲だけが明るく照らされる表現になるはずです。

炎を描く

壁面に設置するたいまつの炎を描きます。

光源に合わせて照らす範囲が移動するので、炎の動きを先に確定させておきましょう。

たいまつの炎のアニメーション
たいまつの炎アニメーションのコマ画像

照らす範囲をベタ塗りする

たいまつの下に別レイヤを作成し、炎に照らされる範囲を1色で塗り潰していきます。

下画像の赤色が追加個所です。

炎の周りをベタ塗りしたコマ画像

今回は2段階で色を変化させると決めているので、層になるように別の色でも塗り潰しました。

画像の青色部分が2層目になります。

階調を増やした画像

それぞれ別レイヤ上でベタ塗りして下さい

次工程に影響します。

動かしたものがこちら。

ベタ塗り状態でのアニメーション

ベタ塗りをレイヤごとに取り出して下のような2枚の画像を得られました。

ベタ塗り部分だけを取り出した画像1
ベタ塗り部分だけを取り出した画像2

ベタ塗りを背景画像に重ねる

ベタ塗りを背景に重ねます。

背景は暗い画像から順番に選択ベタ塗りはベタ塗り面積が大きい画像から順番に選択し、組み合わせていきます。

もっとも暗い背景とベタ(大)の組み合わせ画像
中間の暗さの背景とベタ(小)の組み合わせ画像

最も暗い背景と大きいベタ塗り(赤)の組み合わせ、次に暗い背景と小さいベタ塗り(青)の組み合わせになりました。

最も明るい背景が余るので、この画像は処理なしということになります。

最も明るい背景は加工なし

ベタ塗り部分を透過色に置き換える

前手順で完成した画像のベタ塗り部分を透過色に置き換えます。

そうすると明かりの形の穴が開いた画像が完成します。

ベタ塗り部分を透過色に置き換えた画像1
ベタ塗り部分を透過色に置き換えた画像2

背景画像を重ねる

暗い画像ほど上層になるように、作成画像を重ねていきます。

画像を重ねる説明画像

穴から下層の画像が露出し、部分的に照らされたかのように明るくなります。

画像を重ねた後の画像

穴のサイズ差で縁部分が層になっているのが分かるでしょうか。

明かり部分の拡大画像

動かしたものがこちら。

重ねた画像のアニメーション

たいまつを重ねれば周りが照らされているアニメーションの完成です。

たいまつの炎を重ねたアニメーション

照らしがないバージョンと比べてみましょう。

照らしがないアニメーション

炎がくっきりしていてこちらもいいですね。

レトロさが増した印象を受けます。

作品の雰囲気によってはこちらを採用すべきかもしれません。

思い通りの作品が完成したものの過程がイマイチで恥ずかしい……という状況によく陥っている気がします。

ブログに記録しているからこその悩みでしょうか。

手法のブラッシュアップを目指していきたいですね。

それでは最後に等倍のドット絵を置いてさよならです。

次の記事でお会いしましょう。

『一角獣騎士クリッサ』等倍

COMMENT

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA