こんにちは、FUKUOKAゲームインターンシップに参加している原です。
前回はゲームの主なシステムとキャラクター制作についてお書きしましたが、今回はそのキャラクターにモーションをつける作業を行ったので紹介していきたいと思います。

前回3ds Maxという3DCGソフトで作ったキャラクターに骨を入れていきます。
全身に骨を入れると左のようになります。ゲーム中では右のように表示されます。


この時に個人的に注意したのは骨の数です。いくらローポリゴンで頭身の低いキャラクターであっても、リアルな歩行モーションをつけるために必要な骨の数は頭身の高いキャラクターとあまりかわらないように制作しました。


たとえば足の甲の部分は骨を２つ、間接を3ついれました。一見多いように見えますが、リアルな歩行モーションをつけるために足の甲の部分の動きは重要だと感じたので頭身の高いキャラクターと同様の骨をいれました。
次に攻撃モーションを制作しました。3ds Maxでモーションをつける作業に不慣れということもあり、大苦戦しましたが、なんとか通常攻撃のモーションは作れましたが、実際ゲームに入れてみると、出が遅かったり敵に当たったタイミングが分からないなど、様々な問題が見えてきました。

そこで指導担当の方に相談したところ、モーションに緩急がないとのご指摘をいただきました、実際にモーションを見てみると、スルスルとどこで力をいれているのかがわからないモーションでしたので、次回はキャラクターの力の緩急を考えたモーションとともに、攻撃の時に表示されるエフェクトもモーションに合うものを制作していきたいと思います。

そしてモーションと並行して、今回敵の動くアニメーションの制作も行いました。ゲーム中ではたくさんの敵を表示させるということでゲームの処理が3Dでは重くなってしまうのではないかということを考慮して敵は2Dアニメーションで制作することになりました。以前、依田さんがデザインした恐竜のような形のキャラクターに、実際の恐竜の歩行の時の関節の動きなどを参考にしつつ、歩行と転倒のアニメーションをphotoshopという2Dソフトで制作しました。


上が歩行、下が転倒モーションになります。
このモーションを作るにあたって、事前に話し合いを行い、画像解像度やピクセル数と言った細かな情報までプログラマーと話し合いを行った上で制作を行ったのですんなりとゲームに適用させることができました。

今回インターンシップに参加して強く実感したのはプログラムやデザインなど違う分野同士でもお互いコミュニケーションをとりあい情報を交換しておくと、実際にゲームにデータを入れた時などイメージどおりのものができるということです。これはインターンシップ先の様々な分野の担当の方が皆さん同様のアドバイスをいただいたことで、自分がこれをどのような風に表現したいかなどを事前にデザイナーはプログラマーの方にお話ししておくと、プログラマーもその表現にあった対応を準備することができるので、ここにゲームという作品をつくる上でのコミュニケーション能力の重要性があるのだと強く感じました。

あと一週間ほどでインターンシップは終了してしまいますが、今回アドバイスをいただいた所など、確実に力をつけてインターンが終了しても、これからの制作などに生かしていこうと思います。

---

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　原由布氏（１）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　原由布氏（２）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　原由布氏（最終）

＜サイバーコネクトツーのウェブサイトはこちら＞

こんにちは！
アーティスト志望の依田です。

今週も前回に引き続き素材作りの話をしていきたいと思います。

前回で背景は作り終えましたので、敵モーションと、
ユーザーインターフェースの作成をします。

敵モーションとは、敵が歩いてきたり、ジャンプしたりする動きを作る工程のことです。
今回、敵は2Dで表現することになったので、
Photoshopでパラパラマンガのようなものをつくります。

ユーザーインターフェース(UI)とは、体力ゲージや、リザルト画面などの素材のことです。

どちらも見え方によって面白さが違ってくるので、重要な部分ですね。
その分、とても気合いが入ります！

下の画像は、スライム状の敵のモーションです。

1.敵の通常の動き(実際は常にぴょんぴょん跳ねています)


2.敵をやっつけた時の動き



この敵は前方から跳ねながら来るので、水滴がはずむような動きを意識して作りました。
敵をやっつけた時の動きは、すうっと地面に消えていくようなモーションで、
どちらかというと半固形状のスライムというより、液体に近い質感に仕上がりました。
個性を出したかったので、これはこれでよかったかなと思います。

次にUIを作っていきます。
前回、ゲーム画面の中で背景のUIはお見せしたので、
今回はチュートリアル画面を紹介したいと思います。


このゲームは、会話形式のチュートリアルを想定しています。
舞台が宇宙なので、近未来風の会話画面をつくりました。
また、このゲームはコミカルな世界観を想定しているので、
あまりリアルになりすぎないよう、シンプルに仕上げました。

今回はこうしたこまごまとした仕事も、全部UIに含まれます。
こだわればこだわるほど、ゲームのクオリティが上がっていくわけです。
ゲーム画面の中で目立ち過ぎず、人に伝わりやすいデザインとは何か、
いままでの自分は多くの人の目に触れるということをそこまで徹底して
取り入れてきたわけではなかったので、今回それがとても勉強になりました。
ただ凝ればいいというわけでもないし、シンプルすぎるとアマチュアっぽくなってしまう。
どこまで手をいれればプロの仕事になるのか、その塩梅がUIのとても難しいところです。

そうしていろんな苦悩を経て出来上がった素材達ですが、
実際にゲーム上で動いているところを見ると、そんな気苦労は吹っ飛んでしまいます。

一応動いているからそれでいいやと思ってしまうのではなく、さらに改善点を探し、
より見やすくカッコイイ素材を作ろうとする原動力になります！

もちろん表示物の動きの制御などはプログラマさんとの密な話し合いが必要になります。
動きひとつ作るだけでも、共同作業をこなさなければ、
思い通りには完成しません。
ゲーム作りにはコミュニケーション能力が絶対必要とよく言われますが、
このようなところでその能力が活きてくるのだと実感ました。

細かな素材作りはまだまだ続きます！
今週はこのあたりで。

---

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　依田美菜子氏（１）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　依田美菜子氏（２）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　依田美菜子氏（最終）

＜サイバーコネクトツーのウェブサイトはこちら＞

こんにちは、FUKUOKAゲームインターンシップにアーティストとして参加させていただいてる原です。今週は、ゲーム制作も終盤に差し掛かってきたので、今まで制作したテクスチャ（3DCGに色、模様をつけるための画像）などのゲームに使う素材のブラッシュアップを行いました。ブラッシュアップとは、プログラマーがゲームが正しく動くか確認するためにアーティストが作成し渡した仮のテスト用素材を本番のデータに作り直すことです。


これは仮にベースの色だけを塗ったテクスチャ（左）から、本番の金属光沢などを描きこんだテクスチャ（中央）に差し替えたものです。ブラッシュアップ後のテクスチャデータは右になります。テクスチャについてご指導いただいた際は、よりテクスチャを細かく描きこむためにテクスチャのパーツとパーツの間隔をなるべく狭くとらなければならないのですが、まだまだ空いている無駄なスペースが多いとのご指摘をうけたので、改善すべくパーツの形状や大きさを意識しながら配置しました。しかし、いまだにプロの方がおこなうようなテクスチャの配置に比べると、まだまだだと強く感じたので、ここはこれからの自分の大きな課題のひとつであり、努力していこうと思います。

それに加えて、キャラクターの攻撃エフェクトを作成しました。キャラクター自体が手が短く頭が大きいこともあり、派手なアクションがあまり目立たないのでインターンシップ開始当初にエフェクトで魅せていくということを意識して作っていくようにとのアドバイスをいただいたので、エフェクトの作成にも取り掛かりました。


今回はプログラマーさんと相談し、エフェクトに当たり判定とよばれる攻撃のあたる範囲を設定することになったので、主に攻撃範囲の確認のためのテストデータを用意しました。実際にテストプレイを行い、指導担当の方に意見を頂いたところ、攻撃範囲が敵の足元にしかあたっていないことに加えて、攻撃を振り下ろすときのエフェクトが直線的なのも攻撃範囲が狭く地味に見えていたので改善すべき点であること指摘をうけました。

こういったエフェクトなどプログラマーとアーティストが連携しないとうまく表現できないものを早く、かつ正確に表現するためには以下の流れがあるのだと思います。

① プログラマーとアーティストが画像のサイズや解像度といった細かな情報を共有する。
② アーティストが仮のテストデータを作成する。
③ プログラマーがテストデータを使って、プログラムを組む。
④ ③を行っている間にも本番データ（以下フィックス）を作成しつつ、テストデータで分かった改善点を生かしながらフィックスを完成させる。
⑤ アーティストのフィックスをプログラマーが反映させる。

この一連の流れがプログラマーとアーティストの作業で一番いい方法だとインターンに参加して初めて気がつくことができました。前回もゲーム制作にはコミュニケーション能力が必要だと書きましたが、こういったテストデータの段階で自分がどのようにそれを表現していきたいのかをしっかりと発言できないといくら上記の段階を踏んだとしてもいいものは出来上がらないのだと思います。

そういった点でこのインターンシップではいろんなプロの方々とお話しましたが、みなさんしっかりと自分の意見を持ち、それを外に発信していける人たちでした。そう思うと私は、自分の意見を持ちつつも、他人に発信していくことが苦手なように感じるので、このインターンシップでは技術的な点以外にも自分の弱いところがわかった気がします。
これらのインターンシップの経験を無駄にしないためにも残された数日を有意義に過ごしていこうと思います。

---

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　原由布氏（１）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　原由布氏（３）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　原由布氏（最終）

＜サイバーコネクトツーのウェブサイトはこちら＞

こんにちは。
サイバーコネクトツーにてプログラマーとして参加している馬野泰成です。私のブログは今回で３回目、そしてこれが最後ですね。インターンに参加してのまとめを書いてみます。

複数人での開発経験を得たい！とのことで参加したインターンだけれど、感想は

「とにかく大変」の一言。

プログラマーとして大変だったところは、アーティストからの「ここをこのようにしたいのですが、できますか？」という仕様に関する部分です。
それはゲームがより良くなる意見なので「はい！！」と元気よく答えたい...が、ゲームのシステム部分を作ってしまっていると、いきなりの追加仕様に対応できず。（本当は仕様変更に強いプログラムを書くのが良いけれど、そこは私の経験が不足ということで...）


例えば、上の画像での話です。システムの仕様としては「攻撃モーション」と「攻撃エフェクト」の描画の終了時間は同じとしていました。私が勝手に決めただけで皆に伝えなかったのです。 アーティストからは描画の終了時間をずらしてほしいと私に言いましたが、変えることができませんでした。

ここでは、以下の２点の事を反省しました。
・勝手に仕様を決めた
・プログラムの仕様変更への弱さ

次はアーティストとプログラマーとの仕事の境界について少し話します。
まずはこの画像を見てください。


今回のアクションゲームのゴール部分です。
このキラキラエフェクトはアーティストとプログラマー、どっちが演出を作ったでしょうか？

答えはプログラマー、私です。

【画像2】には大小さまざまなキラキラがあります、そして大きいキラキラは上に向かって登って行き小さくなっていきます。これは以下の６枚の異なる色の物だけでできています。


【画像2】のようなキラキラアニメーションをアーティストが描くのと【画像3】のような１枚絵をプログラマーが動かすのでは各職の作業量、そしてプログラム内部でのメモリの使用量などが全く変わります。

今回、このアニメーションをプログラム側で制御することになったのは私がアーティストに「これはプログラムでできますよ」と言ったからです。このように、プログラマーはアーティストやゲームデザイナーに、プログラマーができる仕事というのを伝える必要があるようです。（プロの方も仰ってました）

さて、長くなりましたが、まとめです。
実際のプロの現場では数十人～数百人規模で開発が行われます。そのような中で他の方との立ち回りをどうやって上手くやっていくか、ということの入口を今回のインターンシップで見つけることができました。今後は一人制作する場合でもこのことを常に頭に入れていきたいです。

私と同じようにゲーム作りを独学で学んでいる方も、ゲーム業界を目指しているのであれば是非心がけてみてください！また、インターンシップにも参加してみてはいかかでしょうか？きっとあなたにとって良い経験となると思います。

---

＞＞　【2011夏】サイバーコネクトツー／プログラマーコース 馬野泰成氏（１）

＞＞　【2011夏】サイバーコネクトツー／プログラマーコース 馬野泰成氏（２）

こんにちは。プログラマー志望の川端です。

ただ今の進捗報告を行います。
他のプログラマーの方が作った土台となるプログラムを大まかに理解し、テクスチャ表示までできました。
今は、テクスチャの切り替えによるアニメーションに挑戦しています。
画像を一枚一枚切り替えて表示する事で、アニメーションさせるという手法です。
パラパラ漫画のようなものを想像していただけるとわかりやすいかと思います。

テクスチャ一枚の表示は完成しているのでそれを応用させるだけですが、「応用させるだけ」と一言で言ってしまうのは簡単です。
あまり経験がないので、かなり苦労しました。

画像を一枚一枚読み込んでいては遅いので、下の図のような一枚に複数の絵が描かれた画像を使います。


これはテスト用の画像なので、ゲーム本体には使用しません。
表示させる位置をずらして何枚もコマ送りにしているかのように見せます。

画像を読み込んだ時に横幅・縦幅を取得して、横幅をフレームの数だけ割って、それをUV座標に適応させて...など、細かい処理を挙げれば切りがありませんが、とにかくパラパラ、漫画させなければ始まりません。


補足ですが、UV座標というのは簡単に説明すると「画像上のどの範囲をテクスチャとして使用するか」の座標です。
上の画像では画像上の黒い枠の部分を使うので、枠の四隅をUV座標として読み込みます。これをどんどん横にずらしていく事でアニメーションさせています。

画像では伝わらないですが、何とかパラパラ漫画させる事に成功しました。
ピンク色の玉が縮んだり伸びたり動きます。

これから敵のモンスターの画像をアーティストの方に描いてもらい次第どんどん動かしていこうと思います。

こういったアニメーションでも、3DCGのモデルでも、アーティストの方がいくら良い絵を描いてくださっても、動かすのはプログラマーの仕事です。アーティストの方のイメージどおりに動かせるまで試行錯誤を繰り返して良い物にしていきたいです。
プログラマーは「縁の下の力持ち」とよく言われるので、私も頑張って縁の下から支えられる仕事をしたいです。

＜９日目のチームを通しての進行具合＞
・ゲーム中のスコア（結果）にどのような要素を入れるか
・主人公のデザインが完成
・ゲームの世界観となるイメージボードの完成

参考書やサイトを参照しながらの作業ですので、技術的に可能・不可能の他に「できるかどうかわからないけど、できそうな事」の線引きというのが難しいです。
できるかどうかがはっきりしないとアーティストの方に無駄に素材を作らせてしまったり、進行が遅くなったりと非常に迷惑をかけてしまいます。
迷惑をかけないためにも、しっかり勉強して技術的に可能かどうかの線引きを早い段階でやる必要があります。

遅いですが、着実に進んでいるという実感はあるので、完成まで乞うご期待！

---

＞＞　【2011夏】サイバーコネクトツー／プログラマーコース　川端慧氏（１）

＞＞　【2011夏】サイバーコネクトツー／プログラマーコース　川端慧氏（最終）

＜サイバーコネクトツーのウェブサイトはこちら＞

こんにちは。サイバーコネクトツーにてプログラマーとしてインターンシップに参加しております、馬野です。今回で私のブログは2回目の掲載ですね。

過去の日記を見てない方がわかるようにもう一度簡単に自己紹介をします。
普段は情報系の大学に通いつつ、ゲーム作りは自分１人で学んできました。
そこで今回は複数人での開発経験を得たい！ということで参加しました。
詳しい経緯は８月１９日のブログを見てくださいね。

さて、インターン開始から１週目がＤｉｒｅｃｔＸの学習を行い、２週目からいよいよゲーム作り開始！！っていき込んでもそう簡単に作ることができないのがゲームなのです。
逆にある時を過ぎるとどんどんゲームの形ができていきます。
ここで、2週目開始直後のプログラムのファイルとソースコードを見て頂きましょう。


画像左部分にフォルダの下にファイルがありますよね？これはゲームの基盤になるプログラムです。画像右部分が現在開かれているソースコードです。スクロールすると、ずらーっとコードが書かれています。
これを見るだけで呪文を見てるようで頭が痛くなる方もいるようですね。
私のようなプログラマーはこれを見るだけで喜び、楽しむことができます。
さて、現在は画像左部分にある１つ１つのファイルにこのようなソースコードが書かれています。そこで、これを実行すると・・・？

どんっ！！


矢印キーで操作すると上の小さい箱の方が動きます。

「え？何これ、ゲームなの？」
そんな声が聞こえてきそうですが、あれだけのファイルがあってもこれだけなのです。
実は最初にお見せしたソースコードの画像はゲームを作る基盤を作っただけです。
しかし、一度"ゲームを作る環境"を作ってしまえば後はサクサク作っていけるわけです。
ゲームの制作工程の中ではこの環境作りが私は好きですね。地味な見えない部分ですが、これがしっかりしてなければゲームは作ることができません。ゲームの土台と言って良いでしょう。

話は変わりますが、私の1回目のブログでも書いたようにデザイナーさんとのやりとりがとても大変です。何といっても、デザイナーさんが描いた物はプログラマーさんが動かさない限りゲーム上では動かない訳ですから。

複数人での開発経験の無い私はどんどん自分のやりたい部分、作りたい処理だけを作っていました。当然、同じようにデザイナーさんも何かしらを制作しています。
いざ、デザイナーから成果物が上がってきたときに、
「あ、すみません。まだ動かせない状況です。」
こんな状況が何度もあります。

私達の担当の方からも「プログラマーは物（絵やアニメーション）が上がってきたら、常にすぐ動かせる状況を作っておかなければならない。」とのアドバイスを頂きました。

なるほど、確かにその方が効率がいいな、と思っても中々慣れないことはすぐにできません。しかし、プロの現場では数十人の開発なんて当たり前。今の私達はたったの4人です。
頑張らなきゃ！ここで負けては、プロにはなれないのですから。

デザイナーさんとのことばかり書いて来ましたが、もちろんプログラマー同士の間でも問題があります。私の中で感じた一番の問題は、ソースコードの共有ですね。今回は私合わせてプログラマーは２人です。

お互いが書いたプログラムのコードが汚くて分からないことがしばしば。そうすると、「これは何やってるの？」とわざわざ教わらなければなりません。作業の遅れが生じますよね。私はコードが汚いに加えて、勝手に修正などを加えてしまうものですから、さらに２人の間での進度共有が難しくなります。
どうやったら、２人での共有ができるかと考えたところ、下のような物を作ることにしました。


『IEDIT』というフリーのツールです。簡単に遷移図を書くことができます。ゲームの仕様に基づき、このような図を１つ書いて置くのもありなんじゃないかなぁと思いました。

それでは、続きはまた次回。

---

＞＞　【2011夏】サイバーコネクトツー／プログラマーコース 馬野泰成氏（１）

＞＞　【2011夏】サイバーコネクトツー／プログラマーコース 馬野泰成氏（最終）

こんにちは。
アーティスト志望の依田です！
インターンシップ初日から一週間が経ち、だいぶ会社に通うことに慣れてきました。

今日は、前回からその後の一週間のお話をしたいと思います。

二週目からは、企画も大枠が決定したので　いよいよゲーム素材の作成を開始しました。

素材を作り始めて最初にぶつかった壁は、「環境の違い」でした。
私が今まで学校で習ってきた3DCGソフトは「Maya」というソフトでしたが、
サイバーコネクトツーさんで使用している3DCGソフトは、「3ds Max」というソフトです。

でも環境の違いなんかに負けてはいられない！と思い、
時には調べ、時には社員の方にご指導をいただきながら、
ようやく「何かを作ることができる」レベルにまで到達することができました。
触った感想としては、「手順」や「言葉」が違うだけで
「3DCGソフトで出来ること」はだいたいどのソフトも同じなので、
私としては簡単に使えるようになりました。
むしろ、中々触る機会のないソフトが使えるようになり、
とてもプラスになったなと思います。

次に、素材を作る役割分担と工程をアーティスト担当の二人で割り振りました。
私の担当は、背景の3DCGと、ユーザーインターフェース・アートボードなどです。
お互いに素材の質感に差がでてしまわないように、相談しながら制作していきます。

まず、ゲームの背景と呼ばれる部分を作ります。
背景とは主人公や敵が出現するステージそのものを作る作業です。
ゲームの見た目の土台となる部分ですね。
背景を作るときに大事なのは、見た目のきれいさはもとより、
ゲームの中に出てくる敵や主人公などのすべての要素が表示されても
違和感のないように仕上げていく必要があります。
そしてなにより、容量の軽いデータをつくること。
データが重いと、ロード時間が長くなってしまう原因にもなります。


背景の地面となるテクスチャです。
コンピュータがすばやく読み取ることができるように、
2の倍数のテクスチャサイズにし、(例:256x256、512x512など)
ゲームの素材であるということを常に意識して制作していきます。

実装してみると、下の画像のようなカンジになります。


今週はゲームの基礎部分が出来上がったので、
次の週からはゲームの面白さにつながる見え方を追求していきたいと思います！

---

＞＞ 【2011夏】サイバーコネクトツー／デザイナーコース　依田美菜子氏（１）

＞＞ 【2011夏】サイバーコネクトツー／デザイナーコース　依田美菜子氏（３）

＞＞　【2011夏】サイバーコネクトツー／デザイナーコース　依田美菜子氏（最終）