![](https://illust55.com/wp-content/uploads/2021/12/image-22.png)
「かっこいい3D風景をつくりたい」
「ゲームの作り方を知りたい」
でも
「どうやればいいか、わからない」
と悩んでいませんか?
このページでは、だれでも、できる方法でゲームのつくり方を紹介しています
今回は、3Dゲームで背景を表示する方法とドラッグで360度カメラを動かす方法を紹介します
ぜひ、チャレンジしてください
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
つぎの目次の流れにそって進めます
Youtubeでさらにくわしく、ゲームのつくり方を紹介しています
・Unityをはじめて聞いた方
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
Unityとはゲームをつくためのソフトです
Unityは世界でもっとも使われているゲームをつくるためのソフトです
公式サイトからインストールプログラムをダウンロードすることができます
<Unity公式サイト>
https://unity.com/ja
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
Unityのインストールの方法を次のページで紹介しています
ぜひ、合わせてご覧ください
<UNITYのインストール方法と 初めての使い方を 紹介しているページ>
https://illust55.com/2018/
・HDRIとはなんなの?
![](https://upload.wikimedia.org/wikipedia/commons/thumb/2/25/20180121_Taipei%2C_Taiwan_Skyline_from_Xiangshan.jpg/800px-20180121_Taipei%2C_Taiwan_Skyline_from_Xiangshan.jpg)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
今回、ご紹介するHDRIは360度のパノラマ背景です
HDRIは360度見ることができる3DやVRのための背景です
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
前だけではなく、後ろ、上、下も背景になります
・無料3D背景のHDRI画像とドラッグで360度カメラを動かそう
・背景の部品をダウンロードしよう
![](https://illust55.com/wp-content/uploads/2021/12/image-1.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
無料の3D背景をダウンロードできるHDRIヘブンにアクセスしてください
1.無料の3D背景をダウンロードできるPolyヘブンにアクセスしてください
https://polyhaven.com/hdris
2.トップ画面の「HDRIs」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-2.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
HDRIが現れます
・背景にするHDRIをクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-3.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
「Download」のボタンをクリックするとダウンロードがはじまります
・「Download」のボタンをクリックしてください
・Unityに背景の部品をくわえよう
![](https://illust55.com/wp-content/uploads/2021/12/image-4.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
Unityを起動してください
1.「プロジェクト」をクリックしてください
2.「新規作成」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-5.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
3Dのプロジェクトをつくります
1.「3D」をクリックしてください
2.「プロジェクト名」、「保存先」を決めてください
3.「作成」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-6.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
ダウンロードした「HDRI」ファイルをドラッグ&ドロップしてください
1.「Assets」をクリックしてください
2.ダウンロードしたファイルをドラッグ&ドロップしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-7.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
読みこんだファイルをクリックしてください
1.読みこんだファイルをクリックしてください
2.「TextureShape」をクリックしてください
3.「Cube」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-8.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
背景に映すために「マテリアル」ファイルをつくります
1.空いている場所で右クリックをしてください
2.「Create」 → 「Material」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-9.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
3Dの背景に「マテリアル」の種類を変えます
1.現れた「Materialファイル」をクリックしてください
2.「Shader」をクリックしてください
3.検索ウィンドウに「cubemap」を入れてください
4.現れた「cubemap」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-10.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
HDRIファイルを「マテリアル」に設定します
・HDRIファイルを「Cubemap」にドラッグ&ドロップしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-11.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
背景の設定ウィンドウが現れます
1.「Window」→「Rendering」→「Lighting」をクリックしてください
2.「Lighting」のウィンドウが現れます
![](https://illust55.com/wp-content/uploads/2021/12/image-12.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
背景を設定します
1.「Environment」をクリックしてください
2.「Skybox」に「Material」をドラッグ&ドロップしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-13.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
背景が現れました
・「360度」の背景が現れました
※ 画面内でマウス右ボタンをドラッグすると周りを見ることができます
・3Dの背景をドラッグで360度見渡すプログラムをつくろう
![](https://illust55.com/wp-content/uploads/2021/12/image-14.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
このままではプレイ中にドラッグで、360度見ることができません
1.空いている場所で右クリックをしてください
2.「Create」 → 「C# Script」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-15.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
プログラムファイルをつくります
ダブルクリックするとプログラムを変えられるソフトが起動します
1.現れた「C# Script」をダブルクリックしてください
2.「Visual Studio」が起動します
![](https://illust55.com/wp-content/uploads/2021/12/image-16.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
次のプログラムを貼り付けてください
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
public class NewBehaviourScript : MonoBehaviour
{
public float speed = 3.5f;
private float X;
private float Y;
// Start is called before the first frame update
void Start()
{
}
// Update is called once per frame
void Update()
{
if (Input.GetMouseButton(0))
{
transform.Rotate(new Vector3(Input.GetAxis("Mouse Y") * speed, -Input.GetAxis("Mouse X") * speed, 0));
X = transform.rotation.eulerAngles.x;
Y = transform.rotation.eulerAngles.y;
transform.rotation = Quaternion.Euler(X, Y, 0);
}
}
}
・もとのプログラムを消して、すべて貼り付けてください
![](https://illust55.com/wp-content/uploads/2021/12/image-17.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
変えたことをセーブします
・「ファイル」 → 「保存」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-18.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
カメラのパーツをクリックしてください
・「Main Camera」をクリックしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-19.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
カメラのパーツにプログラムを加えます
・「C#ファイル」をドラッグ&ドロップしてください
![](https://illust55.com/wp-content/uploads/2021/12/image-20.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
テストプレイで確認してください
・「テストプレイボタン」をクリックしてください
・3Dの背景をドラッグで360度見渡せることを確認しよう
![](https://illust55.com/wp-content/uploads/2021/12/image-21.png)
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
テストプレイで360度、カメラを動かすことができます
・テストプレイ中でも、画面を360度ドラッグして見ることができます
※モバイルでもタップして、画面を360度見ることができます
まとめ
今回は、3Dゲームで背景を表示する方法、ドラッグで360度カメラを動かす方法を紹介しました
![](https://illust55.com/wp-content/uploads/2021/06/210631-男の子_立ち_見出し.jpg)
Youtubeでは、さらにおもしろく作り方を紹介しています
また、他のページでもゲームのつくり方について紹介しています
コメント