![Construct 3 - 3D effects](https://img.itch.zone/aW1nLzE1MTM3MjIxLnBuZw==/original/OBO%2FaU.png)
Construct 3 - 3D effects
Demo - drag and drop the 3DShapes and the Cleric.
Combined Effects:
- Fragment 8 light
- Directional light
- Depth Fog
- Height Fog
- Screendoor transparency
Support for one or eight 3D world based lights, directional light, fog, screendoor transparency, works on 3DShape, 3DObject and some 2D objects. Tilemap not supported (first shader is tilemap fragment shader).
Usage notes:
- It must be the first effect on the 3DShape or 3DObject
- It only works with webgl2 for 3DObject (and it is recommended to use webgl2 only, regardless of whether 3DObject is used or not._
- To set the spotlight cone angle, in the effect parameter Spot cos(angle) value, set it to cos(spotlight angle). The reason to put this as a parameter is so we don't need to calculate cos(angle) for every fragment to save performance. The value should be around 0.9 or so for a reasonably tight spotlight.
- The spotlight direction should be a unit 3 element vector that points in the direction of the cone of light (with z of -1 pointing away from the default viewport, without moving the camera)
IF 3DObject is not used in the project (not recommended):
This effect requires the main.js file from the example project to be included in other projects using this effect, it patches the runtime engine to enable this effect. CAUTION - this may mean this effect could become non-functional in future versions of C3. We will work to make sure this does not happen and we have requested for these changes to be incorporated into the C3 engine, so it will not be an issue in the future.
Development notes:
- *DONE* 8 light versions to come next
- *DONE* Working on webgpu patch for 3DObject to work with lighting
- *DONE* Request changes to C3, so that the main.js changes will not be needed.
- C3 implement the requested changes above.
Updated | 21 days ago |
Status | In development |
Category | Assets |
Rating | Rated 5.0 out of 5 stars (4 total ratings) |
Author | kindeyegames |
Made with | Construct |
Tags | 3D, addon, construct-3, Effects, Shaders |
Purchase
Buy Now$10.00 USD or more
In order to download this asset pack you must purchase it at or above the minimum price of $10 USD. You will get access to the following files:
FragLightTrain.c3p 342 kB
Rally Fragment Light 3DObject.c3p 3.4 MB
ssao-1-6-0.c3addon 6.3 kB
mikal_frag_light-8-2.8.0.c3addon 11 kB
3d-object-vertex-color-1.c3p 1.1 MB
Screendoor-1.c3p 165 kB
FogExample-1.c3p 273 kB
3DObjectFragLight-2-60-0-1.c3p 3.2 MB
Development log
- Updated examples to use 3DObject, not main.js to update shaders21 days ago
- Add 3D Effects affine texture support (PS1 retro)82 days ago
- Add specularSep 03, 2024
- fix (lang) parameter numbers - againAug 25, 2024
- fix (lang) update parameter index numbersAug 23, 2024
- phong lighting support for 3DObjectAug 21, 2024
- fix (screendoor) add 3d effect opacity support for screendoorAug 21, 2024
- Vertex color support for 3DObjectJul 17, 2024
Comments
Log in with itch.io to leave a comment.
I've installed addon mikal_frag_light-8-2.8.0.c3addon
Open example file 3DObjectFragLight-8.
Preview layout - black screen - can't see anything.
What now? How do you turn on a light?
I can't find where the code samples that FoozleCC refers to are located.
Check that the renderer is webgl2 in the project setting, only webgl2 now is supported for the effect, I will update the webpage and remove older versions.
I suggest adding 3dobject (free addon) to your project. It will handle what main.js previously did, and you can leave out main.js.
Light types
I cant see how to check that the renderer is webgl2 in the project setting
https://www.construct.net/en/make-games/manuals/construct-3/project-primitives/p...
See Advanced->WebGPU
Try: 3DObjectFragLight-2-60-0-1.c3p
Thank you very much. Unfortunately the project was saved in r423 beta and I am using r416.2 stable. I see it running in the browser as intended, but can't figure out how to update my desktop version to r423 beta - preference is to stay using stable. 3D Oject addon is installed.
Enabled WebGPU in previous release mikal_frag_light-8-2.8.0 -
Light flashes on for a moment, then screen goes black.
Error log -
instance.js:241 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'bindBuffer')
at Object3DInstance.Tick (instance.js:241:25) etc
6instance.js:241 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'bindBuffer')
at Object3DInstance.Tick (instance.js:241:25)
at _isTicking._tickFunc._tickFunc (sdkInstanceBase.js:1:3025) etc
gltfModel.js:130 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'currentShader')
at GltfModelTop.setVertexShaderModelRotate (gltfModel.js:130:38)
at GltfModelTop.render (gltfModel.js:245:12) etc
It seems to still wan to use main.js as when I delete it, there isn't even a flash of light. Error log after deleting main.js -
domSide.js:16 Uncaught (in promise) GPUPipelineError: The fragment input at location 2 doesn't have a corresponding vertex output.
at ValidateInterStageMatching (..\..\third_party\dawn\src\dawn\native\RenderPipeline.cpp:781)
I don't have older versions of the examples, so I suggest using the browser with the examples as a reference for your desktop development. Additionally, do not use WebGPU; use WebGL2, which is the most stable renderer for C3.
On opening 3DObjectFragLight after Construct 3 update to r424 stable, I got the following notification:
I can't find where the code samples that FoozleCC refers to are located.
www.youtube.com/watch?v=p02bz6jax8Y&t=1105s
I think the project you are referring to is Foozle's example project. Check YouTube comments for a pointer about the location on his itch page.
Why so many addons? Is it necessary to add them all? Do these 3D addons have cars, ships, characters?
Is there a step-by-step tutorial on how to implement and use each of these plugins?
Just use the last version (2.7.0).
if you use it with 3DObject you should not include the main.js file.
You can look at some of the sample projects to see how it works.
This addon does NOT draw 3D Models, it is only an effect.
It would be great if only the latest versions on one download page and older versions on a different download page.
The documentation seems outdated. It says This effect requires the main.js file from the example project to be included - yet in the comments here it says it is not required.. which is it? Also - there is no documentation about the different light types - what does each one do?
Hey Mikal, are there any plans for tilemap support?
Not right now. There is a tile parameter towards the end, but it is just for flipping and tiling a single 'seamless' texture.
I think there's a problem with the vertex color js. In the newest update it only gives me a black screen.
Try using the latest versions of both frag light and 3D Object _and_ remove the main.js script from the project. If that doesn't work, let me know.
main.js is no longer necessary?
Nope, not if you have the latest 3DObject addon in the project.
what export settings should i use to export models with, and how do i export a float vec3?
Export from what source?
I am not sure about the float vec3 comment, is that for the format of vertex color?
Thanks for this !! I must admit that between Effects and Physics, I'm not sure which file I have to download and install. Could you please provide documentation and directions in order to be sure to use the needed files for 3D integration ? Very nice and useful work BTW !!
hey I'm having trouble opening the example projects. My Construct 3 shows that they aren't valid .c3p files... Do you happen to know why is this happening? This message only appears in older example files too, the fog and screendoor example work just fine. I tried using a stable release instead of beta versions too, that didn't work either![]()
I just tried: 3DObjectFragLight-8.c3p and FragLightTrain.c3p and they worked for me. Make sure you are using the latest version of the effects and 3dobject addon. When using the latest 3DObject in 3DObjectFragLight-8.c3p, remove the main.js script from the project (the addon does the change itself.)
If you still see an error on loading, Hit 'F12' to bring up dev console and take a snapshot of the error and post it here.
I see. Thank you for your response!
The vertex color c3p isn't able to be opened
Did you install the latest 3D effect addon?
Yes everything has been updated
ok, I will take a look today, working on my side, but perhaps something is not updated on itch.
Can you also please hit F12 and share a picture of any errors in console?
I downloaded the file and it is working for me with 2.5.0 (should be 1.5.0, but I messed up the numbering). If you show me error messages, especially on console, I can help more.
I've got it working. Just an error on my end
hi i think u skipped 6? was wondering why my parameters in events werent working lol.
Yes, I did, I'll fix it at some point soon.
Hello! Looking to use this on a project I'm working on. Does this support smooth shading, or is it always faceted?
I'm looking to experiment with this to shade planets, and the last experiment I did with the lighting option available for the 3DObject would only show faceted shading.
Cheers!
This does per pixel shading, however the pixel normal is calculated from the tangent of nearby pixels, so it is effectively a plane. The difference from 3Object lighting is that the light attenuation can vary across the face of a polygon. Additionally spotlight edges can vary across the face of a polygon. Finally, you can enable procedural normals based on diffuse texture which can further vary the normal and light calculation.
I am also experimenting with adding normal map support to this effect with 3DObject, it is not yet available, but if the experiment works out, I'll add it as an option.
Thanks for the response!
So in this case, is it possible to get smooth shading using procedural normals? Are procedural normals available in this plugin or are you referencing the procedural normals effect? (sorry for the rapid-fire questions)
Having more normal support on the 3D object would be awesome! I think that currently not being able to have smooth shading is holding back the 3DObject and lighting. Would love to get some smooth shading, as right now the only option I seem to have is making a duplicate of the sphere mesh and fake the shading with a gradient effect, which will cause me to have an extra mesh and draw call.
Right now, more focused on normal mapping. if something is critical for a project, I do commissions to. Per vertex color or normals requires major C3 engine optimization. Normal map is major engine optimization too.
Thanks for the response,
I see, even with normal mapping it would be easy enough to create a normal map that smooths out the surface, so one could just do that I guess.
Regarding the commissions, that's good to know! Definitely will be considering at some point. Is there a platform to submit commissions, what are your rates?
You can DM me on the Construct Community discord. We'll see if normal maps come together, have to wrestle with C3 to get them to work.
Will it be possible to use and customize lighting without a main.js file?
This depends on the requests I have made for SDK V2, waiting for a response from Scirra. In the past requests have takes months to years to get implemented. If they implement the requests, main.js will no longer be needed.
Scirra has said the current SDK will be supported at least for two more years (through C3 SDK V1 LTS), which is what is used with the main.js file.
Hi! the 3d light plugin won't be finished?
What do you mean? Can you provide more details?
Does the effect work when exported to Android?
I would think it would on any modern android platform, but have not tried it.
Well that’s an instant purchase if I ever saw one. Thanks for pushing the 3D related capabilities of Construct, Mikal & Federico!
Thank you!
hi, any chance to add tutorial where edit size / position/ color for light in js code?
With this version (early in development), you do not set the position/color in js code. You use the effect parameters. You can set them as properties in the editor or change them at runtime with events with the set effect parameter action. The JS code is now only to patch the vertex shader to enable the effect/addon.