Беги, Танук! Web App в телеграме для сети ресторанов «Тануки»

Главное о кейсе

В веб-боте сразились за первенство больше 3 000 пользователей. А самый умелый игрок под ником Nikita так загорелся идеей победы, что смог набрать почти 6,5 тысяч очков.

Бизнес-задача и ее решение

Какой была задача?

К нам в студию пришёл крутой заказчик – создатели сети ресторанов “Тануки”. Наступила круглая дата – с момента открытия первого заведения бренда прошло 18 лет. Бренд японских ресторанов стал по-настоящему “совершеннолетним”.

Ребята из “Тануки” хотели отметить знаменательную дату по-взрослому и порадовать свою аудиторию в соцсетях чем-то особенным.

Прочая информация о кейсе

Привет, на связи команда SMIT.Studio. И в этой статье мы расскажем о потрясном кейсе, который мы сделали для ресторанной сети “Тануки”. Мы первыми в стране встроили полноценную игру-раннер внутрь бота в Telegram и поразили аудиторию новым форматом. Рассказываем по порядку, что и как.

Какой была задача?

К нам в студию пришёл крутой заказчик – создатели сети ресторанов “Тануки”. Наступила круглая дата – с момента открытия первого заведения бренда прошло 18 лет. Бренд японских ресторанов стал по-настоящему “совершеннолетним”.

Ребята из “Тануки” хотели отметить знаменательную дату по-взрослому и порадовать свою аудиторию в соцсетях чем-то особенным.

Мы предложили сделать промо-игру прямо внутри web-бота в Telegram. Это новая технология, появившаяся в мессенджере чуть больше месяца назад. Теперь внутри чат-ботов в соцсети можно запускать интерактивный контент – делать графические интерфейсы и даже встраивать игры.

Что мы придумали

18 лет – это возраст совершеннолетия. Как раз самое время, чтобы немного уйти в отрыв.

А чтобы оторваться можно было покруче, мы сделали простую, но увлекательную игру-раннер в стиле Subway Surf. Игроку предстояло управлять несущемся на скейте Тануком, который, похоже, в честь праздника немного похулиганил и теперь ему предстоит скрыться от полиции.

Про игровую механику

Мы сделали классического чат-бота в Телеграм. Внутрь него мы загнали описание механики проекта и кнопку, запускающую веб-бота. В него же мы встроили проверку подписки. Чтобы поиграть за Танука и выиграть промокодов, бот просил сначала подписаться на официальный канал бренда в телеграм.

После подписки становилась активной кнопка “играть”, которая запускала интерактивного веб-бота с 2D-ранером.

Механику игры мы специально сделали классической, чтобы она не требовала от пользователей много времени и внимания на освоение. Если играли когда-то в Subway Surf, сразу поймёте что к чему

Вы управляете несущимся на скейте Тануком, которого преследует полицейская машина. Управление сделали максимально простым. Тап по любому месту экрана – это прыжок. Вам нужно собирать бонусы и уворачиваться от препятствий, собирая очки. С каждой ошибкой догоняющая полицейская машина становится всё ближе, пока, наконец, разгулявшийся Танук не оказывается в руках правосудия.

В конце игра подсчитывает очки, выводит таблицу лидеров. И, если вы оказались достаточно ловким скейтером, дарит вам промокод на хорошую скидку при посещении ресторана. Ну а лучшему скейтеру в рейтинговой таблице полагалась не только скидка, но и смартфон.

По умолчанию у каждого игрока было по 10 попыток показать себя в игре. В случае если они потрачены – нужно либо дождаться следующих суток, либо выслать реферальную ссылку другу.

С какими сложностями столкнулись при разработке?

В целом, разработка игры внутри веб-бота в Telegram мало чем отличается от создания проектов для других платформ. По технической составляющей веб-бот – это страничка сайта, открывающаяся внутри интерфейса телеграм. Игра пишется на Java Script и не сильно отличается от обычных проектов, сделанных под Web.

Основным вызовом для нас как разработчиков были сжатые сроки. На весь проект у нас было чуть больше недели – нужно было успеть ко дню рождения. Не без труда, но мы справились.

Специфика разработки игровых интерфейсов под веб-боты – их нужно внимательно тестировать на то, как они вписываются в экраны пользователей. Игроки будут играть с десктопов, с маленьких телефончиков, с больших лопат. При этом окошко бота отображается не на полный экран. Пришлось прогонять в разных сценариях и дорабатывать дизайн, чтобы все элементы интерфейса были читаемы и воспринимаемы.

Ещё нам пришлось внимательно поработать с балансом. По всей видимости, у нас в студии собрались слишком хорошие игроки. Тестовая версия игры оказалась сложновата для пользователей. Нам пришлось экстренно вносить изменения в геймплей, чтобы сделать игру попроще для среднестатистического любителя суши. Было важно, чтобы люди могли выиграть себе скидок, даже не обладая прокачаными навыками геймеров.

Что в итоге

В итоге, бренд Тануки ярко отметил своё 18-летие, усилил эмоциональную связь с аудиторией и порадовал людей промокодами. Подписчики активно включились в игру и оставили хорошие отзывы.

В веб-боте сразились за первенство больше 3 000 пользователей. А самый умелый игрок под ником Nikita так загорелся идеей победы, что смог набрать почти 6,5 тысяч очков. Довольные геймеры получили свои эмоции, азарт и промокоды, не покидая интерфейс Телеграма. А мы получили уникальный кейс в свою коллекцию.

“Я очень горжусь этим проектом. Мы смогли в очень сжатые сроки сделать один из первых веб-аппов в Телеграм для брендов. Несмотря на достаточно сложную механику и большое количество элементов для отрисовки, мы смогли завершить всё в срок и с минимальными правками. Веб-аппы в Телеграм – потрясающая технология, и я очень рад, что мы смогли раскрыть её возможности в таком ярком проекте”, – Станислав Ягупов, основатель SMIT.Studio.


АНГЛОЯЗЫЧНЫЙ ВАРИАНТ:

Hi, SMIT.Studio. And in this article we will tell you about the amazing case that we made for the restaurant chain "Tanuki". We were the first in the country to build a full-fledged runner game into the Telegram bot and hit the audience with a new format. We tell in order what and how.

What was the task?

We have come to the studio a cool customer - the creators of the chain of restaurants "Tanuki". The round date has come - 18 years have passed since the opening of the first establishment of the brand. The brand of Japanese restaurants has become truly «adult".

The guys from "Tanuki" wanted to mark a significant date adult and please their audience in social networks with something special.

We offered to make a promotional game right inside the Telegram web bot. This is a new technology that appeared in the messenger just over a month ago. Now inside the chat bots in the social network you can run interactive content - make graphical interfaces and even embed games.

What we came up with

18 is the age of majority. It’s about time to get a little bit of a break.

And to get better, we made a simple but exciting runner game in the Subway Surf style. The player had to control a skateboarding Tanuk, who seemed to have played a bit for the holiday and now had to flee the police.

Game mechanics

We made a classic chat-bot in Telegram. Inside it we put the description of the mechanics of the project and the button that runs the web-bot. We built a subscription check into it. To play for Tanuk and win promotional codes, the bot asked first to subscribe to the official brand channel in telegram.

After the subscription, the "play" button became active, which ran an interactive web bot with a 2D-reader.

The mechanics of the game were specially made classical, so that it did not require from users a lot of time and attention to the development. If you’ve played Subway Surf before, you’ll know what’s what

You drive a skateboarding Tanuk, which is chased by a police car. Control was made as simple as possible. Tap anywhere on the screen is a jump. You need to collect bonuses and dodge obstacles by collecting points. With every mistake, the police car catches up with each other until Tanuk is finally brought to justice.

At the end the game counts points, displays the leaderboard. And if you are a skillful skater enough, gives you a promotional code at a good discount when visiting the restaurant. Well, the best skater in the ranking table was entitled not only a discount, but also a smartphone.

By default, each player had 10 attempts to prove himself in the game. In case they are spent - you either need to wait for the next day, or send a referral link to a friend.

What are the development challenges?

Overall, the development of a game within a Telegram web bot is not much different from creating projects for other platforms. According to the technical component of the web-bot - a page of the site, opened inside the interface of the telegram. The game is written on Java Script and does not differ much from the usual projects made under the Web.

The main challenge for us as developers was tight deadlines. For the whole project we had a little more than a week - we had to make it to the birthday. Not without difficulty, but we did it.

The specifics of the development of game interfaces for web-bots - they need to be carefully tested on how they fit into the user’s screens. Players will play from desktop, from small phones, from large shovels. At the same time, the window of the bot is not displayed on the full screen. It was necessary to run in different scenarios and refine the design so that all elements of the interface were readable and understandable.

We also had to work on the balance sheet. Apparently, we have too many good players in the studio. The test version of the game proved difficult for users. We had to make extra gameplay changes to make the game easier for the average sushi lover. It was important for people to be able to win discounts without even having boosted gamer skills.

That in the end

As a result, the Tanuki brand brightly celebrated its 18th anniversary, strengthened the emotional connection with the audience and pleased people with promotional codes. Subscribers are actively involved in the game and left good reviews.

In the web bot fought for the championship more than 3,000 users. And the most skilled player under the nickname Nikita was so excited about winning that he was able to score almost 6.5 thousand points. Satisfied gamers got their emotions, excitement and promotional codes without leaving the Telegram interface. And we got a unique case in his collection.

"I am very proud of this project. We were able in a very short time to make one of the first web apps in Telegram for brands. In spite of the rather complicated mechanics and the large number of elements for drawing, we were able to complete everything in time and with minimal corrections. Web apps in Telegram are an amazing technology, and I’m very glad that we were able to unlock its potential in such a vivid project", - Stanislav Yagupov, founder of SMIT.Studio.

Текущая доступность работы

https://t.me/Tanuki_game_bot

Скриншоты