6 ms·

Relax while watching bouncing particles making connections when they get closer

225 points by tikili 2y ago

ddawson 2y ago
I feel like that's what's happening to my neurons when I'm browsing Reddit. And Hacker News.
justsomehnguy 2y ago
Need DVD version
grues-dinner 2y ago
Nice. Reminds me strongly of levitated.net (sadly broken due to no Flash) and complexification.net (sadly broken due to no Java). Geeking out over Jared Tarbell over dial up basically got me into computers in the first place.
leeoniya 2y ago
there is a website on the internet that has this in the banner or background, but i cannot remember what it was.
deadbabe 2y ago
What if you incorporate game of life type rules into this?
someoneontenet 2y ago
Neat, I’ve also made something like this with processing https://robw.fyi/constellation.html https://robw.fyi/constellation.html
- hashishen 2y ago
  this is great nice work
mjstone 2y ago
Reminds me of the Ex Machina end credits [1] (and the Android live wallpaper I made as a homage to it [2].) [1] https://www.youtube.com/watch?v=uRJ-fPAO3Go https://www.youtube.com/watch?v=uRJ-fPAO3Go [2] https://play.google.com/store/apps/details?id=com.figmentanova.wp2 https://play.google.com/store/apps/details?id=com.figmentano...
stackedinserter 2y ago
I can't relax, the fact that connections don't affect their speed/direction infuriates me.
- stavros 2y ago
  I didn't think I'd care, but I had the same reaction.
airstrike 2y ago
Made a version with charged particles. Probably bad physics all around, but here it is: https://shorturl.at/ocvEO https://shorturl.at/ocvEO
- BlueTemplar 2y ago
  It doesn't take much to get decent physics : https://mattermodeling.stackexchange.com/questions/9541/lennard-jones-clusters-in-python https://mattermodeling.stackexchange.com/questions/9541/lenn... https://en.m.wikipedia.org/wiki/Lennard-Jones_potential https://en.m.wikipedia.org/wiki/Lennard-Jones_potential With the right parameters you get to see the solid and fluid phases of matter !
- dtgriscom 2y ago
  What? No bonding?
- j1elo 2y ago
  Funny how the "shortened" url is actually longer than the real url. Any reason you shared it using the former?
  - airstrike 2y ago
    You mean shorter than `https://tiki.li/run/ https://tiki.li/run/`? That one only works after the real URL is loaded at least once. The un-shortened URL was huge as it contains the whole app in base64 encoding or some such https://tiki.li/run/#cod=pVVLj9s2EL7zVwxgoLCzXa20yTbeIJtD2h4K9FC0hx6CxYKWaJtZiXRI2hbz6zvDh0W7u+ihOugxnG8e3zw0g1970TqjB75RwskWdtzgoxdg5bDvuZNawVG6LUjViZ3Am3IwcGtv2i03G8HUE0HgAd7VzG2NsPja3LEZ/LH1Vra8h1Yr67hyFuYWv0UHa21K+3bHW7Fgz4isqyVCf9b7Xg+rExIijg1SPXXSuqB4x7r40rAVb583Ru9VB8vlkrW6Rwf39/dsvVct9ApGqBgAGOH2RkGvN00N83EBN/n9tnrfLG+XC1Yxu18Z8qyQGAJt0Uk3whu6XUHn6c3TQYrEfsP0tySQ6yj7CIEIEuHVH1FpHqm5Dgrk922dj6USR9khw/0xidBOJPeLfERv6f3rIxrOKLymLE+iGfy9lU4EfrlzhrfEbzoXvRWX6LquS/TnHokMaCN2+95O4Co9B30QyKYvgoeRQvN4Y0ExM8j79glNteKcmlMNP2QCs4SFGHLtAzS23qA7YTjmRW0g1YYU4/EDXD9PDF2wdQPz4OFNJJ1QfERIhIZ6TirU0mggavlSy7+idRjJ4dUDGUW1EP7BZ5mfZIGf60u9JEt6FcM54EoOmCYp4ARykwhBImlSRAzJpuxB0qCB0xAnMFWEEqTA0idl4qdPwn3NODmVvoswignGQhzhQewLcdH483+NxmJSvBgILHkxV6kPz9okd1oVU//F8ONpI/2vxC/69mzCPr0wVe+aci7+TDtrp6108pBDfWmi7n46m8fP/T6OoxIbXkDzPM3gL/ldwIpbdIEtQA3249mu1TnUhGilofU8r6u3yDnutnmDz9yYWAHcjIspzRHTa+oaMISR9gfWIDYujs6h4AtV/aTqs6rPqgWXue+jndzSxHk+8OUBbYQZ/KaQOZxeTPZU0Jd/LDgGXU75lXKPXx7hhwcwqKmHNXpq4h7zr8ixgkEU7a+EOwqhkKjb4KupglKgMODp4KqwQj+l0koM7rJKhE+rLkM/hd9Uqlvst+AgNFfRPeXZdVMMQGINDqLXrXQefR6EsaL3sDN6pw3tdzxHdrL7w1P4WdIPGZOYY3I4vEV73EbLv8vN1glTFCOMCIeVdLDmFs/S8gpRYbvdoZ2UGNlJftI2+w+lijH2Dw== https://tiki.li/run/#cod=pVVLj9s2EL7zVwxgoLCzXa20yTbeIJtD2h4...
bouncybouncycat 2y ago
It seems to me that it is inevitable: every programmer goes through a phase where they do a bounded billiard ball simulation. It’s like a right of passage.
- devin 2y ago
  rite* of passage
  - jhncls 2y ago
    A "wright of passage", a "craftsperson of passage", someone who facilitates or creates transitions -- like a metaphorical bridge-builder
    - mystified5016 2y ago
      Rite, as in the ritual one performs to pass to the next stage of their goal.
kaeruct 2y ago
I'd like to share mine as well. There's a bit of more interaction between particles but I don't remember the exact logic. Code should be easy to read: https://kaeruct.github.io/projects/short-experiments/dots/ https://kaeruct.github.io/projects/short-experiments/dots/
- biomcgary 2y ago
  Agglomerative clustering
- nhecker 2y ago
  I like this.
- deskr 2y ago
  [flagged]
  - taco_emoji 2y ago
    c'mon, man
  - IceDane 2y ago
    You alright there, buddy? I think some grass touching might be in order.
    - deskr 2y ago
      I'm good. I forgot to add there would be a nazi salute too!
- ides_dev 2y ago
  I like how some of the particles get thrown out of the cluster on wider elliptical orbits, they look like comets.
- rikroots 2y ago
  Nice! On a tangent, I thought this sort of "animated star field" effect had gone out of fashion 5 years ago - I rarely come across a website using it nowadays. My example is part of the testing suite for my canvas library: https://scrawl-v8.rikweb.org.uk/demo/particles-006.html https://scrawl-v8.rikweb.org.uk/demo/particles-006.html
Reimersholme 2y ago
[dead]
752963e64 2y ago
[dead]
voiper1 2y ago
Cute. First thing I did though was to see if moving my mouse or clicking affected it. Doesn't seem to, please add that!
65 2y ago
This would make the perfect hero background to my portfolio site!
alentred 2y ago
That... is... mesmerizing... ... ... ⠋ ⠙ ⠹ ⠸ ⠼ ⠴ ⠦ ⠧ ⠇ ⠏ ⠋ ⠙ ⠹ ⠸ ⠼ ⠴ ⠦ ⠧ ⠇ ⠏ Thank you. I wonder if I could use it for meditation. If only it would not require a blue screen.
polishdude20 2y ago
I'd love to see the connection line come from both particles and join between them! Ooo and also if they can like start with random colors and slowly as they meet their colors average out
christina97 2y ago
Having a hero background that was a variation of this was really popular about 10 years ago or so. You’ll still find them on plenty of websites built around that time.
- duskwuff 2y ago
  It's still extremely common in web site templates for cryptocurrency and AI companies. Sure, it's cliché as all hell, but that doesn't stop people from using it.
deleted 2y ago
[deleted]
Zaskoda 2y ago
This is a lot like how I imagine a mesh net with mobile nodes working.
chkas 2y ago
Hello author here. I'm a little surprised to see this on the front page of Hacker News. This is just a simple demo for my educational programming language Easylang. You can easily edit the code and increase the particle count for example. In the IDE you can then create a link with the code embedded in the URL. https://tiki.li/run/#cod=dVLNbsIwDL7nKT5p0gRDdEGMA9PYM+yO0FTasoZBsqWlJG8/O01EQSOHNP5+7NjNAz5y26riUDXiAUJ//lCIFV6kFG1tq4bOswVT27z4/rLmpEtIIgtzMBbL5ZK55rS1KIzWVdEKADW5Socn3iYoPZ88E6VqOHvzS0VqBtSux94QqjFE63Am0aivPw2CMZ4xl4lWujqrsq1JGKGj6So4+IECbr3fwNPGYCYyYTRyrY55WzFCPeeWDztqRHGfaA36CcQ0jlC3VpsYegr9JbypWShLKSGzeQQ47z7lVRGkVXLafNtgFG44hRtfSB6IuxlHtPlk873Nj694dvrkxOvwf/QrE9dfMji8YyYl6KZcVJKt44ap0rQbdE5Sf5H6JPVJOphKsE9WGNp9wpKO/8adsbv1Bo8r2FyX5rijl0NFRcjxP95Fw0hmCxpK5MN7CbS/T2dCiD8= https://tiki.li/run/#cod=dVLNbsIwDL7nKT5p0gRDdEGMA9PYM+yO0FT...
- chkas 2y ago
  https://easylang.online https://easylang.online
- skygazer 2y ago
  Well, that looks suspiciously like caustics in and around a swimming pool on a sunny day.
- Root_Denied 2y ago
  How hard would it be to push this into 3 dimensions instead of 2? It made me think of a starting point for a model of the universe and galaxy interactions.
- swyx 2y ago
  cant believe nobody has asked... what is the goal of easylang? why did you start working on it? why design choices are you most proud of?
  - chkas 2y ago
    The aim is to offer beginners a simple and interesting entry into programming. IMO there is an unoccupied niche for this between Scratch and Python. In the days of home computer BASIC, it was easier to learn programming - you switched on the computer and with a few lines of BASIC code you could magically create a nice sine wave on the screen. Nowadays, beginners are often overwhelmed by all the complexity.
junon 2y ago
Would love to see this with boids simulations :D
ausbah 2y ago
curious what do ppl usually use to make these animations? i’ve used pillow with python in the pass but that only really works with images and seems clunky
- hotpocket777 2y ago
  https://tiki.li/ https://tiki.li/
youainti 2y ago
This made me realize how much I miss screensavers. I used to sit and just stare at them meditatively as a teen.
- grues-dinner 2y ago
  I think I learned more about chaos theory by hacking a first person Rössler attractor "rider" into xscreensaver (instead of the usual Lorenz attractor) than by any other thing.
- ykonstant 2y ago
  Also the cool effects in music players.
- rollcat 2y ago
  Yeah this one definitely has a JWZ vibe. Probably worth porting and contributing to XScreensaver.
greatNespresso 2y ago
Hypnotizing. Watching this with Beanie playing in the background. Mate that feels good
tempestn 2y ago
Anyone else's brain find this... I guess stressful, rather than relaxing? Something about them connecting but never hanging on, and the bits never all coming together, I think.
- dotancohen 2y ago
  Rather like connections in life maybe. All I see is blonde, redhead...
Recursing 2y ago
See https://bleuje.com/animationsite/2024_1/ https://bleuje.com/animationsite/2024_1/ for a collection of programmatic black and white animations made with https://processing.org/ https://processing.org/ He publishes the source code on https://github.com/Bleuje/processing-animations-code/tree/main https://github.com/Bleuje/processing-animations-code/tree/ma...
- NKosmatos 2y ago
  F**ing hell!!! These are some trippy animations over there. Excellent work and all based on mathematical functions. Thanks for posting this :-)
bitwize 2y ago
Neat! I wrote a "game jam fail" game involving pulsating blue "cells" that cluster together and form attacking aliens: https://github.com/bitwize/cosmic-sweep https://github.com/bitwize/cosmic-sweep
idiotsecant 2y ago
As an aside, I described this to Claude and had it recreate it in javascript with some other features I wanted. It took me 30 seconds to write the prompt and it worked flawlessly. Will anyone ever write fun things like this again once the machine can do it for you? How will young people ever get interested when the machine can do all the work for you?
thih9 2y ago
Note, you can edit the code. Here’s my version, with particles affecting each other: https://tiki.li/run/#cod=dVPbToNAEH3fr5jExLQacFH7UNP6Db43jaFA7WoBBYrM3zszu1sWrTzA7pwzc+bGFbykTWeyY9GqK1DV6yddYQ2PWnWHpmjpmCwY2aXZx1tTn6octNYqq491A8vlkrH2tGsgq6uqyDoFAAfyyge44dct5MgnZOBoSsPRdXy/4HtJBKHeQaLZMIggn8xe0Gfn8+S4cgvwFURTQhQyho3ZEmXYvG+JIMGjxAojC+NZGKfCOBHGP8I4FcbfwmiF0QrjKJyblhvQflGXD44sthVIv9nEjfom0sxOIBLCnFJ90B42VfFt8u5ARGcq676AATBg2Lo5B2fMjnDrqqSnl+6QoZRZ6Tih9+Az6PGM4hlFQWMVq7qCtDJl2hVKAhdpw4c9LYXhTkJXg10mF49nw4Luyh3D8UqZ0VZcLiUzDcU/p80S717COCM9Mv1018JMyo5gmAcgehAtiAEYbC5wdfbL60NbkGgNpMibpmmUtmk0zT4ohgc+UtFT0VODQn3PQ3ff6ZBHIaknK3gY0ySTVCCuc9LjmYwZ2S9Pin7Kv044dXK52e/EKfYj/meWw2YL12to0iqvyz35UtlKqrhs753DTMcLarzDZZ0Fxv/hWCn1Aw== https://tiki.li/run/#cod=dVPbToNAEH3fr5jExLQacFH7UNP6Db43jaF...
- thih9 2y ago
  Bugfix, because earlier some particles were immune to the forces: https://tiki.li/run/#cod=dVPbboJAEH3fr5ikSaNtoEutDzbab+i7MQ0C1rUCLSAyf9+Z2QUXa3mA3Tln5syNO3iPq8Ykx6xWd6CKj2+6wgpetGr2VVbTMZozso2Tr8+qPBUpaK1VUh7LChaLBWP1aVtBUhZFljQKAPbklXbwwK9HSJFPyMDR5Iaj6/B5zvecCEJ9gkizoRNBPpmdoG/O59Vx5ebhSwjGhMBndGuzIUq3PmyIIMGDyAojC+MgjGNhHAnjH2EcC+O1MFphtMJ4EU5NzQ2of6jLe0cW2xKk32ziRp2JNLETCIQwHVKVPhbZ2aTNnojOlJdtBh2gx7B1cw7OmBzh0VVJTyvdIUMus9JhRO+uz6DFAcUBRUFDFaqygLgwedxkSgJnccWHHS2F4U5CU4JdJhePZ8OC7sodw8uVMqOtuF1KYiqKP6TNEoebEvTICsTbGiZSewDd1AOxB9GC6IHe+gKXaL+8Q7QKkdZAsrxumuZpO0cjbb2KeOoXKvZU7KletX3jffe+3T6PQlJjljC7pEkmqUBcp6Snw1nkpWS/PC/6Nf964ZWXy85+R15hP+l/RtqtN3C/giou0jLfkS8VrqSO2/bWOUx0OKfWO5y3Wqpr8X84VEr9Ag== https://tiki.li/run/#cod=dVPbboJAEH3fr5ikSaNtoEutDzbab+i7MQ0...
  - thih9 2y ago
    Another version, this time with varying sizes. I guess I have been nerd sniped https://tiki.li/run/#cod=dVPBUoNADL3vV2TGGafVYV2qPdSpfoP3TsehQO1qAQVE8vcm2aUstXKA3eQlL3kJV/CS1K1Nj3mjrkCVr590hSd4MKo91HlDx3jJnl2SfrzV1XeZgTFGpdWxqmG1WrGv+d7VkFZlmaetAoADRWU93PDrFjLkE7LjaAvL2Y1eLPleEECgdxAbNvRCyCe7F++zj3n0WLkF/jVEU0AUIvqN3RKk37xvCSDJo9gRIxPjiRinxDghxj/EOCXGc2J0xOiIcSTObMMCNF+k8sGDxbYG0ZtNLNQPgWZuApEA5qdSRccy/7FZeyCgNxVVl0MPGCBc31yDN6ZHuPVd0tOJOmQoZFZGx/Qmje6gIccAwhMITyAMQVppVZWQlLZI2lwJTZ7UfNjTiljWFdoK3Gr5tDypfmRh/XC8Up20I5cbS21N+YWddstoM7TDZO8XyeiR1Uh2DcxEkwj6eeDEwYnOiYEzWGvgZt2Xd4tWJDYGiJbX0NCcnaI06i7ojbdhhOIAxQEa9D0MJAwf9A9xlJIkWsP9WCaZpAMJnROf0fdxUJL78gDpl/0bhWdRvjr3nUTpYeb/DLffbOH6CeqkzKpiT7HUuJI+Ltubc/tCxrpgX+eTzYxe0lg8hv8E6bzD/91aKfUL https://tiki.li/run/#cod=dVPBUoNADL3vV2TGGafVYV2qPdSpfoP3Tse...
nayuki 2y ago
My independent implementation: https://www.nayuki.io/page/animated-floating-graph-nodes https://www.nayuki.io/page/animated-floating-graph-nodes
sota_pop 2y ago
This reminds me of the header on the home page of one of my favorite network theory books: https://networksciencebook.com/ https://networksciencebook.com/ The version in the banner is interactive with your cursor!
bijection 2y ago
I built a similar thing that includes forces between particles meant to simulate a sort of fluid or, as you scroll down, a gelatinous solid. There’s a bit of free energy injected to keep things moving so it’s actually a very bad fluid sim, but I think that makes it a better interactive toy in exchange. One of the fun parts of naively n^2 particle simulations is trying to find ways to reduce the algorithmic complexity of collision detection. I remember messing with sweep lines and similar, though I don’t remember what optimizations made it into the final code. [0] [0] https://omrelli.ug https://omrelli.ug
- bluocms 2y ago
  Looks really good and is also relaxing to watch when it’s compressed. Did you open sourced it? And your projects are really nice too. Wall smasher is amazing!
Art9681 2y ago
Neat. This is a popular visualization. It's been the ParticlesJS demo for quite some time now: https://vincentgarreau.com/particles.js/ https://vincentgarreau.com/particles.js/ There are many like it, but this one is yours and its pretty cool.
chkas 2y ago
Another one - small colliding balls https://tiki.li/run/#cod=jVPBbtswDL3rKx5QYEgd2FWMDliWaIf+RpGDYzmFMkfa5MSQ/r6gJNeO3QL1RSL5+B4p0g94MTddK/2GY9W2HXsAs5WEAC9+MQ2Bn5yz7l/TRN9zApQQIFyGkkxbyefoKZGFg3DHqv77Zs1NS3DO2clYKAhscDXQDIB7PeAHpWlpLidkWG04Rx4IHrGmk2D+e7B+QRfrzlAij/cAW9AtYQWV392OFrVpWyUbSqQX6P7bK6Rz3gePw5OAxA7Sh1vgh8Cqd6/qgJxqOh8ekRF0jVXvk9sP7sCjTuixB6d7pM0E+khLt+RPpIIAOyQukThi/HzAeownK8QLVjCjUWl1qa6hn7ptKhsupjUWZVmScTF9Ax5raZVuQG99b234aM8tPhJut1sylmMfVEI71EVy1srWbTOMM+yHCh2ExpPPD74hsfhSxEFEih08xFSJ4GcIKKzvU+IwqmOHlUOOOL19XOxKyxjxyOEnkTE3Dk9gyL2PhCJS7izHeQrS4OOm0ODHwX4UFoFBNfxyv6f7Gb+C3Z/qBIc/+PhjRmRcJ4Gcmpo+cdOGpP3n8Dl6IuS/EPJTIT8T8gshPxHyMyFaY8beAQ== https://tiki.li/run/#cod=jVPBbtswDL3rKx5QYEgd2FWMDliWaIf+RpG...
dbajaj 2y ago
Do they attract to each other and over time gravitate towards the center?
gus_massa 2y ago
Nice. Have you tried a version where the particles have a small atraction/repulsion? (Bonus points for a bar to choose the force.) (1/r^2? can I choose the exponent?)
- hnuser123456 2y ago
  This is a very slippery slope towards making a full blown 3d three.js octree based n-body gravity simulation, at least for me :)
  - dylan604 2y ago
    it doesn't have to be 3d though. another idea would be to assign mass values to the particles and see if after an amount of time if everything settles down to some sort of orbital track around each other. but either idea moves it from being a relaxing visual into a bit of sciencey simulator that totally changes to the scope of the project
    - chkas 2y ago
      It shouldn't be that complicated. I tried it once with gravity and without limits on the edges. The cluster of stars moved around in 2d space and stars were repeatedly catapulted out, which then disappeared. Maybe you need a super gravity (black hole) in the center to keep it stable.
      - hnuser123456 2y ago
        From my experiments, you need to flip the velocity if it goes out of bounds, and have a little bit of drag, multiply each vel by 0.9999 each frame. Otherwise, a few particles being ejected at very high speeds IS realistic... they carry away surplus kinetic energy, which allows the remaining cluster to contract. And once too much matter has lost too much kinetic energy, it does converge and become a black hole. The weird thing is that their radius scales proportional with their mass, not volume... so they grow in this weird way where adding a 3 solar mass black to a 3e6 solar mass SMBH causes the SMBH's volume to grow by several, several times the volume taken by the 3e0 BH. It's like black holes force themselves to grow in a straight line internally, but then the entire sphere encompassing that line becomes event horizon, which is probably why there only seems to end up being 1 SMBH per galaxy, they get so big so quickly at the 1e6+ range, that any other BHs drifting around the vicinity get absorbed by the growing EH, which causes the EH to grow more, causing it to absorb more BH... so there's this period where a bunch of relatively tiny, sparse black holes suddenly hit the critical density where the entire region they were all sharing suddenly pops into one huge event horizon that encompasses all the empty space they were sharing previously.
sadeshmukh 2y ago
I decided to try making one myself and spent absolutely way too long on it: https://particles.halceon.xyz https://particles.halceon.xyz

225 points by tikili 2y ago

ddawson 2y ago

I feel like that's what's happening to my neurons when I'm browsing Reddit. And Hacker News.

justsomehnguy 2y ago

Need DVD version

grues-dinner 2y ago

Nice. Reminds me strongly of levitated.net (sadly broken due to no Flash) and complexification.net (sadly broken due to no Java). Geeking out over Jared Tarbell over dial up basically got me into computers in the first place.

leeoniya 2y ago

there is a website on the internet that has this in the banner or background, but i cannot remember what it was.

deadbabe 2y ago

What if you incorporate game of life type rules into this?

someoneontenet 2y ago

Neat, I’ve also made something like this with processing https://robw.fyi/constellation.html https://robw.fyi/constellation.html

hashishen 2y ago
this is great nice work

mjstone 2y ago

Reminds me of the Ex Machina end credits [1] (and the Android live wallpaper I made as a homage to it [2].) [1] https://www.youtube.com/watch?v=uRJ-fPAO3Go https://www.youtube.com/watch?v=uRJ-fPAO3Go [2] https://play.google.com/store/apps/details?id=com.figmentanova.wp2 https://play.google.com/store/apps/details?id=com.figmentano...

stackedinserter 2y ago

I can't relax, the fact that connections don't affect their speed/direction infuriates me.

stavros 2y ago
I didn't think I'd care, but I had the same reaction.

airstrike 2y ago

Made a version with charged particles. Probably bad physics all around, but here it is: https://shorturl.at/ocvEO https://shorturl.at/ocvEO

BlueTemplar 2y ago
It doesn't take much to get decent physics : https://mattermodeling.stackexchange.com/questions/9541/lennard-jones-clusters-in-python https://mattermodeling.stackexchange.com/questions/9541/lenn... https://en.m.wikipedia.org/wiki/Lennard-Jones_potential https://en.m.wikipedia.org/wiki/Lennard-Jones_potential With the right parameters you get to see the solid and fluid phases of matter !
dtgriscom 2y ago
What? No bonding?
j1elo 2y ago
Funny how the "shortened" url is actually longer than the real url. Any reason you shared it using the former?
- airstrike 2y ago
  You mean shorter than `https://tiki.li/run/ https://tiki.li/run/`? That one only works after the real URL is loaded at least once. The un-shortened URL was huge as it contains the whole app in base64 encoding or some such https://tiki.li/run/#cod=pVVLj9s2EL7zVwxgoLCzXa20yTbeIJtD2h4K9FC0hx6CxYKWaJtZiXRI2hbz6zvDh0W7u+ihOugxnG8e3zw0g1970TqjB75RwskWdtzgoxdg5bDvuZNawVG6LUjViZ3Am3IwcGtv2i03G8HUE0HgAd7VzG2NsPja3LEZ/LH1Vra8h1Yr67hyFuYWv0UHa21K+3bHW7Fgz4isqyVCf9b7Xg+rExIijg1SPXXSuqB4x7r40rAVb583Ru9VB8vlkrW6Rwf39/dsvVct9ApGqBgAGOH2RkGvN00N83EBN/n9tnrfLG+XC1Yxu18Z8qyQGAJt0Uk3whu6XUHn6c3TQYrEfsP0tySQ6yj7CIEIEuHVH1FpHqm5Dgrk922dj6USR9khw/0xidBOJPeLfERv6f3rIxrOKLymLE+iGfy9lU4EfrlzhrfEbzoXvRWX6LquS/TnHokMaCN2+95O4Co9B30QyKYvgoeRQvN4Y0ExM8j79glNteKcmlMNP2QCs4SFGHLtAzS23qA7YTjmRW0g1YYU4/EDXD9PDF2wdQPz4OFNJJ1QfERIhIZ6TirU0mggavlSy7+idRjJ4dUDGUW1EP7BZ5mfZIGf60u9JEt6FcM54EoOmCYp4ARykwhBImlSRAzJpuxB0qCB0xAnMFWEEqTA0idl4qdPwn3NODmVvoswignGQhzhQewLcdH483+NxmJSvBgILHkxV6kPz9okd1oVU//F8ONpI/2vxC/69mzCPr0wVe+aci7+TDtrp6108pBDfWmi7n46m8fP/T6OoxIbXkDzPM3gL/ldwIpbdIEtQA3249mu1TnUhGilofU8r6u3yDnutnmDz9yYWAHcjIspzRHTa+oaMISR9gfWIDYujs6h4AtV/aTqs6rPqgWXue+jndzSxHk+8OUBbYQZ/KaQOZxeTPZU0Jd/LDgGXU75lXKPXx7hhwcwqKmHNXpq4h7zr8ixgkEU7a+EOwqhkKjb4KupglKgMODp4KqwQj+l0koM7rJKhE+rLkM/hd9Uqlvst+AgNFfRPeXZdVMMQGINDqLXrXQefR6EsaL3sDN6pw3tdzxHdrL7w1P4WdIPGZOYY3I4vEV73EbLv8vN1glTFCOMCIeVdLDmFs/S8gpRYbvdoZ2UGNlJftI2+w+lijH2Dw== https://tiki.li/run/#cod=pVVLj9s2EL7zVwxgoLCzXa20yTbeIJtD2h4...

bouncybouncycat 2y ago

It seems to me that it is inevitable: every programmer goes through a phase where they do a bounded billiard ball simulation. It’s like a right of passage.

devin 2y ago
rite* of passage
- jhncls 2y ago
  A "wright of passage", a "craftsperson of passage", someone who facilitates or creates transitions -- like a metaphorical bridge-builder
  - mystified5016 2y ago
    Rite, as in the ritual one performs to pass to the next stage of their goal.

kaeruct 2y ago

I'd like to share mine as well. There's a bit of more interaction between particles but I don't remember the exact logic. Code should be easy to read: https://kaeruct.github.io/projects/short-experiments/dots/ https://kaeruct.github.io/projects/short-experiments/dots/

biomcgary 2y ago
Agglomerative clustering
nhecker 2y ago
I like this.
deskr 2y ago
[flagged]
- taco_emoji 2y ago
  c'mon, man
- IceDane 2y ago
  You alright there, buddy? I think some grass touching might be in order.
  - deskr 2y ago
    I'm good. I forgot to add there would be a nazi salute too!
ides_dev 2y ago
I like how some of the particles get thrown out of the cluster on wider elliptical orbits, they look like comets.
rikroots 2y ago
Nice! On a tangent, I thought this sort of "animated star field" effect had gone out of fashion 5 years ago - I rarely come across a website using it nowadays. My example is part of the testing suite for my canvas library: https://scrawl-v8.rikweb.org.uk/demo/particles-006.html https://scrawl-v8.rikweb.org.uk/demo/particles-006.html

Reimersholme 2y ago

[dead]

752963e64 2y ago

[dead]

voiper1 2y ago

Cute. First thing I did though was to see if moving my mouse or clicking affected it. Doesn't seem to, please add that!

65 2y ago

This would make the perfect hero background to my portfolio site!

alentred 2y ago

That... is... mesmerizing... ... ... ⠋ ⠙ ⠹ ⠸ ⠼ ⠴ ⠦ ⠧ ⠇ ⠏ ⠋ ⠙ ⠹ ⠸ ⠼ ⠴ ⠦ ⠧ ⠇ ⠏ Thank you. I wonder if I could use it for meditation. If only it would not require a blue screen.

polishdude20 2y ago

I'd love to see the connection line come from both particles and join between them! Ooo and also if they can like start with random colors and slowly as they meet their colors average out

christina97 2y ago

Having a hero background that was a variation of this was really popular about 10 years ago or so. You’ll still find them on plenty of websites built around that time.

duskwuff 2y ago
It's still extremely common in web site templates for cryptocurrency and AI companies. Sure, it's cliché as all hell, but that doesn't stop people from using it.

deleted 2y ago

[deleted]

Zaskoda 2y ago

This is a lot like how I imagine a mesh net with mobile nodes working.

chkas 2y ago

Hello author here. I'm a little surprised to see this on the front page of Hacker News. This is just a simple demo for my educational programming language Easylang. You can easily edit the code and increase the particle count for example. In the IDE you can then create a link with the code embedded in the URL. https://tiki.li/run/#cod=dVLNbsIwDL7nKT5p0gRDdEGMA9PYM+yO0FTasoZBsqWlJG8/O01EQSOHNP5+7NjNAz5y26riUDXiAUJ//lCIFV6kFG1tq4bOswVT27z4/rLmpEtIIgtzMBbL5ZK55rS1KIzWVdEKADW5Socn3iYoPZ88E6VqOHvzS0VqBtSux94QqjFE63Am0aivPw2CMZ4xl4lWujqrsq1JGKGj6So4+IECbr3fwNPGYCYyYTRyrY55WzFCPeeWDztqRHGfaA36CcQ0jlC3VpsYegr9JbypWShLKSGzeQQ47z7lVRGkVXLafNtgFG44hRtfSB6IuxlHtPlk873Nj694dvrkxOvwf/QrE9dfMji8YyYl6KZcVJKt44ap0rQbdE5Sf5H6JPVJOphKsE9WGNp9wpKO/8adsbv1Bo8r2FyX5rijl0NFRcjxP95Fw0hmCxpK5MN7CbS/T2dCiD8= https://tiki.li/run/#cod=dVLNbsIwDL7nKT5p0gRDdEGMA9PYM+yO0FT...

chkas 2y ago
https://easylang.online https://easylang.online
skygazer 2y ago
Well, that looks suspiciously like caustics in and around a swimming pool on a sunny day.
Root_Denied 2y ago
How hard would it be to push this into 3 dimensions instead of 2? It made me think of a starting point for a model of the universe and galaxy interactions.
swyx 2y ago
cant believe nobody has asked... what is the goal of easylang? why did you start working on it? why design choices are you most proud of?
- chkas 2y ago
  The aim is to offer beginners a simple and interesting entry into programming. IMO there is an unoccupied niche for this between Scratch and Python. In the days of home computer BASIC, it was easier to learn programming - you switched on the computer and with a few lines of BASIC code you could magically create a nice sine wave on the screen. Nowadays, beginners are often overwhelmed by all the complexity.

junon 2y ago

Would love to see this with boids simulations :D

ausbah 2y ago

curious what do ppl usually use to make these animations? i’ve used pillow with python in the pass but that only really works with images and seems clunky

hotpocket777 2y ago
https://tiki.li/ https://tiki.li/

youainti 2y ago

This made me realize how much I miss screensavers. I used to sit and just stare at them meditatively as a teen.

grues-dinner 2y ago
I think I learned more about chaos theory by hacking a first person Rössler attractor "rider" into xscreensaver (instead of the usual Lorenz attractor) than by any other thing.
ykonstant 2y ago
Also the cool effects in music players.
rollcat 2y ago
Yeah this one definitely has a JWZ vibe. Probably worth porting and contributing to XScreensaver.

greatNespresso 2y ago

Hypnotizing. Watching this with Beanie playing in the background. Mate that feels good

tempestn 2y ago

Anyone else's brain find this... I guess stressful, rather than relaxing? Something about them connecting but never hanging on, and the bits never all coming together, I think.

dotancohen 2y ago
Rather like connections in life maybe. All I see is blonde, redhead...

Recursing 2y ago

See https://bleuje.com/animationsite/2024_1/ https://bleuje.com/animationsite/2024_1/ for a collection of programmatic black and white animations made with https://processing.org/ https://processing.org/ He publishes the source code on https://github.com/Bleuje/processing-animations-code/tree/main https://github.com/Bleuje/processing-animations-code/tree/ma...

NKosmatos 2y ago
F**ing hell!!! These are some trippy animations over there. Excellent work and all based on mathematical functions. Thanks for posting this :-)

bitwize 2y ago

Neat! I wrote a "game jam fail" game involving pulsating blue "cells" that cluster together and form attacking aliens: https://github.com/bitwize/cosmic-sweep https://github.com/bitwize/cosmic-sweep

idiotsecant 2y ago

As an aside, I described this to Claude and had it recreate it in javascript with some other features I wanted. It took me 30 seconds to write the prompt and it worked flawlessly. Will anyone ever write fun things like this again once the machine can do it for you? How will young people ever get interested when the machine can do all the work for you?

thih9 2y ago

Note, you can edit the code. Here’s my version, with particles affecting each other: https://tiki.li/run/#cod=dVPbToNAEH3fr5jExLQacFH7UNP6Db43jaFA7WoBBYrM3zszu1sWrTzA7pwzc+bGFbykTWeyY9GqK1DV6yddYQ2PWnWHpmjpmCwY2aXZx1tTn6octNYqq491A8vlkrH2tGsgq6uqyDoFAAfyyge44dct5MgnZOBoSsPRdXy/4HtJBKHeQaLZMIggn8xe0Gfn8+S4cgvwFURTQhQyho3ZEmXYvG+JIMGjxAojC+NZGKfCOBHGP8I4FcbfwmiF0QrjKJyblhvQflGXD44sthVIv9nEjfom0sxOIBLCnFJ90B42VfFt8u5ARGcq676AATBg2Lo5B2fMjnDrqqSnl+6QoZRZ6Tih9+Az6PGM4hlFQWMVq7qCtDJl2hVKAhdpw4c9LYXhTkJXg10mF49nw4Luyh3D8UqZ0VZcLiUzDcU/p80S717COCM9Mv1018JMyo5gmAcgehAtiAEYbC5wdfbL60NbkGgNpMibpmmUtmk0zT4ohgc+UtFT0VODQn3PQ3ff6ZBHIaknK3gY0ySTVCCuc9LjmYwZ2S9Pin7Kv044dXK52e/EKfYj/meWw2YL12to0iqvyz35UtlKqrhs753DTMcLarzDZZ0Fxv/hWCn1Aw== https://tiki.li/run/#cod=dVPbToNAEH3fr5jExLQacFH7UNP6Db43jaF...

thih9 2y ago
Bugfix, because earlier some particles were immune to the forces: https://tiki.li/run/#cod=dVPbboJAEH3fr5ikSaNtoEutDzbab+i7MQ0C1rUCLSAyf9+Z2QUXa3mA3Tln5syNO3iPq8Ykx6xWd6CKj2+6wgpetGr2VVbTMZozso2Tr8+qPBUpaK1VUh7LChaLBWP1aVtBUhZFljQKAPbklXbwwK9HSJFPyMDR5Iaj6/B5zvecCEJ9gkizoRNBPpmdoG/O59Vx5ebhSwjGhMBndGuzIUq3PmyIIMGDyAojC+MgjGNhHAnjH2EcC+O1MFphtMJ4EU5NzQ2of6jLe0cW2xKk32ziRp2JNLETCIQwHVKVPhbZ2aTNnojOlJdtBh2gx7B1cw7OmBzh0VVJTyvdIUMus9JhRO+uz6DFAcUBRUFDFaqygLgwedxkSgJnccWHHS2F4U5CU4JdJhePZ8OC7sodw8uVMqOtuF1KYiqKP6TNEoebEvTICsTbGiZSewDd1AOxB9GC6IHe+gKXaL+8Q7QKkdZAsrxumuZpO0cjbb2KeOoXKvZU7KletX3jffe+3T6PQlJjljC7pEkmqUBcp6Snw1nkpWS/PC/6Nf964ZWXy85+R15hP+l/RtqtN3C/giou0jLfkS8VrqSO2/bWOUx0OKfWO5y3Wqpr8X84VEr9Ag== https://tiki.li/run/#cod=dVPbboJAEH3fr5ikSaNtoEutDzbab+i7MQ0...
- thih9 2y ago
  Another version, this time with varying sizes. I guess I have been nerd sniped https://tiki.li/run/#cod=dVPBUoNADL3vV2TGGafVYV2qPdSpfoP3TsehQO1qAQVE8vcm2aUstXKA3eQlL3kJV/CS1K1Nj3mjrkCVr590hSd4MKo91HlDx3jJnl2SfrzV1XeZgTFGpdWxqmG1WrGv+d7VkFZlmaetAoADRWU93PDrFjLkE7LjaAvL2Y1eLPleEECgdxAbNvRCyCe7F++zj3n0WLkF/jVEU0AUIvqN3RKk37xvCSDJo9gRIxPjiRinxDghxj/EOCXGc2J0xOiIcSTObMMCNF+k8sGDxbYG0ZtNLNQPgWZuApEA5qdSRccy/7FZeyCgNxVVl0MPGCBc31yDN6ZHuPVd0tOJOmQoZFZGx/Qmje6gIccAwhMITyAMQVppVZWQlLZI2lwJTZ7UfNjTiljWFdoK3Gr5tDypfmRh/XC8Up20I5cbS21N+YWddstoM7TDZO8XyeiR1Uh2DcxEkwj6eeDEwYnOiYEzWGvgZt2Xd4tWJDYGiJbX0NCcnaI06i7ojbdhhOIAxQEa9D0MJAwf9A9xlJIkWsP9WCaZpAMJnROf0fdxUJL78gDpl/0bhWdRvjr3nUTpYeb/DLffbOH6CeqkzKpiT7HUuJI+Ltubc/tCxrpgX+eTzYxe0lg8hv8E6bzD/91aKfUL https://tiki.li/run/#cod=dVPBUoNADL3vV2TGGafVYV2qPdSpfoP3Tse...

nayuki 2y ago

My independent implementation: https://www.nayuki.io/page/animated-floating-graph-nodes https://www.nayuki.io/page/animated-floating-graph-nodes

sota_pop 2y ago

This reminds me of the header on the home page of one of my favorite network theory books: https://networksciencebook.com/ https://networksciencebook.com/ The version in the banner is interactive with your cursor!

bijection 2y ago

I built a similar thing that includes forces between particles meant to simulate a sort of fluid or, as you scroll down, a gelatinous solid. There’s a bit of free energy injected to keep things moving so it’s actually a very bad fluid sim, but I think that makes it a better interactive toy in exchange. One of the fun parts of naively n^2 particle simulations is trying to find ways to reduce the algorithmic complexity of collision detection. I remember messing with sweep lines and similar, though I don’t remember what optimizations made it into the final code. [0] [0] https://omrelli.ug https://omrelli.ug

bluocms 2y ago
Looks really good and is also relaxing to watch when it’s compressed. Did you open sourced it? And your projects are really nice too. Wall smasher is amazing!

Art9681 2y ago

Neat. This is a popular visualization. It's been the ParticlesJS demo for quite some time now: https://vincentgarreau.com/particles.js/ https://vincentgarreau.com/particles.js/ There are many like it, but this one is yours and its pretty cool.

chkas 2y ago

Another one - small colliding balls https://tiki.li/run/#cod=jVPBbtswDL3rKx5QYEgd2FWMDliWaIf+RpGDYzmFMkfa5MSQ/r6gJNeO3QL1RSL5+B4p0g94MTddK/2GY9W2HXsAs5WEAC9+MQ2Bn5yz7l/TRN9zApQQIFyGkkxbyefoKZGFg3DHqv77Zs1NS3DO2clYKAhscDXQDIB7PeAHpWlpLidkWG04Rx4IHrGmk2D+e7B+QRfrzlAij/cAW9AtYQWV392OFrVpWyUbSqQX6P7bK6Rz3gePw5OAxA7Sh1vgh8Cqd6/qgJxqOh8ekRF0jVXvk9sP7sCjTuixB6d7pM0E+khLt+RPpIIAOyQukThi/HzAeownK8QLVjCjUWl1qa6hn7ptKhsupjUWZVmScTF9Ax5raZVuQG99b234aM8tPhJut1sylmMfVEI71EVy1srWbTOMM+yHCh2ExpPPD74hsfhSxEFEih08xFSJ4GcIKKzvU+IwqmOHlUOOOL19XOxKyxjxyOEnkTE3Dk9gyL2PhCJS7izHeQrS4OOm0ODHwX4UFoFBNfxyv6f7Gb+C3Z/qBIc/+PhjRmRcJ4Gcmpo+cdOGpP3n8Dl6IuS/EPJTIT8T8gshPxHyMyFaY8beAQ== https://tiki.li/run/#cod=jVPBbtswDL3rKx5QYEgd2FWMDliWaIf+RpG...

dbajaj 2y ago

Do they attract to each other and over time gravitate towards the center?

gus_massa 2y ago

Nice. Have you tried a version where the particles have a small atraction/repulsion? (Bonus points for a bar to choose the force.) (1/r^2? can I choose the exponent?)

hnuser123456 2y ago
This is a very slippery slope towards making a full blown 3d three.js octree based n-body gravity simulation, at least for me :)
- dylan604 2y ago
  it doesn't have to be 3d though. another idea would be to assign mass values to the particles and see if after an amount of time if everything settles down to some sort of orbital track around each other. but either idea moves it from being a relaxing visual into a bit of sciencey simulator that totally changes to the scope of the project
  - chkas 2y ago
    It shouldn't be that complicated. I tried it once with gravity and without limits on the edges. The cluster of stars moved around in 2d space and stars were repeatedly catapulted out, which then disappeared. Maybe you need a super gravity (black hole) in the center to keep it stable.
    - hnuser123456 2y ago
      From my experiments, you need to flip the velocity if it goes out of bounds, and have a little bit of drag, multiply each vel by 0.9999 each frame. Otherwise, a few particles being ejected at very high speeds IS realistic... they carry away surplus kinetic energy, which allows the remaining cluster to contract. And once too much matter has lost too much kinetic energy, it does converge and become a black hole. The weird thing is that their radius scales proportional with their mass, not volume... so they grow in this weird way where adding a 3 solar mass black to a 3e6 solar mass SMBH causes the SMBH's volume to grow by several, several times the volume taken by the 3e0 BH. It's like black holes force themselves to grow in a straight line internally, but then the entire sphere encompassing that line becomes event horizon, which is probably why there only seems to end up being 1 SMBH per galaxy, they get so big so quickly at the 1e6+ range, that any other BHs drifting around the vicinity get absorbed by the growing EH, which causes the EH to grow more, causing it to absorb more BH... so there's this period where a bunch of relatively tiny, sparse black holes suddenly hit the critical density where the entire region they were all sharing suddenly pops into one huge event horizon that encompasses all the empty space they were sharing previously.

sadeshmukh 2y ago

I decided to try making one myself and spent absolutely way too long on it: https://particles.halceon.xyz https://particles.halceon.xyz