I progammed a simple cloth animation. Initially I tried to implement Hooke's law, but it wasn't numerically stable, presumably because I used explicit Euler. Anyway, I came up with something (WebGL2 based, won't work in Safari unfortunately) I quite like but don't understand the math at all.
Every point has a position $p$ and velocity $v$. The position is given relative to the initial position, where the initial position of point $(i,j)$ can be thought as $(i,j,0,0)$ (I rendered the cloth in 4 dimensions to make it more interesting, but that should not make a huge difference). There is a linear gravity term $g_v$ on the velocity which pulls the point back to its original position and also a friction term $f_v$ which slows down the velocity, so we have $v_{t+1}=f_vv_t+g_vp_t+d$ where $d$ is some external disturbance which is triggered by mouse clicks. But the position doesn't follow just $p_{t+1}=p_t+v_{t+1}$, as I added some term to implement clothiness, so the points tend to the center of the four surrounding points. What I came up with is $$p_{t+1}=g_pp_t+v_{t+1}+\frac{c}{|c|^{2/3}+1}$$ where the center $c$ is computed as the sum of the positions of the four neighbouring points, $g_p<1$ is some kind of another gravity term and the $2/3$ basically just make the last term approximates $c$ for small $|c|$ but grows slower for larger values of $|c|$.
I played around with this and tried to get rid of some terms but couldn't really find a satisfying way to do so. On the other hand, I just can't wrap my head around what I have actually done here. The velocity is not the true velocity anymore, as it doesn't reflect the change in position. Yet the new position feeds back in the velocity via the $g_v$ term. It's also weird that if you click the cloth once, it more or less just changes position, but on every further click it behaves much more like a cloth.
Can someone tell me if this math does make any sense or if there is some underlying principle for this dynamics which I accidentally approximated?