Нужно разработать дизайн интерфейса криптотрейдинг приложения UPDOWNX. Работа выполняется только как UI дизайн, без верстки и без разработки. Основная задача — прорисовать интерфейс в Figma, чтобы потом разработчик смог легко сверстать его с использованием TailwindCSS.
Дизайн должен быть выполнен в темной теме (dark theme) в стиле crypto / cyberpunk, с неоновыми акцентами, свечением элементов и современными карточками. Интерфейс должен выглядеть технологично, минималистично и премиально. Основной фон интерфейса — темный, элементы выделяются мягкими свечениями и неоновыми цветами.
Основные цвета интерфейса:
фон — #05070A,
карточки — #0B0F14,
основной неоновый цвет — #00FFA3,
красный для падения — #FF3B3B,
дополнительный акцент — #2CF6C3.
Элементы интерфейса должны иметь мягкие границы, glow-эффекты и аккуратные тени. При этом важно не перегружать дизайн сложными эффектами. Поскольку интерфейс будет верстаться через TailwindCSS, дизайн должен быть максимально структурированным и логичным.
Не использовать сложные формы, нестандартные контейнеры или тяжелые визуальные эффекты. Все блоки должны быть построены на карточках, flex или grid-структуре. Желательно использовать простые радиусы, например стиль rounded-xl, простые тени и легкое свечение. Градиенты можно использовать, но без сложных переходов.
Основной шрифт — Inter.
Заголовки — крупные и читаемые, подзаголовки — средние, основной текст — стандартный интерфейсный. Интерфейс должен выглядеть современно и аккуратно.
Для desktop используется контейнер 1440px, рабочая область примерно 1280px. Для мобильной версии нужно использовать ширину 375px или 390px. Важно соблюдать 8-пиксельную сетку, чтобы разработчику было легко повторить дизайн.
Необходимо прорисовать следующие страницы интерфейса.
Первая страница — Trading (главная страница торговли). На ней должен быть основной график актива, выбор криптовалюты, таймфреймы, цена актива, кнопки UP / DOWN для открытия сделки, таймер сделки, блок Live Trades с последними сделками пользователей и блок открытых позиций.
Вторая страница — Markets. Это список криптовалют. На странице должен быть поиск, список активов (BTC, ETH, SOL и т.д.), цена, изменение за 24 часа, а также кнопка перехода к торговле.
Третья страница — Balance. На этой странице отображается общий баланс пользователя. Должны быть кнопки Deposit и Withdraw, QR-код для депозита, а также список последних операций.
Четвертая страница — History. Здесь отображается история операций пользователя. Нужно сделать фильтр по типу операций: All, Trading, Deposits, Withdrawals. Также должны отображаться дата операции, актив, ставка и результат сделки.
Пятая страница — Tournaments. На странице должен быть баннер турнира (например Bull vs Bear), призовой фонд, кнопка участия, лидерборд участников и список доступных турниров.
Шестая страница — Profile (личный кабинет). Здесь отображается профиль пользователя, аватар, статистика трейдера (Win Rate, Profit, количество сделок), а также история операций.
Также необходимо сделать мобильную версию всех страниц. Для мобильного интерфейса должна быть нижняя навигация с иконками: Trading, Markets, Balance, Tournaments, History. Интерфейс должен быть адаптирован под мобильное использование.
Кроме страниц нужно создать набор компонентов (UI Kit). В него должны входить кнопки (primary, secondary, danger), карточки (asset card, trade card, stats card, tournament card), таблицы (trades, history, leaderboard), поля поиска и элементы фильтрации.
В результате дизайнер должен передать Figma-файл, в котором будет структура проекта: Desktop версии страниц, Mobile версии страниц и Components / UI Kit.
Главная цель — сделать современный криптотрейдинг интерфейс, который выглядит технологично и при этом легко верстается через TailwindCSS.