основное изображение проекта

Meta Fighter

Мультиплеерный 3Д файтинг для браузеров и мобильных устройств

изображение проекта
Клиент

Германия

Описание

Игра FTE — 3D-файтинг с персонажами NFT на сети Binance Smart Chain. Проект предлагает возможность играть базовыми персонажами, а также чеканить уникального персонажа для себя или замораживать (держать деньги на определенный срок и возвращать их на кошелек по истечении) свои средства для получения NFT через определенное количество дней. На сайте пользователи также могут продать своих NFT-персонажей, купить или обменять их на навыки и бустеры.

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

В чем была цель данного проекта

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

Над чем мы работали

При разработке проекта мы столкнулись с задачами касающимися разных областей:

  1. Разработка мультиплеерной игры для браузеров и мобильных устройств Android и iOS
  2. Разработка смарт контрактов и публикация смарт контрактов в Binance Smart Chain
  3. Разработка скриптов по запуску функций смарт контрактов
  4. Настройка серверов
  5. Разработка бэкенда
  6. Разработка сервиса отлова событий
  7. Разработка веб сайта с авторизацией через Metamask и WalletConnect, маркетплейсом, лидербордами, cтейкингом и клаймингом MF Tokens.
  8. Разработка концепт артов, иллюстраций, персонажей, 3Д моделлинг, анимации
  9. Разработка прототипа и дизайна веб сайта и игры.
  10. Копирайтинг
  11. Балансировка системы прокачки персонажей
Технологии

Разработка: Unity, Nuxt.js, PUG, CSS, Python, Solidity, Binance Smart Chain, Amazon EKS, Machinations
2D: Adobe Photoshop, Corel Painter

3D: 3d studio max, Autodesk Maya, Substance painter, ZBrush

Анимации и спецэффекты: Autedesk Maya, 3ds Max, Unity

изображение проекта

Режимы игры

В игре есть три режима:

F2P (Free-to-Play)

F2G (Fight-to-Gain)

F2E (Fight-to-Earn)

В F2P игроки могут играть своими NFT или базовыми персонажами.

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

В F2E в игре участвуют игровые токены. Эти токены можно купить или вывести со спот-кошелька пользователя.

mf-1

Игра, в которой вы участвуете в захватывающих 3D-боях NFT и зарабатываете на Binance Smart Chain!

Структура проекта

Проект представляет систему взаимодействия смарт контрактов, бэкенда и клиентов.

Бэкенд разработан с применением микро сервисной архитектуры. Также разработаны:

  1. Сервер подбора игроков
  2. Система отлова событий из Blockchain
  3. Сервер для мультиплеерной игры.

Клиент проекта представляет собой веб сайт и игру, также интегрированную в веб сайт. На веб сайте представлена логика взаимодействия пользователя с MF токенами и NFT, которые пользователь или сминтил или купил в разделе маркетплейс.

mf block-1

Процесс разработки

Данный проект велся используя два подхода Waterfall и Agile.

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

После составления документации, архитектуры и прототипа, были начаты работы по созданию дизайна, игровой графики, а также параллельно велась разработка 3Д персонажей для игры.

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

Только после того как графических материалов стало 10% и дизайна сайта 20%, была начата разработка бэкенда, фронтенда, игры и смартконтрактов.

Каждый месяц 5 отделов (арт, бэкенд, гейм, фронтент и blockchain) взаимодействовали ежедневно и решали задачи данного проекта.

meta fighter-5

Авторизация

Для полноценного использования платформы на сайте и в приложении реализована авторизация через расширение браузера Metamask-а или Wallet connect, который предоставляет сразу несколько криптопровайдеров, через которых можно авторизоваться в системе. До того как пользователь авторизуется, он может ознакомиться с проектом на главной странице, просмотреть маркетплейс с выставленными на продажу NFT, а также поиграть в игре за базовых персонажей.

mf block-3

NFT

После того как пользователь авторизуется на сайте, он может сменить себе NFT, обратившись к смартконтракту, и через какое-то время увидеть в разделе My NFT свою новую NFT.

Структура NFT:

  1. Индекс в блокчейне
  2. Тип персонажа
  3. Уникальную цветовую гамму (которая формируется из 5 слоев)
  4. 4 характеристики(атака, выносливость, скорость и защита)
  5. Уровень
  6. Tier
  7. и некоторые другие атрибуты.

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

mf block-4

Marketplace

На сайте можно выставить на продажу или купить NFT бойца. При проведении этих действий происходит обращение веб клиента к специальному смарт контракту, который осуществляет торговлю NFT.

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

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

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

mf block-5

Staking

В разделе Staking пользователь может заморозить свои средства, с целью получения денежной или цифровой выгоды.
Существуют 4 типа заморозки денег:

  1. За бустеры. Для начисления опыта, которые выдаются сразу же на 30 или 60 дней, после чего сгорают, а деньги становятся доступны для возврата
  2. За NFT персонажей. Через 7 дней вы получите бесплатно определенного типа NFT и деньги станут доступны для возврата
  3. За скилы. Выдаются сразу же на 45 дней, после чего скил сгорает, а деньги становятся доступны для возврата
  4. За MF токены. Работает как банковский вклад с ставками от 2,5 до 128% годовых.
mf block-6

Vesting

Для проведения этапа Vesting был разработан раздел Claiming.

Данный раздел был выпущен одним из первых во время разработки проекта, чтобы вызвать доверие у всех вовлеченных пользователей в данный проект. В этот момент также были выпущены 2 смарт контракта - один MFToken на основе протокола ERC20, второй как раз для распределения части этих токенов между различными пулами инвесторов.

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

Неоднократно приходилось менять пул инвесторов или убирать некоторые кошельки, которые решили выйти из раздачи токенов. Было реализовано 12 пулов с разным сценарием выдачи токенов. Среди них были как поэтапные выдачи, так и календарные.

mf block-7

Сервис отлова событий от BlockChain

Изначально в качестве решения данной задачи, был выбран сервис Moralis, который наиболее подходил по своей стабильности и функциональности.

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

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

mf block-8

Через какие этапы создания игры мы прошли?

Структура

Вся игра представляла собой:

  • Главный экран. Карта, на которой располагался GUI для перехода между экранами настройки, лидерборд и MY NFT, а также арены, на которые можно было переходить для сражений.
  • Выбор режима. Экран на котором можно ознакомиться и выбрать режимы FTP, FTE, FTG.
  • Выбор персонажа. Экран на котором пользователь может выбрать за кого он будет играть
  • Лобби. Экран на котором встречаются игроки
  • Загрузка боя. Экран где происходит дозагрузка всех необходимых ресурсов, не успевших скачаться, до того как игроки нашли друг друга.
  • Экран боя. Поле сражения, где игроки видят своих бойцов и управляют боем
  • Экран выигрыша/проигрыша
  • Лидерборд. Таблица лидеров по различным условиям
  • Список имеющихся NFT у игрока, где можно прокачать персонажа или добавить ему усилителей
  • Экран настройки
mf-10

Арены

В игре имеется 6 арен - Sky, Winter, Dream, Sky, Japan, Dark Feature, City. Для каждой арены проработан уникальный концепт, проработаны все текстуры и свет.

Произведена оптимизация каждой арены и согласование с левел дизайнеров всех рекламных точек на арене.

Звук

Для игры были записаны уникальные звуки и музыка композитором и саунд дизайнером, который также интегрировал и настраивал их с помощью утилиты FMOD. В виду более тысячи разных возможных ударов у бойцов и поэтому невозможности делать звук под каждый удар (ввиду ограничения веб билда), звуки писались обобщённо на категории ударов.

В качестве стилистики музыки была выбрана боевая и современная, для подчеркивания бескомпромиссного стиля игры.

mf-slider-1
mf-slider-2
mf-slider-3
mf-slider-4
mf-slider-5
mf-slider-6
mf-slider-7
mf-slider-8
mf-slider-9
mf-slider-10
mf-slider-11
mf-slider-12

Спецэффекты

В игре присутствуют FX-спецэффекты - при ударах персонажей, супер ударах, а также на локациях.

FX спецэффекты уникальны для каждого удара, создавались FX-аниматором по готовым анимациям и затем интегрировались в игру. В игре создано порядка 150 уникальных спецэффектов ударов.

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

3D Графика

Подход к 3д графике был разделён на 2 составляющие - бойцы и арены. Каждый боец создавался сначала по концепту от художника в ZBrush в виде высокополигональной и проработанной модели, затем переносился в одну из программ работы с 3д графикой (Maya, Max) и подводился к игровой модели.

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

3д модели арен создавались также по концептам художников. Они состоят из двух видов - общий и игровой. Общий нужен для подлёта камеры при начале боя. На первой арене были опробованы все возможные графические решения, которые можно использовать в веб браузере, при этом не сильно понижая фреймрейт. Остальные арены шли по техническим условиям первой арены.

mf img big

Сетевое взаимодействие

Помимо основных запросов на получение данных для пользователя, были реализованы:

  • Отдельный сервис подбора игроков, позволяющий распределять игроков по комнатам, аренам и регионам
  • Сокет сервис для контроля боя и выдачи его результатов
  • Сервис отлова событий от блокчейн
  • Сервис подсчета игроков в лидерборде

Реализация разных игровых режимов

В рамках технического задания, необходимо было реализовать 3 игровых режима:

  • F2P (Free-to-Play)
  • F2G (Fight-to-Gain)
  • F2E (Fight-to-Earn).

Режим F2P наиболее популярен для игроков, которые еще не приобрели свои NFT и хотят просто потренироваться в данной игре как с ботами, так и с реальными игроками.

F2G - здесь игрок обязательно должен быть авторизован через крипто кошелек и играть за NFT. Доступна игра PvP (player-vs-player) и PvE (player-vs-enemy), а также 1vs1 или 3vs3. В режиме PvP коэффициент заработка очков опыта больше чем в режиме PvE. Также в режиме 3vs3 можно заработать опыт сразу для 3-х ваших NFT.

В режиме FtE игрок должен быть не только авторизован и иметь на кошельке NFT, но еще и держать на своем игровом (спотовом) кошельке кредиты, из которых необходимо будет сделать ставку в игре. На каждой арене будет своя собственная ставка. Игрок который победил, забирает весь куш за минусом 10%, которые забирает платформа.

Античит

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

Оптимизация игры

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

После того как были оптимизированы исходники под WebGL, для портирования игры на мобильные устройства, необходимо было также изменить данный способ предзагрузки данных и адаптировать все ресурсы под использование на мобильных устройствах - шейдеры, 3D модели, свет и многое другое.

Защита и блокировка от различного DDoS атак

На протяжении всей разработки проекта, были отражены 3 атаки злоумышленников. Для защиты использовали Cloudflare, Cloudfront, а также балансировщик нагрузки в архитектуре AWS. Также в качестве защиты от читеринга, была разработана система контроля боя, покрытая шифрованием и контролируемая только бэкендом.

mf block-9

Ещё проекты

swealth_lab_small_icon
Mobile Apps, Websites
Swealth Flow
Web platform to sell CBD products
Img_fitogochi-cover-small
Mobile Apps
Fitogochi
Development of a mobile wallet for iOS / Android, Development of payment processing, Analytics
referIt small card
Mobile Apps
ReferIt
Digital marketing company based in USA that uses 3-way referral system for customers, businesses and communities
decoration imagedecoration imagedecoration imagedecoration image

Оставив заявку, Вы получите

  • Консультацию менеджера
  • Сбор и формализацию ваших требований
  • Рекомендации и идеи исходя из ваших задач
  • Коммерческое предложение для вашей компании
  • Окончательную смету с полной детализацией ваших работ
decoration image