Hyper-realistic sand with WebGL2

(av.github.io)

423 points | by everlier a day ago ago

61 comments

  • evnp 19 hours ago

    Super loud sound warning, us parents and folks wearing headphones would really appreciate default sound off. Or at least a some indication to turn volume down before tapping "pour"

    • codingjinxx 2 hours ago

      ya i opened this in class and i forgot to mute

  • rybosome 17 hours ago

    I notice that different types of sand sound different - the timbre of the sand falling onto the table and shuffling around is noticeably different between the various types. I was curious if the differences in the sand were being physically modeled to synthesize sound.

    It’s a physics-based generation but the simulation model is somewhat limited; essentially a few parameters that vary between the sand types, some randomization, and responsiveness to flow rate. Still, it’s highly effective; something like the fine, silty desert sand is noticeably brighter and sounds more like a hiss as it pours and flows than the rocky volcanic sand.

    Very cool effect, this is joyful to play with.

  • smusamashah a day ago

    Found source repo here https://github.com/av/safe-sand

    • hjun1052 4 hours ago

      Wish it had a license. Would’ve loved to add some ants to this.

  • alex_duf a day ago

    On a mobile phone it makes a lot more sense. Try shaking it!

    • leobuskin a day ago

      It doesn’t in my case, I see some weird animation, everything disappears, “pour” button again. Shaking or any other movement doesn’t help. Latest chrome on iOS

    • flykespice 20 hours ago

      The demo runs like a slideshow on my humble budget android phone from 2021

    • theowaway213456 a day ago

      I think it responds to tilting, not shaking?

    • mattlondon a day ago

      Nothing happens on my android phone

    • dyauspitr a day ago

      Maybe it’s too much for my iPhone 13 or something, I can see it but it’s all choppy and slow

    • kinduff 19 hours ago

      I tried shaking the browser window lol

  • nkmnz 20 hours ago

    Something seems wrong with the stones. They seem to move way to fast. They need more friction.

  • Faint 3 hours ago

    Smooth on OnePlus 13. Some flickering on the side the sand falls hard to. Still very nice.

  • asaddhamani 21 hours ago

    I just spent 15 mins playing with this on my phone, it was a lot of fun!

  • lavendermon 20 hours ago

    Tried this on desktop and mobile, totally different experiences. I love the residue effect on the screen after I tilt the sand around on mobile. Next step: hourglass or maybe a snow globe?

  • smusamashah a day ago

    oh wow, the stones even have some water around them. This looks and feels real.

    And if you manage to collect a lot in one place, the sand from the pile does fall like real sand. This is amazing.

    The sound is not good though.

    • catapart a day ago

      They have different characteristics, too. The red, desert sand is clumpier than the beach sand, for instance.

    • jarjoura a day ago

      yup, I would just remove the sound effect completely.

  • momojo 21 hours ago

    This brings me a lot of joy. I love little toys that exist for no other reason than "I really want this to be a thing"

  • weitzj 20 hours ago

    Does it make Patterns if you put a sine wave on your phone's speaker? What are they called? MoirĂŠe patterns?

  • bob1029 20 hours ago

    I like how when my phone's forward vector is aligned with world up all the sand falls out.

  • bahmboo 6 hours ago

    Love it. Want it on my actual pixel home screen

  • techpression a day ago

    I wouldn’t call it realistic, sand gets stuck in the air, stones don’t rotate, and there’s quite an uncanny valley effect based on angles. Still a cool demo of what is possible, even though I get 10fps or something on a iPhone 15 Pro

    • vfosnar a day ago

      didnt encounter the stucking issue but agree with the overerall point, the sand gets a sort of 'build-up pressure and bounce back' effect which breaks the immersiveness for me, otherwise cool

    • zamalek a day ago

      What do you mean "stuck in the air?" It's top down.

  • mashally 21 hours ago

    It was a lot of fun. I wrote I love you phrase to my gf and she liked it.

  • kccqzy a day ago

    It didn’t look realistic to me until I added `?sand=beach` to the URL. Maybe I only associate sand from the beach as sand. Others I call silt perhaps incorrectly.

  • matt3210 19 hours ago

    Finally, the kind of sandbox we deserve

  • hamidmohaqeq a day ago

    This is really cool and give a realistic sense

  • andai 15 hours ago

    Probably a bug, but the audio was just distorted noise without end.

  • yipinwong 20 hours ago

    I felt like a kid playing with real sand in decades playing with this.

  • hirako2000 17 hours ago

    Handles double simultaneous taps n drags. Nice touch!

  • cat-whisperer 18 hours ago

    a full circle moment

  • tgtweak 21 hours ago

    This one does much better at retaining volume than the smudge demo last week :)

  • itomato 20 hours ago

    You can play a nice little round of Bocce with the stones

  • amunozo a day ago

    I am feeling the sand physically at watching at this, good job!

  • cheapcheerful a day ago

    Wow man, very cool.

  • patrick_rtk 4 hours ago

    very nice !

  • Teladin 21 hours ago

    Seeing all the Macbook Pro PROLED XDR Touch Screen geeks finding a use for their new device :D

  • arm32 a day ago

    This is very fun to play with.

  • customguy a day ago

    Zooming on the desktop makes it more dense looking, which is probably not intended but can look very cool IMO.

    • SamBam 21 hours ago

      Such a curious effect, although it makes sense given that each particle is probably being positioned in absolute coordinates with respect to the screen boundaries. So each grain gets bigger but stays in place.

  • turadg 20 hours ago

    anyone who likes that should touch grass

    https://grass.turadg.com/

  • wigster a day ago

    i feel like i'm watching a stop-motion movie as it moves. very nice

    • refactor_master 6 hours ago

      Yeah, the sand looks more like a fine sequence of stop-motion frames than physics based sand.

  • monster_truck 14 hours ago

    This does not seem very realistic at all. Cool slop I guess,

    You are managing to use my GPU so inefficiently that the transient spikes are bumping my speakers out of standby

  • iberator 15 hours ago

    10 fps on merely 3 years old Android phone.

    • ThePinion 14 hours ago

      It's quite amazing. I've found if you simply give the LLM a slight hint that things should be optimized for all devices, you can get tenfold performance of the original one-shot. But I think this is still a secret tactic because none of these have been optimized in the slightest.

      Originally I felt eh maybe you have to have an old coder's mind to tell the LLM how to keep things optimized... But yeah nah not anymore, you just tell it to optimize.

  • int32max 18 hours ago

    woah this is really well done

  • hvvivek 21 hours ago

    this is super fun! well done

  • samiv 21 hours ago

    Cue the whines about not using WebGPU.

  • emilfihlman 21 hours ago

    I think it's lacking momentum, the sand stops way too abruptly, and the audio also has too harsh cutoff. It also falls too fast.

    Otherwise really amazing!

  • christkv a day ago
  • nout a day ago

    This is annoying to clean up exactly like real sand.

    • bovermyer 21 hours ago

      Yeah, it's coarse, and it really gets everywhere.

  • lloydatkinson 21 hours ago

    Runs like crap on iPhone 14. I know it’s not the current generation of phone but is there really that meaningful of a difference between that and a current one?

    • Wowfunhappy 12 hours ago

      Huh? It ran great on my iPhone 13.

  • Razengan a day ago

    Naturally the first instinct of man is to draw a penis.

    • animuchan 4 hours ago

      Your comment got me thinking: why didn't I?

      (Because I didn't draw anything really, some formless lines.)

      Is this the fault of consumerism, where we anticipate the penis to come pre-drawn for our immediate gratification?

      Or have we witnessed internalized self-censorship?

      Or lowered testosterone from work-related stress?

      One tiny penis, left undrawn, raised so many questions.

    • Rexxar 12 hours ago

      I think you should be aware of this: https://en.wikipedia.org/wiki/Psychological_projection