Искусство обучать. Опыт HTML Academy

2015 · Доклад · SPB Frontend

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

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

У компании было почти всё своё: язык QScript, базы DBS4 и DBS, собственный сервер. Скрипты тоже хранились в базе. Эти технологии мало где можно было применить за пределами «Кодекса», зато рядом оказались сильные программисты. За четыре года я научился у них очень многому. Названия инструментов остались в той компании, а опыт работы с людьми и кодом — со мной.

Потом были девять лет техническим директором в маркетинговом агентстве и участие в организации Digitale. Задачи постоянно менялись. Приходилось сталкиваться с тем, чего раньше не делал, учиться и сразу применять новое. Теперь этот опыт помогает мне смотреть на обучение в HTML Academy: мало рассказать человеку о технологии, нужно дать ему возможность поработать с ней и получить обратную связь.

Кто приходит учиться вёрстке

В 2015 году в Академии около 123 тысяч регистраций, за месяц ученики выполняют примерно 716 тысяч заданий. На интенсивные онлайн-курсы записывается около одного процента аудитории. Именно на них у нас появляется возможность сопровождать человека от первых упражнений до собственного проекта.

Базовый курс HTML и CSS длится месяц. Мы принимаем людей без опыта и весь этот месяц занимаемся основами вёрстки. Не пытаемся одновременно рассказать про адаптивность, препроцессоры, методологии и автоматизацию. Нам нужна база, на которую потом можно положить остальные знания.

Для следующего шага есть продвинутый курс. В нём уже больше инструментов, востребованных в работе: автоматизация, препроцессоры, подходы к организации кода, адаптивная вёрстка. Готовим и базовый JavaScript; со временем хотим сделать продолжение. Отдельный адрес JS Academy ведёт в ту же компанию.

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

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

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

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

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

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

Почему до конца доходят не все

Через наши интенсивы уже прошло больше тысячи человек. Успешно завершили обучение 44%, а 11% выполнили финальный проект на все 100%. Эти проценты относятся к нашим участникам на момент выступления; за ними стоят конкретные работы и требования к ним.

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

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

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

Что означают 60 и 100 процентов

Финальный проект мы проверяем по заранее известным критериям. Они разделены на базовые и дополнительные. Чтобы успешно закончить курс, нужно выполнить все базовые — это 60% общей оценки. Нельзя набрать любые 60% и пропустить обязательное требование.

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

Дополнительные критерии дают остальные 40%. Среди них — устойчивость вёрстки к переполнению. Что произойдёт, если текста станет больше? Как поведёт себя блок, если изображение окажется шире ожидаемого и ему не задали размер? Совпадения с картинкой в одном состоянии недостаточно, чтобы ответить на эти вопросы.

Мы проверяем, что каждый блок сохраняет разумное поведение при изменении содержимого. Для максимальной оценки такие требования обязательны, для успешного завершения курса в целом — нет. Часть учеников всё равно добивается 100%: им хочется довести работу до конца по всему списку.

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

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

Учебный проект живёт в GitHub

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

Проект ученика находится на GitHub. У него есть собственный форк исходного репозитория. Для очередного задания он создаёт отдельную ветку, вносит изменения и делает коммиты. Когда считает работу законченной, открывает пулреквест в основной репозиторий.

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

Только после этого изменения попадают в основную ветку. Ученик постепенно привыкает к тому, что отправить код — ещё не закончить задачу. Замечания и обсуждение становятся обычной частью разработки.

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

Работа над заданием в отдельной ветке: обсуждение с наставником и исправления до принятия изменений.

Наставник рядом с учеником

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

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

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

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

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

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

На вопрос о педагогической методологии я не берусь отвечать за Сашу Першина: он занимался методиками дистанционного обучения и может объяснить эту сторону подробнее. Я могу показать наш практический процесс — работу с макетом, последовательность заданий, проверку кода и помощь наставника. Рассказать всё, что знаешь, и научить другого человека действительно не одно и то же.

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

Инженер, который сменил работу

Перед выступлением я попросил выпускников рассказать свои истории. Один из них учился на инженера и хотел работать чертёжником или испытателем. Рассчитывал участвовать в развитии производства. После института побывал на нескольких заводах, работал в автомобильных компаниях, ездил в командировки в Германию.

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

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

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

От бумажной работы к удалённой

Другая выпускница закончила педагогический университет и шесть лет занималась офисной работой. Она описывала её как перекладывание бумаг из одной стопки в другую. Хотелось путешествовать, иметь более гибкий график и получать удовольствие от своего дела.

Она пробовала другие занятия, в том числе продажи и работу экспедитором, но своего места не находила. Потом ей дали ссылку на HTML Academy. В курсах её увлекла история Кекса — нашего персонажа, который появился потому, что кот Саши был рядом, когда тот готовил задания.

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

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

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

Учиться рядом с людьми

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

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

Чтение при этом не заменяет практики. Инструменты меняются, но часть уже работающих специалистов не хочет разбираться в новом: сборку по-прежнему делают руками, к Grunt или Gulp относятся как к лишней работе. У новичка есть возможность не повторять эту привычку. Пробуя новое в своих проектах, он постепенно приобретает опыт, которого нет в одном только списке прочитанных статей.

Почему новые курсы начинаются с небольшой группы

Базовый курс JavaScript мы сначала запускаем без большого анонса. Первый поток небольшой: проверяем материалы, затем рассказываем о курсе выпускникам и только после этого — более широкой аудитории.

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

Открыть оригинал