YouTube KidsCanCode 2019年03月1日より。
ハイライト:
-
3Dエディタでの操作方法
-
3Dオブジェクトの作成と操作方法
-
メッシュやカメラなど、Godotに欠かせない3Dノードの扱い方
Godot 101:Intro to 3D (part 1/7)
00:01 | Welcome to Godot one on one tutorial series where you learn how to use the Godot game engine. | Godotゲームエンジンの使い方を学ぶ「Godotワン・オン・ワン」 チュートリアル・シリーズへようこそ。 |
00:06 | In this set of tutorials, we're going to dive into the 3D side of things. | 今回のチュートリアルでは、3Dの側面を学びます。 |
00:10 | We'll look at how to navigate in a 3D editor; | 3Dエディタでの操作方法を見ていきます。 |
00:12 | how to create and manipulate 3D objects; | 3Dオブジェクトの作成と操作方法。 |
00:14 | and how to work with with some of Godot's essential 3D nodes, such as meshes and cameras. | メッシュやカメラなど、Godotに欠かせない3Dノードの扱い方を説明します。 |
00:19 | Ready? let's get started. | では、さっそく始めましょう。 |
00:22 | When you first open a new project in Godot, you'll see the 3D view. | Godotで新しいプロジェクトを初めて開くと、3Dビューが表示されます。 |
00:27 | And in a 3D viewport, the first thing you'll notice is the three colored lines. | 3Dビューポートでは、まず、3本の色付きの線に気づくでしょう。 |
00:32 | The red is the X axis, the blue is the Z axis and the green is the Y axis. | 赤がX軸、青がZ軸、緑がY軸です。 |
00:38 | So in Godot we're using in 3D the Y axis up. | Godot 3Dでは、Y軸を上にして使っています。 |
00:44 | Some other 3D programs might use different orientation. | 他の3Dプログラムは、異なる方向を使用する場合もあります。 |
00:48 | Some use Z up. | Z軸を上にするものもあります。 |
00:50 | but in Godot the X and Z are the plane, and the Y is the up and down axis and positive Y is up. | しかしGodotでは、XとZが平面で、Yが上下の軸、Yの正の値が上になります。 |
00:59 | This color scheme is going to continue throughout the interface. | この配色はインターフェイス全体で継続していきます。 |
01:02 | The green for the Y, the red for the X and the blue for the Z. | 緑はY、赤はX、青はZを表します。 |
01:07 | You'll see that in the Inspector later. | これは後でインスペクタで確認できます。 |
01:09 | Now navigating around in 3D is performed using the mouse and the keyboard together. | さて、3Dでの操作は、マウスとキーボードを併用して行います。 |
01:15 | So here are the main controls. | 主な操作方法は以下のとおりです。 |
01:17 | The mouse wheel is going to Zoom you in and out. | マウスホイールは、ズームインとズームアウトを行います。 |
01:22 | The middle button, if you click the middle button and drag, you will orbit the camera around whatever object you're looking at. | 中央ボタンを押してドラッグすると、見ている対象物の周りをカメラが回るようになります。 |
01:30 | Holding down shift while you drag with the middle button will pan the camera. | Shiftキーを押しながら中央ボタンでドラッグすると、カメラをパンできます。 |
01:35 | So moving the camera horizontally and vertically but not changing which way it's pointing; | カメラの向きは変えずに、水平方向と垂直方向にカメラを動かすのです。 |
01:41 | and then right clicking and dragging will actually rotate the camera. | そして、右ボタンを押してドラッグすると、実際にカメラを回転させます。 |
01:45 | So the camera is not moving, but it's rotating. | カメラは動かずに回転するのです。 |
01:49 | Another navigation method you can use is if you press shift F, you'll be taken into free look mode; | もうひとつのナビゲーション方法として、シフト+Fを押すと、自由視点モードになります。 |
01:57 | which means now just moving all I'm doing is moving the mouse, and then by using WASD you can fly around. | つまり、マウスを動かしているだけで動き、WASDを使って飛び回ることができます。 |
02:04 | This is similar to the UI that's using a lot of the control screen that's using a lot of 3D games. | これは、多くの3Dゲームで使われている操作画面のUIに似ています。 |
02:11 | And you press shift F again. It'll toggle back out of that mode. | もう一度シフトFを押すと、そのモードから切り替わります。 |
02:15 | Now you can also control the camera using the perspective button up in the top left. | また、左上の遠近ボタンを使ってカメラを操作できます。 |
02:20 | This lets you snap the camera to a certain view, top down from the front from the left, et cetera. | これにより、上から下、前から左からなど、特定のビューにカメラをスナップさせることができます。 |
02:28 | And so depending on where your objects are and how they're arranged; | オブジェクトの位置や配置に応じて、特定のビューにスナップさせることもできます。 |
02:32 | that can let you snap to a particular position and view it from the angle that you want to view it from. | 特定の位置にスナップして、見たい角度から見るのです。 |
02:42 | So let's add our first 3D node. | それでは、最初の3Dノードを追加してみましょう。 |
02:45 | So if you go over here to create root node when you click on 3D scene, it's going to add a spatial node. | ここで「3Dシーン」をクリックしてルートノードを作成すると、空間ノードが追加されます。 |
02:52 | And the spatial node in 3D is the equivalent of the node 2D when you're in 2D space. | 3Dの空間ノードは、2D空間にいるときの2Dノードに相当します。 |
02:58 | All of the 3D nodes inherit from it, and it has a set of properties that all 3D objects are going to need. | すべての3Dノードはこのノードを継承します。3Dオブジェクトが必要とするプロパティのセットを持っているノードです。 |
03:06 | Now, first thing you'll notice, once you add it is this object appeared in the center these arrows and circles. | さて、ノードを追加して最初に気づくのは、中央に矢印と円のオブジェクトが現れていることです。 |
03:14 | This is not the node. This is called a Gizmo. | これはノードではありません。これは「ギズモ」と呼ばれるものです。 |
03:18 | Gizmos are used to move and Orient your 3D objects on the screen. | ギズモは、スクリーン上の3Dオブジェクトを動かしたり、向きを変えたりするのに使われます。 |
03:24 | Notice that they're color coded along with the axes. | 軸と一緒に色分けされていることに注目してください。 |
03:28 | And so to use the Gizmo, you can grab the arrows. | ギズモを使うには、矢印をつかみます。 |
03:33 | So grab the green arrow, I'm moving it up and down along the Y axis. | 緑の矢印をつかむと、Y軸に沿って上下に動かしています。 |
03:37 | I grabbed the blue arrow, I'm moving it along the Z, and so on. | 青い矢印を掴むと、Z軸に沿って移動します。 |
03:41 | And the rings are used to rotate the object. | そして、リングはオブジェクトを回転させるために使います。 |
03:44 | So if I grab the red ring, I'm going to rotate it around the X axis. | 赤いリングを掴むと、X軸を中心に回転させます。 |
03:49 | And so by using the Gizmo, you can arrange and Orient your objects where they need to be. | このように、ギズモを使うことで、オブジェクトを必要な場所に配置したり、向きを変えたりすることができます。 |
03:56 | Gizmos can operate in two different modes. | ギズモは2つの異なるモードで動作します。 |
03:59 | By default, they're in global mode, which means they are aligned with the global X, Y, and Z axis. | デフォルトでは、グローバルモードになっています。つまり、グローバルなX、Y、Z軸に合わせて配置されます。 |
04:05 | So even if I move along Z over here and I move along X and let's say I rotate it; | そのため、ここでZ軸に沿って移動し、X軸に沿って移動し、仮に回転させたとしても、ボディは回転しますが、軸は回転しません。 |
04:13 | the body rotates, but the axes are still pointing parallel to the global axis. | ボディは回転しますが、軸はグローバル軸に平行になっています。 |
04:20 | If I pull up, it's going to move up along the y axis. | 上に引っ張れば、Y軸に沿って上に移動します。 |
04:24 | Moving back here. And the other mode is called local mode. | ここで後ろに移動します。もう1つのモードは、ローカルモードと呼ばれているものです。 |
04:28 | And if you go over here, you see the button here toggles between global and local space mode. | 立方体の形をしたこのボタンを押すと、グローバル・スペース・モードとローカル・スペース・モードを切り替えることができます。 |
04:34 | And you can press the letter the T key on your keyboard to toggle that. | キーボードのTキーを押しても、モードの切り替えができます。 |
04:39 | When we're in local space mode, now if I rotate around the X axis, so do the arrows. | ローカル・スペース・モードでは、X軸を中心に回転させると、矢印も回転します。 |
04:47 | So now these arrows are representing the bodies local X, Y, and Z. | つまり、これらの矢印はボディのローカルなX、Y、Zを表しています。 |
04:52 | So if I move it along the Z, it's going to go off in this diagonal direction. | つまり、Z軸に沿って動かすと、このように斜めの方向にずれていきます。 |
04:56 | And I'm up above the plane. | そして、平面の上にいるようになります。 |
05:00 | So depending on how you're moving your object, toggling between local and global space will help you get it to where you want it to be. | このように、オブジェクトの移動方法に応じて、ローカル空間とグローバル空間を切り替えることで、目的の場所にオブジェクトを移動させることができます。 |
05:11 | Now let's look at the Inspector for the spatial node. | では、空間ノードのインスペクタを見てみましょう。 |
05:14 | Over here under transform, you'll see you have three properties translation, rotation, and scale. | ここの「トランスフォーム」には、「トランスレーション」「ローテーション」「スケール」の3つのプロパティがあります。 |
05:21 | So unlike the 2D nodes which have position, translation is the equivalent. | 位置を持つ2Dノードとは異なり、移動がそれに相当します。 |
05:27 | So you see, if we start moving it along the Z, the Z changes. We move along while the Y changes. | Zに沿って動かし始めると、Zが変化します。Yに沿って動かすと、Yが変化します。 |
05:35 | and so on. And a quick note about units. | そんな具合です。あと、単位についての注意点です。 |
05:39 | In 3D, one unit is typically considered to be 1 meter. | 3Dの場合、1単位は一般的に1mとされています。 |
05:46 | You can really have it represent whatever you want. | どんな単位で表現してもかまいません。 |
05:49 | If you're making a game where everything's microscopic and you're running around in a microscopic world, each unit might be 1 mm. | もし、すべてがミクロの世界で走り回るようなゲームを作るのであれば、1単位は1mmかもしれません。 |
05:57 | But in general, each unit that you move is 1 meter. | しかし、一般的には、移動する単位は1メートルです。 |
06:03 | And so an object that's 1 meter Cube would be the size of this grid that you see right now. | つまり、1立方メートルのオブジェクトは、今見ているこのグリッドのサイズになります。 |
06:10 | And now if I rotate, you'll see the rotation numbers change. | これで回転させると、回転数が変わるのがわかると思います。 |
06:15 | And so on. | といった具合です。 |
06:17 | You can use those in the same way that you would use the properties in 2D. | これらは、2Dのプロパティと同じように使えます。 |
06:22 | Just like a Node 2D, a spatial has no size or appearance of its own. | 2Dのノードと同じように、空間にはそれ自体のサイズや外観はありません。 |
06:27 | In 2D, you do the Sprite to add a texture to your node so it would be visible. | 2Dでは、スプライトを使ってノードにテクスチャを追加し、見えるようにします。 |
06:33 | In 3D you need to add a mesh. | 3Dでは、メッシュを追加する必要があります。 |
06:35 | A mesh is a mathematical description of a shape. | メッシュとは、形状を数学的に記述したものです。 |
06:40 | It consists of a collection of points called vertices; | メッシュは、頂点と呼ばれる点の集まりで構成されています。 |
06:43 | and these vertices are connected by lines which are called edges, and multiple edges together make a face. | これらの頂点は辺と呼ばれる線で結ばれており、複数の辺が集まって面を構成します。 |
06:51 | For example, here's a picture of a Cube, and so the corners are the vertices, and there are eight of those. | 例えば、これはCubeの絵ですが、角が頂点で、8つあります。 |
06:59 | The edges are the connections between the vertices, twelve of those. | 辺は頂点間を接続し、12本あります。 |
07:03 | And the faces are the square surfaces that are formed by the edges, which are six in a Cube. | 面は辺によって形成される正方形の表面で、Cubeでは6つあります。 |
07:12 | So typically meshes are created using 3D modeling software such as Blender. | メッシュは通常、Blenderなどの3Dモデリングソフトウェアで作成されます。 |
07:16 | You can also find collections of them online to download. | また、オンラインでコレクションを見つけてダウンロードすることもできます。 |
07:20 | However, sometimes you just need a basic shape, such as a Cube or a sphere. | しかし、時には、Cubeや球体などの基本的な形状が必要な場合もあります。 |
07:24 | In this case, Godot provides a way to create simple meshes called primitives. | そのような場合、Godotではプリミティブと呼ばれる単純なメッシュを作成する方法を提供しています。 |
07:29 | So let's add a mesh instance to our spatial. | では、空間にMeshInstanceを追加してみましょう。 |
07:36 | The mesh instance represents a mesh. | MeshInstanceはメッシュを表します。 |
07:38 | And over here you can see in the Inspector mesh property is empty. | インスペクタではメッシュのプロパティが空になっています。 |
07:43 | So if we click the down arrow, you can see you could load a mesh that you have, or you can create one of these primitives. | 下矢印をクリックすると、手持ちのメッシュを読み込むか、プリミティブを作成することができるのがわかります。 |
07:51 | Let's select the Cube. | ここでは「キューブ」を選択します。 |
07:55 | Now let's save our scene and run it and see what our Cube looks like in game. | それでは、シーンを保存して実行し、ゲーム内でキューブがどのように見えるか見てみましょう。 |
08:03 | It looks like nothing. | 何も見えませんね。 |
08:04 | And that's because in 3D, you won't see anything in the game window unless you have a camera to tell Godot what you want rendered in the game viewport. | なぜなら、3Dでは、ゲームビューポートにレンダリングされたいものをGodotに伝えるカメラがない限り、ゲームウィンドウには何も見えないからです。 |
08:18 | So we need to add a camera to our scene. | そこで、シーンにカメラを追加する必要があります。 |
08:25 | So I've added the camera. | カメラを追加しました。 |
08:27 | Here's a Gizmo. Let's move it out of the box so that we can see it. | ここにギズモがあります。これをボックスの外に出して、見えるようにしましょう。 |
08:31 | So that is our camera. | これが私たちのカメラです。 |
08:33 | This pink, pinkish, purple pyramid here is the cameras represents the camera's view. | このピンクっぽい、紫のピラミッドがカメラで、カメラの視界を表しています。 |
08:39 | So it's facing this way. | こちらを向いています。 |
08:42 | And the little triangle up here on top shows you the top of the camera. | 上にある小さな三角形は、カメラの上部を示しています。 |
08:46 | You can always check what the camera sees by clicking the preview button here. | カメラが何を見ているかは、ここで左上のプレビューボタンをクリックすればいつでも確認できます。 |
08:51 | That's what the camera sees. | これがカメラが見ているものです。 |
08:52 | So if we wanted to, we can move the camera up a bit, rotate it to point down a bit, and then it's going to be looking at the Cube like that. | カメラを少し上に動かし、回転させて少し下に向ければ、このようにCubeを見ることができます。 |
09:04 | Now, if we play the scene, we will see what that camera sees. | さて、このシーンを再生すると、そのカメラが見ているものを見えるようになります。 |
09:11 | You might notice that this Cube appears kind of a light bluish color, and in reality, this mesh is white. | 気づいたかもしれませんが、このCubeは薄い青みがかった色に見えますが、実際にはこのメッシュは白です。 |
09:21 | The blue color is coming from the ambient lighting. | この青い色は、周囲の照明によるものです。 |
09:24 | So in the next part, we're going to talk about how to light your scene and also how to change the appearance of your mesh using a material. | 次のパートでは、シーンを照らす方法と、マテリアルを使ってメッシュの外観を変える方法について説明します。 |
09:33 | Thanks for watching. And I'll see you in the next video. | ご覧いただきありがとうございました。また次のビデオでお会いしましょう。 |