Сайт для Национальной технологической олимпиады

Заказчик
“Кружковое движение” – это ассоциация участников технологических кружков, основанная в 2017 году.Цель ее работы – активная поддержка и развитие образовательных инициатив в технической сфере.
Задача
Клиент обратился к нам за помощью в обновлении уже существующего сайта проекта “Национальная технологическая олимпиада”.Старая версия сайта нуждалась в свежем дизайне и в гибкой системе управления.

Решение:

Разработка новой концепции сайта

Сайт разрабатывался для двух целевых аудиторий – “Ученики” и “Наставники”, поэтому важно было изначально продумать качественный UX дизайн и интуитивно понятную структуру для обеих категорий пользователей.

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

Мы сделали навигацию на сайте максимально простой и удобной для пользователей. Проработали разделы сайта. Для каждого направления олимпиады создали раздел “Профиль”. На странице профиля можно найти всю важную информацию о событии: расписание, требования к участникам, необходимую контактную информацию, подробное описание этапов олимпиады. Каждый профиль содержит теги, позволяющие легко перейти в список мероприятий на схожие темы.

Также реализовали систему умной фильтрации для разделов “Площадки для подготовки” и “Материалы подготовки”. Теперь пользователи могут легко находить все необходимое для эффективных занятий в рамках подготовки к мероприятиям: пройти нужный видеокурс, скачать данные или найти ближайшую офлайн-площадку.

Работа над календарем олимпиад

Поскольку в рамках проекта проводится множество мероприятий, на сайт необходимо было добавить удобную и понятную схему, отображающую актуальные и предстоящие события. 

Основываясь на цветовом кодировании (условном обозначении отдельных направлений/сфер мероприятий), которое уже использовалось клиентом, мы разработали и отрисовали календарь олимпиад. Основные цвета стали обозначать этапы и статусы мероприятий.

 

 

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

Дизайн

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

 

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

Адаптация административной панели

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

Результат

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


Перейти на сайт

В карточку агентства

Письмо автору кейса

Пользуйтесь реальным опытом в IT и следите за успехами потенциальных подрядчиков и конкурентов
Подпишитесь на рассылку
Читайте также
Кейсы по теме#Образование, наука, работа