My website is hosted on git hub pages the link is https://shepardb0y-src.github.io/Mega-Man/ The vision for my game was to implemnt a version of megaman platform game on the pc but just do the boss battle stage. To start my project I had to research how i would implement my 2d graphics. After doing some research i discovered Html 5 canvas. Canvas is a tool used to draw graphics with Javascript to implent it you have to declare the canvas element in the index.html file then capture the value in javascript to begin drawing. So i found some some tutorials that helped me understand how to piece my the game together. in these tutorials they were able to explain the importance of canvas and how its used to make 2d and even 3d games The reason for this is canvas is able to capture the frame rate of sprite sheets which will then be used to make an illusion of the pictures moving. Canvas has many special javascript methods that allow it to draw on the DOM. I had to use many of them in my game application. To bring my characters to life i had to use the canvas special method of draw image. This method takes 9 different arguments, the first argument is the Image file, this image file was a sprite image. A sprite image an image that has many frames within that can be cropped out at differnt frames. The next four are optional then next two describe where you would like to place the image on the canvas sheet with x and y coordinates the last two describe how much of the sprite sheet you would like to crop out and place on the canvas. After learning about the draw image method picking up on the other canvas methods was a bit easier. I was able to draw a missle for megaman megabuster this proved to be challenging but i figured out. Making my character moved was difficult as well i had to learn the new way to implement keyboard events now that key code is deprecated i had to learn ho to use the key method instead. I had may moments where i struggled but i perserved through the project. I wish i was able to automate the boss some mpre and give him some attacks. Also i would loved to animate megaman sprite sheet when he moves so the game woould look more dynamic.Overall it was a great expierience.
the tutorials used are https://www.youtube.com/watch?v=EYf_JwzwTlQ&t=528s https://www.youtube.com/watch?v=Wh2kVSPi_sE&t=814s