Advertisement

Procedural Generated 2D Starfield & Planet

Started by June 27, 2017 01:17 PM
23 comments, last by taylorswift 7 years, 6 months ago

You haven't said much about your platform (and I don't know very much about HTML5 platforms in general) but if you have access to shader technology, you can often accomplish this kind of thing with quite decent performance. Just search at ShaderToy for star fields, and you can see stuff like this: https://www.shadertoy.com/view/XlfGRj

Granted, deciphering what's going on in some shaders is kinda tough, but you ought to be able to at least pull out some things you can use to your own benefit.

I've used a fragment shader to blur each of my circles but it seemed quite inefficient.

Right now I am working on a simplex noise 2D fragment shader to generate gas clouds, but I am not an expert of shaders in general to be honest.

I've clicked on your link, and this is really, really impressive. I will definitely investigate the really short code of this visually astounding shader :)

You made my day!

Advertisement
21 hours ago, yahiko00 said:

You can see below a static overview. The animated GIF was too big to upload ^_^

Yes, that seems like really nice progress :-) .  I have a few comments that maybe will help improve.  A comment above about stars appearing more white in space is partly true yes in the sense they have a broad spectrum so the 'redness' or 'blueness' is not so apparent.  So making them more white helps with the 'realism' (at least with the nearest stars; see my final comment below).

Second, it feels like there are too many stars in the nearest plane and you can see they all move at the same speed a little too clearly which breaks the illusion slightly.  I would perhaps reduce the density of stars here (although the distant ones seem fine for this).  

 

9 hours ago, taylorswift said:

P.S., you’re confusing star distance with red shift. Closer stars aren’t any more prone to being yellow/red than more distant stars. Red shift comes from star velocity relative to the viewer; if anything more distant stars are slightly redder than nearer stars from universe expansion.

Actually, I wanted to say something about this also.  This is incorrect but for the wrong reasons.  It's true that there is redshift due to the expansion of the Universe but we can't actually see stars in other galaxies with the naked eye so all visible stars are in our own Galaxy.  However, there is an effect known as interstellar reddening where gas/dust in the interstellar medium (ISM) absorbs preferentially blue light from distant stars making them appear redder.  And since more distant stars have more ISM between us and it, they appear redder.  This is a quite famous example OSC_Astro_20_03_B68IR.jpg

where you can see an obvious gas cloud making stars redder.  This is obviously a very discrete blob of gas, but this happens in many directions on large-scales so I would make the near stars white/yellow/blue (depending on mass) and the distant stars more and more red if you wish to mimic this kind of Galactic-fog effect :-)

As a recall, I have implemented a GUI to let anyone play with parameters with the online demonstration of the star field generator.

starfield20170709-gui.png.aa07a7f14243d57f9634c7d789a06650.png

Feel free to play along with these parameters and tell me which ones produce good visual results. It is not possible at the moment to save and export parameters, but you can take screenshot you can share.

Thanks to that, it is already surely possible to choose more "realistic" colors for stars, or their numbers in each layer. Although any comments can be interesting... as long as it is said in polite form. ;)

Also, a very first version of comets has been implemented.

starfield20170709.gif.211580feb8fc05715eb6807377ba4b92.gif

It uses a particle system with 500 particles, which seems a good compromise between resolution and performance.

Now gas clouds...

48 minutes ago, yahiko00 said:

Feel free to play along with these parameters and tell me which ones produce good visual results. It is not possible at the moment to save and export parameters, but you can take screenshot you can share.

Thanks to that, it is already surely possible to choose more "realistic" colors for stars, or their numbers in each layer. Although any comments can be interesting... as long as it is said in polite form. ;)

Yes, I just had a quick play around.  Not saying this is so incredibly realistic but should be a little more so :-)  Actually, it's perhaps a little 'boring' looking in a way since it's dominated by white, yellow and red stars but is closer to how it problably looks.  The massive blue stars are usually located in young stars clusters and normally they die quickly before they enter the Galactic background (either fizzling out or exploding as Supernova).  If you want to add other features like gas clouds and star clusters, then that is one thing to think about.  Anyway, you seem to be making good progress so look forward to seeing some gas clouds soon ;-)

StarfieldParameters.png

Just curious: on which hardware have you taken this screenshot? I'm wondering so because of the FPS which is quite low.

Advertisement
6 minutes ago, yahiko00 said:

Just curious: on which hardware have you taken this screenshot? I'm wondering so because of the FPS which is quite low.

Just on my not-particularly powerful laptop (a cheapish Lenovo Thinkpad).  I also have more stars than you (800-odd) which might slow it down a little more I guess?

Thanks for your reply :)

Since I got similar FPS on one of my GPU-less laptop too, I guess your Thinkpad has no GPU too.

Any FPS feedback on other devices would interest me as well :)

9 hours ago, sergamer1 said:

Actually, I wanted to say something about this also.  This is incorrect but for the wrong reasons.  It's true that there is redshift due to the expansion of the Universe but we can't actually see stars in other galaxies with the naked eye so all visible stars are in our own Galaxy.  However, there is an effect known as interstellar reddening where gas/dust in the interstellar medium (ISM) absorbs preferentially blue light from distant stars making them appear redder.  And since more distant stars have more ISM between us and it, they appear redder.  This is a quite famous example

where you can see an obvious gas cloud making stars redder.  This is obviously a very discrete blob of gas, but this happens in many directions on large-scales so I would make the near stars white/yellow/blue (depending on mass) and the distant stars more and more red if you wish to mimic this kind of Galactic-fog effect :-)

That’s interesting i was not aware of this!

On 7/3/2017 at 1:46 PM, sergamer1 said:

Okay, gas clouds are a whole other ball-game!  Their form is highly irregular and not described by some simple equation (unfortunately).  When astrophysicists try to generate such density fields, they usually try and produce some kind of fractal density field (i.e. with fractal dimension less than 3 so it has holes and other structures).   Maybe you should consider something like Perlin noise (https://en.wikipedia.org/wiki/Perlin_noise) since you'll presumably only be generating in 2d.  Many people generate irregular shaped profiles, such as mountain ranges or islands, using Perlin noise, and I think this the route to take.  I've seen other people try stuff like this (i.e. interstellar gas clouds) in the past, although I'm not sure what method they used.  If I find something that's useful, I'll post it here!  :-)

I wanted to add you can get very nice results by combining gradient noise with cell noise which gives you a lot more well-defined structure than gradient noise alone. The horizon zero dawn cloud thread has a lot of useful info on this technique. It tends to be heavy to compute but you might have luck prerendering it since the camera is only moving in one direction and gas clouds in space don’t change much in time.

This topic is closed to new replies.

Advertisement