ГБУ ЦДМСИ «Крылья» обратились
к нам с запросом разработать досуговый портал для всех жителей Москвы. Портал должен объединять мероприятия для детей, молодежи, людей среднего возраста
и пенсионеров.

Этапы разработки:

1 Этап

С заказчиком была согласована и утверждена основная цветовая гамма: оранжевый, черный, серый и белый. Оранжевый стал акцентным, в данном случае он означает энергичность, подвижность, бодрость, активность и эмоциональность. Для сайта мы выбрали минималистичные, легко читаемые шрифты, без ярко выраженных акцентов. Ключевые моменты в тексте и название разделов выделили жирным начертанием, чтобы посетители не упустили важную информацию. В дизайне сайта мы использовали скругленные элементы и волнистые линии. Такое оформление облегчает восприятие контента, добавляет ему мягкости; волнистые линии также символизируют ощущение движения жизни, что отлично перекликается с тематикой сайта.

Первым делом мы приступили к дизайн-оформлению будущего сайта

Созданным дизайном мы хотели передать красочность и разнообразность мероприятий досугового центра

В навигационное меню вынесли 5 страниц: Главная, О нас, Мероприятия, Расписание и Новости

Далее мы создали общую структуру сайта

2 Этап

3 Этап

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

Информация на главной странице

4 Этап

Оформление текста и карточек тренеров

В разделе О нас мы сделали отдельные стилизованные плашки для информационных страниц об истории создания центра, его руководстве и сотрудниках. Разбили на отдельные секции текст о предлагаемых услугах центра по возрастным категориям: дети, взрослые, старшее поколение и семьи. Сделали в едином стиле карточку для каждого тренера и преподавателя, и отсортировали их по направлениям досуга. Иконками и текстом оформили преимущества ЦДМСИ «Крылья». Создали форму заявки для записи на пробное занятие по любому из направлений. Отдельно выделили блок контактов и геопозиции

5 Этап

У центра несколько направлений проводимых мероприятий (спорт, досуг, московское долголетие и д.р.), поэтому для каждого из них мы создали отдельную страницу. Внутри страниц стилизованными иконками отобразили виды мероприятий конкретного направления, а также настроили фильтры выбора по названию, району, возрасту участника, имени тренера и адресу проведения, чтобы пользователи могли быстрее ориентироваться по странице.
Каждое мероприятие мы реализовали через стандартный блок «Товары», где также отобразили всю необходимую информацию

Создание страниц для каждого вида досуга

Заказчику было важно, чтобы у каждого занятия кроме кнопки записи были дополнительные кнопки перехода на отдельные страницы о тренере и месте проведения. Стандартный функционал Tilda не предусматривает наличия таких кнопок у блока «Товары», поэтому мы доработали его через HTML-код, самостоятельно добавив 2 дополнительные стилизованные кнопки, настроили переход из них на заранее созданные страницы о тренере и адресе

Внедрение дополнительных кнопок через HTML-код

6 Этап

Следующим этапом было вынесение новостного блока обо всех мероприятиях досугового центра на отдельную страницу. Список новостей был стилистически оформлен и выложен через блок Tilda «Потоки». Мы настроили возможность прочитать подробнее о каждой новости, для этого нужно нажать на выбранное событие

Оформление и настройка новостной страницы

8 Этап

Для сайта мы настроили большое количество стильных анимаций и плавных переходов для динамичности и привлекательности

9 Этап

Провели необходимые SEO-настройки: для каждой страницы выставили заголовок h1; сделали описание и заголовок страниц; добавили favicon. Подключили Яндекс Метрику, Яндекс Вебмастер, Google Search Console, Google Analytics для отображения сайта
в поисковой выдаче и дальнейшего анализа посещаемости

SEO-Настройка сайта

10 Этап

Результат:

Ссылка на сайт: