We recently implemented support for 3D models in Construct. We're excited to announce the next step into 3D in Construct: the new 3D editing mode in the Layout View!
Construct's new 3D editing mode
Get started
If you want a quick and simple example using 3D to check out, open the First Person Shooter example. To try out the 3D editor, just click the new 3D button that appears in the top toolbar in the Layout View to switch into the new 3D editing mode.
Then there are a few ways to move the view around:
- Hold the right mouse button and move the mouse to look around. While still holding the right mouse button down, use the W, A, S, D, Q and E buttons to move around (or arrow keys and page up/down).
- Choose Enter free look mode from the view menu in the top toolbar, and then use the same keyboard keys to move around. Press Escape to end free look mode.
- Hold the middle mouse button and move the mouse around to orbit the view. Select an object and press F to focus the view on it and make that the center of the orbit.
- Hold shift while also holding the middle mouse button and move the mouse around to pan the view (similar to the A/D/E/Q buttons above).
- Scroll the mouse wheel to move the camera forwards/backwards.
Set the camera orientation
In some projects like the previously linked First Person Shooter example, you may find the camera orientation isn't what you want. It defaults to a "top down" perspective similar to the 2D editor. This works well for some types of projects like 3D platformers, but for this project it would be a more natural fit to use a "parallel to layout" view that matches the player's camera. You can do this by changing the camera orientation in the view menu.
Changing the camera orientation in the 3D editor.
A familiar editing experience
You should find many of the interactions and keyboard shortcuts you're already familiar with in the 2D editor also working in the 3D editor. This includes:
- Right-clicking objects to bring up a menu
- Using Ctrl+drag to create a clone
- Holding Shift for "axis lock" (moving along diagonals only)
- Holding Tab and clicking the selection to cycle through Z order
- Pressing Enter to "wrap" the selection and manipulate them together
- Snapping to grid, with new support for setting the grid size on the Z axis
You can learn more about using the 3D editor in the manual entry on the Layout View 3D view.
Unified editing
Our goal is to build a hybrid 2D and 3D engine, with unified editing experience. Contrary to some other tools, Construct's 3D editor is the very same editor and view used for 2D as well. It's all the same Layout View - the 3D mode just provides new tools in the same editor. There are no separate isolated editors - 2D and 3D content integrates seamlessly, as both can appear in both view modes. All content also renders consistently in both modes, using the same renderer - there's no need to switch to a different renderer to handle 3D content (which would also bring the risk of things rendering differently).
This allows for some fun ways to experiment with your projects. You can open a 2D project and look around it in 3D. Then you can play around with some 3D additions, such as by dropping in a 3D shape. You're not forced to decide between 2D or 3D - you can mix and match as you go along!
Implementing the 3D editor
Developing the 3D editor features has also been an interesting project. Construct's Layout View already used a 3D camera viewing a 3D world - it was just locked to a 2D top-down perspective with 2D editing tools. Implementing the 3D editor "just" meant allowing the camera to move freely, and then adding the "gizmo" to allow moving objects around in 3D. This was still a significant project, but internally many of the 3D editing tools have been integrated with the 2D editing tools. For example moving the selection with the gizmo in the 3D editor uses the same code as dragging the selection to move it in the 2D editor. This avoids duplicating editor code, and means both editing modes can make use of similar interactions - such as Ctrl+drag to clone, Tab+click to cycle through Z order, and so on. Overall this helps keep our codebase consistent, while also making sure the editing experiences between the two editing modes are similar, ensuring many of the same keyboard shortcuts and features from the 2D view work consistently in the 3D view.
More on the way
We have lots more planned! Our latest beta releases already have more, including:
- Scale editing mode to resize objects in the 3D view
- Editing mesh points with the gizmo in the 3D view
- Updates for 3D model, including a new stretch transform mode
- Usability improvements for 3D editing
We're also actively working on 3D rotation for more kinds of objects - including 3D Shape - so keep an eye on upcoming releases for that!
Video introduction
Our r487 release video on YouTube also starts with an introduction to the 3D editor, so take a look at that to see it in action.
Conclusion
Better support for 3D has been a long-standing request for many years. As we covered in our previous blog on 3D model support, after holding off for many years, we're now developing major new 3D features in Construct. The 3D editor is a big step forward for being able to use 3D in Construct, making it far easier to design 3D content and 3D worlds. It smoothly integrates 2D and 3D content, so you can do things like put down a Tiled Background for the floor, add in some 3D shape objects, add both sprites and 3D models, and edit everything with a proper 3D view. We can't wait to see what you come up with! Launch Construct in your browser now and try it out right away.