This demo is heavily inspired by an article by Emanuele Feronato on creating a terrain. Infact I was so inspired that I decided to use the same variables' name he used. ;)

Jokes apart, very slight modifications were made so if you want to learn how it was coded you can check his article.

In a nutshell, what is happening here is that two sine or cosine curves are being created. At every 'x' position 10px apart we are calculating 'y' position on the sine or cosine curve. Thus we get two sets of coordinates whose 'x' position are 10px apart and another two sets of coordinates, just below the other two, lying on the ground. Then a polygon is drawn using all the four coordinates and this was done for the entire length ('X' direction).

Meanwhile here's the demo.

Click on the canvas to change terrain shape.

By administrator at 12:07:33 AM 2 Comment(s)


This is awesome. I was always curious as to how Tiny Wings made the hills. Now I know! Combining this with trajectory and world scrolling, and you have yourself a game already.
By Evertith on 10 Nov, 2012 at 05:52:41 PM
I guess we got to thank Emanuele Feronato for that! :)
By administrator on 11 Nov, 2012 at 10:26:38 AM

Add a Comment

Please enter the email address.Invalid format. (Won't be Displayed)
Notify me of followup comments
Enter the displayed Code: captcha