Strategolog — это маркетплейс курсов и образовательная платформа онлайн-профессий. Маркетплейс предлагает услуги, направленные на помощь клиентам в улучшении их профессиональных навыков и достижении успеха в своей отрасли.
Strategolog отличается от конкурентов своей уникальной моделью, в которой различные эксперты могут предлагать свои курсы на платформе и платить комиссию за использование услуг платформы. Маркетплейс Strategolog предлагает обширный выбор курсов различной сложности и форматов обучения, что позволяет каждому пользователю найти оптимальное решение, соответствующее их индивидуальным потребностям и графику.
Задача:
Наша совместная работа направлена на создание дизайна и разработке кастомной образовательной платформы.
Сбор данных, информации и лучших трендов по смежным проектам на рынке;
Проработка сценариев поведения пользователя на платформе;
Отрисовка дизайн-проекта платформы и отдельных страниц сайта;
Разработка клиентской и серверной части платформы: настройка базы данных, верстка личного кабинета, работа с адаптацией, интеграция сервисов для обмена данными и тестирование функционала;
Изначально заказчик пришел с задачей — сделать образовательную платформу для его онлайн-школы, однако позже идея расширилась до того, чтобы сделать маркетплейс курсов. Эксперты могут приходить со своим продуктом и за % размещаться на его платформе, а также могут проводить обучение и проверять домашние задания студентов. Также есть эксклюзивный контент, который заказчик хочет показывать по подписке. Поэтому на платформе будет разделение на платные курсы и те, что доступны по подписке
У заказчика есть идея — реализовать масштабный образовательный марктелпейс курсов, но он не хочет вкладывать огромные деньги на разработку, поэтому захотел сделать no-code прототип своей идеи, чтобы проверить жизнеспособность продукта. Его идея на коде стоила бы более 5 миллионов рублей, однако на no-code разработку уйдет 200-400 тысяч, что намного выгоднее
Мы предложили заказчику разделить работу на 2 логических этапа, где реализуем сначала самый главный функционал, а после дополнительный.
Результат:
Мы разработали дизайн и фирменный стиль образовательной платформы по вкусу закачика и представили наше видение. Дизайн нашей платформы полностью кастомный, поэтому было написано 2000+ строк кода html,css и js кода.
В личном кабинете пользователей был внедрен следующий функционал:
Маркетплейс:
В разделе "Маркетплейс" пользователь имеет доступ к широкому выбору курсов и образовательных программ, представленных на платформе. Он может просматривать описания курсов, изучать информацию о преподавателях и экспертах, а также ознакомиться с отзывами других студентов. В этом разделе пользователь может выбрать интересующие его курсы и оформить их покупку или подписку.
Мои курсы:
Раздел "Мои курсы" предоставляет пользователю информацию и управление курсами, на которые он подписан или которые он приобрел. Здесь пользователь может видеть список всех своих курсов, получать доступ к материалам и видеолекциям, просматривать задания и домашние задания, а также отслеживать свой прогресс обучения. Также, в этом разделе пользователь может взаимодействовать с преподавателями и другими студентами, задавать вопросы и обсуждать учебные темы.
Домашка:
Раздел "Домашка" предназначен для управления и выполнения домашних заданий, связанных с выбранными курсами. Пользователь может видеть список заданий, сроки их выполнения, загружать свои ответы или работы. Также, в этом разделе пользователь может получать обратную связь от преподавателей и оценки за выполненные задания. Раздел "Домашка" помогает студентам организовать свое учебное время и эффективно выполнять задания.
Профиль:
Раздел "Профиль" позволяет пользователям заполнить информацию о себе, управлять подпиской, просматривать историю покупок курсов, получать техническую поддержку и ознакомиться с политикой конфиденциальности, условиями пользования и отправлять обратную связь. Этот раздел предоставляет удобный инструмент для управления персональными настройками, подпиской и доступом к важной информации на платформе, с целью создания более удобного и индивидуализированного пользовательского опыта.
Что сделали:
Мы разработали план производства работ на 1,5 месяца, поделили их на этапы. Мы начали двигаться по 1 этапу нашего плана и сейчас разрабатываем этот функционал Вот как мы построили нашу работу:
Поиск и исследование референсов, идей
Анализ референсов конкурентов: лучшие идеи и тренды
Файл Figma с подборкой референсов сильных дизайн-концепций конкурентов
Исследование опыта Целевой Аудиотрии
Ниже мы подготовили список идей, который поможет улушчить пользовательский опыт уже сейчас и в будущем
User Flow платформы
Отрисовка эскиза прототипа
Разработка UX/UI Дизайна интерфейсов
Разработка образовательной платформы на Tilda
Была разработана структура базы данных AirTable, включающая в себя возможность взаимодействие куратора со студентов при сдаче домашних заданий через отдельный личный кабинет куратора
Мы предложили заказчику разделить работу на 2 логических этапа, где разработаем сначала самый главный функционал, а затем дополнительный. После окончания «Этапа 1» команда будет тестировать платформу на реальных студентах и в DEMO-режиме давать доступ экспертам к нашей LMS системе.
Этап 1. Образовательный модуль + Подписка
Так выглядит наш план сотрудничества по проекту 👇🏻
Этап 2. Дополнительные фичи
Мы поделили работу на 5 этапов и поставили дедлайн по каждому:
Разработка UX/UI дизайна:
Проанализировали сайты и платформы конкурентов, выписали лучшие тренды и идеи;
Нашли и сохранили в мудборд интерфейсы конкурентов, чтобы продумать свою дизайн-концепцию.
Собрали User Flow - визуальное представление пути пользователя по платформе;
Отрисовали эскизы прототипа в Figma;
Разработали интерактивный UX/UI Дизайн интерфейса в Figma;
Подготовили дизайн-проект для передачи в вёрстку;
Сверстали 28 страниц интерфейсов на Tilda с адаптацией (320-480px, 480-960px, 960-1200px, 1200-1920px);
Подключили 10+ модификаций и написали 6 000+ строк HTML, CSS, JS код для стилизации элементов и увеличения функциональности платформы;
Подключили систему аналитики (Яндекс Вебмастер) и настроили цели;
Описали и настроили структуру баз данных в AirTable, что позволило нам эффективно и структурированно хранить информацию по студентам, кураторам, курсам;
Разработали бизнес-логику и автоматизацию событий в Make при передаче данных из Tilda в нашу базу данных;
Подключение интеграций:
Настроили почтовый клиент через SMTP-сервис для отправки писем пользователям при триггерных событиях (регистрация, покупка курса / подписки, окончание доступа);
Подключили плавную передачу динамических данных из AirTable в личный кабинет пользователя с помощью 38 интеграций в сервисе Collabza;
Тестирование и передача проекта:
Провели тестирование всех форм приема данных более 300 раз;
Проверили корректность отображения динамического контента из базы данных;
Составили техническую документацию по работе платформы (инструкции + скринкасты).