３Ｄ宝石集めアクションゲーム 手順１１
最終更新：
orika_ex_miyako 2023年01月12日(木) 18:57:24履歴
プレイヤーの収集用のアイテム(宝石)を作成します。
＜実装動画＞
動画ファイルへのリンク
以下の内容で順番に実装を進めていきます。
手順１１ ー宝石プレハブの作成ー
１．Simple Gems Ultimate Animated Customizable Pack アセットをインポートする
プレイヤーの収集するアイテム用のゲームオブジェクトを作成します。
アセットストアより、無料のアセットをインポートして利用します。
アセットストアにて Simple Gems と検索窓に入力するか、下記の URL より移動してアセットのページに移動し、インポートを行ってください。
アセットストア
PackageManager
Import 確認ポップアップ
インポートが終了したら Project フォルダ内の Assets に AurynSky フォルダが追加されていることを確認してください。
インポートされる際のフォルダの構成はアセットストア内で確認できます。アセット名 = フォルダ名ではないことを覚えておくとよいでしょう。
フォルダ
インポートが終了したので、次はこのアセットを利用して収集アイテム用のゲームオブジェクトを作成します。
２．インポートしたアセットを利用して、収集用のアイテム(宝石)を作成する
１．プレハブ・ゲームオブジェクトを Scene ビューに配置する
下記のパスにあるフォルダ内には、プレハブの状態になっているゲームオブジェクトが複数入っています。
この中から１つを選択して、ヒエラルキー、あるいは Scene ビュー 内にドラッグアンドドロップして配置します。
4 Side Diamond 〜 Sprial のいずれのゲームオブジェクトでも構いません。
パス
この例では SphereGemSmall プレハブ・ゲームオブジェクトを利用します。
フォルダ画像
インスペクター画像
なお、Models フォルダには、プレハブと同名の fbx ファイルも含まれています。
今回は特に設定を行いませんが、Import Settings の内容をインスペクターより確認しておくといいでしょう。
パス
モデルの Import Settings インスペクター画像
Scene ビューに配置しても、プレハブ・ゲームオブジェクトの座標によっては画面に映らないケースがありますので、座標を調整します。
ヒエラルキー画像
SphereGemSmall プレハブ・ゲームオブジェクト インスペクター画像
２．プレハブ・ゲームオブジェクトの座標を調整する
Sceneビューに配置したプレハブ・ゲームオブジェクトの初期位置を調整します。
ヒエラルキーにあるプレハブ・ゲームオブジェクトを選択し、
インスペクターの Transform コンポーネント内の Position の値を初期値 (0, 0, 0) にします。
角度の情報はそのまま利用したいので Reset はしないように、手動で 0 にしてください。
インスペクター画像
恐らく、Scene ビューには見えるようになると思いますが、まだ、配置というには微妙な位置になる可能性があります。
Scene ビュー画像
その場合には、プレハブ・ゲームオブジェクトの Position の値を初期値にしてから、Scene ビュー内で配置する位置を調整します。
Game ビューも確認しながら、プレイヤーのそばに配置してください。
下記の画像は参考例です。
次の手順で宝石を獲得する機能を追加しますので、プレイヤーの近くに(ただし、プレイヤーとは重ねないで)配置してください。
Scene ビュー画像
Game ビュー画像
なお、この時点では宝石には色がありません。
次の手順でマテリアルを使って色を着けていきます。
３．マテリアルをアサインする
今回利用するアセットでは、すべてのプレハブにはマテリアルがアサインされていません。
そのため、アセット内に用意されているプレハブは、色がついていない状態で存在しています。
これは「アセットを利用する人が任意の色を利用してください」というアセット製作者の意向の元に、そのようなデザインになっています。
下記のパスには、アセット製作者の方がマテリアルについても用意してくれていますので、
この中から任意のマテリアルを１つ選択し、先ほど配置したプレハブのゲームオブジェクトのマテリアルとして利用することが出来るようになっています。
BG 〜 Yellow までの任意のマテリアルを選択して、アサインを行います。
パス
この例では Blue を選択しています。
フォルダ画像
マテリアル選択時のインスペクター画像
ヒエラルキーにある宝石のプレハブのゲームオブジェクトを選択し、インスペクターを確認します。
MeshRenderer コンポーネント内にある Materials をクリックするとアサインできるスペースが開きますので、
ここにマテリアルをドラッグアンドドロップしてアサインします。
あるいは、Scene ビューにある宝石のプレハブに直接ドラッグアンドドロップしてアサインしても問題ありません。
アサイン場所
マテリアルをアサインすると、宝石のプレハブが着色されます。
アサインするマテリアルを変更すれば、他の色への差し替えも自由に行えます。
自分のイメージにあったマテリアルを選択してください。
マテリアルアサイン後のプレハブ画像
Game ビュー画像
３．宝石プレハブの設定を行う
ヒエラルキーにある宝石のプレハブ・ゲームオブジェクトを選択し、名前を変更します。
現在の名前の最後に Variant を追加してください。 〜 Variant という名称にします。
これは次の手順の中で、プレハブをさらに別の派生したプレハブにする作業(プレハブバリアントの作成)を行うためです。
インスペクター画像
続いて、最初からゲームオブジェクトにアタッチされている AnimationScript の IsScaling のチェックを外してください。
他のものはチェックを入れておいて問題ありません。
このスクリプトを利用することで、宝石のプレハブ・ゲームオブジェクトが自動的に上下運動と回転のアニメーションします。
各チェックを外すことでアニメーションを停止出来るほか、設定値も変更できます。
今回は初期値のまま利用しています。
インスペクター画像
AnimationScript はインポートしたアセットに含まれているスクリプトですが、
難しい処理はないため、一度、確認して処理を読みこんでおくと良い学習につながります。
最後に、ゲームを実行して、どのように宝石がアニメーションするのかを確認しておきます。
この時点でもアニメーションの調整はできますが、ゲーム実行中でのインスペクターへの変更は反映されませんので注意が必要です。。
＜実装動画＞
動画ファイルへのリンク
宝石のアニメーションの確認とともに、宝石にプレイヤーが侵入しても、まだ獲得することが出来ません。
それは当然のことながら、そのような機能がまだ実装されていないためです。
次の手順では、宝石の獲得機能の実装を行い、宝石にプレイヤーが侵入したら宝石がゲーム画面から消えるように機能を追加します。
実際に自分でプロジェクトを作成する場合にも、このように、機能を１つずつ分解して、順番に実装を行っていくようにするとよいでしょう。
以上でこの手順は終了です。
=> 次は 手順１２ ー宝石の獲得機能の追加ー です。
＜実装動画＞
動画ファイルへのリンク
以下の内容で順番に実装を進めていきます。
手順１１ ー宝石プレハブの作成ー
１．Simple Gems Ultimate Animated Customizable Pack アセットをインポートする ２．インポートしたアセットを利用して、収集用のアイテム(宝石)を作成する ３．宝石プレハブの設定を行う
１．Simple Gems Ultimate Animated Customizable Pack アセットをインポートする 
プレイヤーの収集するアイテム用のゲームオブジェクトを作成します。
アセットストアより、無料のアセットをインポートして利用します。
アセットストアにて Simple Gems と検索窓に入力するか、下記の URL より移動してアセットのページに移動し、インポートを行ってください。
Simple Gems Ultimate Animated Customizable Pack
アセットストア
PackageManager
Import 確認ポップアップ
インポートが終了したら Project フォルダ内の Assets に AurynSky フォルダが追加されていることを確認してください。
インポートされる際のフォルダの構成はアセットストア内で確認できます。アセット名 = フォルダ名ではないことを覚えておくとよいでしょう。
フォルダ
インポートが終了したので、次はこのアセットを利用して収集アイテム用のゲームオブジェクトを作成します。
２．インポートしたアセットを利用して、収集用のアイテム(宝石)を作成する
１．プレハブ・ゲームオブジェクトを Scene ビューに配置する
下記のパスにあるフォルダ内には、プレハブの状態になっているゲームオブジェクトが複数入っています。
この中から１つを選択して、ヒエラルキー、あるいは Scene ビュー 内にドラッグアンドドロップして配置します。
4 Side Diamond 〜 Sprial のいずれのゲームオブジェクトでも構いません。
パス
Assets/AurynSky/Gems Ultimate Pack/Prefabs
この例では SphereGemSmall プレハブ・ゲームオブジェクトを利用します。
フォルダ画像
インスペクター画像
なお、Models フォルダには、プレハブと同名の fbx ファイルも含まれています。
今回は特に設定を行いませんが、Import Settings の内容をインスペクターより確認しておくといいでしょう。
パス
Assets/AurynSky/Gems Ultimate Pack/Models
モデルの Import Settings インスペクター画像
Scene ビューに配置しても、プレハブ・ゲームオブジェクトの座標によっては画面に映らないケースがありますので、座標を調整します。
ヒエラルキー画像
SphereGemSmall プレハブ・ゲームオブジェクト インスペクター画像
２．プレハブ・ゲームオブジェクトの座標を調整する
Sceneビューに配置したプレハブ・ゲームオブジェクトの初期位置を調整します。
ヒエラルキーにあるプレハブ・ゲームオブジェクトを選択し、
インスペクターの Transform コンポーネント内の Position の値を初期値 (0, 0, 0) にします。
角度の情報はそのまま利用したいので Reset はしないように、手動で 0 にしてください。
インスペクター画像
恐らく、Scene ビューには見えるようになると思いますが、まだ、配置というには微妙な位置になる可能性があります。
Scene ビュー画像
その場合には、プレハブ・ゲームオブジェクトの Position の値を初期値にしてから、Scene ビュー内で配置する位置を調整します。
Game ビューも確認しながら、プレイヤーのそばに配置してください。
下記の画像は参考例です。
次の手順で宝石を獲得する機能を追加しますので、プレイヤーの近くに(ただし、プレイヤーとは重ねないで)配置してください。
Scene ビュー画像
Game ビュー画像
なお、この時点では宝石には色がありません。
次の手順でマテリアルを使って色を着けていきます。
３．マテリアルをアサインする
今回利用するアセットでは、すべてのプレハブにはマテリアルがアサインされていません。
そのため、アセット内に用意されているプレハブは、色がついていない状態で存在しています。
これは「アセットを利用する人が任意の色を利用してください」というアセット製作者の意向の元に、そのようなデザインになっています。
下記のパスには、アセット製作者の方がマテリアルについても用意してくれていますので、
この中から任意のマテリアルを１つ選択し、先ほど配置したプレハブのゲームオブジェクトのマテリアルとして利用することが出来るようになっています。
BG 〜 Yellow までの任意のマテリアルを選択して、アサインを行います。
パス
Assets/AurynSky/Gems Ultimate Pack/Materials
この例では Blue を選択しています。
フォルダ画像
マテリアル選択時のインスペクター画像
ヒエラルキーにある宝石のプレハブのゲームオブジェクトを選択し、インスペクターを確認します。
MeshRenderer コンポーネント内にある Materials をクリックするとアサインできるスペースが開きますので、
ここにマテリアルをドラッグアンドドロップしてアサインします。
あるいは、Scene ビューにある宝石のプレハブに直接ドラッグアンドドロップしてアサインしても問題ありません。
アサイン場所
マテリアルをアサインすると、宝石のプレハブが着色されます。
アサインするマテリアルを変更すれば、他の色への差し替えも自由に行えます。
自分のイメージにあったマテリアルを選択してください。
マテリアルアサイン後のプレハブ画像
Game ビュー画像
３．宝石プレハブの設定を行う
ヒエラルキーにある宝石のプレハブ・ゲームオブジェクトを選択し、名前を変更します。
現在の名前の最後に Variant を追加してください。 〜 Variant という名称にします。
これは次の手順の中で、プレハブをさらに別の派生したプレハブにする作業(プレハブバリアントの作成)を行うためです。
インスペクター画像
続いて、最初からゲームオブジェクトにアタッチされている AnimationScript の IsScaling のチェックを外してください。
他のものはチェックを入れておいて問題ありません。
このスクリプトを利用することで、宝石のプレハブ・ゲームオブジェクトが自動的に上下運動と回転のアニメーションします。
各チェックを外すことでアニメーションを停止出来るほか、設定値も変更できます。
今回は初期値のまま利用しています。
インスペクター画像
AnimationScript はインポートしたアセットに含まれているスクリプトですが、
難しい処理はないため、一度、確認して処理を読みこんでおくと良い学習につながります。
最後に、ゲームを実行して、どのように宝石がアニメーションするのかを確認しておきます。
この時点でもアニメーションの調整はできますが、ゲーム実行中でのインスペクターへの変更は反映されませんので注意が必要です。。
＜実装動画＞
動画ファイルへのリンク
宝石のアニメーションの確認とともに、宝石にプレイヤーが侵入しても、まだ獲得することが出来ません。
それは当然のことながら、そのような機能がまだ実装されていないためです。
次の手順では、宝石の獲得機能の実装を行い、宝石にプレイヤーが侵入したら宝石がゲーム画面から消えるように機能を追加します。
実際に自分でプロジェクトを作成する場合にも、このように、機能を１つずつ分解して、順番に実装を行っていくようにするとよいでしょう。
以上でこの手順は終了です。
=> 次は 手順１２ ー宝石の獲得機能の追加ー です。
コメントをかく