Разработка многостраничного сайта для досугового центра
ГБУ ЦДМСИ «Крылья» обратились
к нам с запросом разработать досуговый портал для всех жителей Москвы. Портал должен объединять мероприятия для детей, молодежи, людей среднего возраста
и пенсионеров.
Результат
Сайт должен быть понятным и красивым,
при этом динамичным и продающим. На сайте должна быть возможность сразу записаться на мероприятия
Техническое задание:
Создать многофункциональный единый удобный досуговый портал для жителей всех возрастов, учесть их интересы и хобби, предложить увлекательные мероприятия и мастер-классы
Цель разработки:
Жители Москвы от детского
до пенсионного возраста
Основная ЦА:
Этапы разработки:
1 Этап
С заказчиком была согласована и утверждена основная цветовая гамма: оранжевый, черный, серый и белый. Оранжевый стал акцентным, в данном случае он означает энергичность, подвижность, бодрость, активность и эмоциональность. Для сайта мы выбрали минималистичные, легко читаемые шрифты, без ярко выраженных акцентов. Ключевые моменты в тексте и название разделов выделили жирным начертанием, чтобы посетители не упустили важную информацию. В дизайне сайта мы использовали скругленные элементы и волнистые линии. Такое оформление облегчает восприятие контента, добавляет ему мягкости; волнистые линии также символизируют ощущение движения жизни, что отлично перекликается с тематикой сайта.
Первым делом мы приступили к дизайн-оформлению будущего сайта
Созданным дизайном мы хотели передать красочность и разнообразность мероприятий досугового центра
В навигационное меню вынесли 5 страниц:
Главная, О нас, Мероприятия, Расписание и Новости
Далее мы создали общую структуру сайта
2 Этап
3 Этап
Мы отобразили всю основную информацию о досуговом центре: рассказали о последних событиях, цифрах, партнерах
и контактах, и вынесли отдельный блок досуговых направлений
Информация на главной странице
4 Этап
В разделе О нас мы сделали отдельные стилизованные плашки для информационных страниц об истории создания центра,
его руководстве и сотрудниках.
Разбили на отдельные секции текст
о предлагаемых услугах центра по возрастным категориям: дети, взрослые, старшее поколение
и семьи.
Сделали в едином стиле карточку для каждого тренера и преподавателя, и отсортировали их
по направлениям досуга.
Иконками и текстом оформили преимущества ЦДМСИ “Крылья”.
Создали форму заявки для записи на пробное занятие по любому из направлений.
Отдельно выделили блок контактов и геопозиции
Оформление текста
и карточек тренеров
5 Этап
 У  центра несколько направлений проводимых мероприятий (спорт, досуг, московское долголетие и д.р.), поэтому для каждого из них мы создали отдельную страницу. Внутри страниц стилизованными иконками отобразили виды мероприятий конкретного направления, а также настроили фильтры выбора по названию, району, возрасту участника, имени тренера и адресу проведения, чтобы пользователи могли быстрее ориентироваться по странице.
Каждое мероприятие мы реализовали через стандартный блок “Товары”, где также отобразили всю необходимую информацию
Создание страниц
для каждого вида досуга
Заказчику было важно, чтобы у каждого занятия кроме кнопки записи были дополнительные кнопки перехода на отдельные страницы
о тренере и месте проведения. Стандартный функционал Tilda не предусматривает наличия таких кнопок у блока “Товары”, поэтому мы доработали его через HTML-код, самостоятельно добавив 2 дополнительные стилизованные кнопки, настроили переход из них на заранее созданные страницы о тренере и адресе
Внедрение дополнительных кнопок через HTML-код
6 Этап
Раздел “Расписание” мы вынесли на отдельную страницу, чтобы не перегружать информацию
на сайте. Само расписание было решено разместить через pdf и excel документ -
это самый оптимальный и удобный вариант
как для сотрудников центра,
так и для его участников. Сотрудники могут оперативно внести изменения и загрузить новое расписание на сайт без помощи разработчика,
а пользователи могут ознакомиться
с выложенным документом, просто загрузив
его на устройство. Такой подход минимизирует неточности и несовпадения в расписании мероприятий, а также сокращает время работы
и количество задействованных сотрудников
Реализация расписания мероприятий
7 Этап
Следующим этапом было вынесение новостного блока обо всех мероприятиях досугового центра на отдельную страницу. Список новостей был стилистически оформлен и выложен через блок Tilda “Потоки”. Мы настроили возможность прочитать подробнее о каждой новости, для этого нужно нажать на выбранное событие
Оформление и настройка
новостной страницы
8 Этап
Для сайта мы настроили большое количество стильных анимаций и плавных переходов
для  динамичности и привлекательности
9 Этап
Провели необходимые SEO-настройки: для каждой страницы выставили заголовок h1; сделали описание и заголовок страниц; добавили favicon. Подключили Яндекс Метрику, Яндекс Вебмастер, Google Search Console, Google Analytics для отображения сайта
в поисковой выдаче и дальнейшего анализа посещаемости
SEO-Настройка сайта
10 Этап
Результат:
Ссылка на сайт: