Создали единую онлайн-площадку для South HUB — ежегодной масштабной конференции в Сочи для директоров и топ-менеджеров из IT-сферы. Событие проходит в формате кэмпа, его фокус — на профессиональном развитии, балансе работы и жизни, нетворкинге.
1️⃣ Вводная задача от заказчика, проблематика, цели
❌ ПРОБЛЕМА
У South HUB не было единой цифровой платформы. Промо-лендинг собирался каждый год заново на Tilda или схожих конструкторах. В итоге терялась часть аудитории, снижалась вовлеченность и усложнялась работа самих организаторов.
► ЗАДАЧИ
▪️ Собрать всю ключевую информацию в одном месте.
▪️ Обеспечить удобный путь пользователя — от знакомства с South HUB до покупки билета.
▪️ Предоставить возможность обновлять контент из года в год без привлечения разработчиков.
▪️ Создать визуально яркий и динамичный образ, отражающий атмосферу комьюнити и события
✅ РЕШЕНИЕ
Новый сайт:
▪️ Разработан современный лендинг.
▪️ Вся информация о кэмпе структурирована и доступна в несколько кликов.
▪️ Дизайн отражает энергичность сообщества: крупная типографика, динамика, микроанимации, яркие визуальные акценты.
Конструктор блоков:
Для организаторов создана система модульного редактирования — готовые блоки с ограничениями по контенту. Это позволило обновлять сайт самостоятельно. В итоге пользователи всегда видят актуальную программу и материалы.
Удобный переход на покупку билетов:
Пользователи могут быстро и просто приобрести билеты, а организаторы экономят время. Кроме того, это закрыло риск мошенничества — официальная ссылка на сайте гарантирует.
2️⃣ Описание реализации кейса и творческого пути по поиску оптимального решения
✨ ДИЗАЙН
Мы взяли за основу брендбук, но добавили к нему настроение самой аудитории. South HUB — это С-level из IT: люди, для которых премиум важен не меньше, чем драйв и энергия. Поэтому дизайн получился сдержанным и элегантным по форме, но живым и динамичным по содержанию — без канцелярской строгости и с атмосферными акцентами.
В основу легла палитра белого, серого и черного цветов. «Встречает» посетителей сайта логотип-молния в 3D-исполнении, с ним можно «поиграть» при помощи курсора. Этот элемент объединяет несколько смыслов: первую букву названия South HUB, технологичность и дружелюбность через плавные линии. Мягкий liquid gradient остается статичным во всех блоках — оживляет композицию, но не отвлекает внимание от контента.
Также мы использовали несколько приемов:
▪️ Акцентная типографика и смещение строк: помогают сфокусировать внимание на заголовках.
▪️ Бегущая строка: для call-to-action, чтобы создать ощущение ожидания события.
▪️ Анимация и скроллителлинг: от микроанимаций (hover, focus) до эффектов, завязанных на скролле.
▪️ Параллакс: добавляет глубины и динамики.
Вся динамика не случайна — она отражает сам дух IT-комьюнити, где все всегда в движении.
⚙️ ТЕХНИЧЕСКАЯ РЕАЛИЗАЦИЯ
Чтобы совместить динамичный UX с удобным управлением контентом, использовали React + WordPress в роли Headless CMS. WordPress используется как источник данных (API), а визуал и логика — в React. Такой decoupled-подход дал гибкость на фронтенде, не связывая руки CMS-шаблонами.
React позволил удобно управлять анимационными сценариями и их производительностью, что было важно, ведь акцент мы делали на «живых» интерфейсах и микроанимациях.
WordPress помог снизить порог входа для контент-менеджеров. В админке внедрили кастомные поля и ограничения (например, лимит на длину заголовка), чтобы контент нельзя было «сломать» и визуал оставался аккуратным при любых правках. Плюс — можно смотреть историю версий и кто внес изменения: удобно для контроля качества и оперативных откатов.
3️⃣ Результаты сотрудничества
Чтобы понять, что такое South HUB, как проходит кэмп, где купить билеты и как подтвердить участие, раньше человеку приходилось проходить целый квест. Запуск новой платформы заметно изменил то, как люди взаимодействуют с ивентом. Теперь путь от знакомства с сообществом до участия в событии стал короче и понятнее. Все необходимое доступно в одном месте, без лишних действий и разрозненных ссылок.
А главное — исчезла сложность входа в South HUB. Участники больше не тратят силы на поиск информации и оформление участия, а могут сосредоточиться на том, с кем интересно было бы познакомиться, какие посетить доклады и активности. Благодаря этому у проекта кратно выросло число участников.
4️⃣ Заключение
Сайт South HUB для команды Maru's — партнерский проект. Мы взяли на себя дизайн и технологическую часть, а организаторы вложили свою экспертизу и контент. Такой формат позволил реализовать проект без классической коммерческой модели, но с общим пониманием, что результат нужен обеим сторонам.
В начале пути было много гипотез по функционалу: от полноценного личного кабинета до интеграций с разными билетными системами. Совместно с заказчиком мы перебрали разные сценарии и в итоге решили сконцентрироваться на удобном лендинге и прозрачном процессе покупки билетов.
Мы презентовали идеи сайта в видеоформате — создали шоурил. Это позволило показать не только внешний вид страниц, но и то, как сайт будет «жить»: анимации, переходы, динамику элементов.
Результат — это не только готовый продукт, но и выстроенный процесс взаимодействия: мы научились находить баланс между амбициозными идеями и практичными решениями.
Выставлено в номинациях:
— Сайт конференции, мероприятия