Yesterday, a pile of “fake sand” got stuck during my product demo
I was demoing an outdoor gear page from a café in Shenzhen. The client tapped the screen, but the sand on the page looked like a flat photo. I spent half an hour trying to make it work, and the animation still looked fake. In the end, I switched to a video so I could finish presenting the concept. Looking back, Hyper-Realistic Sand gave me a lighter technical route, but it definitely isn’t worth developing for every side project.
It turns the browser into a small sandbox
Hyper-Realistic Sand is an open-source web experiment that calculates in real time how sand falls, collides, and piles up, then renders the result. In a demo from New York, the creator Av placed a finger on the screen, and the nearby grains scattered as if he had stirred them. A freelance designer could use it for an interactive cover, while a brand team could use it to explore an installation concept. The most useful lesson for non-coders isn’t the complicated code; it’s defining the question first: will this interaction help a client understand the product more intuitively?
What it costs to try it today
To experience the creator’s page, the cost is 0 yuan, takes about 10 minutes, and requires no programming. The first step is to open the page’s sand area and move the grains with a mouse or finger. Adding it to your own website changes the equation: a small demo takes roughly one day to prepare, with the exact cost depending on hosting and development. The technical barrier is being able to read basic web code and locate the WebGL2 graphics section. I got this wrong too: at first, I thought I could download the assets and change the brand colors, only to realize that rendering, particles, and interactions all needed adjustment. If I only need it for a client proposal, there’s no pressure to test it now; video or existing motion graphics are the safer route.
Here’s how I’d choose based on where I am now
If I’m just starting and haven’t found a stable client base, I’d save the example for inspiration without rushing into development. I’d use it to spark an interaction idea that can be touched and responds. If I already have one or two clients who often ask about product details, I’d build a small demo, invite them to try it, and check whether it communicates the product more clearly than static images. If I’m scaling and already have web developers on the team, I’d add it to our visual-technology research list, then estimate integration, device compatibility, and long-term maintenance costs. Whatever the stage, I’d start with one question: can this interaction lead to a quote, a sale, or a repeat purchase? If I can’t answer that, I wouldn’t invest just because it looks cool.