IZMENI SOZNANIE: Два события, один сайт

Наша команда M-Social не первый год работает с агентством IZMENI SOZNANIE. Очередной яркий проект — разработка сайта для двух масштабных летних мероприятий: деловой конференции «Культурный код» и вечеринки «Летняя Digital Elka». Нам нужно было сделать сайт, который не просто продаёт билеты, но и передаёт атмосферу каждого события. И всё это — в сжатые сроки.

Архитектура выбора

У сайта была чёткая и простая цель: помочь гостям выбрать мероприятие и купить билеты. Для этого мы сделали три страницы.

- Разводящая страница. Это стартовая точка, с которой начинается знакомство с событиями. Здесь мы сразу задаём настроение и показываем два пути. С одной стороны — строгая деловая конференция «Культурный код», с другой — яркая и безумная «Летняя Digital Elka». Посетитель видит два основных блока и уже на этом этапе может принять решение или сразу перейти к покупке билетов.

- Лендинг «Культурный код». Это полноценная страница конференции. Здесь мы разместили всё, что нужно для принятия решения: описание, спикеров, программу, партнёров и, конечно же, билеты.

- Лендинг «Летняя Digital Elka». Страница для вечеринки. Здесь вместо спикеров — музыкальный лайн-ап, дресс-код "Сказки от-кутюр" и те же блоки с билетами и контактами.

Техническая магия

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

Вот несколько интересных деталей:

Скролл-анимация. В первом блоке мы сделали эффект погружения в берёзовую рощу. Вы крутите колёсико мыши — страница будто замирает на месте, а стволы берёз начинают расступаться с разной скоростью: одни быстрее, другие медленнее. При этом на вас надвигается огромный зелёный круг. Создаётся ощущение движения вглубь рощи.
Параллакс. Мы добавили эффект параллакса для ключевых визуальных элементов: при прокрутке фигуры лебедя, собаки-шара и хамелеона двигаются чуть медленнее фона. Это создаёт лёгкое 3D-ощущение. А карточки с переходом на мероприятия и билеты красиво «выезжают» в поле зрения при скролле.
Слайдер. Для конференции мы сделали слайдер спикеров. В нём два уровня: карточка с именем и регалиями, а при клике открывается поп-ап с подробной биографией. Если у спикера отсутствовал блок с биографией, кнопка «Подробнее» блокировалась — мелочь, но приятно и логично.

Финал

Разработали и сдали сайт за 18 календарных дней. Провели каждого гостя за руку от сомнений «Конференция или вечеринка?» до точного попадания в кнопку «Купить билет». Атмосфера событий была аккуратно интегрирована в интерфейс, превратив сухие строки кода в интерактивные праздники.

Отдельное спасибо IZMENI SOZNANIE за смелость и доверие. Этот проект — очередное доказательство того, что крутой сайт открывает двери в новую реальность.

Следующий кейс