Mingle
openКонцепция: Музыка, которую видно
Моей целью было не просто нарисовать тысячный по счету музыкальный плеер, а сделать сервис, где музыка становится визуально осязаемой. В основе проекта лежит само название платформы — Mingle, что переводится как «смешиваться». Этот образ пронизывает весь дизайн на всех уровнях.
У сервиса практически нет своей фиксированной цветовой палитры. Внешний вид макетов на 100% зависим от музыки: интерфейс забирает цвета из обложек треков и плейлистов. Массивный фоновый градиент непрерывно живет и меняется, цвета в нем буквально смешиваются друг с другом под музыку.
Детали и реактивный дизайн
Весь сайт реагирует на воспроизводимый звук, и это транслируется через серию микро-взаимодействий, которые оживляют интерфейс:
- Значок логотипа во время проигрывания медленно вращается, напоминая катушку бобинного магнитофона.
- Название играющего трека слегка пульсирует в ритм музыки, создавая ощущение бита.
- Метафора «смешивания» (mingle) отлично поддерживается эффектом слияния (gooey). Если посмотреть на элементы управления (кнопки вперед/назад/пауза), видно, что они не просто стоят рядом в ряд — они визуально стягиваются и перетекают друг в друга, как жидкая материя.
Удобство поверх эмоций: острова контента
Сделать такой нестандартный, «подвижный» интерфейс — это круто, но мне было важно не пожертвовать UX и оставить управление удобным и логичным.
Поскольку на заднем плане происходит постоянная игра цветов, контент не мог просто лежать поверх них — он бы потерялся. Решением стали полупрозрачные матовые плашки («островки»), внутри которых размещается строгая, аккуратная типографика и списки недавних треков или плейлистов. Это позволило создать строгую систему отступов и грамотно собрать модульную сетку.
Даже при фокусном воспроизведении (где поверх интерфейса выводятся строчки песни и крупно показываются детали композиции) сохраняется кристальная ясность — пользователь всегда понимает, куда нажать, несмотря на выразительность и эмоциональность визуального решения.
