E-comm образовательная площадка для Международного Эриксоновского Университета коучинга

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

Университет охватывает всю территорию России и стран СНГ: Москва, Санкт-Петербург, Самара, Воронеж, Казань, Алматы, Красноярск, Новосибирск, Тюмень, Екатеринбург и многие другие города. Студенты и выпускники – это предприниматели, политики, менеджеры, юристы, тренеры, консультанты, психологи, педагоги и все, кто стремится к саморазвитию через коучинг.

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

1. Имиджевые задачи:

— Обновление позиционирования, которое уже не соответствовало актуальному статусу компании.

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

2. Бизнес-задача:

— Разработка инструментария для автоматизации бизнес-процессов, способствующего росту компании.

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

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

Что касается разработки самого сайта, мы структурировали процесс на логичные и понятные этапы:

1. Аналитика:

— Проведение брифинга с клиентом;

— Опросы и исследование целевой аудитории;

— Проработка персоналий;

— Разработка пользовательских сценариев для каждого сегмента пользователей;

— Создание архитектуры сайта и логическое разделение платформы на блоки;

— Формирование технического задания;

— Разработка дизайн-концепции и определение направления визуального стиля.

2. Дизайн:

— Создание дизайна главной страницы;

— Разработка дизайна внутренних страниц;

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

3. Фронтенд:

— Реализация визуальной части сайта с учетом всех адаптивных решений и интерактивных элементов.

4. Программирование:

— Внедрение CMS «1С-Битрикс: Управление сайтом» для обеспечения удобного управления контентом и дальнейшего масштабирования платформы.

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

Прежде чем приступить к столь сложному проекту, нам предстояло изучить все вводные от клиента и максимально подробно исследовать каждый уголок Университета — словно мы ученики Хогвартса, исследующие бесконечные коридоры замка. В «Эриксоне» этих лестниц миллионы, и упустить даже один кирпичик было нельзя, ведь именно он мог нарушить систему, которая должна работать как часы.

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

— Общее описание бизнес-модели клиента: понимание ключевых принципов работы организации.

— Описание позиционирования: анализ текущего имиджа и его соответствия статусу компании.

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

— Обработка текущих метрик и целей: анализ показателей, накопленных за долгие годы работы старого ресурса.

— Выявление узких мест: определение проблем, которые мешают росту компании.

— Сопоставление данных: объединение всей собранной информации в единый дашборд, позволяющий приоритезировать дальнейшие действия.

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

Разработка пользовательских сценариев охватила все типы клиентов:

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

— Те, кто хочет пройти обучение, но не уверен, какие программы для него подойдут.

— Те, кто только узнал о коучинге, не до конца понимает его суть и сомневается в необходимости обучения.

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

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

Заключительным этапом предпроектной подготовки стала разработка дизайн-концепции и определение направления визуального стиля. Опираясь на наш многолетний опыт, мы провели детальный анализ стилей конкурентов в России и мире, создали мудборд, позволяющий клиенту увидеть актуальные пути решения его задачи. В данном случае было принято решение пойти по пути минимализма, что идеально сочетается с предполагаемым большим объемом контента на платформе. Мы также учли, что данную площадку можно назвать своего рода «образовательным e-commerce», что позволило нам обратить внимание на лучшие практики как в образовательном секторе, так и в ведущих e-commerce продуктах.

Поскольку параллельно с предпроектным исследованием наша команда брендинга уже разработала платформу бренда для университета, на момент старта дизайна сайта мы имели четкое представление об обновлённом фирменном стиле и визуальной коммуникации. Согласованные визуалы дизайн-концепции позволили нам объединить все элементы в единое целое, создавая продукт, отражающий суть и амбиции Университета коучинга.

Мы выбрали стиль современного минимализма, в котором преобладают чистые линии и геометрия, дополненные трендовыми арочными элементами. Фирменные яркие акценты добавляют эмоциональную насыщенность, а брендовые детали интегрированы в основной UI, передавая дополнительные смыслы и усиливая коммуникацию с аудиторией.

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

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

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

— Форма обратной связи и онлайн-чат: инструменты для оперативной консультации, позволяющие пользователям мгновенно связаться с представителями университета.

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

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

— Виджет количества выпускников: мощный имиджевый элемент, который демонстрирует масштаб и доверие, способствуя принятию решения о сотрудничестве.

— Лента с программами, стартующими в ближайшее время: актуальный календарь обучения, позволяющий пользователю ориентироваться в предстоящих курсах.

— Блок «Что такое коучинг»: вводная информация, помогающая новичкам понять суть коучинга и ценность образовательных программ.

— Блок с преимуществами вуза: ключевые аргументы, подчеркивающие уникальность и высокое качество обучения в Университете.

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

— Блок с описанием истории компании: рассказ о развитии университета, его традициях и достижениях, формирующий доверие.

— Лента преподавателей: представление команды экспертов, что особенно важно для потенциальных абитуриентов.

— Блок с живыми отзывами выпускников: реальные истории успеха, подкрепляющие репутацию университета.

— Лента со всеми доступными программами: детальное представление всех образовательных предложений, чтобы пользователь мог выбрать наиболее подходящий вариант.

— Лента рекомендованных статей: полезный контент для самостоятельного изучения перед принятием решения.

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

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

Внутренние страницы

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

1. Страница “Старт в коучинге”

Это вторая по значимости страница после главной, отвечающая на вопросы «Что такое коучинг?» и показывающая интерактивную карту образовательного процесса.

— Интерактивная карта: визуально демонстрирует все этапы обучения, начиная с точек старта и заканчивая конечными программами, которые ведут к желаемому результату.

— Блок с преподавателями: знакомит пользователя с экспертами, проводящими обучение.

— Программы и расписание: предоставляет актуальную информацию о курсах, их времени и условиях.

— Ответы на часто задаваемые вопросы: помогает развеять сомнения и уточнить детали обучения.

— Формы обратной связи: позволяют оперативно получить консультацию и дополнительную информацию.

2. Каталог программ и расписание

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

— Расписание с каталогом программ: полная информация о курсах с указанием дат, формата и географической привязки.

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

— Подробная страница программы: детальное описание курса с возможностью записи на обучение.

3. Личный кабинет пользователя

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

— Администратор;

— Модератор;

— Физическое лицо;

— Кабинет для корпоративных пользователей.

Функционал личного кабинета включает:

— Регистрация, авторизация и восстановление пароля;

— Персональная карточка профиля;

— Каталог купленных программ с онлайн-чатами;

— Статусы текущих программ обучения;

— Интеграция с CRM для бесшовного перехода в учебный процесс;

— Истории заказов и оплаты;

— Заказ мерча из внутреннего интернет-магазина;

— Доступ к документам и обучающим материалам с возможностью скачивания;

— Система рекомендаций для дальнейшего развития профессиональных навыков.

4. Интернет-магазин

Разработан как самостоятельный блок, позволяющий пользователям заказывать продукцию, мерч и обучающие материалы онлайн с удобной оплатой и доставкой. Функционал магазина интегрирован с образовательной программой, чтобы предложения соответствовали потребностям студентов.

5. Раздел “Для бизнеса”

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

6. Контентные страницы “Дополненная ценность”

Эти страницы предоставляют дополнительную информацию, необходимую для принятия решения:

— О нас: история университета, слова основателя, информация о преподавателях, партнёрах, а также описание коучинга и система документов.

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

— Подробная страница статьи: с возможностью поделиться в социальных сетях, что способствует вовлечению аудитории.

— Контакты: все способы связи с университетом для оперативной коммуникации.

— Страница 404: креативное оформление, которое поддерживает общий стиль сайта даже при возникновении ошибок.

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

В рамках проекта мы реализовали несколько ключевых этапов, охватывающих верстку и программирование корпоративной части сайта на CMS «1С-Битрикс: Управление сайтом». Наш подход позволил создать быстрый, адаптивный и функциональный продукт, готовый к дальнейшему развитию и интеграции с внешними системами.

Для верстки мы использовали проверенные технологии — HTML, CSS и JS, что обеспечило оперативное создание MVP-версии. Этот выбор позволил добиться следующих результатов:

— Быстрого и адаптивного отображения всех разделов сайта на любых устройствах;

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

Мы понимали, что проект предусматривает последующую интеграцию с несколькими CRM, включая «Битрикс24», поэтому использование сложных фреймворков могло бы только усложнить задачу. Для поддержки дальнейшего развития и обеспечения оперативного управления контентом, для бэкенда мы выбрали систему «1С-Битрикс». Это позволило:

— Гибко решать практически любые задачи с учетом расширения функционала;

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

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

После завершения программирования корпоративной части проекта к нам присоединились коллеги-интеграторы, которые разработали взаимодействие системы с CRM в рамках смарт-процессов внутри «Битрикс». Это позволило максимально эффективно управлять всеми процессами и обеспечило бесперебойное функционирование образовательной платформы.

MVP-часть была успешно реализована и внедрена, а её эффективность подтверждают установленные при запуске платформы показатели и метрики. Этот проект стал не только ценным опытом для нашей команды и клиента, но и, пожалуй, самой масштабной разработкой в образовательной нише, с которой мы когда-либо работали. Мы решились на амбициозный шаг, создав продукт, который стабильно работает и способствует росту Университета, благодаря тщательной проработке всех процессов, автоматизации множества задач и предоставлению удобного инструмента для получения знаний из любой точки мира.

Для нас ниша образования всегда была чем-то особенным – она дает нашему миру ресурсы для развития. Осознание того, что мы внесли свою лепту в создание такого грандиозного проекта, вдохновляет и мотивирует нас на новые подвиги!