feature image

2024年9月14日 | ブログ記事

ゲームのタイトル画面を作ろう

はじめに

この記事は夏のブログリレー27日目の記事です

進んだはじめに

皆さんこんにちは!24Bのlemonと言います!
大学に入ってイラストやドット絵を描き始めたしがない新入生ですが、どうぞ生暖かい目でご覧ください

更に進んだはじめに

いきなりですが、皆さんは1ヶ月あったらどんなことをするでしょうか?
バイト?
遊び?
大学の復習? そんな訳なかったですね

しかし、世間一般的に1ヶ月でやることと言えば決まっています

そう!ゲーム開発ですよね!

そんなわけで、traPで今年から始まったイベント「1-Monthon」に参加しました
別で参加記を書くかもしれないので、この記事では自分の担当したグラフィックについて色々書いていこうかな~と思っております

簡潔すぎる概要紹介

「1-Monthon」は1ヶ月でゲームを共同制作するイベントです

本題

この記事で取り上げるのはゲームのタイトル画面についてです
dotpict_20240904_235203-1
↑はいこれ

コンセプトとしては水属性のお城と火属性のお城がせめぎ合っているという状況
これを描くときに意識していたことを最初から時系列順に辿っていこうと思います

0.使ったアプリの紹介

使ったアプリは「dotpict」になります
自分は指で描いているのですが、普通はiPadなどでペンを使って描くことが多いようですね(自分調べ)
dotpictの詳しい使い方は飛ぶ人先輩の記事を参考にしていただければと思います

1.構図を考えよう

大前提として、今回はゲームのタイトル画面を作ることを目的としていました
つまり、左上や中央上側にゲームタイトルを入れるスペースが欲しいわけです。今回は作成してる途中に右上が埋まったので、自然と左上を開けることになりました
このことから分かるかもしれませんが、ゲームタイトルを入れるスペースが必要なことは途中で気づいたんですよね(スペース作れて良かった~)

さて、構図を考えるには何をメインにするかが必要不可欠です。今回はお城を2つ描くことを決めていたので、そのうち水のお城をメインにしましょう
メインとなる水のお城を手前に配置することは確定として、そうなれば後ろに火のお城が来ることになります。また、イラストにおいて、同じ高さに何個も要素を入れるのは好ましくありません。そこで、火のお城は火山の上に建てるとおしゃれになって一石二鳥ですね
手前にくる水のお城が正面から見えているのはつまらないので俯瞰視点を採用することにして、構図はある程度決定です。
自分はこんな感じで結構テキトーに構図を決めます(だからタイトルのスペースを忘れることになるんだよ)

2.描こう

描きます。終わり。

3.プラスα

嘘です。ちゃんと内容を書きます。

さて、ドット絵で俯瞰視点を描くことが初めてだったので、まずは正面絵を描いてみることにしました。本当はゲーム画面を作った際に真上から見た構図を描いていたのですが、この記事では割愛(あまり必要性を感じなかったので)
dotpict_20240913_175631
↑実際に描いた正面絵はなくなってしまったので再現

これを俯瞰視点にしたら水のお城は完成。火のお城も小さくしてカラーチェンジして完成です。実際に立方体を俯瞰視点から観察してあげると楽しいです
dotpict_20240913_180143
↑なんか土台の火山も生えていますが、これは気持ち程度に等高線を意識してあげると良いと思います

次に陰を落とすと立体感が増します。灰色ベースで描いて不透明度を下げてあげれば、手間をかけずに陰をつけることができます
dotpict_20240913_180228

少し画面が寂しいですね。空にグラデーションをつけましょう。ちょっとだけ画面の単調さが消えて良いと思います
dotpict_20240913_180257
↑なんか陰が消失してしまいましたが、気にしないでください

3.プラスα

画面の空白をいい感じに埋めて完成
dotpict_20240913_180409

4.完成

チームメンバーのch4tlaくんが作ってくれたロゴも入れて、こんな感じのタイトル画面ができました
----------2024-09-09-19.39.24-1

最後に

1-Monthon楽しかったですね。来年も参加したい感じがあります

それはさておき、夏のブログリレーも3分の2が終了しているようです。このまま最後まで追っていって頂ければと思います
明日の投稿者は@Pugmaさんです!お楽しみに!

偶然にも、過去にぷぐま先輩のファンアート(?)を描いていたのでこちらを載せてお別れとしましょう

lemon icon
この記事を書いた人
lemon

ミルクティー派を許すな(θωθ)

この記事をシェア

このエントリーをはてなブックマークに追加
共有

関連する記事

2023年11月21日
School Breakin' Tag -新感覚おにごっこ-
s9 icon s9
2023年9月3日
タイピング&アクション『TypeTheCode』作りました
wal icon wal
2024年9月17日
1か月でゲームを作った #BlueLINE
Komichi icon Komichi
2023年4月25日
【驚愕】作曲4年目だった男が大学3年間ゲームサウンドに関わった末路...【ゲームサウンドのお仕事について】
tenya icon tenya
2024年8月21日
【最新版 / 入門】JUCEを使ってVSTプラグインを作ろう!!!!【WebView UI】
kashiwade icon kashiwade
2023年3月20日
traPグラフィック班の活動紹介(Ver.2023)
NABE icon NABE
記事一覧 タグ一覧 Google アナリティクスについて 特定商取引法に基づく表記