Q3D V-2.4

a 3D plugin suite for Construct 2 powered by three.js

Includes a total of 8 different plugins+ 3 behaviors for a huge variety of tasks from : Rendering, Models, 3D Collisions, 3D Sprites, Viewports, Raycasters, Lights, 3D Physics, Shaders, Morph Animation, Skeletal Animation, and tons of features for 3D game development in C2 for the web geared specifically to WebGL for great performance! Buy now and get future updates completely free! This plugin suite has hundreds upon hundreds of actions/conditions/expressions and properties available to developers, it's unprecedented for C2.

Q3D allows you to create entire 3D games, or supplement existing 2D games with 3D backgrounds or overlays. All programming is done in the Construct 2 event sheet, simplifying the task of 3D game development greatly compared to traditional three.js development.

Check out the TINY TANK demo for an idea of what's possible with the Q3D plugins!

UPDATE: Version 2.4

Changes:

The changes in this patch are comprehensive, the major ones are outlined here, however there are many small changes and bugfixes that are not.

Q3D has been updated to use the current latest three.js r71 version instead of the previous r69.

Bugs relating to R-69/R-71 blender exporter have SHOULD be fixed (some may have been missed)

A major bug was introduced with the "Destroy" optimizations when deleting object hierarchies since r189. This required a rewrite of the way destroying was handled, hopefully this is now fixed for good.

Some issues with morph controller have been fixed. Also Q3D Morph Controller has been renamed "Q3D Morph Anim." so that it doesn't get cutoff in the "add behaviour" dialogue.

You can now choose more "Editor Rep." Modes for Q3D Model to make laying things out easier. "Textured" uses the "DiffuseMap" animation to texture the model, and "LayoutIcon" uses the first frame of an animation you create called "LayoutIcon" as a graphic for identification.

Many other small things have been changed/fixed, which may lead to strangeness in old projects moving to this update. I'd like to apologize if this affects you, however it was necessary. If there are issues migrating, please feel free to ask for advice.

Added:

Q3D Models can now load in "geometries" created with Q3D Master "GEOMETRY" section actions.

In order to use this functionality a few things should be kept in mind.

Q3D Master has a section titled "Geometry". These actions allow for "custom" specified primitives to be generated at runtime.

These actions create a geometry in memory, which is assigned a name you choose using the action, for example "Cube", "Custom1", etc. you decide! This name should be unique, and without special characters (especially no periods ".").

To load a geometry in a Q3D Model, instead of specifying a model filename with extension, specify the geometry name with the extension ".geom". For example "Cube.geom", "Custom1.geom".

If the geometry hasn't been created by a Q3D Master action yet, it will load in automatically when it is. This is similar to the way loading of models already works.

Q3D Oimo Physics Behaviour added. This behaviour allows for fully 3D physics and has a great variety of features which are too comprehensive to all list in this changelog.

It suffices to say over 50 actions are available, and most features expected of a fast javascript physics engine!

Although this plugin uses Oimo.js library, It is a custom fork with additional functionality which I carefully tweaked from the outdated main project on GitHub, so it should be quite performant.

Because of the fact Q3D runs in javascript, this plugin only currently supports spheres/boxes, and has to cut some corners to achieve good performance. Nonetheless compound objects made of multiple primitives are possible using some actions.

In the future support for collision with arbitrary meshes may be possible, however after thorough investigation I have not found any fast enough solutions yet that would not bog down the CPU in a javascript engine.

Oimo was chosen over the more ubiquitous cannon.js because the communication layer between cannon (an emscripten port) and Q3D would have not been ideal, the choice was very difficult to make however i believe this was best, since this choice gives the best performance for game uses.

The behaviour was made to resemble the C2 physics plugin closely, however there are many necessary differences both due to the differences between Oimo and Box2D, and the differences between 2D and 3D. Nonetheless this plugin has much more functionality to help make it more usable than the physics engine in C2 (which lacks many things).

Some features may not work as expected. I've attempted to make things as simple as possible, but once again physics in 3D are very complex, so things like joints easily become confusing.

I've fixed many bugs in the physics library already, however there may be some i have missed. If you experience weird behaviour it's best to work around it, however bug reports are welcome (Some things may not be simply fixed however)

Q3D Skeletal Anim. Behaviour added. This behaviour is quite weird by C2 standards. It is only meant to be applied to Q3D Models, and takes care of handling all skeletal control tasks. Any model that must have bones/and or/skeletal animation needs this behaviour.

In most cases the "Bone Type-Index" property should not be changed. This value chooses the Q3D Bone type to associate to the specific model. The issue is that on export/shuffling of objects in the layout the index order MIGHT change, so having only one is best. Previously names were used but SDK limitations prevent this from working on export (a huge bummer)

To use this Behaviour and skeletal animations in general, one Q3D Bone plugin MUST be added to the project, or else it wont work, keep reading the changelog for more details about the Q3D Bone plugin and how/why it's needed/used.

This Behaviour works similarly to the Q3D Morph controller, managing multiple animations and tweening.

Skeletal animations are complicated, so care should be taken not to over use them, as they have a high CPU cost. Having many skeletal animations run simultaneously will be slow, and optimizing this is something i'm looking into, however it is again very complex, so design considerations must be made rather than "make this faster" wishes that may not be possible to fulfill.

The other properties of the behaviour control how animations are interpolated (speed vs. visual quality choices can be made here), and the other action relates to how bones are "fit" if colliders are being used. This is a good way to mock things up, play with the debug visibility on the Q3D Bones to investigate how the scaling works.

Q3D Bone added. This is essentially a "dummy object" that must be used in conjuction with Q3D Models with an applied Q3D Skeletal Anim. behaviour.

The reasons for having a "Q3D Bone" are numerous, however this plugin behaves in strange ways that must be understood by the user. The reason is to work around C2, and with it, to maximize the usefulness of the skeletal animation system + construct 2.

At least one Q3D Bone must be added to the project for you to be able to use the skeletal animation system, it is recommended you have only one since weird bugs can happen with more.

On start of layout all Q3D Bones added to the layout are instantly destroyed.

Under no circumstances should the "Destroy" action be called on Q3D Bones. This can ONLY AND ALWAYS CAUSE BUGS.

Q3D Bones are created automatically anytime a Q3D Model with Q3D Skeletal Anim. behaviour and a proper three.js json model file with animations/skeletal info is used.

Q3D Bones are destroyed automatically when their parent Q3D Model is destroyed. It is for this reason "destroying" bones is unecessary. The action only remains because it is FORCED to be there by the C2 SDK.

Q3D Bones support collisions, and can be picked / managed like most C2 objects. This means that you can test for collisions for each bone, you can parent objects to bones, etc. This allows for very complex functionality to be simply implemented using C2's picking.

Q3D Bones have various properties relating to debugging visualization, however in final projects to maximize performance it is best to make sure they have no debug created, and that they are invisible.

UPDATE: Version 2.3

Changes:

Q3D Model now has additional properties for controlling morph target normals and shading in the "lighting properties" section.

If no morph normals are defined in a file with morph targets, morph normals are generated. These can be ignored or used based on the properties for morph normals in "lighting properties".

Morph targets now reset their influences after being destroyed.

Bug where adding a Q3D Master after a Q3D viewport would cause problems has been fixed.

Alpha test material property wasn't useful/working so it was removed.

Draw side resets properly for recycled objects now.

Options for modifying textures have been improved, now /all frames can be modified at once/, /only the current frames/, /only the current animations/, etc.

Actions for modifying material properties are more stable, and shouldn't cause crashes if called before material/model is initialized.

Changing texture/material before model loads in is now possible.

All light and sprite related actions in Q3D Master have been deprecated and replaced with the more usable Q3D Light and Q3D Sprite objects.

Added:

Geometry created with Q3D Master can now be directly loaded into Q3D Models by using a model filename like GeomName.geom, where GeomName is the name of the geometry created with Q3D Master.

Added an action to save canvas contents to png, this triggers a render (required by browsers) so it should be at the end of the event sheet.

Q3D Model now has additional options for selecting a material type, instead of only supporting phong materials.

With this addition, new custom shaders can be made using ".qfx" files. These are written in normal GLSL and have the normal features of three.js shader materials but have a particular xml-like layout. See packaged ".qfx" files for examples.

Q3D Light added, a new object to replace the old system, which allows for simple control/debugging/events for lights

Q3D Lights attempt to greatly simplify lighting in Q3D and make them individual instances, since using the old system everything was done "blind" in Q3D Master.

The lighting actions in your old projects have been deprecated, so you'll need to transfer to the new system (Annoying, but necessary to improve usability)

With that said, creating and destroying many lights will still introduce stuttering, since this forces shaders to rebuild.

To prevent stuttering / shader rebuilds, try to reuse lights and hide them when not needed, you can make them invisible or give them 0 intensity.

Lights look good but are expensive, so try not to create too many as this can overencumber some GPUs and lead to shaders becoming too complex for the hardware.

Q3D Sprite added, a new object which has almost all the features of C2 sprites, but exists within the 3D scene

Q3D Sprites act as billboards and always face the camera.

They have 2D and 3D features, so they work well for 2.5D style projects, or for simple particle effects.

Collisions are not a current feature of Q3D Sprites, so you'll have to pair them to regular sprites for 2D collisions, or to a Q3D Model for 3D collisions.

UPDATE: Version 2.2

Changes:

General stability fixes.

Do to a user request, textures are now automatically set to nearest filtering for min and mag if point sampling is set on the project.

Loader significantly improved. Now you loaded files are queued up and loaded sequentially rather than hanging the application by trying to load all at once.

Showing a progress bar is now much easier than before. using Q3DMaster.LoadedItems and Q3DMaster.LoadTotal, you can retrieve items loaded and items queued.

For example use a simple expression like Q3DMaster.LoadedItems*100/Q3DMaster.LoadTotal to show what % of items have completed.

Files exported from newer three.js exporter have a JSON filetype instead of .js, added a simple fix so the .js loader loads .json now too.

Texture loading has been improved and should be faster now. Textures shouldn't bug out and look like the sprite sheet on some platforms any-more when they're not loaded yet. This addresses some problems firefox had.

Bug fixed where moving spot/direction lights and their target was broken.

Attempted to fix bug where files weren't loading properly in XDK cordova apps, need people to test the fix however.

Problems with edittime fixed that were causing some plugins to return alerts when opened in checked / beta C2 builds.

The ability to adjust morph target influences based on the exact morph frame name loaded in the .js model file.

Swapping between perspective/ortho camera modes at runtime was broken but has been fixed, although there may be some tricky cases that continue to break it. please report any bugs you run into.

Bug where viewport projection would work weirdly/break after moving the camera that frame has been fixed.

Fixed small problem where action params were incorrectly showing in events.

Fixed bug with "set normal scale" for Q3D model.

When using "behind mode" you can now use html controls like buttons sliders etc. this is done using the css control "pointer-events" = none which is available on modern browsers. Note however that the controls will be behind the construct canvas (dunno how to fix this without changing official plugins).

Added:

Q3D Morph Controller has been added as a behaviour. It allows for easy control / tweening / playing of morph target animations for a Q3D Model.

Q3D Morph Controller requires the .js file to have animations layed out in a specific way.

The name field for each frame in the "morphTargets" object of .js files denotes an animation name, but any numbers at the end are chopped off. All the animation names are parsed this way on load into Q3D.

For example, if your frame names are called "stand001", "stand002" , "stand003", the numbers are chopped off and you get a 3 frame animation called "stand" which Q3D Morph Controller can play.

Regardless of how the numbering is set up, the morph animation frames are parsed first to last and the animation frames are numbered based on this order in a 0 based fashion. So our previous example would start at frame 0, even if it started at 1 in the file.

The morph controller has various features for adjusting morph animations and tweening them, but there are hardware limits to how many morph targets can be used concurrently, since they use a shader program for performance gains, the limit is usually 8, so considering tweening, 4 concurrent animations, or 8 static frames are possible.

With that said, a model can have any number of morph frames / animations, one only has to watch out for how many are "activated".

There is a debug action in Q3D Morph Controller that alerts a list of the usable animations for the model.

The actions available to a Q3D Morph Controller are similar to those used for sprite animations, but require an animation name to be specified since multiple animations can play at once.

Some actions in particular require two animations, and can modify the two to transfer between them.

Two names are specified for a "start" and "end" animation. A duration in seconds is also specified to determine how long to make the transfer last.

Both animations are started, and the first one gradually fades to the second based on the specified transfer rate.

If during the course of the transfer the duration is changed or a reverse transfer is started, it picks up the current transfer and modifies it so that it smoothly continues at a different rate or reverses completely.

The Q3D Morph Animations example capx is now available for download as an example of how to use the Q3D Morph Controller.

UPDATE: Version 2.1

General stability fixes.

Fixed bug where .Rx/Ry/Rz functions were in radians

Fixed bug where Viewport could cause crashes due to a misplaced new in the plugin prototype instead of the typeproto.

If webGL isn't available Q3D now silently alerts in the console instead of obnoxiously

Simple FPS example/demo added

UPDATE: Version 2

Q3D is now a set of 5 plugins.

I know its been a long time coming, but i've finally finished up the updates to Q3D. Thank you to all those who bought the plugin early on and helped support the development of the new easier to use and much more feature rich plugin set, all of you can download the new version from the original page you got in your emails at no extra charge <img src="{SMILIES_PATH}/icon_e_biggrin.gif" alt=":D" title="Very Happy">. There is a comprehensive change-log of what's been removed/fixed/added below, and serves as some light documentation of the new features. I'm aiming to add more examples for the new year, but finals are coming up so they probably wont be coming until after christmas. There are however a few new examples of how to use some of the features in the new plugin available below. Currently cameras and lights and 3D sprites must be controlled through the old system, as i haven't gotten around to making separate plugins for them yet, however those will eventually come in the new year, hopefully with animation support as well and some other goodies.

Changes:

The main component of the plugin is now called Q3D Master

Q3D Master has a default orthographic camera which imitates the viewport and axis alignment in the edditime in its default position (+Z axis goes into the screen)

Q3D Master has a default directional light which can be enabled disabled through properties.

Q3D Master has a default grid and axis helper which can be enabled disabled through properties.

Q3D Master has an option to control how many frames are rendered or dropped (Frameskip ratio).

Q3D Master has had general stability fixes and only safe objects can be modified now (previously any idea could be passed and cause glitches).

There was previously a bug with how colors were input into the Q3D, where the red and blue channels were swapped (owing to the way three.js represents colors vs construct 2). This has been fixed so that colors actually correspond properly to their RGB components.

There was previously some bugs with the way Q3D lookat/rotate world functions worked, these have been fixed (most of them should be, i may have forgotten one or two so please report any weirdness)

Thanks to a fix by ashely to the c2 engine, node webkit now supports "behind mode" properly.

Loading models has been improved, and the filetype is automatically checked so there is only one action now.

Viewports were deprecated, there is now a dedicated object, try to replace all your viewport stuff with it if use an existing project.

A resolution controlling mode has been added to the properties, to facilitate how resolution is controlled and set for the renderer upon initialization.

Q3D has been modified to work if there are multiple instances of it on a webpage associated to different construct runtimes (hopefully) i haven't tested this much but it should work OK now. YOU STILL CANNOT HAVE MORE THAN ONE PER RUNTIME.

Added:

All the Q3D plugins have a proper icon now.

Q3D Model, an object which can be moved around and manipulated similarly to a sprite

Q3D model facilitates loading models in at runtime and manipulating them, this was previously very abstract.

Q3D Master must exist in the layout or the model will cause a crash, this is a dependency that is necessary for obvious reasons.

There are various properties which facilitate the importing of a model which has been added to the files folder.

Use Model specifies whether or not this object uses a model, Q3D model can be used for collision testing without a model.

If set to yes, A callback will be created that generates the model when it is loaded

Q3D Viewport, an object which facilitates setting up split screens or multiple layered renders, or even the main screen

The positioning/scaling of the Q3D Viewport in the layout editor relative to the window size determines the size of the viewport relative to the window size.

if the window size changes, the way it was in the layout editor "scales" to fit the new window size (hopefully) this is a tricky bit to get working so...

let me know if theres a problem somewhere, ill try to help, theres a lot of stuff i didn't test in all use cases because of the complexity <img src="{SMILIES_PATH}/icon_e_smile.gif" alt=":)" title="Smile">

Q3D Viewport has some projection conditions that help with picking stuff using the mouse, they work very similar to raycaster

The viewport projection tests require an absolute position, so use layerToCanvas or mouse.absoluteX etc.

Due to a three.js bug, there's a problem with shadow maps and viewports in the current version, i'm working to fix this, but its a complex issue.

New examples have been made available, old ones have been deprecated.

Version 1

Supported Features:

3D WebGL canvas rendering inside Construct 2, using three.js

Supplement the power of Construct 2 with the 3D capabilties of three.js

Overlay the 3D canvas with 2D elements like text and sprites.

Control rendering resolution at runtime

Support for anti-aliasing

Objects:

Easy loading of 3D models in .obj, and three.js JSON format

Generate objects from built in geometric primitives with controllable parameters

I'm a bit of a numpty and never worked with 3D. I know it's probably a lot work but is there a possibility of a "lite" version to test if I understand the plugin & features and would be able to actually create something before paying $15(about £8.50).

Could this be used rendering a 2D based game with 3D models efficiently (I know it can sounds dumb, but I'm pretty sure I'm not the only one to think about the mix 2D and 3D world.. Unified!), and also can we just turn off that alert message when webGL is off (to instead display a message ingame)

Also it took a while to actually display the demo, all the 2D were good, but the 3D appeared like 2 minutes after only first time though.