Pixar напрягся
Будни офиса Miro
Бонобо Канзи
Рабочее место для кота
Протесты против Маска
«Офису» — 20 лет
Ламба из картона
Дорожка для аквабега
Jaguar Type 00 в Париже
Xiaomi SU7 Ultra
Полёт над Луной
Автопилот Tesla на бездорожье
«Игровые» Google Maps

Кейс дизайна игры для МегаФона: пиксель-арт, ламповые 80-е и больше 2 млн уникальных игроков за полтора месяца

Искали идею, рисовали макеты и прятали котиков по окнам, — в Red Collar. Собрали лучшее, что было в СССР.

«Панельки нашего двора» — новая промо-игра от МегаФона. Рассказываем, как делали ее: от идеи до пиксельного финала с 8-битной музыкой.

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

Кейс дизайна игры для МегаФона: пиксель-арт, ламповые 80-е и больше 2 млн уникальных игроков за полтора месяца

Задача: tower bloxx и четкие сроки

Надо было придумать идею для аркадной игры с механикой tower bloxx — геймплей заключается в строительстве башни из блоков — и нарисовать до старта маркетинговых активностей. Опорными точками для поиска идеи были:

  • потенциально попасть в предпочтения аудитории;
  • сделать игру вовремя;
  • сделать игру интересной не только за счет бонусов: идея должна стимулировать людей играть, т. е. быть выгодной в том числе с позиции маркетинга.

Поиск идеи

Аудитория пользователей довольна широкая, поэтому ориентировались на мировой опыт игровой индустрии: аркадные игры завоевывают внимание аудитории не столько за счет сложных визуальных решений, сколько за счет эстетики.

Выбрали три идеи локаций, в которых будет происходить игра, и три варианта стилизации иллюстраций этих пространств:

  • постсоветская ностальгия;
  • футуризм космической эры, колонизация планеты;
  • путешествия по странам, где уровни — разные атмосферные места, типа рисовых пагод в Китае.

Делать иллюстрации планировали в стиле сюрреализма «Розовой пантеры» — гротескная графика, плывущая геометрия — пиксельной графики или классических иллюстраций.

Выбрали советскую атмосферу и стиль пиксель-арт, которые потенциально откликаются максимально широкой массе пользователей. А минимизация детализации даёт быструю отрисовку и быстрое исправление деталей в случае ошибок.

Маркетинговую задачу отклика также лучше всего может решить атмосфера советской эпохи. Есть психологический эффект «узнавания знакомого»: людям в основном нравятся уже знакомые вещи, представленные в свежей обертке.

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

Мудборды трех идей и разных стилей иллюстраций.
Мудборды трех идей и разных стилей иллюстраций.
Пример внедрения брендинга МегаФона: поиск стилизации музыкальной кассеты. Слева — варианты, справа — итог.
Пример внедрения брендинга МегаФона: поиск стилизации музыкальной кассеты. Слева — варианты, справа — итог.

Кристаллизация идеи: поиск рефов и вдохновения

Уровни игры, которых должно быть четыре, решили сделать по десятилетиям: советское и постсоветское время: 60-е, 70-е, 80-е и 90-е. Референсы искали по этим отрезкам: гуглили архитектуру, ретро-игры, знаковые культурные произведения, культовые предметы и атмосферные вещи.

У МегаФона есть маскот — Коржик. Собака породы корги, которая также должна присутствовать в игре. Чтобы персонаж был уместен в разных десятилетиях, внедрили миф о том, что Коржик путешествует во времени на автомобиле DeLorean DMC-12 из фильма «Назад в будущее».

Ларьки, первое остекление балконов, спутниковые тарелки, стереотипный красный мерседес, фотоаппарат Любитель и многое другое, — было референсом и часть можно встретить в игре.<br />
Ларьки, первое остекление балконов, спутниковые тарелки, стереотипный красный мерседес, фотоаппарат Любитель и многое другое, — было референсом и часть можно встретить в игре.
Коржика на DeLorean можно увидеть на баннере в приложении МегаФона.
Коржика на DeLorean можно увидеть на баннере в приложении МегаФона.

Пиксель-арт: умножаем пиксель на 4 и делимся гайдами

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

Пиксель-арт достаточно простой стиль иллюстрации. Однако, есть моменты, которые стоит помнить со старта работы.

Например, минимальный размер изображения 1:1 — когда это минимальный размер зерна изображения и одно зерно равно одному пикселю. Когда рисуется пиксель-арт его стоит сразу тестировать на устройстве, под которое рисуется интерфейс: десктоп, смартфон, часы и так далее.

1:1 не будет просматриваться с мобильной версии, поэтому мы увеличили арт-фон на 400 процентов. Каждый пиксель рисунка увеличивали на 4 пикселя для крупности.

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

Для тех, кто не работал с пиксельной графикой, оставляем несколько ссылок на гайды: подборка материалов на Medium, туториал по базовым вещам от Make Games With Derek и еще один от Studio Mini Boss.

Линейная перспектива и многоплановость

Игра должна быть динамичной. Чтобы добиться этого в пиксельной графике, каждое десятилетие мы разбили на шесть планов, которые накладываются друг на друга во время игры. Динамика создается с помощью анимации параллакса: когда один слой двигается относительно другого.

Предполагалось, что фоны будут меняться от времен года, но из-за сжатых сроков было принято решение остановиться на лете. Различие в бекграунде сделали за счет смены времени суток: 60-е — это день, 70-е — вечер, 80-е — день и 90-е — вечер.

На фон наслаивались билды: первый кубик — это подъезд, а дальше для каждого уровня свои варианты из символов времени: телек, видеодвойка, бумбокс и так далее.

Примеры фона и финальных объектов для уровня 80-х.<br />
Примеры фона и финальных объектов для уровня 80-х.

Атмосфера в детализации

Чтобы добиться атмосферы, набирали огромное количество деталей из разных эпох. С каждым десятилетием развивается скилл игрока и количество объектов в игре растет. Она становится более насыщенной и яркой.

Особого внимания заслуживает небо — оно нигде не повторяется. Его делали чрез дизеринг — специальный прием, градиент, который складывается не путем смешивания цветов, а пиксельного «шумного», неплавного перехода. Усовершенствовали этот прием и встраивали в концепцию облаков. Отличаются только 80-е: в них небо сделано через облачные слои.

Для некоторых фонов референсами служила японская мультипликация: вдохновлялись оттенками цветов и градиентами.

Панелькам уделили особое внимание. Окон в игре, как повторяющихся, так и уникальных, больше ста штук. Они, как символ уюта, кипящей жизни и своего локального мира. Сделали разные занавески, посадили котов, поставили цветы и поселили Коржика, — чтобы как в жизни.

Часть окон из игры. Пасхалка к иллюстрации: кто первый напишет точное количество окон с котами, окон с цветами и окон с Коржиком в комментариях к материалу, — получит набор мерча от нашей команды.
Часть окон из игры. Пасхалка к иллюстрации: кто первый напишет точное количество окон с котами, окон с цветами и окон с Коржиком в комментариях к материалу, — получит набор мерча от нашей команды.

Селектор уровней: иллюстративность в интерфейсе

Как и у каждой игры, в «Панельках нашего двора» есть выбор уровней в меню. Сначала сделали меню, которое совмещает всю игру на одном экране через косую склейку иллюстраций — так можно выбрать десятилетия. А выбор уровня внутри происходил по выбору этажа в панельке.

Отказались от этого варианта, так как иллюстрации фонов смешивались и не было нативно для пользователя, что тут есть выбор десятилетия.

Решили отрисовать уникальные по композиции иллюстрации и совместить часть фона и панельный дом, чтобы выбор зоны и выбор уровня был сразу на одном экране. В игре по свайпу плавно переключается день и ночь, а по окнам можно выбрать уровень.

Промежуточные и итоговый варианты селектора уровней.<br />
Промежуточные и итоговый варианты селектора уровней.

Музыкальное сопровождение

8-битная музыка — неотъемлемая часть пиксельной графики. Прослушали сотни композиций и сэмплов, из которых выбрали те, что вызвали самые сильные ностальгические настроения. Отобранные треки адаптировали под динамику игры.

Брали не классические мелодии, а стилизованные современные композиции. Поэтому можно встретить и техно-стиль, и мелодичный поп-рейв, и инопланетный ритмичный фанк.

Здесь можно услышать одну из мелодий, что использовались в игре, и посмотреть на механику.

Результаты

Создали концепцию и графику для четырех уровней, четырех временных отрезков игры в механике «tower bloxx»: космические 60-е, рок-н-ролльные 70-е, романтичные 80-е и технологичные 90-е. Каждый уровень со своим набором характерных черт и отсылок.

В игре можно встретить фотоаппарат Смена 8м, кассетный бумбокс, видеодвойку с VHS из 90х, шлем Гагарина, олимпийского мишку из 80х и другие культовые артефакты.

Каждый новый проект стараемся сделать особенным, находить новые решения и ставить перед собой сложные задачи. Игра не только помогает весело зарабатывать бонусы в МегаФоне, но и греет душу чистым ламповым теплом.

За полтора месяца промо-игры ее посетили более 2 млн уникальных пользователей.

Кстати, помимо игры мы успели стилизовать и главные призы: например, музыкальные колонки, часы и еще много всего. А еще делаем ряд иных интересных проектов с МегаФоном, но это уже совсем другие истории.

Кейс дизайна игры для МегаФона: пиксель-арт, ламповые 80-е и больше 2 млн уникальных игроков за полтора месяца
2222
реклама
разместить
7 комментариев

выглядит прикольно, мне понравилось , думаю многим тоже залетит

2

Музыка только напрягает. Можно было бы мелодии поприятнее поискать, как в играх денди

1

Отличные результаты, веселая игра получилась!

1

Комментарий удалён модератором

Можно ссылки на художников и материалы?

1

Классный кейс с атмосферной игрой :)

Раскрывать всегда
Илон Маск подтвердил запуск чат-бота Grok в Telegram

Ранее на релиз намекал основатель мессенджера Павел Дуров.

Источник фото: Bloomberg
1919
88
33
22
11
11
11
"доступен бесплатно владельцам платной подписки" я так ржал
День 1127: дилеры начали предлагать скидки до 1 млн рублей на китайские машины из-за затоваривания складов

Собираем новости, события и мнения о рынках, банках и реакциях компаний.

Фото ТАСС
5454
55
Какая скидка... В здравом уме это г@вно никто не возьмет. Если б ввели акцию "миллион тому, кто заберет машину со склада", тогда еще можно было бы подумать.
Мрачная космоопера про внедрение ERP: баги, Хаос и команда, которая никогда не сдается. Серия 5 «Молебны машинного духа»

«Технологии – лишь инструменты,весь вопрос в силе духа людей их применяющих»

Мрачная космоопера про внедрение ERP: баги, Хаос и команда, которая никогда не сдается. Серия 5 «Молебны машинного духа»
Сбой у Системы быстрых платежей — СБП-переводы не работают у крупнейших банков

Среди них «Яндекс», «Т-Банк», «Альфа-банк», ВТБ и другие.

Сбой у Системы быстрых платежей — СБП-переводы не работают у крупнейших банков
200
1919
88
22
11
Вот так чуть не пришлось натурой за такси сейчас оплачивать. Хорошо, что наличка нашлась.
Российские производители электроники попросили ограничить параллельный импорт ноутбуков, смартфонов и планшетов

А ещё предоставить ритейлерам льготные кредиты на закупку отечественных устройств, субсидировать рекламу и ввести дополнительный утильсбор.

Фото ТАСС
5353
2424
33
22
11
Надеюсь, Светлана Легостаева и прочие лица, задействованные в данном предложении, пользуются ноутбуками, смартфонами и планшетами исключительно отечественного производства?
Как я тайно ненавидел свою работу

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

Как я тайно ненавидел свою работу
2323
11
11
Ненавидеть свою работу я начал еще на собеседовании
Почему доход застыл на месте и что с этим делать?

Вы когда-нибудь задумывались о том, что ваш доход, словно упёрся в невидимый потолок? Вы делаете что-то, что приносит деньги, но ощущение роста давно ушло или никогда не приходило?

Почему доход застыл на месте и что с этим делать?
Хотел купить готовый бизнес для пассивного дохода, но в итоге потерял 8 млн рублей за 5 месяцев

Первые две недели после покупки шли хорошо, но потом поступил первый звоночек от управляющего с просьбой приехать на объект и поговорить с субарендаторами. На разговор пришли — сырник, колбасник и овощник. Я понял, будут бить...

Хотел купить готовый бизнес для пассивного дохода, но в итоге потерял 8 млн рублей за 5 месяцев
77
11
Почему закрываются кофейни: 5 ключевых ошибок, которые губят даже «самый лучший кофе»

Многие города сталкиваются с волной закрытия кофеен. При этом владельцы часто винят кризис, высокую аренду или конкуренцию. Однако проблема глубже: предприниматели нередко сами роют яму своему бизнесу, надеясь на авось. Почему даже заведения с «ручной работой» и «индивидуальными стаканчиками» терпят крах? Разбираю ключевые ошибки.

Почему закрываются кофейни: 5 ключевых ошибок, которые губят даже «самый лучший кофе»
55
22
11
реклама
разместить
Зачем тратить время на отдельный корпоративный мессенджер, если есть Telegram?

В этой статье хочу поделиться, почему современным компаниям не стоит тратить ресурсы на внедрение нового чата для сотрудников, когда под рукой уже есть любимый всеми Telegram, дополненный возможностями Teleforce.

Зачем тратить время на отдельный корпоративный мессенджер, если есть Telegram?
77
Переехал в Израиль и открыл там агентство по репатриации. 2,5 млн рублей на русских мигрантах

Захотелось в жизни перемен, всё бросил и уехал в Израиль. Открыл бизнес, теперь помогаю переезжать таким же непоседам.

Переехал в Израиль и открыл там агентство по репатриации. 2,5 млн рублей на русских мигрантах
66
66
33
33
Власти Киото утвердили новые ставки налога на размещение туристов в гостиницах — максимум 10 тысяч иен за ночь

Его начнут взимать с 1 марта 2026 года.

Источник фото: David Edelstein / Unsplash
44
22
22
11