44 lines
1.5 KiB
Markdown
44 lines
1.5 KiB
Markdown
# План редизайна фронтенда Game Marathon
|
||
|
||
## Концепция дизайна
|
||
|
||
**Стиль:** Минималистичный геймерский дизайн
|
||
- Темная база с неоновыми акцентами (cyan/purple/pink градиенты)
|
||
- Glitch эффекты на заголовках и при hover
|
||
- Glassmorphism для карточек (blur + transparency)
|
||
- Subtle grain/noise текстура на фоне
|
||
- Геометрические паттерны и линии
|
||
- Микро-анимации везде
|
||
|
||
**Цветовая палитра:**
|
||
```
|
||
Background: #0a0a0f (почти черный с синим оттенком)
|
||
Surface: #12121a (карточки)
|
||
Border: #1e1e2e (границы)
|
||
Primary: #00f0ff (cyan неон)
|
||
Secondary: #a855f7 (purple)
|
||
Accent: #f0abfc (pink)
|
||
Success: #22c55e
|
||
Error: #ef4444
|
||
Text: #e2e8f0
|
||
Text Muted: #64748b
|
||
```А ты
|
||
|
||
## Референсы для вдохновления
|
||
|
||
- Cyberpunk 2077 UI
|
||
- Discord dark theme
|
||
- Valorant game UI
|
||
- Steam profile pages
|
||
- Twitch streaming UI
|
||
- Epic Games Store
|
||
|
||
---
|
||
|
||
## Технические заметки
|
||
|
||
**Framer Motion:** Использовать для page transitions и сложных анимаций
|
||
**CSS:** Использовать для простых transitions и hover эффектов
|
||
**Tailwind:** Основной инструмент для стилей
|
||
**Custom Hooks:** useAnimation, useGlitch для переиспользования логики
|