Recently, I came across an interesting video on youtube that shows a tutorial to develop a pixel game. (URL: https://youtu.be/yP5DKzriqXA)
Side Note: I have always been interested in pixel game because of how simple and interactive it is.
Below are some interesting elements that I’ve learned through this video regarding pixel game development.
Map
One of the most important elements in a pixel game is the map, the tiled map is the main component of a pixel game. Surprisingly all the character movements that you have seen in pixel games are the movement of a map. The character is in a uniform motion, only the map moves which creates an illusion of the character moving.
But here comes the question, how do obstacles work in the pixel game?
Of course, in pixel game, there are boundaries within the map, some areas that you cannot go through, it is made by mapping collisions. On top of creating the game map, we also create a collision map that specifies the area of collision that the character cannot pass.
Here is an example of a map and a collision map:
To detect a collision, we render the rectangle in the canvas of javascript, and then we compare the coordinate of the collision rectangle with the coordinate of the character.
Character
So if the action of moving forward, backward, left, or right is the movement of the map, how do we see it as if the character is moving? The answer to this question is that we are animating the character at the same time we are moving the map. Character animation is considered in the frame.
In order to render the character, we crop out a single piece from the character assets, and in order to animate the character, we switch the cropping positions so that we can take out a different piece of character movements. By alternating between different characters moving using the image, we can create an animation of characters moving in the game.
Conclusion
This article just serves as an introduction for those who are interested in pixel game development but don’t know where to start. I hope this helps you in your journey of game development. ✌️
