О проекте
BeeCase — платформа открытия кейсов со скинами для Counter-Strike 2. Пользователь пополняет баланс, открывает кейсы, получает скины в инвентарь и дальше решает, что с ними делать: продать, использовать в апгрейде или вывести в Steam. Мы проектировали интерфейс сайта: главную страницу, личный кабинет с инвентарём, систему уровней и раздел бонусов.
Задача
В нише кейсов десятки похожих сайтов, и пользователь легко переходит с одного на другой. Удерживает его не сам кейс, а всё, что вокруг: прогресс, регулярные награды, понятный инвентарь. Нам нужно было собрать в одном интерфейсе много механик — кейсы, батлы, апгрейды, уровни, бонусы, реферальную программу — и сделать так, чтобы сайт при этом не превратился в набор баннеров.
Визуально мы опирались на эстетику самой игры: тёмный фон, оранжевый фирменный акцент, а для каждого раздела — свой цвет подсветки. Он повторяется в иконках и карточках, и пользователь узнаёт раздел по цвету ещё до того, как прочитал заголовок. Талисман бренда — пчела, она появляется в логотипе и на наградах.
Главная страница
В шапке — основные разделы «Кейсы», «Батл кейсов» и «Апгрейд», переключение языка, баланс и заметная кнопка «Депозит». Под ней бежит лента последних выпавших скинов с ценами, которая показывает, что на сайте прямо сейчас что-то происходит.
Первый экран делится на промо-слайдер и вертикальное меню из четырёх входов: «Бонусы», «Реферальная система», «Event» и «Battle Pass». Ниже — карточки магазина и инвентаря, а затем каталог. Кейсы разбиты на категории — бесплатные, акционные, доступные, сборки, капсулы, оружейные, кейсы рангов — и вкладки категорий закреплены горизонтальной полосой. У каждого кейса своя иллюстрация, название и цена, рекомендованные отмечены отдельной плашкой.
Профиль и инвентарь
В личном кабинете сверху собрано всё о пользователе: аватар с уровнем, шкала опыта до следующего уровня, ID и баланс с кнопками «Пополнить» и «Вывести». Справа — быстрые переходы к бонусам, реферальной программе и разделу «Доказуемо справедливо», где можно проверить честность выпадения.
Инвентарь разделён на скины, кейсы и бонусный инвентарь. Для коллекции, которая может быстро разрастись, мы добавили поиск по названию, фильтр по диапазону цены, сортировку и категории. Карточка скина показывает предмет, название, стоимость и кнопку «Продать», а цветная полоса внизу обозначает редкость.
Уровни и бонусы
Система уровней — главный инструмент удержания. На странице наград видна текущая шкала опыта и награда за ближайший уровень, например бесплатный кейс, с кнопкой «Получить награду». Ниже — лента наград за уровни: бонус на баланс, кейсы, скидка в аукционе, рамка для профиля, повышенный шанс в апгрейде. Полученные награды отмечены галочкой, текущая подсвечена. Здесь же можно купить ускоритель прокачки.
Раздел «Бонусы» собирает все способы получить что-то сверх открытия кейсов: текущий уровень, бесплатные и акционные сундуки, лидеры по активности и лотерея скинов. Ниже — поле для промокода, переключатель push-уведомлений и бонусы за подписку на соцсети и мессенджеры. Каждое действие оформлено одинаковой карточкой с кнопкой, поэтому список легко просматривается, сколько бы механик в нём ни было.
Результат
Мы собрали интерфейс, в котором много игровых механик укладываются в понятную структуру: каталог кейсов, инвентарь с фильтрами, прогресс по уровням и отдельный центр бонусов. У пользователя всегда есть следующая цель — уровень, награда или бесплатный сундук, — а каждое действие на сайте находится в один-два клика с любой страницы.