Всё гениальное
— изи!

Меню
Кейс

Сообщество игроков в нарды NardyClub

“NardyClub” - это крупнейшее в странах СНГ и Европы сообщество любителей и профессиональных игроков в нарды.

IMAGE

О клиенте

Проект существует уже более 6 лет, объединяя истинных ценителей древнейшей игры.

Осенью 2016 года из-за хакерской атаки на игровые сервера была полностью заблокирована работа ресурса с частичной утерей данных. Администрацией проекта было принято решение за 6 месяцев возродить проект в виде нового игрового веб-сервиса на современной технологической базе с обновленным дизайном.

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

Ключевые задачи, которые поставил перед нами Заказчик:

  • стабильность системы при высоких нагрузках
  • отказ от устаревших Flash-технологий
  • восстановление игры при обрыве соединения
  • возможность параллельных игр
  • сохранение проверенного годами интерфейса и адаптация его к современным принципам разработки веб-интерфейсов
  • функционал для проведения партнерских турниров
  • мощная CRM-система с богатой статистикой и аналитикой

“У нас классный проект и очень большая лояльная аудитория. Но мы понимаем, что проект морально устарел. За 6 лет у нас накопился колоссальный опыт, который бы мы хотели воплотить, но нынешний проект не способен на это. Не говоря уже о том, что Chrome уже даже просто-напросто не поддерживает Flash. Сделайте нам iPhone в мире онлайн-игр, а себе - технологическую изюминку для портфолио!”

Кирилл П.
руководитель проекта “Nardyclub”
IMAGE

Проектирование и дизайн

Основные задачи при проектировании интерфейса:

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

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

Сайт состоит из четырёх основных экранов: окно регистрации/авторизации, страницы со списком игр, страница с игровым полем и страница личного кабинета. Значительная часть функционала скрыта всплывающих окнам, что создаёт ощущение нативного десктопного интерфейса.

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

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

Наталия Потапова
designer
IMAGE

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

Нововведения

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

  • поддержка двух игровых сессий
  • более подробная статистика о сыгранных партиях
  • обработка разрывов интернет соединения
  • компоненты

Главные аспекты

Архитектура

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

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

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

Владимир Алёхин
back-end developer
IMAGE

Поэтому было решено использовать WebSocket-сервер на Go прослойку в виде гема AnyCable. Это позволило драматически сократить время отклика и избавило от увеличения задержек при масштабировании системы.

Итоги

Результатом нашей работы стал качественный и отказоустойчивый игровой веб-сервис, сочетающий в себе целый стэк современных веб-технологий и лаконичный Flat дизайн.