@@simondev758 Personally, I would like to know more about interactive experiences, anything shaders, turning small ideas into working apps from start to the end (mini-game series or such). I myself have solid web + basic CAD/CAM experience and would love being able to make basic spacial games in my free time, exploring possibilities of 5G etc.
@@simondev758 To briefly answer now, it's a "custom renderer" on top of a classic game. It generates everything from its old install files. It even generates topology people did not know was possible ;)
Can't wait for the update where you discuss dynamically switching blending modes from "additive" to "normal" in order to turn the fire into smoke. I would also love to see the use-case where you tie the particle's spline to a texture in a sprite sheet so that you can use an animated texture for the particle.
Definitely show me what you end up making. Also keep an eye out, I'll probably follow this up soon with some more tutorials on more advanced particle system topics.
@@simondev758 Three.js & WebGL in general. I know you add source code, but people need something really basic, explained step by step, very slow and in details.
This is an amazing video, thanks for sharing it. I'm having an issue where the fire loads and is coming down, but if I look too far up or too far down the fire disappears. when I look at the right angle I can see the fire. Any thoughts on why?
First of all thank you for this wonderful video, was wondering how to achieve particle stays in world space (let say in this video case, I wanted to launch the rocket and the particle will leave a trail)
Hey! I have a question. Is it possible to make the particles (the pngs) not follow the camera? I have been trying to change the shaders but i haven't manage to achieve this :(
I have turned this into a Particle System module, but would like to make it much larger (for use with a volcano). I have increased the size of the textures and the distance between them. I have tried increasing the life of the particles, but this does not appear to increase the height of the plume. Instead, the particles create an ever increasing ball of smoke at the top. Increasing vertical speed seems to eliminate this problme, but that begins to look too fast. Which other variable(s) do I need to change to increase the height, but not the speed? Thanks!
Nevermind. It's the drag that is creating the ball since it eventually reduces the vertical speed to zero. I just need to reduce or eliminate that value.
You asked if it was possible to make games, which it completely is. Whether or not JS is the appropriate platform, depends entirely on what you're target audience is. If you just purely want to make a game, unity or godot may be something to look into.
Hi,Simon!Your videos are really helpful!I downloaded the code,could you so kindly help me to change the fire color to a perticular one? i change the color code in lines 156&157&164,but the result is bad(it seems like all transparent grey with color rgb(143,143,143) or nothing when i set it to 0x000000 ).I simply wanna implement a smoke effect
Hello SimonDev, I would like to ask for your advice. I'm making a PS2 Bios "remake" (those spinning, glowing balls) for my website. Reference: th-cam.com/video/Cxk1gI2sg3w/w-d-xo.html How would you do those light trails? I tried the "afterimage postprocessing" but it didn't provide the result that I want. Looking forward to your answer, thank you in advance!
When I delete orbitcontrol the fire doesn't show. I tried to comment the sort of the particles but it isn't enough. How can I solve it? Here a js fiddle: jsfiddle.net/jresq8ch/2/ In the line 286 there is the orbitcontrol if you comment it the particle system isn't work
@@Tholem98 The particle system doesn't so much have an individual position as it does a bounds. It's like trying to get the position of a swarm of bees.
@@simondev758 hey, another question (sorry). I tried to make it work with THREE.Clock() instead an anonimous function inside the requestAnimationFrame(). I tried something like requestAnimationFrame(animate()) and inside the animate function use THREE.Clock.getDelta() but it didn't work. Could you explain me why? What i'm doing wrong?
These videos are amazing, never change the style.
It's like all the good parts of a hour long dev video and none of the fluff and slow typing.
dude stop rocking my world. you're comprehensive and simple-but-not-stupid attitude on this... it's got me moving. thanks!
This channel is GOLD
Thank you so much for the great tutorial and detailed explanation!! The best I've seen on three.js + particle
This video makes me feel so calm... thanks for that too!
Please keep on making these, good resources are so scarce in WebGL niche still.
No worries, got anything you really want to see covered?
@@simondev758 Personally, I would like to know more about interactive experiences, anything shaders, turning small ideas into working apps from start to the end (mini-game series or such). I myself have solid web + basic CAD/CAM experience and would love being able to make basic spacial games in my free time, exploring possibilities of 5G etc.
Ok great, I plan on covering a lot of that so stay tuned :)
WOW! Amazing! Congratz, man!
This is awesome! maybe a video on particle collision would be cool. Thanks for all the good videos.
Great videos. The best three.js videos I've seen.
Thanks, any suggestions for upcoming topics?
@@simondev758 Maybe basic physics system? Collisions, gravity, etc....
@@Lambparade Good idea, I think there are some solid JS physics libraries
That looks amazing and I want that! Thanks so much for your straight forward examples!
np, glad they're helping! What are you going to build with this?
@@simondev758 I will DM you! I plan to release in spring :)
@@simondev758 To briefly answer now, it's a "custom renderer" on top of a classic game. It generates everything from its old install files. It even generates topology people did not know was possible ;)
@@alexpineda3422 Ooh neat, would love to see it when it's ready.
Can't wait for the update where you discuss dynamically switching blending modes from "additive" to "normal" in order to turn the fire into smoke. I would also love to see the use-case where you tie the particle's spline to a texture in a sprite sheet so that you can use an animated texture for the particle.
That video is already out, look for the one that's called "Blending (using WebGL/Three.js) - And How to Combine Additive and Alpha Blending"
@@simondev758 Awesome! Thanks for the heads up!
Great timing with starship hopping
What do you mean?
@@simondev758 the spacex team had a successful test of their new starship prototype earlier this month- th-cam.com/video/s1HA9LlFNM0/w-d-xo.html
@@starhopper4587 Heh I didn't catch that reference at all, thanks!
Very good video, well explained, thank you 😊 Subscribed!
pretty good tutorial, awesome, thank you for doing so good particle system tutorial
You're welcome!
Good work :P Definitely going to put this in my game sometime next month. Happy Coding!
Definitely show me what you end up making. Also keep an eye out, I'll probably follow this up soon with some more tutorials on more advanced particle system topics.
Really cool! I honestly didn't know how much you could do with JavaScript.
Thanks man, JavaScript exposes webgl (and soon webgpu) meaning you can do nearly the same as native.
Thanks for this, it was great!
thanks for your amazing tutorial, how to do the black smoke effect?
Mate, this is insane! Keep on posting new videos!
Will do, got any requests?
@@simondev758 Basics please. How to install and use those libraries. How do they work under the hood. There's so little information around.
Basics on webgl or what?
@@simondev758 Three.js & WebGL in general. I know you add source code, but people need something really basic, explained step by step, very slow and in details.
Is the tutorial on creating a basic 3d world the right style?
This is an amazing video, thanks for sharing it. I'm having an issue where the fire loads and is coming down, but if I look too far up or too far down the fire disappears. when I look at the right angle I can see the fire. Any thoughts on why?
That is really cool 🤩
Thanks man
First of all thank you for this wonderful video, was wondering how to achieve particle stays in world space (let say in this video case, I wanted to launch the rocket and the particle will leave a trail)
Just keep them in world space
Hey! I have a question. Is it possible to make the particles (the pngs) not follow the camera? I have been trying to change the shaders but i haven't manage to achieve this :(
I have turned this into a Particle System module, but would like to make it much larger (for use with a volcano). I have increased the size of the textures and the distance between them. I have tried increasing the life of the particles, but this does not appear to increase the height of the plume. Instead, the particles create an ever increasing ball of smoke at the top. Increasing vertical speed seems to eliminate this problme, but that begins to look too fast. Which other variable(s) do I need to change to increase the height, but not the speed? Thanks!
Nevermind. It's the drag that is creating the ball since it eventually reduces the vertical speed to zero. I just need to reduce or eliminate that value.
Keep it up (Y) !
Will do
Thank you
I'm learning JavaScript. Can I make any game like RPG, Roguelike or Quest game on JS?
Sure, not really any restrictions on what you can build
@@simondev758 but many people tell that JavaScript isn't most useful for 3D games making
You asked if it was possible to make games, which it completely is. Whether or not JS is the appropriate platform, depends entirely on what you're target audience is.
If you just purely want to make a game, unity or godot may be something to look into.
Hi,Simon!Your videos are really helpful!I downloaded the code,could you so kindly help me to change the fire color to a perticular one? i change the color code in lines 156&157&164,but the result is bad(it seems like all transparent grey with color rgb(143,143,143) or nothing when i set it to 0x000000 ).I simply wanna implement a smoke effect
You need to make sure alpha blending is set, and either set the colour like you're doing, or change the texture.
@@simondev758 Huge thanks!Ill try to make this happen!
Can you do a tutorial about soft particles please?
Sure, I'll see what I can do
@@simondev758 thank you :) you are the best!
Just a comment. With additive blending you don’t have to sort. But cool tutorial
Totally right, forget what I said exactly but I probably should have called out that it depends on the blend mode.
SimonDev don’t worry only works for the additive glOne glOne case. But super nice content! I just subscribed. 🙏 from Peter
Hello SimonDev,
I would like to ask for your advice.
I'm making a PS2 Bios "remake" (those spinning, glowing balls) for my website.
Reference: th-cam.com/video/Cxk1gI2sg3w/w-d-xo.html
How would you do those light trails?
I tried the "afterimage postprocessing" but it didn't provide the result that I want.
Looking forward to your answer, thank you in advance!
When I delete orbitcontrol the fire doesn't show. I tried to comment the sort of the particles but it isn't enough. How can I solve it?
Here a js fiddle: jsfiddle.net/jresq8ch/2/
In the line 286 there is the orbitcontrol if you comment it the particle system isn't work
Because you're not looking at it anymore. Here: jsfiddle.net/7nvxt8pr/
@@simondev758 thank you so much. I tried to apply a lookAt but passing the position of the particles but I did't know how get that position. Thank you
@@Tholem98 The particle system doesn't so much have an individual position as it does a bounds. It's like trying to get the position of a swarm of bees.
@@simondev758 You right, thank you
@@simondev758 hey, another question (sorry). I tried to make it work with THREE.Clock() instead an anonimous function inside the requestAnimationFrame().
I tried something like requestAnimationFrame(animate()) and inside the animate function use THREE.Clock.getDelta() but it didn't work. Could you explain me why? What i'm doing wrong?
I use my phone for code these things, my computer can't handle it😂
Wow, coding on a phone must be hard. Any tips on how to do that?
your videos are unclear.
Hmm, any recommendations on what to improve?