 |
 |
 |
   |
ゲームカレッジ１年生・・・コンテンツ制作
 |
| 携帯コンテンツをプログラミング中 |
 |
| ゲームの１ステージの美術設定を検討しています |
 |
| キャラクターデザインのラフ画を描いています |
授業開始２ヶ月ほどですが・・・
ゲームカレッジ・・・自習中
ゲームカレッジの一年生たちが、授業後学校に残って自習していました。
 |  |
| プログラムの自習中 | グラフィック専攻も自習中 |
 |  |
| 線画をクリンナップしています | デジタルで着彩中 |
授業だけではなく自習も大切です
授業で学ぶことはもちろん大切ですが、自分で学ぶことも同様に大切です。やはり自分で努力してこそ実力がつきます。
一年後には自分の作品を持って企業を訪問して回ることになります。いまから真剣に制作に取組んでいます。
ゲームカレッジ・・・コンテンツ制作
全国展開のヒューマンアカデミーでは全国どの校舎でも同じ授業が受けられるようカリキュラムの共通化を進めています。でも、ゲームカレッジの授業「コンテンツ制作」は例外のひとつ。ここでは学生さんの希望に応えられるよう各校舎独自の授業を行っています。
神戸校では、学生さんからの希望の多い美少女ＣＧの授業を行っています。プロの指導を直接受けられる土曜日の授業です。
 |
| みんなで作業中 |
 |  |
| 先生の指導に沿って作業します | デジタルで線画をクリンナップ |
 |  |
| デジタルペイント | スクリプト作成 |
作ったＣＧでゲーム制作
ゲームカレッジですので、ＣＧを制作するだけでなく、ゲームにしてゆきます。
グラフィック専攻の学生がＣＧを作成すると、プログラム専攻の学生がスクリプトを使ってゲームに実装します。簡単にゲームを作れるスクリプト言語ですが、ここでは学生が作ったオリジナルのスクリプトエンジンを使っています。
ヒューマンアカデミーには、学生さんの学習ニーズに応える様々な授業があります。興味を持たれた方はぜひ見学しに来てくださいね。
Ｗｅｂアニメーション制作中
ゲームＣＧ専攻の学生が、春休みの課題、Ｗｅｂアニメーションを制作中です。学校は春休み中ですが、学校に集合して全員で作業を進めています。
 |
| 制作風景 |
基本はアナログ
ＷＥＢアニメーションはドロー系のツールを使ってコンピュータ上で作りますが、アニメーションの作り方はセルアニメと同じです。まずは動画用紙を使って下絵を制作します。
 |  |
| トレース台とタップは必需品 | 下絵をスキャナーで取り込みます |
 |
| パソコン上でトレース・彩色してゆきます |
完成したアニメーションはＷＥＢを使って広く公開する予定です。３月末の完成を目指してみんな頑張っています。
ゲームプログラミング・衝突判定
ゲームカレッジの授業「ゲームプログラム」では、ゲームプログラム専攻の２年生が、リアルタイム３ＤＣＧを使ったゲーム作りのための要素技術を学んでいます。
ゲームにおいて、二つ以上のもの（キャラクターなど）がある時、それらが衝突しているか、していないかを判定することはとても重要です。
この判定を「衝突判定」または「当たり判定」といいます。
今回の授業では１年生の時にも学んだ長方形同士の当たり判定を３Ｄに応用しました。３Ｄに応用するだけでなく、長方形の向きを変えても衝突判定ができるようになりました。ここでは少しだけ授業内容を紹介します。
衝突判定の方法
判定を行う２つの長方形をそれぞれ長方形Ａ、長方形Ｂとします。
 |  |
| 図１ 横軸（長方形Ｂ）での判定 | 図２ 縦軸（長方形Ｂ）での判定 |
図１では、長方形Ｂを横に切る軸（以下「長方形Ｂの横軸」というふうに呼びます）で判定を行っています。長方形Ａの右端が長方形Ｂの左端より左側にあるので、衝突していないことになります。
図２は長方形Ｂの縦軸での判定です。長方形Ａは長方形Ｂの上端より上にあり、衝突していないと判定できます。
 |  |
| 図３ 問題発生 | 図４ 長方形Ａを基準に判定 |
図３は長方形Ｂの横軸での判定ですが、長方形Ａの右端が長方形Ｂに食い込んでいて、衝突していないという判定ができません。
長方形Ｂの縦軸で判定しても結果は同じです。
この場合は図４のように長方形Ａを基準とした判定を行います。図４の長方形Ａの横軸を基準として判定を行うと、長方形Ｂの左端は長方形Ａの右端より右側にあり、衝突していないと判定できます。
３Ｄへの応用
３Ｄの場合も２Ｄの場合と同様に、任意の方向を向いた直方体同士の衝突判定ができますが、特殊なケースがあるので注意が必要です。以下少し見てみましょう。
 |  |
| 図５ 問題発生 | 図６ 解決・・・できない |
図５は、２Ｄの場合の図３と同様の問題が発生するケースです。しかしながら図６のように直方体Ａを基準にしても不具合が発生してしまいます。
どうやらそれぞれの直方体が持つ軸の全てで判定しても充分ではないようです。
問題の解決
 |  |
| 図７ | 図８ |
このケースではまず、図７のように、直方体Ａの一つの軸に着目します。この軸が図８のように、縦または真横になるように座標軸の基準をとりなおします。
図８の横軸を基準とすると、図９のように衝突していないという判定が可能になります。
 |
| 図９ 外積による分離軸での衝突判定 |
ここで判定の基準とした軸の方向は、直方体Ａの図７で着目した軸と直方体Ｂが持つ奥行きの軸との外積から求める事ができます。
それぞれの直方体が持つ３本の軸の合計で６本の軸、ＡＢお互いの軸それぞれの外積で求められる９本の軸、合計１５本の軸で衝突判定を行い、いずれも衝突していないと判定できなければ衝突していると判断する、このアルゴリズムで当たり判定を行う事ができます。
新技術を学ぶ
3DCGモデル（の一部）を囲むように作成した直方体を任意に回転させたもの (OBB:Oriented Bounding Box)同士をモデル同士の当たり判定に応用する事は比較的新しい技術ですが、現在市販ゲームでも良く使われています。
ヒューマンアカデミーでは新しい技術も身につけられるよう積極的に取り入れています。興味を持たれた人はいつでもお問い合わせください。
ゲームカレッジ・・・ゲームプログラミング
ゲームカレッジの授業「ゲームプログラム」では、ゲームプログラム専攻の２年生が、リアルタイム３ＤＣＧの要素技術を学んでいます。今回は前回学んだ「スキンメッシュ(Skin Mesh)」の応用編。
動く３ＤＣＧに視覚効果を加えてみます。
 |  |
| スキンメッシュの表示 | 影をつけました |
動く視覚効果
キャラクタが動くなら動く影も欲しい・・・という事で、テクスチャシャドウを使ってスキンメッシュから影を落としました。
次は初歩の環境マッピングに挑戦です。
 |  |
| 背景をテクスチャに描画 | スキンメッシュに貼り付け |
 |  |
| 背景とあわせて表示 | 少し屈折 |
 |
| プログラミング中です |
卒業までもう少し
卒業制作として制作中のゲームもあともう少しで完成です。学んだ内容を制作中のゲームに活かせるよう、がんばって勉強しています。
ゲームカレッジ・・・ゲームプログラム
ゲームカレッジの授業「ゲームプログラム」では、ゲームプログラム専攻の２年生が、リアルタイム３ＤＣＧの要素技術を学んでいます。今回のテーマは「スキンメッシュ(Skin Mesh)」。３Ｄモデリングソフトが出力するアニメーション付きのデータの表示について学びました。
 |  |
| 変形前 | 変形後 |
原理は簡単
キャラクターが形を変える原理は単純で、一つの３ＤＣＧモデルに対して複数の移動・回転を適用します。どの移動・回転を適用するかを、３ＤＣＧモデルの部分毎に切り替える事で変形させています。
上の曲がったモデルの例では、上半分を時計回りに、下半分を反時計回りに回転させて、中央でまがった状態を実現しています。
 |  |
| アニメーションを含んだモデル | ボーン |
ボーンによるアニメーション
アニメーションを含んだモデルは、体のパーツ毎に、回転や移動ができるよう、ボーン（Bone）と呼ばれる構造が仕込まれています。モデルに含まれたアニメーションは、このボーンを動かす事でキャラクターを動かそうとします。 そうする事でボーンのつなぎ目が関節となる多関節アニメーションが実装されます。
 |  |
| ボーンのアニメーション | モデルに適用・・・あれれ？ |
失敗は成功のもと
ボーンを動かす事ができれば、始めに棒を曲げた要領で、キャラクターを動かすことができるはずです。やってみると・・・・うまくゆきません。これは、体のパーツ毎にあるボーンのそれぞれが独立して座標の基準を持っているので、全体として一つのＣＧを表示させようとすると破綻してしまうからなのだそうです。 これを避けるためには、座標の基準を統一させる必要があります。下図のように３ＤＣＧの関節にあたる部分を全部一点に集めてしまってからボーンを適用します。
 |
| 関節部を一点に集中（ Bone offset matrix を適用） |
 |
| 完成図 |
最後はうまくゆきました
いろいろ勉強しながら取り組んで、最後はうまく動きました。一歩一歩プロに近づいてゆけるよう頑張って勉強しています。だんだん卒業が近づいてきますが、最後まで気を抜かず皆で頑張っています。
ゲームカレッジ・・・ゲームプログラミング
ゲームカレッジ２年生の授業「ゲームプログラミング」では、引き続きリアルタイムＣＧを中心にゲーム作りの要素技術を学んでいます。今日の内容はシャドウ、前期学んだテクスチャを使った影（テクスチャシャドウ）の続きです。
 |  |
| (1)テクスチャシャドウ | (2)うまくいかない例 |
複雑な地形の場合・・・・
前期に学んだシャドウの手法の場合、地形が複雑になると、上記の（２）のように余計なところに影が出てしまうことがあります。これは、光があたった結果影ができている・・・のではなく、影用のテクスチャを用意して、光源（ライト）から単純に投影しているためにこうなってしまいます。光源からみてキャラクターの向こう側の地形だけに影が出るだけでなく、手前側にも影が出てしまいます。
デプスシャドウ
本日は複雑な形の上に影を落とす方法の一つ、デプスシャドウ（Depth Shadow）について学びました。これは、光源位置にカメラを置いて、そこからの深度（Depth）によって影の表示を行う方法です。
 |  |
| (3)ライトの位置からレンダリング | (4)深度のレンダリング |
（３）光源位置からレンダリング
(2)で使用した、シーン（３ＤＣＧモデルの組み合わせ）を光源位置でレンダリング（描画）すると、（３）のようになります。
（４）深度のレンダリング
レンダリングの方法に工夫を加えて、通常の色彩ではなく深度（カメラからどれだけ離れているか）を画像として保存します。
深度（Depth）判定には一定の精度が必要な為、ここでは通常の画像ではなく、小数表現が可能なＨＤＲ(High Dynamic Range)形式のテクスチャに描画しています。
 |
| デプスシャドウ |
この深度と実際のモデルを比較して、より光源から遠い場所にのみ影を落とす事で、不適切な場所に影が出てしまうことを防いでいます。
精度の高い手法
デプスシャドウは精度の良い方法で市販のゲームなどでも良く使われています。キャラクターの影を地形に落とすだけでなく、キャラクターの影をそれ自身に落としたり、あるキャラクターの影を別のキャラクターに落としたりといったことも可能です。
 |
| 応用例 |
まだまだ勉強です
２年生も後半になり、学生生活も残り少なくなってきましたが、まだまだ勉強することがあります。できる限りのスキルを身に付けられるよう、学生たちもがんばって学んでいます。
ゲームカレッジ１年・・・チーム制作
ゲームカレッジの授業「チーム制作」ではゲームカレッジの一年生が合同でゲームを作り始めています。ＲＰＧ風シミュレーションゲームの制作をしています。
 |
| みんなで取り組んでいます |
 |
| 地道なプログラミング作業です |
 |
| キャラクターは仮のものです |
年度内の完成を目指して
年度内の完成を目指して、まずは年内に１つのマップで遊べるようにしていきます。２年生になると就職活動も本格化しますので、今のうちに充分なスキルを身に付けられるようがんばっています。
ゲームプログラミング
ゲームカレッジの授業「ゲームプログラミング」ではゲームプログラム専攻２年生が、ゲームを作るための技術について学んでいます。現在神戸校では、主にリアルタイムＣＧの要素技術を学んでいますが、今回は、パーティクル（粒子）を使った簡易な炎の表現と、３ＤＣＧモデルに強い光があたっているような表現について、学びました。
簡単な形を組み合わせて
 | 左のような簡単な図形を重ねて炎の形を作ります。 |
 |  |
| 出来上がった形 | 色づけ |
今回のポイントははじめからカラー画像を組み合わせて表示するのでは無く、プログラマブルシェーダ（ピクセルシェーダ）を使ってカラーに加工していることでした。これにより炎の下の方は白っぽく、上の方で赤黒くなる表現を実現できました。
グレア（ハレーション）の表現
立体物に強い光が当たって輝いているような表現のリアルタイムＣＧでの実装法を学びました。
 |
| 完成図 |
以下順を追って、どのようにするのか見てみましょう。
 |  |
| (1)始めの状態 | (2)明るい部分のみ |
 |  |
| (3)ぼかし１ | (4)ぼかし２ |
 |  |
| (5)解像度アップ | (6)モデルと合成 |
(1)始めの状態は、反射光の計算をしている為強く光っていますが、普通にカメラで撮った明るい反射光のようには見えませんので、加工していきます。
(2)表示しようとする３ＤＣＧモデルのうち明るい部分だけを切り出します。あとでぼかしを入れる為、意図的にドットを荒くしています。
次に、ピクセルシェーダを使ってぼやけさせていきます。まずは(3)横方向、次に(4)縦方向にぼかします。
(5)荒い画像に再度ぼかしをかけながら、細かい画像に変換します。
(6)最後にもともののＣＧモデルと重ねて完成です。
卒業制作に・・・
学んだ内容は卒業制作に盛り込んでいきます。残り学生生活は少なくなってきましたが、まだまだ勉強することがあります。がんばろう２年生諸君。
ゲームプログラミング
ゲームカレッジの授業「ゲームプログラミング」では、ゲームプログラム専攻の2年生がゲーム作りの要素技術を学んでいます。2年生の前期は主に3DCGの表示システムに関するプログラミングについて学んでいます。
 | ポリゴンモデルの表示 まずは、モデラーで作成したモデルを表示させました。 |
| 平面のように見えます |
 | 照明の実装 照明を実装してポリゴンモデルに陰影をつけ、立体感を出します。 |
| すこし立体感がでました |
 | スペキュラ光源の実装 スペキュラ（反射光）を実装して、表面にツヤを出してみます。だいぶ立体感は出てきましたが、どうも地面に乗っていないような感じがしますので、次に影を実装して、接地感を出します。これには影用のテクスチャとプログラマブルシェーダを利用します。 |
| スペキュラ光を実装 |
 |
| シャドウ（影）を実装 |
立体を立体らしく見せる
立体を立体らしく見せるという事にも細かい技術があるものです。一つひとつ学んで、ゲームづくりに役立てていきます。
