Итоги 3-го чемпионата по вёрстке

Чемпионат по вёрстке помогает:

1. Профессиональным разработчикам подтверждать свой уровень и навыки, оставлять цифровой след.
2. Клиентам выбирать лучшие студии и компании для разработки своих проектов.
3. Компаниям находить специалистов по реальному результату, а не по резюме.

Ключевые особенности соревнования:

• сложные и объёмные макеты от профессиональных дизайн-студий;
• двухнедельный формат, ориентированный на качество, а не скорость;
• строгая многоуровневая оценка;
• жюри из опытных разработчиков из бигтеха и компаний заказной разработки.

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

Дизайн-челлендж от Mish

Участники работали с ярким, необычным макетом от Mish.

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

Запись лайва: ссылка VK, ссылка YouTube

Макет включал адаптив в двух версиях (мобильной и десктопной), большое количество мелких элементов, нестандартные перестроения сетки, сложное переполнение в отдельных блоках, а также яркие анимации и микроанимации.

Mish — агентство, разрабатывающее комплексные цифровые решения под ключ: от идеи до готового продукта с последующей поддержкой. Работали с Альфа-Банком, Spar, МТС, агентством «ПИК» и многими другими.

Две недели на реализацию сложного проекта

Участники работали над заданиями с 30 марта по 14 апреля включительно.

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

Строгая многоуровневая оценка

Качество работ оценивалось по системе критериев качества вёрстки, общепринятой на рынке и используемой в профессиональной разработке. Эти критерии HTML Academy поддерживает и развивает с 2015 года.

Всего при проверке применялось 59 критериев. Ядро этой системы подробно описано в фундаментальной статье на Хабре и отражает требования к промышленному качеству HTML и CSS.

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

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

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

Серьёзный состав экспертного жюри

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

Состав жюри трека для профессионалов

• Артём Альтигин, Руководитель команды разработки, Контур
• Роман Желтов, Tech Lead, Сбер
• Илья Туров, Frontend-разработчик, Альфа-Банк
• Сэм Булатов, Старший разработчик, Т-Банк CoreTech

Состав жюри трека джунов

• Владислав Фроленков, Frontend-разработчик, Андагар
• Сергей Хрипачёв, Заместитель технического директора, WL: digital-агентство
• Николай Шабалин, Frontend-разработчик, СберЗдоровье
• Светлана Корякина, Frontend-разработчик, Яндекс Крауд

Главные выводы по работам участников

Итоговый разбор работ и комментарии жюри показали высокий уровень участников: большинство уверенно справились с макетом, который по своей сложности соответствует уровню задач, с которыми работают middle/senior frontend-разработчики.

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

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

Мнения экспертов о финальных работах

Впечатления в целом: каждая работа заслуживает признания — крутые стили, чёткая структура, продуманная работа с переменными. Такие «полные» подходы меня правда впечатляют! А если и есть некоторые детали вёрстки (те же баги), давайте помнить о том, что очень часто вёрстка и анимации финализируются на этапе тестирования либо со стороны заказчика в ходе разработки. Все участники большие молодцы!

Владислав, Андагар

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

Сергей Хрипачёв, WL

Таблицы победителей в финале чемпионата

Трек: Профессиональный

Трек: Джуны

Получить код победителей и детальный протокол оценки

Напишите на corp@htmlacademy.ru, и мы вышлем:

• код финалистов и победителей чемпионата;
• детальный протокол оценки работ с комментариями.

Если вы подбираете начинающего разработчика и хотите оценить уровень по реальным проектам, напишите на corp@htmlacademy.ru.

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

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.