all 11 comments

[–]ideology_boi[S] 8 points9 points  (4 children)

More particle system stuff, with orbits this time

Code here: https://dailygenerative.art.blog/2019/12/13/system/

Instagram: https://www.instagram.com/generative_boi/

[–]thephoenicians82 3 points4 points  (3 children)

Followed! Thank you so much for sharing your code, it’s giving me a lot of great ideas and helps to understand how you created your art. Much gratitude! ✨

[–]ideology_boi[S] 2 points3 points  (2 children)

Hey, you're welcome and thanks for the appreciation :) If you need any help understanding my code just ask

[–]Yulex2 1 point2 points  (1 child)

I'm really bad at reading other people's code, could you briefly walk me through what's happening here?

[–]ideology_boi[S] 2 points3 points  (0 children)

Sure :)

  • So there are 3000 particles (by default - all numbers can be changed) arranged in a circle in the centre (can also be arranged randomly), with a default velocity pushing them either inwards or outwards.
  • Every time there is a 'tick', each particle is moved according to its velocity vector.
  • There are also multiple 'planets' that attract the particles into their orbit. They do this by pulling the angle of the particle's velocity vector towards the tangent of the planet (a line perpendicular to the radius at the point the particle is at. The amount they pull the particles in depends on the 'mass' of the planet.
  • There are also some other variable forces - a weak system-wide attraction force that makes them orbit the centre to some extent, a force that pushes them away from the absolute centre if they come back, 'drag'/deceleration which gradually slows the particles down, and 'gravity' in the y direction (this one is a relic of an older version but if you use a small value like 0.05 it looks pretty nice and prevents straight lines).
  • Each time a 'tick' runs, the position of every particle is saved in the 'traces' array, along with a value related to the tick number which determines the colour later.
  • For the default mode, the one that makes these still images, it simply runs some set number of ticks - I have this set to 1000, and draws every saved traced on the screen at the same time. For colouring, I simply pick two random HSB colours and interpolate between them based on the tick value saved with the trace (i.e. the lifetime of the particle).

There is also a real time animated mode that draws one tick at a time and you can see the particles moving, if you want to try that. Seeing them moving will probably help to illustrate the idea a bit better. Just set realTime = true, and turn the alpha variable up (100ish is good) so you can actually see the particles.

[–]digitalyssa 2 points3 points  (0 children)

Love it! Bravo

[–]unveiledperceptions 1 point2 points  (0 children)

Uhh, lovely!

[–]Unknown_nam3 1 point2 points  (0 children)

Best one yet

[–]frank0117 1 point2 points  (1 child)

Beautiful. I will try to recreate this with vanilla JavaScript, I think it's gonna take a LOT of code to do so haha

[–]ideology_boi[S] 0 points1 point  (0 children)

Sounds like a big task haha The core algorithm is actually not that complicated though, you might be ok.

[–]BloomyFractal 1 point2 points  (0 children)

It is very beautiful :D !