For this project I wanted to use spring to create the waves by having many points in one line and mimic the motion of waves on a sea/water surface. I was also inspired by the ocean in the Disney movie Moana and referenced this code which helped me realize the project.

To make the surface of the water smooth, the number of spring points are set as one third of the canvas, and for the waves it’s done using two arrays with an initial length equal to the length of the spring points. Then there’s a function calculating the difference in height (diff) between the current spring and its adjacent spring(s), then multiply this with a factor smaller then 1 (which I set to 0.99 because the effect is most satisfying to me) to determine the amount of wave propagation.

In the final version of the project the code of drawing the springs is commented out but here’s a screenshot of the points being drawn.

Finally I adjusted the color to a green-blue gradient that matches the one in the movie. I wanted to draw some clouds in the background and maybe play with the transparency of the water but ran out of time. I also thought about making two sets of surfaces to create a sense of depth to the image, which is something that could be explored later on.

Here’s a video of the waves with the points drawn and a smoother animation.