UI/UX дизайн для 2D–2.5D веб-проекта с гонками машинок

Необходимо разработать дизайн интерфейса для веб-проекта в формате 2D–2.5D сцены с машинками и короткими гонками. Это не маркетинговый сайт и не классический лендинг, а интерактивный игровой интерфейс, в котором пользователь большую часть времени находится на одном экране, делает выбор и наблюдает за процессом гонки.

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

Нужен именно дизайн сцены и интерфейса. Реализация логики, анимаций и фронтенд не входят в задачу.

Экраны и состояния

При первом входе предусмотрен отдельный disclaimer-экран с подтверждением перед продолжением.

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

Основной экран до старта гонки. На нем видно текущую трассу, размещение машинок, таймер до старта, зону ставок на конкретную машинку с автоматическим просчетом потенциального выигрыша, а также короткий список результатов последних 5–10 заездов (какая машинка выигрывала). На экране постоянно присутствуют закрепленные элементы: логотип проекта, кнопка подключения кошелька (после подключения — постоянно видимый wallet), баланс пользователя и футер с ссылками на ToS, Privacy Policy и Twitter.

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

Отдельно предусмотрен экран или большая модалка для реферальной системы.

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

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

Трассы и машинки

Для каждой трассы дизайнер должен заложить направление движения и условный маршрут (guideline), пригодный для дальнейшей анимации движения машинок на фронтенде.

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

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

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

Анимации

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

Постоянной фоновой анимации быть не должно. Движение появляется лишь в момент гонки.

Стиль и подача

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

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

Админ-панель (дизайн)

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

Админ-панель предназначена для мониторинга и оперативного контроля платформы и должна включать такие разделы:

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

Дизайн админки ожидается на уровне wireframe / базового UI без глубокой аналитики и без проработки бизнес-логики.

Результат работы

Ожидается Figma-файл с дизайном для desktop и mobile, основными состояниями экранов, подготовленными ассетами трасс и машинок, а также базовым UI-китом. Верстка и код не нужны.

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

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