Art

1weekのグラフィック制作過程まとめ追記

他に書きとめたいこと、まとめて。

まずプレイヤーだけSpineを使いました。理由は、一度にアニメーション作れてUnityへ持ってこれるからです。時間短縮。

詳しくはSpineのタグで探すと、何か記事が出てきます

一番最初のゲームアイデアスケッチ。地球の中を通り抜けるイメージでした。最初はブラジルに彼女に会いに行く設定でしたよ。

最初に描いたもの

1weekを終えて思う事

ササカワさんの音楽からアイデアをもらって絵を描くことがありました!こういうのは創作の高まり合いなのでしょう。また、アニメーションに合ったタイミングで、音を付けると、グッと質があがるものだなぁと思いました。いつも適当に音つけちゃうんで^^;

タニスさんの、分からないことに対して向かっていく姿に勉強させられました。1weekの一人参加でつまづく場面があると、いつも代案にうつる私ですが、、そのような粘りが’必要だなーと思わずにはいられません。

今回も貴重な体験をさせて頂きました。この場ですが、ありがとうございました!楽しかったです!

Art

1weekのグラフィック制作過程まとめ5

タイトル・アイコンなど終盤編

さて、タイトルシーンやパネルの仕上げと調整まで来ました。最終日としては、ばっちりなスケジュール。

まずは出来あっがったタイトル画面です。気を付けたのは、パッと見て、分かりやすいもの。穴、キャラクター、看板で、どんなゲームが少し予想できたらいいなと思いました。完ぺきではないですが、1weekという時間の中での制作なので、自分にOKです!

unityroomで公開しました

アイコンは2つ候補があったのですが、下で決まり。

やはりキノコ推し

では、惜しくも?採用にならなかったアイコン。

おとなしいですか?

2番目でも好きなのですが、インパクトのある方にしました。ポーズも上のほうが動きがあって良かったと思います。ゲームのスクショとキャラクターイラストを合わせて作りました。

説明パネル

いつもの説明パネル。シンプルです。あまり説明パネルは時間かけて見られないと思うので、これでいいかと思いました。

これで完成となりました!!

ゲームはここで遊べますよ

https://unityroom.com/games/ss1week_fole

Art

1weekのグラフィック制作過程まとめ4

タイムラインカットシーン編

次はタイムラインで「カットシーン」を2つ作りました。この辺りが、メンタルきつかったです。アニメーションは時間がかかる作業なので。

まずはタイトルシーンでスタートボタン後に流すもの。夜にイラスト描いて、次の日で仕上げました。もう一つはエンディングのシーン。こちらも翌日、夜にイラスト描いて、次の日に仕上げました。

タイムラインでカットシーン作るのに、準備するもの、これが結構色々とあります。背景、オブジェクト、キャラクターを、もちろん必要なだけ用意。ボーンアニメーションをしていく時間はないと思ったので、イラスト画像を切り替えていく作戦に。本当はもっと凝りたい気持ちもありましたが、ゲーム自体のグラフィックも終えてなかったので、今回は妥協案。

用意した画像の一部

準備した画像、10枚くらい。
デートに遅刻しちゃうよーの絵。
急いで髪を整えるの絵。
そして歯を磨くの絵。
画像暗めに見えてます?が、これがタイトルシーン。
エンディング

是非これもゲームで見てください!

Unity room で公開中 Fole

https://unityroom.com/games/ss1week_fole

この泥くさい裏側。

私が、割とタイムラインを好きなのは、視覚的である!と思っていました。上の画像を見て思ったのは「ほぼ表示、非表示!」なのです。私が大好きなコード(笑) SetActive をしていたのです!なんとなく納得した自分でした。

Art

1weekのグラフィック制作過程まとめ3

パーティクル編

以前お伝えしたパーティクルの似たようなものを使って、キノコエリアを作っていきました。

こちらがイメージ

まずはキノコ画像を用意して、周りに配置。

はじめはこんな感じです

それからパーティクルで実験。そこは記録はしてません^^;

これ以降修正はありますが、このようなキノコランドになりました

気を付けたのは、色、半透明になるところです。一つパーティクル作って、それを壁に3つ付けました。一つは大きさを少し変えました。

この後、キャラクターダメージ、植物から出る泡、燃えるキノコ、なども作りました。是非、ゲームで発見してください!

Art

1weekのグラフィック制作過程まとめ2

キャラクター開発・背景編

制作過程の続きです。まずはキャラクター。今回は敵は攻撃せず、当たるだけ。あまり攻撃的でないキャラクターを描きました。

鳥とか地底人とか
ぞうさんとか、とげとげ

絵を描くとき、unityで色を変えられるようにモノトーンで作っています。というより、先にイラストを描いて、モノトーンに変えてエクスポートします。これは私のやり方ですが。

こんな感じです。

次は背景。

背景は直接描くときもありますが、上のようにモノトーンで作るときもあります。どっちでもいいよね!ということです。

ゲーム全体のデザイン中。

地球の中を通って、そとに出てくるところ。上はステージ2です。

今回はステージが2つあります。

ステージ1にもゴールである、ガールフレンドがいます。彼女に会えそうになったのですが、うまくいかずにステージ2へ、というシナリオです。

こちら同じ場面のステージ1

ステージ1の地上に出るところ。出るとこを、朝霧のような感じになりました。狙ったわけではないですが、行き当たりばったりの表現です。

直感で作ろうとするのは、そこで生まれる偶然の発見が好きだからです。と言いつつ、細かく計画して描くのが好きではないのです、本当は。

それでは続きは3へ。

Art

1weekのグラフィック制作過程まとめ1

スケッチ・作業前半編

今回のチームは、アイデア×クリエイティブといった感じで、好きなように作らさせて頂きました。音楽担当のササカワさんからは、音からのインスピレーションをもらい、頼りになるコード担当のタニスさんには、色々と要望に応えてもらい、、そのおかげで、私も実験もできました。

まずは最初のスケッチなど。

地球をくぐりぬけ、彼女に会いに行くゲーム!
人間にしようかどうしようか、迷いました。

ゲームデザインを進めていきます。

キャラクターは草!光を持っているので、地底でも明るいよ!という設定。光を風船のように持って、フワフワと飛びます。

また地底なので、地上からの光などを少し意識。

光が入っていく感じを表現。

パーティクルの実験

パーティクル好きなのですが、今回ゲームの「キノコエリア」で色々と試しました。ゲームのシナリオだと、キノコに囲まれ、これ以降ステージがカオスっぽくなるというこでした。それも踏まえてのテストの一コマが、下。

キノコいいねー

これをキノコエリアに!

そしてキャラクターデザイン、背景などの作業は続く。2へ。

Unity

1week game jamに参加中:回想

今月も1週間でゲームを作るイベントに参加しています。去年の12月から、割と頻繁に参加しています。一人の時もあるし共同参加の時もあります。まず一人と共同参加の良いところ、良くないところ!

一人参加の良いところ:コードやフォルダの中身が汚くても気にしなくていい。Gitでコンフリクトなどの心配をしなくていい。

一人参加の良くないところ:面倒なことは避けて、簡単な道を歩みやすい。孤独。

共同参加の良いところ:自分のいつもの考えを、変えてくれる刺激がもらえる。孤独感がない。

共同参加の良くないところ:気が抜けないぜー。(いい意味だと高まり合う)

メインのゲームをリリースするのは近々のゴールです。でもそれだけだと、つまらない?せっかくゲーム作って勉強しているのだからと参加しています。

メンタル弱いのでドキドキして、月曜ごろ「どうして参加したんだろう」と思います。でも出来上がたった時には、何かしら成長している気がします。調べた技術だったり、メンタルだったり、新しい考え方だったり。それに、自分の作品として残せるのは、ダメダメ作品でも嬉しいものです!後からみて、その成長を楽しめたらいいなと思います。

先月は一人参加。今回は3人チームです!2人よりチーム感があって、私は好きかも。コード、イラスト、音楽とだいたいのパートに分かれてやっていますが、アイデア出しとか一緒にして、発想が膨らんでいくのが面白いところです。

こうやってゲームを通して人と出会って、創作を一緒にできるなんて、めちゃくちゃ楽しいと思っています。

こんな感じのゲームです
タイトルシーン。完成してませんが。

今回は?いや、今回もグラフィック担当しています。コードをいじらないので、めっちゃ自由を感じながら、制作しております。残り数日がんばっていきます!

Unity

Ipad・タブレットの画面サイズに対応させる

再審査に向けた準備していくうちに、忘れていたことが多いことに気づきます。リジェクトされて良かったとさえ思います。気になっていたけど、見過ごそうと思っていた件の第2弾。Ipadの画面サイズに対応することに挑戦!

Unity アセットで、Universal device previewというものがあります。セール期間に購入してありました。

Universal Device Preview | Utilities Tools | Unity Asset Store

これでIpadなども設定できるので(なぜ今までしなかったのか^^;)、怖いものみたさでやってみました。すると、ずれてる!アイテムボックスが下に。オブジェクトも消えてる??

がっくりでした

ここから調べることに。

カメラにスクリプトを張ったり、キャンバスの下にパネルつけたり、それにスクリプトつけたり。レターボックスなるアセットがあるのか!と発見したり。

私の設定が良くないのか、このゲームには合わないのか、、解決しませんでした。

記事を読んだり、動画見たりしていき、、、

ふと読んだ「キャンバスをエクスパンド」して、という言葉。試しに設定し直してみました。

Screen Match Modeに注目!
Screen Match Mode をExpand に。

これを、変えました。すると、、

お、お!!

なんと丁度よく入りました!

ただ余白が気になったので、、、これを作り直すことにしました。

まわり(レターボックス)は、もうちょい改良したい!

こんな方向性で行こうと思います!ちびちび1パネルごと直していこうと思います。

時間かかりそうなので、1weekジャムと一緒に進めていこうかな!

Free Images

フリー素材4

ゲームになど使っていただいて構いません。加工しても構いません。

禁止事項:

素材自体を転売や再配布する行為(加工やトレースした場合も同様)

公序良俗に反する利用、反社会的勢力や違法行為に関わる利用

イラスト素材で製作した物品を売ること

1weekで使ったものなど、色々とあります。サイズ、クオリティーが安定してませんが、すみません。好きなものがあったら、お使いください。

Google Play

アダプティブ アイコン:実機でアイコンが小さくなる件

ずっと気にはなっていたけど(じゃあ直せ!)、見過ごそうと思っていた件がありました。それはアンドロイド実機テストすると、アイコンが小さくなることです。

真ん中上。

他のアイコンに比べて、小さい。どうしてか、よく分からなかったので調べました。どうやら、この設定が必要だと気づきました。それは、

アダプティブ アイコン  |  Android デベロッパー  |  Android Developers (google.cn)

というわけで、手直しをしました。

unityの設定はここ。

デフォルトアイコンはそのままでいいと思います。

その下にあるアイコン設定。ここにアダプティブアイコン欄があります。大事なことは、二つのレイヤーで用意すること。なるべく中央にイメージが来るようにすること。

私が用意したイメージ2種です。

これで、バッチリ?だといいのですが、テストしないと分かりません。

ちなみに設定後はこんな感じに。

セレクトを押してイメージを選びます。そのままか。
左側のアイコンです。(ぼやけて、すいません)

どうでしょうか?結構イメージは真ん中に寄せました。どのくらいかというと、、

真ん中に集結

このくらいです。これでちょうど良かったです。

サイズについて:

108 x 108 dp でサイズを設定と、先ほどのサイトに書いてあったのですが、じゃあピクセルでは?と調べると、、

ボブさんの回答を見てみました。(どこかのサイト。覚えてません)

そう、432 ピクセルになるとのこと、です。

追記:

サイズは512でも他のサイズでも大丈夫とのことです^^;

【Unity】アイコン画像のフォーマット警告:Compressed texture XXX is used as icon. This might compromise visual quality of~ を消す – ヽ|∵|ゝ(Fantom) の 開発blog? (fc2.com)