Зачем вообще «неон» в Android-приложении
Молодая аудитория чувствует визуальный язык за секунду. Если экран выглядит как корпоративная админка 2014 года, пользователь закрывает приложение раньше, чем дойдёт до онбординга. Неон — это не «кислотные цвета ради кислоты», а контраст, глубина и движение, которые подчёркивают характер продукта.
В Jetpack Compose такой стиль собирается быстрее, чем в XML: градиенты, blur-эффекты и анимации живут в одном дереве композиции. Главное — не устроить фейерверк на слабом железе.
База: тёмный фон и акцентная палитра
Начни с тёмной темы и двух акцентов: холодный cyan и фиолетовый/magenta. Третий цвет — только для CTA и важных состояний. Так интерфейс остаётся читаемым, а «безумие» не превращается в кашу.
val NeonBg = Color(0xFF0B0B15)
val NeonAccent = Color(0xFF7D5DFF)
val NeonGlow = Color(0xFF00D7FF)Градиенты без просадки FPS
Линейный градиент на весь экран — норм, если не перерисовывать его каждый
кадр. Оберни фон в отдельный слой и избегай лишних animate* на
больших Box. Для карточек используй радиальный градиент с низкой
непрозрачностью — он даёт объём без тяжёлого blur.
- Фон экрана — статичный градиент.
- Карточки — лёгкий radial + border 1px с alpha 0.08.
- Кнопки — linear gradient только на CTA.
Glow и «стеклянные» панели
Эффект свечения в Compose делается через shadow с цветным
elevation и полупрозрачные обводки. Blur на Android дорогой: если целишься
в mass-market устройства, имитируй стекло полупрозрачным фоном
Color.White.copy(alpha = 0.06f) вместо настоящего backdrop blur
на каждом элементе.
Motion: дерзко, но с лимитом
Микроанимации — твой друг: scale на нажатие, лёгкий fade при появлении списка.
Не анимируй одновременно opacity, scale и offset на десятках элементов LazyColumn.
Для списка достаточно AnimatedVisibility на header и staggered
появление первых 5–7 айтемов.
val scale by animateFloatAsState(
targetValue = if (pressed) 0.96f else 1f,
animationSpec = spring(dampingRatio = 0.6f),
label = "ctaScale"
)Типографика: читаемость важнее хайпа
Заголовки — жирные, крупные, с tight line-height. Основной текст — спокойный серо-фиолетовый на тёмном фоне. Не ставь неоновый цвет на body-текст: глаза устают за минуту. Акцентный цвет — для лейблов, ссылок и бейджей рубрик.
Чеклист перед релизом
- Прогони экран на устройстве с 60 Гц и на бюджетнике.
- Проверь контраст в Accessibility Scanner.
- Отключи лишние recomposition в Layout Inspector.
- Сохрани «спокойную» тему для ночного режима без неона.
Итог: неоновый UI — это дисциплина плюс характер. Compose даёт скорость экспериментов; твоя задача — оставить только те эффекты, которые работают на впечатление и на FPS одновременно.