Кейс: сайт обучающих мастер-классов по макраме

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

Например, тот факт, что на конструкторе может создать сайт даже простой пользователь, часто становится причиной для осуждения этой платформы — мол, ничего путного и высокоэффективного там не сделать (так, лендинги поклепать для бизнеса, который пока не готов вкладываться в “нормальный” сайт). Команда Tildev уже несколько лет опровергает все нехорошие мнения по поводу Тильды, мы ее любим, уважаем и ценим :) К тому же, за эти годы и команда Тильды провела огромную работу по улучшению самой платформы, за что мы им несказанно благодарны.

Закончим это небольшое лирическое отступление и оду любви Тильде и перейдем к делу. Команда Tildev создала обучающую площадку на Тильде — об этом и поговорим.

Кейс: сайт обучающих мастер-классов по макраме

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

  • Защита видео-уроков от скачивания. Чтобы пользователи могли только просматривать видео на сайте, но не скачивать себе.
  • Покупка курсов на ограниченный срок. При покупке курса, пользователь получает доступ к нему только на 1 год.

Ниже рассказываем подробнее о проделанной работе.

Структура и дизайн

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

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

После утверждения структуры, было разработано 3 дизайн-макета на выбор, заказчик остановился на одном из них.

Кейс: сайт обучающих мастер-классов по макраме

Личный кабинет

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

Кейс: сайт обучающих мастер-классов по макраме

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

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

Кейс: сайт обучающих мастер-классов по макраме

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

Блок с видео мы реализовали через ZeroBlock Тильды. Видео каждого мастер-класса вставлено с помощью сервиса Annexx. Также под видео мы добавили кнопки для навигации по урокам.

Кейс: сайт обучающих мастер-классов по макраме

Защита видео-уроков от скачивания

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

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

Кейс: сайт обучающих мастер-классов по макраме

Еще из интересного…

  • Подключена Яндекс. Касса для приема платежей.
  • Использованы дополнительные модификации от сервисов Nolim и Annexx, а также собственные для расширения функционала сайта и улучшения дизайна.
  • Добавлена базовая анимация элементов на сайте.
  • Настроена SEO-оптимизация сайта.
  • Подключен домен и все необходимые сервисы приема данных.
  • Для заказчика была записана видео-инструкция по добавлению новых мастер-классов, а также редактированию имеющихся.

С учетом всех внутренних страниц на сайте вышло более 100 страниц.

Результата работы можно посмотреть по ссылке https://relaxgamak.ru/

Такой вышел кейс. Интересная работа для нас и отличный результат для заказчика.

11
Начать дискуссию