Are you fast enough?
Welcome to typohacko, a 2D, speed typing game using HTML, CSS and JavaScript.
Typohacko is a simple typing game, which combines two element of both a speed typing game and shooting components.
I've always wanted to create a game that involves two game types and combine them into one. Those were such cool things I'd like try. When I started working on this project, I realized that my knowledge of JavaScript was very basic. It was such a scary feeling to get started as I did not know much on where and how to. The feelings and efforts I tried to find on the internet were quite exhausting. Fortunately, I learned some solutions based from my questions that I had in mind along my journey and pretty much developed my knowledge on my JavaScript skill.
PS: It's my very first game and I know it needs a lot more stuffs 😅
Play it here!
The game is simply made by HTML, CSS and JavaScript (as stated above) It has a simple markup in HTML which defines almost every needs such as header, main content, links and footer. The CSS part is responsible for the layout of the game page such as graphics and user interfaces. JavaScript is for the DOM (Document Object Model), interactions, visuals and logics. Since I'm making a simple game as my first project, I based on what I experienced and from my knowledge, to create a minimal yet direct, click and play type game.
- Canvas creation
- Display visuals inside canvas
- Player input
- Random words would appear falling down
- Game difficulty levels
- Health system implementation
- Scoreboard
- Added visuals
Initially I wanted to create a game whereby the user shoots out letters from a sentence. It starts off with a gameplay that would display a peaceful city. Secondly, a sudden attack by an alien invasion and the user need to save the city and citizens from attacks above using sentences that would appear promptly on the screen. The user then type the word in and it shoots off the letters as a projectile to hit the alien spaceship above!
Turns out, I could not get my code to work even with my pseudocodes. So, I opted a bare, simple game plan that would help me achieve the requirements from this project. I applied what I had learned for the past few weeks, to a great extent of googling, youtube and stackoverflow. I accomplished and gained knowledge from this project. Basically, the game starts with a screen where the user can choose the difficulty of the game and play. A random word would come falling down and the user needs to type the correct word in order to get points.
- Spent quite a bit of time of figuring out CSS and HTML to get display right.
- Multiple DOM functions couldn't work
- Implementing user interfaces, additional buttons
- Possible loading and menu screen
- A functional reset button
- Highscore system