Модернизация сайта городского сада и культурной площадки

Сад «Эрмитаж» — не просто прогулочная территория, а городская культурная площадка с афишей, событиями, театрами, фотогалереями и большим потоком посетителей.

Сайту нужно было стать удобнее для пользователей: быстрее загружаться, корректно работать на мобильных устройствах и помогать гостям быстрее находить мероприятия, новости и полезную информацию.

Сад «Эрмитаж» — исторический парк в центре Москвы и одна из известных культурных площадок города.

На территории сада находятся театры, летняя эстрада, фонтаны, памятники, детские площадки и зоны отдыха. Здесь проходят концерты, фестивали, выставки, городские события и программы для разных аудиторий.

• Мобильная версия сайта. Посетители смогут удобно смотреть афишу, новости и информацию о саде со смартфонов.

• Раздел «Мероприятия». События сада получают отдельную понятную структуру и становятся заметнее для аудитории.

• Раздел «Новости». Команда сада может регулярно публиковать важные обновления и поддерживать контакт с посетителями.

• Обновленная фотогалерея. Визуальный контент лучше показывает атмосферу сада и усиливает доверие к площадке.

• Ускорение загрузки страниц. Пользователи быстрее получают доступ к информации и меньше уходят из-за долгой загрузки.

• Адаптация под разные устройства. Сайт корректно работает на смартфонах, планшетах и компьютерах.

Этап 1. Маркетинг

Разобрали, как посетители взаимодействуют с площадкой и какая информация для них критична: афиша, новости, фото, описание зон отдыха и данные о событиях.

• Изучили специфику сада как культурной и городской площадки.

• Учли большое количество разных типов контента: мероприятия, новости, фотоотчеты, история сада, объекты на территории.

• Определили, какие разделы должны быть доступны пользователю быстрее всего.

• Изучили потребности целевой аудитории (ЦА): быстро найти событие, понять формат мероприятия, посмотреть фото и спланировать визит.

• Выявили боли: неудобно искать информацию с телефона, сложно быстро перейти к актуальным событиям, важные материалы теряются в структуре.

• Поняли, как закрыть эти боли через сайт: упростить навигацию, добавить понятные разделы и адаптировать интерфейс под мобильные устройства.

• Создали 5 аватаров клиентов.

• Изучили 14 сайтов конкурентов. Поняли как культурные площадки и городские парки подают афишу, новости и фотоотчеты.

• Выделили решения, которые помогают быстрее вовлекать посетителей в события.

• Составили список из 34 идей для сайта.

• исследование ЦА

• анализ 14 конкурентов

• карта пользовательских сценариев

• список из 34 идей для реализации

• сформирована логика обновления сайта

Этап 2. Проектирование

На этом этапе мы продумали структуру новых разделов и мобильной версии, чтобы пользователь мог быстро найти нужную информацию без лишних переходов.

• «Мероприятия»

• «Новости»

• «Фотоотчеты»

• Страницы событий

• Страницы новостей

• Мобильная версия ключевых страниц

• Публикация мероприятий.

• Публикация новостей.

• Вывод фотоотчетов.

• Адаптивная структура страниц.

• Удобный просмотр материалов с мобильных устройств.

Те функции, которые нельзя было полностью показать в прототипах, мы описали в техническом задании (ТЗ).

• прототипы страниц

• документ ТЗ

• готовая структура сайта, которая позволяет посетителям находить мероприятия, читать новости, смотреть фотоотчеты 

Этап 3. Дизайн сайта

• Акцент на фото и визуальную атмосферу сада.

• Понятную подачу мероприятий и новостей.

• Удобное чтение с мобильных устройств.

• Быстрый переход к важным разделам.

• Сохранение узнаваемости и статуса культурной площадки.

• дизайн-макеты новых страниц и мобильной версии

• пользователям стало проще ориентироваться в афише, новостях и визуальных материалах сада

Этап 4. Верстка

После утверждения дизайна мы сверстали страницы на HTML, CSS и JavaScript с учетом адаптивности и стабильной работы на разных устройствах.

• Адаптивную верстку для смартфонов и планшетов.

• Корректное отображение новых разделов.

• Оптимизацию изображений.

• Настройку кеширования.

• Проверку верстки в разных браузерах.

• сайт стал быстрее загружаться и удобнее работать на мобильных устройствах

• посетители могут смотреть мероприятия, новости и фото без потери качества интерфейса

Этап 5. Разработка back-end

Мы собрали техническую основу для новых разделов и настроили управление контентом, чтобы команда сада могла самостоятельно публиковать новости, мероприятия и материалы.

• Модуль раздела «Мероприятия».

• Модуль раздела «Новости».

• Обновленный функционал фотогалереи.

• Настройку CMS для управления контентом.

• Логику вывода материалов на сайте.

• альфа-версия сайта

• разделы, которые можно наполнять и использовать как постоянный канал коммуникации с посетителями