Subscribe to GameFromScratch on YouTube Support GameFromScratch on Patreon

28. September 2015

 

Now that we have covered 3D basics and loading and creating static meshes now it’s time to move on to loading and using animated models.  Godot currently supports animation only in COLLADA format, which is supported with varying degrees of success in all popular 3D modelling applications.  If you are exporting from Blender, consider using the Godot Blender exporter plugin instead of the built in exporter.

 

As always there is an HD video of this tutorial available here.

 

In the video I show the entire process of creating the animated mesh in Blender.  If you want to see how it is done, I recommend you watch the video.  Unfortunately I could not get COLLADA to export multiple named animations, so I had to create all the animations along a single timeline.  If you work in Maya or Max it may be possible to get named animation clips to work correctly.

EDIT – I was mistaken about how to export multiple animations using the Better Collada plugin.  It does in fact work and the process is demonstrated in this video.  Sorry for that.

 

Here is the model and animation we are working with:

animatedModel

It’s 100 frames of animation in length driven by 3 bones.

 

Importing a 3D Model

 

First let’s start with the process of importing a 3D model.   In Godot a 3D Model is imported as a scene.  This means it will also have all of the miscellaneous things included in your scene, such as lights and cameras.  Be sure to remove those or not export them if you do not want them as part of the hierarchy.  Also be sure to save your existing scene before importing a new model, as unsaved changes will be discarded.

 

Godot only supports dae (COLLADA format) models.  Import by selecting Import->3D Scene.

image

 

In the resulting dialog, you have to select a file, as well as a location to put it.  There are several other things we can set controlling how the mesh is imported, how textures work and even defining animation clips, but the defaults will work for now.

image

 

Again, be certain to save your scene before you click Import and Open!

 

Now your model will load in a new scene.  It will default oriented about the origin and there is a good chance your camera will be inside your model, simply use the scroll wheel to zoom out.

 

image

 

Note that the scene has the same name as your model by default.  Notice also the hierarchy of nodes it created.  At the top is a Spatial, and if you have a skeleton attached and Armature exists with the Mesh(es) as children.  If there are animations, there will also be an AnimationPlayer node created.  This is what we are going to focus on next.

 

Splitting Animations

 

We want to split our single long animation into a pair of smaller animations.  Note that in the import that default FPS of the animation was set to 15FPS ( you can change it if you wish ).  Select the AnimationPlayer Node and look in inspector.  If you didn’t specify any clips in the import process you will have simple “Default”.  If you go to Play you can set the animation that plays on start up:

image

 

With the AnimationPlayer selected you will also see that the animation editor is shown at the bottom:

image

 

Using this tool, you can duplicate the default animation twice and then crop each animation accordingly.  We actually already covered using the AnimationPlayer editor in this post so I wont be covering it again.  If you struggle with the process however, simply watch the video and it is shown in detail.  I created two animations, BendForward and BendUp by copying and halving the default timeline.

 

Creating a Model Instance

 

Now that we’ve got a model to work with, let’s flip back to our original scene and put it to use.  Save your scene, then in Godot select Scene->Go To Previous Scene, or simply load the .scn file.

image

 

Now we add an instance of our scene to our scenegraph.  Click the + icon:

image

 

In the file dialog, select your recently created scene.  Your scene graph should now look like this:

image

 

And your model should now appear in your scene.  Not the drop down icon beside the node, this can be used to open that scene or to toggle the visibly of child nodes in your parent scene:

image

 

Playing Animation

 

Now that we’ve got our model in our scene and our animations defined, let’s play them in code.  The process is remarkably simple.  Attach a script to the root of your scene and add the following code:

image

 

As you can see, you access the nodes just like any other in Godot.  There is even autocompletion on the available animations in the play() method!  That’s all you need to do to play the animation.  If you refer to the earlier animation tutorial, all the same logic can be used to create extremely complex animation systems.

 

The Video


Programming , ,

25. September 2015

 

Building on the previous 3D Godot Engine tutorial, today we are going to look at dealing with static meshes in Godot.  That is, meshes that don’t change and do not contain animations.  We will look first at loading a 3D model in OBJ format, apply a texture, then finally look at programmatic mesh creation.  Then in the follow up tutorial, we will look at importing and using animated (COLLADA) meshes.

 

As always there is an HD video version of this post available here.

 

Importing a 3D Static Mesh

 

For simple non-animated models you can import them using the OBJ format which is supported by just about every single content creation tool available, but is very limited in functionality.  First of course you are going to need a 3D model in OBJ format to work with. If you are incapable of creating one yourself, there are plenty available on OpenGameArt.org.  Personally I just opened Blender and textured mapped a simple cube with a test pattern like so:

image

 

Be sure to save your texture externally if you go this route!  Another thing to notice is that the up axis in Blender is Z, while the up axis in Godot is Y.  Notice the orientation of the texture in the above image.  When you export your OBJ file from Blender, you can select the UP axis:

image

 

It beats rotating everything by hand, no?

 

Importing your Model into Godot

Importing a OBJ format model is trivial in Godot.  Simply select Import->3D Mesh.

image

 

The following dialog will appear:

image

 

For the most part you will keep the defaults as they are, however if you made use of smoothing in your DCC, you may want to enable it here.

 

Instancing a Mesh

 

Now that we have our model loaded, we can create an instance of it.  As you may be able to guess, we use the node MeshInstance, which of course is a Spatial.

image

 

You can have multiple instances of the same mesh.  However if you are going to have several instances of the same mesh, and they are relatively close together instead use MultiMeshInstance.  It’s a Node for optimizing performance.  If you have several instances of the same mesh, MultiMeshInstance will batch them all together into a single draw call.  For now though let’s focus on MeshInstance.  Create a new one in your scene like so:

image

 

Now in the Inspector select the Mesh and pick the mesh you just imported:

image

 

You should now see your imported object in your scene:

image

 

But UGH, no texture.  Let’s fix that.  Select Material Override and choose New FixedMaterial:

image

 

Next import your image into Godot as 2D Texture:

image

 

Now select the fixed material  again and edit:

image

 

Scroll down and locate Textures->Diffuse, then Load:

image

 

Select your texture map.  Now you should see:

image

Woot, textured 3D object.

 

Now there was a TON of stuff we just glossed over.  There are dozens of settings you can set on the FixedMaterial, then there was the ShaderMaterial, which enables you to use a GLSL shader on your 3D object.  We will cover these at a later point in time.

 

Dynamic Geometry

 

Sometimes you may find need to create your geometry dynamically.  Godot fully supports this, in fact there are two way to go about it.  The first is using an ImmediateGeometry node.  This provides an OpenGL 1.1 like fixed pipeline interface for creating geometry.  It’s intended for geometry that is going to change often.  I added an ImmediateGeometry node to my scene, then attached the following script:

extends ImmediateGeometry

func _ready():
  self.begin(VS.PRIMITIVE_TRIANGLES,null)
  self.add_vertex(Vector3(0,2,0))
  self.add_vertex(Vector3(2,0,0))
  self.add_vertex(Vector3(-2,0,0))
  self.end()

When run:

image

 

You can also generate a mesh dynamically using SurfaceTool.  A more expensive process, so not something you are going to want to change on a frame by frame basis.  In this case we use MeshInstance just like we did when we loaded the Obj file, but in this case we create the mesh instead of loading it from file.

 

Here is the script to create a triangle, this time with UV information specified so it can be textured:

extends MeshInstance

#export(FixedMaterial)    var material    = null

func _ready():
  
  var surfTool = SurfaceTool.new()
  var mesh = Mesh.new()
  var material = FixedMaterial.new()
  material.set_parameter(material.PARAM_DIFFUSE,Color(1,0,0,1))
  
  surfTool.set_material(material)
  surfTool.begin(VS.PRIMITIVE_TRIANGLES)
  
  surfTool.add_uv(Vector2(0,0))
  surfTool.add_vertex(Vector3(-10,-10,0))
  
  surfTool.add_uv(Vector2(0.5,1))
  surfTool.add_vertex(Vector3(0,10,0))
  
  surfTool.add_uv(Vector2(1,0))
  surfTool.add_vertex(Vector3(10,-10,0))
  
  
  surfTool.generate_normals()
  surfTool.index()
  
  surfTool.commit(mesh)
  
  self.set_mesh(mesh)
  

 

Now when you run it:

image

 

Explaining how to generate a mesh, what UV coordinates are, etc are way beyond the scope of this tutorial.  Most introductory OpenGL or Direct3D tutorials will give you the knowledge you need to create geometry programmatically.

 

Notice in the example above the line that is commented out?

 

export(FixedMaterial)    var material    = null

This is an EXTREMELY powerful feature of Godot, enabling you to use built in editors to set values of your game objects.  Uncomment that line and comment out the FixedMaterial.new() line and look at your object in Inspector:

image

 

By simply exporting a var from your node you get editor access.  Very cool.

 

That’s it for now.  In the next tutorial we will look at loading more complex COLLADA models with animations.  By the way, if you are looking for a great primitive library, or a more indepth procedural mesh example, be sure to check out this project.

 

The Video

 


Programming , ,

23. September 2015

 

The newest version of Blender is now available for those willing to walk on the wild side.  It’s RC1, meaning Release Candidate 1 or in other words… try thisSplash 276.png version and tell us what bugs you encounter!  For the most part though, I have found previous RC versions to be quite stable and I am a huge fan of shiny and new.  Speaking of which, this release brings a number of new features:

 

In this release:

  • Initial support for Pixar's OpenSubdiv geometry subdivision technology.
  • A huge view-port performance boost.
  • Big file browser performance boost and arrow keys navigation support.
  • Node auto-offset feature that helps organizing node layouts.
  • Absolute grid snapping in the 3D view.
  • Sculpting with tiled strokes.
  • Text effect strips for the sequencer, supporting subtitle export
  • And: 100s of bug fixes and other improvements!

New functionality by category:

 

Cycles Renderer

 

  • New Point Density Texture
  • Improvements for AMD GPUs (stability on Windows / Linux and compatibility with OSX El Capitan).
  • Camera zoom motion blur support
  • Support for extended and clipped image texture extension.

 

User Interface

 

  • Viewport: The ongoing viewport project brought a big performance boost
  • Node Editor: Auto-offset of existing nodes when adding a new one
  • File Browser:
    • Arrow-key navigation and selection.
    • Huge rework of internal code, now quicker & lighter.
  • It's now possible to get the correct (user edited) shortcuts of modal operators
  • And more!

 

Modeling

 

  • Two new tools: Flatten faces and edge offset
  • Data Transfer supports transferring data between equal meshes better
  • Absolute grid snapping for the 3D view was added
  • Displace modifier custom normals support
  • And more!

 

OpenSubdiv

 

  • Initial integration of the Pixar OpenSubdiv library
  • Greatly improves viewport playback performance
  • GPU tessellation support
  • Improves edge sharpness
  • And more!

 

Sequencer

 

  • New text effect with capability of exporting as subtitles was added
  • Improved AltRMB Template-RMB.png selection behavior

 

FreeStyle NPR

 

  • Freestyle memory consumption was reduced
  • New stroke modifiers were implemented

 

Sculpting/Painting

 

  • Weight paint smoothing.

 

Animation

 

  • Clean channels tool was introduced that helps organizing channels
  • A new add-on to create bone selection sets is bundled
  • And more!

 

If you are interested in trying Blender 2.76 out, click here.  I have been waiting a very very long time for a flatten faces option, as the current workaround is a horrible hack.

Art

23. September 2015

 

LibGDX, the cross platform, Java based, open-source game development library just released version 1.7.  I have to admit, not the most exciting release notes ever mind you…

 

image

 

[1.7.0]

- Gdx.input.setCursorImage removed, replaced with Gdx.graphics.setCursor and Gdx.graphics.newCursor see https://github.com/libgdx/libgdx/pull/2841/
- Fixed an issue with UTF8 decoding in GWT emulation of InputStreamReader
- Updated to RoboVM 1.8 for iOS 9 and Xcode 7 support 

If you have a game on the iOS App Store, make sure it works on iOS 9. If not, recompile with RoboVM 1.8 and Xcode 7 and resubmit it to the App Store!

Update your project as usual. Also update your RoboVM Eclipse or IntelliJ IDEA plugin to 1.8.0!. If you are on a Mac, consider using RoboVM Studio. It will take away all the setup pain for you

Happy coding!

 

If you are interested in learning more about LibGDX, GameFromScratch.com has two comprehensive tutorial series for you, one in text, the other in video format.

 

RoboVM Studio is something I very  much have to check out.  It’s basically a fork of IntelliJ 15 with the RoboVM stuff preinstalled and preconfigured.  As IntelliJ is my Java weapon of choice, next time I am working with iOS i’ll have to give this a go.

News

22. September 2015

 

In this next part in the ongoing Godot Tutorial Series we are going to begin looking at how you work in 3D in the Godot game engine.  Today we are going to cover the basics of 3D, followed shortly by another tutorial on working with 3D models.  As always I assume you have gone through the previous tutorials in the series or understand the concepts they cover.

 

There is an HD video version of this tutorial available here.

 

3D in Godot

 

After working with 2D in Godot, you will find that 3D is remarkably similar.  No doubt you have been overlooking the interface since the first day you loaded Godot:

image

 

The scene works remarkably similarly, you create a hierarchy of nodes that compose your 3D scene.  In 2D, the root class for displayable nodes was CanvasItem.  In 3D, the base class is instead Spatial:

image

 

Creating a Simple 3D Scene

 

Now let’s assemble a simple 3D scene.  Beyond a TestCube, Godot does not have any built in 3D primitives, so a cube we shall test with!

 

As it was with the 2D world, you still need a root node to hold your scene, in this case I am going to use Node.  Now let’s go ahead and add a Cube at the world origin.  The node name is TestCube:

image

 

So your scene should look like:

image

 

And in the 3D view:

image

 

Now let’s pause a moment to discuss working in 3D…

 

3D Navigation and Editing

 

The 3D Panel in Godot works quite similarly to the 2D view, however different angles and viewports come into play.  One important thing to realize up front is the axis directions in Godot.  Godot is a Y-up engine.  That is, the Y axis represents up and down on your screen, while X represents left and right.  The Z-axis then represents depth… imagine you had the ability to push your hand into your monitor… that would be the Z-axis.  Keep in mind, different tools use different up-axis, so you have have to take this into account when importing models.

 

It’s also often handy to have multiple viewports open when placing things in 3D.  This can be accomplished using the View menu:

image

 

Here is the result of a 4 viewport view ( also available by hitting Ctrl + 4 ):

image

 

You can set the individual camera of each view by clicking the label at the top left corner of a viewport:

image

 

You can also freely rotate the camera.  By default the controls are:

  • Scroll Wheel – Zoom in and out
  • Middle Mouse Button – Orbit
  • Shift + MMB – Pan
  • Ctrl + MMB – Zoom

Modifying entities in the scene is a bit different than 2D as there is now an additional axis.  You still translate, scale and rotate using the same toolbar and hotkeys:

image

 

However, the resulting widget is a fair bit different.  There is a color coded widget per axis, enabling you to make edits a single axis at a time.  Here for example is a rotation in effect:

3DWidget

 

Each axis is colour coded.  Red is the x axis, green is y, while blue is z.  You can see each axis rendered in the grid behind with the matching colour scheme.

 

You can also transform using direct numeric entry, via the Transform-> Transform Dialog… menu:

image

Then…

image

 

If you come from a different 3D background, there are actually several settings to make Godot perform in a way you are more familiar with.  Click settings at the top right corner of the IDE and there are a number of 3D settings you can configure including configuring Godot to work like Maya or Modo if you prefer.  You can also resize the gizmo and alter it’s transparency, etc.

image

 

 

Creating a Camera

 

Ok, now that you know how to navigate around the 3D interface, let’s hop back to our 3D scene and add some life.  Even though you’ve added a box to our world, if you run the game you will see nothing.  There are a couple reasons for this, the first of which is that there is no camera in the scene.  Unlike a 2D game, the default viewport isn’t enough, you have to create a camera.

 

A camera is simply a Spatial derived node, simply add one to the root of your scene:

image

 

Be sure you add the Camera node inherited from Spatial, Camera2D will not work.  Additionally InterpolateCamera is probably not what you want either… think of that class as more like a Camera Swing  arm that helps move the camera around instead of as a camera itself.  I will probably cover this in the future.

 

Once the camera is added to the scene, be sure to move it so it can see your cube, like so:

image

 

With a camera in the scene, you can click the “Preview” button at the top right corner of any view to preview what a camera sees.  This is one of the ways a split view certainly comes in handy, use one or more views for positioning your scene, and dedicate one to previewing your camera.

 

If you look down at the Inspector with your camera selected, you will see that there are several settings:

image

 

Projection determines the type of your camera, Perspective or Orthogonal.  With a perspective camera, as things get further away ( z-axis ) they appear to be smaller, mimicking the way the human eye works.  With an orthographic camera, sizes stay the same.  As a general rule, a 3D game uses perspective, a 2D game use orthographic.

Fovy is the field of view, or the number of degrees along the Y axis the camera can see.  A FoV of 180 for example would allow you to see both your left and right hand if you held them out to your side.  Most games however use much lower values.  On consoles 60-75 are typical values, while on a PC where you are much closer to the monitor, a higher value like 90 is often used.

Near and far values control how close the camera starts recording, and how far out it captures an image.  Basically this is the “range” of the camera.  FOV, Aspect Ratio and Near/Far plane all go together to calculate the camera’s view frustum.

The Current value is very important if you have multiple camera’s in your scene.  Whichever one is flagged as current is the one that will be rendered.  If only one camera is specified, current does not need to be set.

 

Adding a Light

 

If you press play at this point, you will still see nothing, as there is no light in the world.  Just like in real life, no light, no visibility.  There are three options available for lighting:

image

 

An omni light is like a light that radiates in all directions.  This a typical table lamp without a lamp shade.

A spot light on the other hand is a light with a defined beam and direction.  Think headlights on a car or the light of a flashlight.

A directional light on the other hand is basically a massive light source with a direction and that’s about it.  Think… the sun.

 

In this example lets fake a sun by adding a directional light to the scene. At this point your scene should look something like this:

image

 

The directional light shows up as a big wireframe arrow in the 3D scene.  Using movement and rotation, position it so it’s shining down on your box on an angle, like so:

image

 

You will notice in the Inspector you can now set properties for both the light and the shadows it creates:

image

 

In this case we will stay with default settings.  The most important settings you will see in those dialogs are Shadow, which enables you to turn shadow generation on and off, Colors, which sets the color of the light, and Energy, which sets the intensity of the light. 

 

Now that we finally have a camera, a light and a 3D object, if we press play we should see:

image

TADA!  Your first Godot 3D application!

 

The Video

 

Programming , ,

Month List

Popular Comments