In this video you will learn how to create an arcade game using pure JavaScript in conjunction with the Canvas API. The game in question is ‘circus’ which is an arcade game made in 1977 by Exidy. The aim of the game is to use a see-saw to propel the 2 men into the air. One at a time. So that they can pop all of the balloons. Lives will be lost if the player fails to catch either of the men with the see-saw.
📚 Materials/References:
Completed projects GitHub repository: https://github.com/lfcourtney/Circus-...
Blue balloon image: https://raw.githubusercontent.com/luk...
Green balloon image: https://raw.githubusercontent.com/luk...
Yellow balloon image: https://raw.githubusercontent.com/luk...
Game Sound SFX: https://github.com/lukechopper/Circus...
Hit Balloon SFX: https://github.com/lukechopper/Circus...
See-Saw Jump SFX: https://github.com/lukechopper/Circus...
🧠 Concepts Covered:
Animate a sprite sheet in canvas
Mouse control in canvas
Advanced collision detection in canvas
Switch between animations in canvas
High score & game mechanics in canvas
💻 Technologies used:
HTML5 and the canvas API
JavaScript (No jQuery)
CSS (No Bootstrap)
If you enjoyed this video then please consider liking 👍 and subscribing. You would be doing me a huge favour if you did this and it would be greatly appreciated ❤️ by me. Likewise, if you have any queries or comments that you want answered. Then please, don’t hesitate post them down into the comments box below. I would love to hear back from you and will answer all of your questions to the best of my ability.
Stay awesome guys. ❤️
#canvas#HTML#JavaScript#gamedev#canvasapi#webdev#coding#development#computerscience