Open source tapping game built with Javascript


After 6 months of hard work applying everything I’ve learned in Javascript, I present to you this simple game that works perfectly on both mobile phones and desktop browsers. And of course, I’m sharing the source code with everyone hoping it’d help someone learn more Javascript.


Mahdi Farra

Senior Product Designer based in 🌉 SF Bay Area.


Main Idea

The main idea came to me when I was on vacation in Jordan.

No. They don’t ride camels for work.

Tiny Project

I wanted to make a tiny project to prove that I’ve learned something in Javascript.

I’m doing something with my life. Finally.

My Childhood Friend Loved My Idea!

While I was in Jordan, I went out to see my childhood friend, Amr. I told him about a stupid idea for a game. Amr loved the idea! And that’s when I decided I should go ahead and work on it!

I know. Amr looks like Pitbull in this photo.


The idea was a simple tiny game,very similar to the famous Whac-A-Mole game. The main difference is that my game will use Emoji’s instead of moles.

Wow! Such Genius! Much Smartness! Cool!

Proof of Concept

I wanted to make a small project to prove to myself that it’s doable in Javascript.

First proof of concept

Responsive Love

After I managed to make the first proof of concept, I decided to try making it responsive to test it on my mobile phone.

First responsive proof of concept

Mobile first they say. I say second, third… do whatever is easier for you.

💩 It’s going to get very technical from here on. Run if you’re not a nerd.

Emoji’s Photos & Random Sounds

I was using regluar emoji characters, and these have unpredictable width and height, so I though I’d better use images instead. I also tried spicing things up by making the clicking sound change everytime you click on an emoji!

Images for emoji’s prototype

Catch the Emojis

After doing a lot of expermients I thought it’s time to give that game a name and a better user interface.

Play Catch the Emojis

I know! That neon red is ridiculous. I mean awesome.

Sound Pool

The game of course, has to have some sound effects.

I managed to get one sound to play at a time, but I needed to be able play multiple sounds at the same time, so I had to program my own audio pool.

Sound Pool Proof of Concept

The End of Catch the Emojis!

I finally implemented the sound pool, and also made it super easy to a new level.
And that was the final version of Catch the Emojis!

Play Catch the Emojis 2

I Hate It!

I woke up a few days after finishing that game with a weird feeling. I hated it. I hated everything about.

I asked a few people to try playing the game, and I noticed that I made a lot of mistakes.
The interface wasn’t intuitive, and my Javascript code wasn’t the best either.

I had to do something about it.

New Game!

I decided that the new game is going to be very similar to the old one, but with a little bit more logic in it.

I wanted to make something more challenging, and more fun to play.

See the new design artboards

Debugging Panel

This time, I decided to take things a bit more serious. I created a simpel debugging panel to help me show/hide the pages real quick which made my life 10 times better when I'm debugging a sprcific page.

Try the control panel


I wanted this version of the game to have a better animation, so I’ve used a lot of CSS3 animation with Javascript to control it.

I tried designing and animating the blue circle first, and I wanted to do that the simplest way possible using a single div element!

See the circles I’ve made on Codepen

Sound Effects

I spent sometime to choosing the right sound effects because I know that they’ll compliment the interface if they were choosen right.

DJ Mahdi van Buuren. Such a multi-talents guy.

Big Objects (OOP)

Back to the technical stuff; to make it easier for me and whoever is going to work on this project in the future, I’ve created a bunch of objects, each one these controls 1 big task, such as creating levels, changing pages, managing audio… etc.

Fun fact: I re-wrote my code for this project 7 times at least, and still, I feel like I need to re-write it again.

Infinite Levels

In the beginning I made an object that you would call and pass a few parameters to setup a new level, but later I thought it’s a lot of work to pass different parameters for each level manually, so I automated it using simple math.

I love math! It empowers lazy people like me.

What’s Next?

I always wanted to learn React Native, and I think this game is a great opportunity for that. I’d be able to make an app out of it, and then publish it to the app stores.

Then I’ll be rich. So rich. So so rich. I’ll even buy a small island. hmmm… okay, island are a bit too expensive. I’ll buy a big house then. hmmm… a big house is super expensive… hmmm… I’ll rent a small apartment?…. hmmm okay.. I’ll stay where I am. Damn it.

Loved the Game?

If you loved the game, you can use it the way you want, but please, mention my name somewhere. Like you know, I worked really hard to get this done.

Hey! Why don't you share this website on your Twitter, Facebook or even Snapchat if that's your thing (not judging).

Loved Me?!

I love you too, but I’m sorry :( I’m already taken.

But hey, I accept gifts. Gifts are awesome.

This is my wishlist on Amazon


I wouldn’t be able to do it without you!

avatar of Nour Abu Saud Nour Abu Soud

First of all, thank you for not devorsing me. And also for helping me debug the game, and for testing it a million times. And most importantly, for keeping up and believing in all my crazy ideas!

avatar of Amr Zahrawi Amr Zahrawi

Thank you for believing in me and for listening to my stupid ideas!

avatar of Benjamin Benjamin

Thank you for letting me rubber-duck you. I know. That might sound weird if you’re not a computer geek. But again, thanks Benjamin for answering my programming questions and supporting me.

avatar of Ignacio Crespo Ignacio Crespo

Thank you for helping me understand more about game developement. I won’t forget our discussion about the sound pool.

avatar of Juan Rios Juan Rios

Thank you for testing the game, for inspiring me while designing it, and for the help choosing some of the sound effects!