本講座ではUnityでビリヤードゲームの作り方について説明していきます。
Unityの新規プロジェクトを作成するところから、一つずつ丁寧に進めていくので、初学者の方でも完成まで辿り着けます。また簡単に作成するため素材のインポートも必要ないように進めていきます。
その分調整の値が細かいですが、大まかに合っていれば大丈夫なので参考にしつつ、それぞれカスタマイズしてください。
全4回構成を予定しております。
プロジェクトの作成
まずはUnityの新規プロジェクトを作成します。
使用するUnityのバージョンは 2020.3.5f1(2021/6 現在最新のLTS)を想定していますが、多少のバージョンの違いは問題ありません。
テンプレートは「3D」を選択してください。主にビリヤード台を真上からみたゲームを作成します。テンプレートは3D、真上からみて2Dになるようなゲームを作成していきます。
保存先は任意の場所に設定してください。
レイアウト、Gameビュー解像度
UnityEditorの Layout は使いやすいように配置していただければと思いますが、
「Scene」「Game」「Hierarchy(ヒエラルキー)」「Inspector(インスペクター)」「Project」「Console」を表示し続けられるように配置することをおすすめします。
今回は下記画像の配置で行っていくので参考にしてください。
次に、Gameビューの解像度を指定します。
最後にスマホ対応もしますが、まずは横長画面でPC用に作成します。
Full HD( 1920 * 1080 )を選択しておきましょう。
また、Projectタブから新しく「Prefab」「Script」「Material」のフォルダを作成しておきましょう。
ビリヤードフィールドを作ろう!
それではビリヤードのフィールドを作成していきましょう。
今回は簡易的に作成するためにUnity内にあるプリミティブ(Cube、SphereなどのUnityにある3Dオブジェクト)で作成していきます。
まずは開いているシーンの名前を「BilliardScene」と名前を変更しておきましょう。
空オブジェクトの作成
オブジェクトを作成していきましょう。
「Hierarchy」で右クリック、「Create Empty」を選択し空の「GameObject」を3つ作成します。
そのGameObjectの名前をそれぞれ「Table」「Ball」「Floor」と名前を変更します。
これらはビリヤード台、ボール、床などを作成するための親となるオブジェクトになります。このように分けておくと後々管理しやすくなります。
また、同じように「Hierarchy」で右クリック、「UI→Canvas」を選択し、UI用のキャンバスを作成しておきます。このとき「Event System」が自動的に生成されます。
(Event SystemはUIでボタンなどのイベントを使用するために必要なので消さないようにしてください)
またあらかじめ「Table」「Ball」「Floor」の位置を調整しておきましょう。
「Hierarchy」から選択しそれぞれの「Inspector」から「Transform」を下記のように設定します。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
「Table」 Position : x = 0, y = 0, z = 0 Rotation : x = 0, y = 0, z = 0 Scale : x = 1, y = 1, z = 1 「Ball」 Position : x = 0, y = 0.08, z = 0 Rotation : x = 0, y = 0, z = 0 Scale : x = 1, y = 1, z = 1 「Floor」 Position : x = 0, y = -0.5, z = 0 Rotation : x = 0, y = 0, z = 0 Scale : x = 1, y = 1, z = 1 |
カメラの調整
今回はビリヤード台を真上から撮影しますので「Main Camera」を上から下を撮るように調整していきます。下記画像のように「Hierarchy」にある「Main Camera」を選択し「Transform」を設定してください。
ビリヤード台の作成
まずは台を作成していきます。
「Hierarchy」にある「Table」の上で右クリックをして「3DObject→Cube」を「Table」の子に作成します。もし「Table」の子になっていない場合は作成された「Cube」をドラック&ドロップで「Table」の上に持っていって下の画像のように「Table」と「Cube」を親子関係にしてください。
こうすることで親の「Table」を動かすと同時に「Cube」も動いたり、「Cube」のインスペクターの「Transform」は親からの相対位置、角度となります(ローカル位置、角度)。
この先同じように、親子関係を作って多くのオブジェクトを作成していきます。
また「オブジェクトの作成」は「Hierarchy」で右クリック、「Create Empty(今後Emptyといいます)」または「3DObject→作成したいオブジェクト」です。
この2つを覚えておきましょう。
では、台を完成させていきます。
1 2 3 4 |
Table > Cube > Wall ( Create Empty ) > Hole ( Crete Empty ) |
のようにEmptyをTableの子に2つ作成し名前を「Wall」「Hole」とします。
そしてWallの子に「Cube」を6個、「Hole」の子に「Cylinder」を6個作成します。
(Windowsだと Ctrl + D、Macだと command + D で複製できます)
上の画像を参考に作成したら、次に各オブジェクトの位置、大きさ、角度を設定していきます。
それぞれを選択し、インスペクターの「Transform」の項目を設定します。
これらの位置は記事の下の方に完成画像がありますが、厳密に同じである必要はありません。参考にそれぞれの設定値を記載しておきます。
数が多いので以下「Transform」の「Postion」「Rotation」「Scale」をそれぞれp、r、sとして、下記のように表記します。
1 |
オブジェクト名 p( x, y, z ) r( x, y, z ) s( x, y, z ) |
名前は画像の通りであるとして下記のように設定してください。(>は親子関係を表しています)
若干面倒ではあるので、以下の画像の完成図を参考に手動で設定してもさほど影響はないかと思います。大切なのは「Table」の壁として「Wall」があり、穴の位置に「Hole」があることを確認して配置しましょう。
「Hole」の長さが少し長く見えますがカメラへの写り方を考慮してそうしています。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
Table p( 0, 0, 0 ) r( 0, 0, 0 ) s( 1, 1, 1 ) > Cube p( 0, 0, 0 ) r( 0, 0, 0 ) s( 2.9, 0.1, 1.6 ) > Wall p( 0, 0, 0 ) r( 0, 0, 0 ) s( 1, 1, 1 ) >> Cube p( 0.7, 0, -0.8 ) r( 0, 0, 0 ) s( 1.3, 0.3, 0.1 ) >> Cube(1) p( -0.7, 0, -0.8 ) r( 0, 0, 0 ) s( 1.3, 0.3, 0.1 ) >> Cube(2) p( 0.7, 0, 0.8 ) r( 0, 0, 0 ) s( 1.3, 0.3, 0.1 ) >> Cube(3) p( -0.7, 0, 0.8 ) r( 0, 0, 0 ) s( 1.3, 0.3, 0.1 ) >> Cube(4) p( 1.45, 0, 0 ) r( 0, 0, 0 ) s( 0.1, 0.3, 1.4 ) >> Cube(5) p( -1.45, 0, 0 ) r( 0, 0, 0 ) s( 0.1, 0.3, 1.4 ) > Hole p( 0, 0, 0 ) r( 0, 0, 0 ) s( 1, 1, 1 ) >> Cylinder p( 0, 0, 0.825 ) r( 0, 0, 0 ) s( 0.2, 0.3, 0.2 ) >> Cylinder(1) p( 1.4, 0, 0.8 ) r( 0, 0, 0 ) s( 0.2, 0.3, 0.2 ) >> Cylinder(2) p( -1.4, 0, 0.8 ) r( 0, 0, 0 ) s( 0.2, 0.3, 0.2 ) >> Cylinder(3) p( 0, 0, -0.825 ) r( 0, 0, 0 ) s( 0.2, 0.3, 0.2 ) >> Cylinder(4) p( 1.4, 0, -0.8 ) r( 0, 0, 0 ) s( 0.2, 0.3, 0.2 ) >> Cylinder(5) p( -1.4, 0, -0.8 ) r( 0, 0, 0 ) s( 0.2, 0.3, 0.2 ) |
マテリアルの設定
これらのオブジェクトに色を付けるためにマテリアルを設定していきます。
3Dオブジェクトに色を付けるためには、オブジェクトにマテリアルを設定します。
マテリアルとは、簡単に言うとオブジェクトの色や質感を表現したり、テクスチャ(今回は使用しませんが)を貼ったりするためのものです。
まず、「Project」ウインドウに作成した「Material」フォルダを右クリックして「Create→Material」と選択肢新しいマテリアルを作成しましょう。
新しく3つのマテリアルを作成しそれぞれ「Table」「Wall」「Hole」と名前をつけます。
そしてこれらの色を設定していきます。
作成したマテリアルを選択し、インスペクターに表示されているマテリアル情報の上の方にある「Main Maps」項目の「Albedo」の右の四角をクリックしてください。
そうするとカラーパレットが出ますので、そのRGBAの項目をそれぞれ下記のように設定します。
(パレットの円形をクリックすることでも設定できます)
またHoleのみ、「Albedo」の下の「Metallic」「Smoothness」も変更しましょう。
1 2 3 4 5 6 7 8 9 10 11 12 |
Table R : 40 / G : 255 / B : 0 / A : 255 (黄緑) Wall R : 100 / G : 60 / B : 0 / A : 255 (茶色) Hole R : 0 / G : 0 / B : 0 / A : 255 Metallic : 0 / Smoothness : 0 (黒) |
これらは、色や質感を設定するためのものなので好きなように変更しても問題はありません。その他の項目は今後説明しますが自由に色を変えてみてください。
さて、マテリアルを設定していきましょう。
マテリアル「Table」は「Table」オブジェクトの子にある「Cube」に、
マテリアル「Wall」は「Table→Wall」の子にある6つの「Cube」に、
マテリアル「Hole」は「Table→Hole」の子にある6つの「Cylinder」に、
設定します。
ヒエラルキーの該当オブジェクトをクリック(複数の場合はShift,command等で複数選択してください)、そしてインスペクターに表示されている情報の下の方の空白部分にマテリアルをドラック&ドロップをしていきましょう。
そして最後にヒエラルキー「Hole」オブジェクトの子の6つの「Cylinder」を選択して、そのインスペクターの「Mesh Renderer」というコンポーネントの「Lighting」という項目から「Cast Shadow」を「Off」に、「Recieve Shadow」のチェックを外してください。
詳細はここでは省きますがこれは「Cylinder」オブジェクトの影を作らないように、影をうつさないようにする設定です。
これらの設定を終えると「Game VIew」が下記のようになっていればビリヤード台の完成です。なっていない場合各オブジェクトの位置を調整して見ましょう。
フロアを配置しよう
フロアは簡単に配置していきます。
3Dオブジェクトの作成、マテリアルの設定は台と同じように設定しますのでここでは簡単に解説します。
最初に作成した「Floor」を右クリックして「Create→Cube」で作成し位置、サイズを下記のように設定します。
その後マテリアルを作成し「Floor」という名前にして「Floor」の子のCubeに設定しましょう。
色はお好き設定してもらって構いませんが、今後出てくる画像では黒にしています。
1 2 3 |
Floor > Cube p( 0, 0, 0 ) r( 0, 0, 0 ) s( 5, 0.1, 5 ) |
ボールを配置しよう
次にボールを配置して行きます。
3Dオブジェクトの配置の仕方は今までと同じですので、サクッと作成していきましょう。
まず、最初に作った「Ball」というEmptyオブジェクトを右クリックして「3D Object→Sphere」を1つ、また「Create Empty」から空オブジェクトを作成します。
そして、作成したSphereオブジェクトに「Main Ball」、Emptyオブジェクトに「Nine」と名前をつけます。
「Nine」を右クリックして「3D Object→Sphere」で球を1つ作成し「Color Ball」と名前をつけましょう。
この段階で「Nine」を選択しインスペクターからTransformを下記のように設定しておきます。
1 2 |
Nine p( 0.7, 0, 0 ) r( 0, 0, 0 ) s( 1, 1, 1 ) |
プレハブ化
プレハブとはゲームオブジェクト使い回すために予め作成しておける機能で、作成したプレハブをたくさんシーン内に配置してあっても大本のプレハブの値を変更すれば、すべてのオブジェクトに同時に適用することができるものです。
そうすることでオブジェクトの管理がしやすくなります。
ではプレハブを作成していきます。
最初に「Project View」に作成した「Prefab」フォルダを開いて、上で作成した「Nine」の子にある「Sphere」をドラック&ドロップして「Prefab」フォルダに入れましょう。
そうすると画像のようにヒエラルキーの「Sphere」は青文字になり「Prefab」フォルダに「Sphere」が入っているかと思います。
これでプレハブ化できました。
そしてこの「Color Ball」を複製して合計9個作成してください。
このボールにそれぞれ名前をつけていきます。任意で結構ですが画像のようにするとこのあと色をつけていくのでわかりやすいかと思います。色は実際のビリヤードのボール番号を表していますが、9以降は実際は2色のしましまになるため今回は適当に一色で作成します。
1 2 3 4 5 6 7 8 9 |
1_Yellow_ColorBall 2_Blue_ColorBall 3_Red_ColorBall 4_Purple_ColorBall 5_Orange_ColorBall 6_Green_ColorBall 7_Brown_ColorBall 8_Black_ColorBall 9_GoldClear_ColorBall |
ボールの設定
ボールにマテリアルを設定していきます。
設定方法は先のものと同じなので割愛し上記9個のマテリアルを作成しそれぞれボールにセットしていきましょう。
「黄色」「青」「赤」「紫」「オレンジ」「緑」「茶色」「黒」の8個は今までのように色をパレットから選択すれば作成できますのでやっていきましょう。
(プロジェクトビューで右クリック→Create→Material)
最後の「9_GoldClear_ColorBall」だけ少し変えてみましょう。
同じようにマテリアルを作成し「GoldClear」名前を変更したらマテリアルを選択しインスペクターで「Render Mode」という項目を「Transparent」に変更し色は金っぽい黄色っぽい色に設定してみます。こうすると金の透明なボールができます(好きな色でOKです)。
最後に位置、大きさを設定していきます。
まずはMainBallを選択。インスペクターの「Transform」の「Position」「Rotation」「Scale」をそれぞれ下記のように設定します。
1 2 3 4 |
MainBall p( 0, 0, 0 ) r( 0, 0, 0 ) s( 0.06, 0.06, 0.06 ) |
そして、ヒエラルキーにある「ColorBall」の右側にある「>」マークをクリックしてプレハブを開きましょう。
そして開いた状態のインスペクターの「Transform」から「Scale」を
1 |
s( 0.06, 0.06, 0.06 ) |
と設定します。こうすることでこのプレハブのオブジェクトのすべてのScaleを一括で変更できます。
その上でシーンに戻って各ボールの位置を調整していきましょう。
基本的には好きに並べればいいのですが、ビリヤードっぽくダイヤ型に並べましょう。
それぞれのボールを選択しインスペクターの「Transform」のPosition、Rotationを設定していきます。
面倒であれば下の画像を参考に大体の位置を合わせれば大丈夫です。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
1_Yellow_ColorBall p( -0.109, 0, 0 ) r( 0, 0, 0 ) 2_Blue_ColorBall p( -0.055, 0, 0.032 ) r( 0, 0, 0 ) 3_Red_ColorBall p( -0.055, 0, -0.032 ) r( 0, 0, 0 ) 4_Purple_ColorBall p( 0, 0, -0.063 ) r( 0, 0, 0 ) 5_Orange_ColorBall p( 0, 0, 0 ) r( 0, 0, 0 ) 6_Green_ColorBall p( 0, 0, 0.063 ) r( 0, 0, 0 ) 7_Brown_ColorBall p( 0.055, 0, -0.033 ) r( 0, 0, 0 ) 8_Black_ColorBall p( 0.055, 0, 0.033 ) r( 0, 0, 0 ) 9_GoldClear_ColorBall p( 0.111, 0, 0 ) r( 0, 0, 0 ) |
これらの設定をすべて完了すると、下の画像のようになります。
なにか違っている場合は各々調整してみましょう。ここに記載のある数値は厳密に合わせる必要があるものではありませんので、自由に変更してください。
ヒエラルキー画面は以下のようになっているはずですのでこちらも比べてみてください。
以上で、ビリヤードフィールドの作成が終了しました。
次回から、ボールを打つ、衝突するなどの処理をスクリプトを記載したりコンポーネントを設定したりして作成していきます。
次回の記事:
コメント
質問です。
プレハブから作成した9個の球に対してマテリアルをアタッチすると、
ヒエラルキーウィンドウの各球の左端に青い線が表示されるはずなんですが、
この記事では見当たりません。なぜでしょうか?
画像がないのでどこのことか想像で書いていますが、
エディタのバージョンの違いかなと思います。解説画像のエディタは2020なので。