Best Games of Telegram

Since Telegram announced its Game Platform we have been very enthusiastic to work in it as you might already know. After all, along this article, we have already published a tutorial about how to develop a game bot and another tutorial about porting your HTML5 games to Telegram.

But we also like to play and we realized it is not very easy to find games in Telegram (only for the moment… we hope); that’s why we want to list here our favorites games.


Don’t Die in @DontDieBot

Listen to me, this is a good one. Really challenging but extremely easy to learn. The responsiveness of the controls is perfect.Do Not Die

In each level you drag your character to pick up a key that will open the door of the next level. But don’t let the zombies see you… or smell you.


iBasket in @ludeiBot

What? Yes, it is one of our games, but we really worked hard on it to create a good game. And more than once we have had bad looks at the office when someone gets the first place in the rankings.iBasket HTML5

Simple. Colorful. Fun. Throw the balls and get the maximum amount of points in 90 seconds. Don’t think too much, if you don’t score for a certain amount of time you lose the score multiplier. And listen here, the key to be the best: clean shots give you 5 extra seconds of play, maybe using 2 seconds to aim instead of 1 is worth it.


Kung Fu Inc in @gamee

Tap left or right to throw a punch in either direction to destroy… vacuum cleaners?

Kung Fu Inc

Yep, that’s right. I guess somebody doesn’t really like Roombas. Try to not throw punches in the air, the combo multiplier is the key to reach the top of the ranking.


Jumper Frog in @microgamesbot

An old classic not so common nowadays. If you are young maybe you don’t even know it.

Jumper Frog

Jump across the road avoiding the cars and use the turtles and the logs to not fall in the water (just ignore the fact that every frog can swim, we all do). Your objective is to reach the top of the screen and eat every fly in the way.


Flappy Bird

There is more than one Flappy Bird and there aren’t many differences but visual aspect. Play the one you like the most, all of them are equally addictive.

Flappy BirdJumping SubmarineSkipper

Meteoric and Meteoric Plus in @gamee

Combine similar asteroids to form a planet. Combine the planets to create stars. Combine the stars and watch it EXPLODE!

In Meteoric, the asteroids fall from the top and you have to pile them next to their alike to combine them; whereas in Meteoric Plus, the asteroids appear randomly and you drag everything to the top, right, bottom or left (like in the game 2048), if two similar objects collide they will fuse.


2048 in @awesomebot

Speaking about 2048, that is a great game too. Of course we can find it in Telegram.

2048

One of the best games to compete with your friends. But for the love of Cthulhu, keep your highest tile in a corner of the board.


Sumon in @ludeiBot

A target number appears, you have to combine numbers in the board to sum the exact amount. Then, the target changes and you have to do it again until there are no more numbers in the board to complete the level. Easy, right?

Well, you have to do it fast; and it is better if the numbers you combine are far apart from each other. If you are one of those who asks why bother learning to do mental calculus if every mobile has a calculator nowadays, maybe it’s not that easy.

Sumon

Every level concedes notably more points than the previous one. So you might think that playing in a easy level for several minutes will assure you a place in the winners podium, when actually, anybody capable of playing in a harder level will surpass your score in a matter of a minute.


Hextris in @awesomebot

I’m sure you know Hextris. Another of those extremely simple games but incredibly competitive. Share it in your chats, you will see how everybody tries to get the record but “casually, they were just playing in the public transport”. Yeah… suuure… me too…

Hextris

I haven’t even put any effort to get that screenshot, I could do it better…


Do you agree with our list? Did we miss any game? Leave a comment if you found a really good game we didn’t list here. We want to try it, it’s not easy to find them.

How to adapt HTML5 games to be published on Telegram

The Announcement

On October 3rd, Telegram published its gaming platform. Now, the bots are able to launch HTML5 games inside Telegram and share your score with your friends. @gamebot and @gamee were the two first bots announced and Ludei is not going to be the last when it comes to HTML5.

The Rules

When creating a game with @BotFather, he will make you accept a series of rules:

  1. You will not implement any ads or any external links on your custom URL pages.
  2. You will not invite users to pay for any services provided on custom URL pages.
  3. You will not use any data collected over the course of user interaction with your custom URLs for spamming Telegram users.
  4. You will not transfer any Telegram data collected over the course of user interaction with your custom URLs to any third parties.
  5. In order to protect the privacy of Telegram users, your custom URL pages must not set any cookies.

Now, those are some serious rules that made us change some things in our games.

Due to these rules we had to remove every way of promoting the rest of our games and every social media integration like Twitter or Facebook. Thankfully, we didn’t collect any information for third parties neither used cookies in our games -removing all that sounds like a headache.

Game Rules by @BotFather

Game rules by @BotFather

Sharing the games

The first thing you notice when reading the technical post is the script you have to include inside your games. It is a rather short script. This is because launching a game inside Telegram means opening a URL, provided by our bot, in the webview of Telegram. Our game should need hardly any changes.

<script src="https://telegram.org/js/games.js"></script>

This script provides us with the TelegramGameProxy.shareScore() method, which is used to share the game (but not a score, weird) with Telegram chats. It works like the usual share button in Telegram, there is no complexity with this part. We added a button with the shareScore() function at the result screen of each game in case you don’t know what to do with it.

Sending scores

The name “shareScore“ is quite confusing since you can’t even pass it a parameter to share. To actually send a score you should also read our post about a game bot creation. The game must send the score to the bot (with a HTTP POST, in our case) and the bot is responsible of notifying Telegram of our score. But how does the bot know who we are when it receives it? We solved this problem sending along the score a number of identifiers the bot previously added to the URL of the page. These identifiers are always userId (identifies the user) and either inlineId (if the bot was summoned with an inline call), or the pair chatId and messageId. The necessary ones are in the request Telegram sends to our bot when a user taps the play button.

Update scores in Telegram

@ludeiBot updates scores in Telegram

To sum it up: the user activates the play button, Telegram asks our bot for a URL to open and sends the identifications of the user, the bot returns a URL containing those identifiers in a query, and finally, our game can send the score and the identifiers of the user so the bot can update the rankings.

Detecting Telegram

At this point we have a game that can be published to Telegram, but why would we use two versions of the source code of our game? We still want to be able to promote our games if the user plays at ludei.net. If we can know when the game is executing as a Telegram game we can serve it from its original server to Telegram. Any special change we made for Telegram just has to follow a condition.

At first we tried checking window.TelegramWebviewProxy !== undefined  (like Telegram does in its script), but somehow TelegramWebviewProxy is undefined even inside the Telegram webview, so in the end, we just check if the URL contains the identifiers of Telegram our bot adds. In our case the identifiers were query parameters because our games already had a method to parse them. Although they could have been hash parameter too; Telegram exposes an object containing them.

Testing your game

The last thing to do is testing. Most of the testing can be done easily like with any web page development: set up a local server and open the URL in your devices. But we found some resolution problems when Telegram launched the games. Some elements appeared several times larger than when using a typical browser app. Therefore, one last advice from us is to create a minimal test bot, capable of just launching the games, enough to be able to fix any bug that might appear only in Telegram.

Our games

Check out our games (please open the following links on your mobile device):