Building your first 3D game with the Q3D plugin

  • 9 favourites


Attached Files

The following files have been attached to this tutorial:



Download now 227.95 KB


15,845 visits, 33,656 views



This tutorial hasn't been translated.


This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Part II – The Event Sheet - The "SETUP" Group

Under the "OnStartOfLayout" condition, we have three things to set up: some basic things in Q3D, the car, and the random obstacles.

Setting up Q3D...

When you make a game of your own in Q3D, you will probably want to import 3D model files that were created elsewhere (i.e. Blender / 3DS Max / Maya). For simple objects, however, it might be easier to use the objects built into Q3D via three.js. We will be defining two of these objects: "Cube.geom" and "Cylinder.geom" for use as the car body, buildings, and wheels. These aren't actually files, but they are treated the same as a model file by Q3D.

In addition to the above, we want to narrow down the field of view of our camera to zoom in on the car. By setting the camera frustum to 15°, we can create a cone that is 30° wide. You can adjust this angle to zoom in or out. Note that this only has affects cameras in "perspective" mode. Cameras in "orthogonal" mode use a box with a width and height instead. The Q3D manual has a great discussion of this if you want to switch modes.

Setting up the car...

In this example, I have created a function called "createcar" which creates a car body + 4 wheels. Each wheel is attached to the car via a "limited hinge" joint which can rotate from -180° to 180°, giving the wheels a full 360° of rotation. The hinge axis is defined to be the y axis. I strongly recommend reading the Q3D manual for how to define axes.

The screenshot below shows the completed function:

Setting up the random obstacles...

In this tutorial we will create 6 randomly-size buildings that are spawned at random locations. The events for this setup is shown in the picture below:

For a real game, you will probably want to manually place objects on your layout. Because Construct 2 is designed for 2D, you need to think very carefully about 3D placement of objects on the 2D layout editor. You won't be able to visualize your results until you hit the "preview" button.

While working in Construct 2, I recommend laying out everything from a top-down view, then making your camera controllable as soon as you can so you can see how the scene looks from various perspectives. Give each object an x,y coordinate and an x,y size. Then give each object a z coordinate and a z size. If you are using the built-in three.js shapes "Cube.geom" and "Cylinder.geom", the object's original is the geometric center of the object, but if you use an actual 3D model file (.obj or .js), you can set the origin point manually.


  • Order by
Want to leave a comment? Login or Register an account!