2008/10/3 金曜日

ゲームを作ってみよう 〜その8〜

第8回『グラフィックデザインを考えるのです』

0sae アイコンこんばんちわ。はじめまして。「めくり番長」でキャラデザインやらしてもらった、ぽっと出新人0saeです。”おさえ”にあらず。”まさえ”ですよろしくたのんますです。
今回は「ゲーム?作ったことないよ?」てなレベルの私でもゲーム作れるぜ ってな素敵ゲーム「バウンスショット」のグラフィックを企画書を元に画面を仕上げたり、ステージを作ったりするっのを解説しようって言う、そんな話です。

正直右も左もわかんない状態でやってるので私のやり方が正解なのかどうか不安なんですが・・・。
きっとこの記事を読んでくださってる方々からすれば一番近しいLvのスタッフなので、きっとなんか役にはたつと・・・いいなあ。

というわけで本題。

バウンスショットの企画書に沿って、ゲームの元Flaデータをいじり倒すわけですが、 それにしても、方針を決めないとデザインもまとまりませんね。

そこで仮データのゲームをプレイしてみたり、他の似た感じのゲーム(ギャ●ガとかギャ●クシアンとか・・・)画面を眺めてみたり。
ここらへんはもう趣味だったり思い付きだったりするので野性の勘に任せてやっております。

 で。考えた挙句企画書内の丸い形の敵っぽくないというか敵意が微塵も感じられないあのぷよぷよテイストが忘れられず、そのまま仕上げることに。
結果かわいい感じのデザインにしようかなと言う事になったわけですが、ここでNIGORO全体のゲームを見てみると、あんまりNIGOROっぽくない・・・?とかいう話も無くもないのであまりにも可愛すぎずデザインするようバランスを保つように注意。

で、まず何から始めたかというと、Photo Shopでのスタート画面作り。
この画面作りの作業は、実際Fla内で使う素材作りと、イメージボード的な役割で使用します。
もちろんAdobe Illustratorを使用してもOKなんですが、意外とベジェを使うよりビットマップを使ったほうが
SWFが軽くなるって話でしたので、PhotoShopで作成することに。

しかしゲームイメージを練るなら本来ゲーム内の画面から作るのが妥当だとは思うんですが、今回のゲームでは中身のグラフィックをいじれる箇所が

・背景
・自機
・敵
・爆発
・連鎖爆発
・自弾
・敵弾
・残機
・表示フォント

と、数が少なかったため、次にイメージを固定させやすそうというか、グラフィック凝らなきゃなーと思ったスタート画面から始めました。

POPでコミカルで宇宙っぽくて跳ね返る的な・・・ってな感じでできたのがこんなん。


0sae バウンス説明内 スタート画面

なんとなくそれっぽくねっすか。
んでもって背景の星はFla内で斜め上に向かってゆっくりスライドするアニメーションに。

0sae バウンス説明内 自機グラフィック自機はカーソルが動く方向に傾きつつ移動すると言う動きをするので、ある程度横幅があるほうが傾いた感が出て操作感が良さ気だったので、多少横広なデザインに。お尻のジェット噴射的なものは2フレームのアニメーションでちらつかせてなんかそれっぽくアニメーションさせます。
本当はビットマップで作る予定だったのですが、傾き処理の際にドットがぼけたりするのを防ぐため、泣く泣くベジェでオブジェクトを作成しております。

0sae バウンス説明内 敵グラフィック敵は敵であって敵でないというかもう可愛い路線で強くなさそうな間抜けな感じのデザインへ。
・・・あんまり変わってねえですな。
でも可愛さが増して、間抜けな感じになってませんでしょうか。しかもこいつらプルプル動くんです。そりゃもうゼリーの如くですよ。
硬さの欠片もないという、敵らしからぬところを押し出してみました。

で、全体画面がこんな感じ。

0sae バウンス説明内 ゲーム画面

残機グラフィック、ステージの横幅、ピンク敵の当たり判定などの指定は、外部ファイルから設定するようになってたりするのでざっと材料作った後に微調整する必要がありますが、大体はグラフィック入れ替えるだけでワシの出来ることは8割がた済んでる感じですかね。

と、こんな感じでデザインを作ってくと言うお話でした。

外部ファイルに関しましては下記を参照ください。
第6回『外部ファイルを読み込ませてみよう

関連ページ

  1. 第1回『ゲーム製作の流れ、一から見せます』
  2. 第2回『企画内容を吟味しよう』
  3. 第3回『仕様を詰めておこう』
  4. 第4回『では、仕様書をまとめましょうか』
  5. 第5回『ゲーム制作のためのツールを作る。・・・・いやじゃ!』
  6. 第6回『外部ファイルを読み込ませてみよう』
  7. 第7回『動く物を作ろう』

ここまで出てきた資料




2008/1/28 月曜日

問題はアイディアで意外に解決する

どうも俺ちゃんです。samieru

いやーなんでしょうね、Flashですよ。今までも仕事でちょろっとActionScriptの修正とか追加はしていたんすがタイム ラインって奴をほとんど触ってなくてですね、Death Villageが初Flashなんすよねーこれが。
こんな奴が偉そうにFlashの技術ブログなんて書いていいのか?と言うか開発環境が高いし、裾野を増やすならJavaで書くべきじゃないのか?とか思ったりもするんですが、指令なのでがんばります。
さてFlash。めっちゃ泣かされました。なんやこれ!?って感じですよ。
タイムライン邪魔っすよ。だからタイムラインをほとんど使わずにクラス作ってそこで処理を行ってるんですが、それだけじゃなくてこのActionScript2.0ってのがもう、なんだ、「アホかー!」って感じの言語仕様で何回ドタマに来たか。
実は今、NIGOROの技術チーム側はAdobe Creative Suite 3 (CS3)での開発をちょろちょろやってまして、経堂では師匠が今ActionScript2.0でやる方法をやってるんで俺ちゃんは ActionScript3.0の方からのアプローチをメインで行きたいと思ってます。

でも、せっかく技術話なんで俺ちゃんのActionScript2.0の歴史であるDeath Villageで使ってるちょいテク話でもしようかなーなんてね。
だって誰も突っ込んでくれなくて寂しいんだもの。

これ、結構やってそうでやってないギミックが多いと思うんですよ。
Flashでこんなゲーム作る奴がそもそもおかしいとか言われそうですが。
とにもかくにもこれは初めてのFlashやったこともあって最初はまともに動かなくて一体どうすりゃいいんだと悩んだんですが、なんとかなったんすわ。とりあえず、「問題はアイディアで意外に解決する」って言う小話を。

(続きを読む…)





Copyright (C) Nigoro Allright Reserved. Powered by ASTERIZM