Мы сделали модуль для курса «Нетологии», и теперь его можно купить. Рассказываем, как создается онлайн-обучение

«Атвинта» стала одним из экспертов большого курса по UX/UI-дизайну от «Нетологии». Командировки в Москву за счет платформы, «казенные» вебки и права на контент — раскрываем внутреннюю кухню ниши онлайн-образования.

Кроме нас, экспертами образовательной программы выступили Agima, ITECH, МТС и другие лидеры диджитал-рынка. Каждая компания отвечала за свой тематический блок. Мы создали модуль по анимации интерфейсов.

Подробно о процессе в этой статье рассказал Алексей Нибо, дизайн-директор Атвинты, который непосредственно занимался разработкой программы и уроков.

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

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

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

До этого я не писал вебинары или уроки, но был огромный опыт обучения дизайнеров разного уровня в Атвинте. Задача сразу показалась интересной. Мне захотелось получить дополнительные навыки, структурировать свой опыт и узнать — а какой я автор и преподаватель?

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

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

Далее подписали договор (об условиях будет ниже), обговорили, как все будет происходить, и приступили к разработке атвинтовского блока.

Если смотреть со стороны приглашенного эксперта, то процесс выглядит так:

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

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

Программу и тизер готового блока по анимации интерфейсов можно посмотреть на скриншоте.

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

Например, у ребят будут практические уроки и задания по ProtoPie — софту для интерактивного проектирования. Чтобы приблизить задачи к реальности, я решил работать в контексте мобильного приложения вымышленного банка. Назвал его «ОченьБанк».

Для выполнения домашек подготовил макеты и интерактивный прототип приложения, где собрал все стандартные типы анимации и взаимодействия:

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

Первое задание по ProtoPie — реализовать базовые виды анимации на прототипе с помощью готовых элементов, которые я собрал в Фигме (иконки, картинки, кнопки, видео). Задание со звездочкой здесь же — сделать все то же самое, но используя свои наработки.

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

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

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

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

Разработка теории и практики мне далась легко, а вот с записью оказалось сложнее.

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

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

Теперь пару слов о том, как проходят съемки. У меня был опыт записи на студии Нетологии в Москве и удаленно — прямо у себя дома.

Так как я нахожусь в Кемерове, для записи курса мне пришлось улететь в командировку. Все проходило в офисе Нетологии — там у ребят есть несколько своих съемочных студий. Мы работали в одной из них.

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

Продюсер и методист контролируют процесс записи и говорят, когда надо перезаписать, а когда дубль был удачным. На один вебинар уходило 2-3 часа. Средний тайминг урока после монтажа — 1-1,5 часа.

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

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

Из интересного — техника. Нетология высылала курьером свою веб-камеру, я ее забирал, снимал урок, а после возвращал все с тем же курьером. И так несколько раз. Под конец мы с курьером уже начали здороваться как старые друзья. Модель вебки Logitech C922 — выдает отличное качество и звук.

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

Отснятые кадры и визуалы к урокам передали на монтаж. Специалисты получают ТЗ от методистов и собирают воедино запись, презентации, примеры и другие материалы, которые дополняют лекцию.

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

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

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

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

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

Всего ребят ждет 21 час теории и 41 час практики по анимации интерфейсов.

За запись курса агентствам платят, сколько — по договору сказать не могу. Командировку в Москву с билетами и проживанием оплачивала Нетология. По поводу жилья спрашивали, советовались и предлагали разные варианты на выбор — здесь тоже порадовало внимательное отношение команды.

Теперь про интеллектуальною собственность и юридические штуки.

«Право авторства» принадлежит эксперту. Нетология получает «право использования» всех созданных материалов, а также «исключительное право» на учебную программу. Если просто — авторство остается за экспертом, а распоряжается результатами интеллектуального труда платформа.

Также Нетология получает право размещать логотип и упоминать агентство на своем сайте.

Курс стал интересным проектом для меня и важным для агентства.

Плюсы для Атвинты:

Плюсы для меня:

Если появится возможность снова стать автором или соавтором курса — обязательно еще раз пойду в эту историю. Для меня это про рост и возможность сделать значимый вклад в свою любимую сферу.

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