16 предметов - 1 система

Учебные материалы готовятся в 2 раза быстрее

Перенёс подход дизайн-системы из продукта в учебный контент для 16 предметов

8 ч → 4 ч

на один урок (2 урока в день вместо 1)

4 → 2 мес.

на дизайн материалов к запуску курса

20 → 8

дизайнеров выделяют на продукт

~100 · 16

компонентов · режимов — один файл на все предметы

Контекст

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

16

предметов

6–9 мес.

материалов на каждый предмет

20

графических дизайнеров собирали это вручную

Всё это собиралось вручную. Одна и та же карточка — фото, заголовок, описание — заново рисовалась в каждом из 16 предметов.

Ключевые решения

01

Компоненты, а не шаблоны страниц

Проблема

Графические дизайнеры раньше не работали с компонентами.

Варианты

Может сразу собрать готовые шаблоны целых страниц?

Решение

Нашёл повторяющиеся паттерны во всех 16 предметах и вынес их в простые компоненты — около 100 штук. Страничные шаблоны сознательно не делал.

Почему?

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

Набор элементов
Набор элементов
Задания, собранные из элементов
Задания - собраны из элементов, тип меняется в свойствах компонента
Результат
Результат

02

Предметы как режимы переменных

Проблема

У каждого из 16 предметов свои акцентные цвета.

Решение

Обычно режимы переменных переключают светлую и тёмную тему. Я сделал 16 режимов - по одному на предмет. Переключаешь режим прямо на холсте, и материал перекрашивается со всеми акцентными цветами.

Что это даёт

Один набор компонентов на все предметы: правка в одном месте сразу доходит до всех 16.

Переменные: режимы-предметы

Как это работает

Один клик — и материал перекрашивается под другой предмет

Внедрение и поддержка

Как 20 человек без опыта освоили систему

Видео и инструкции

Записал обучающие видео и подготовил письменные инструкции по работе с компонентами и режимами предметов.


Мастер-классы

Проводил часовые мастер-классы по работе с системой.


Группы поддержки

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


Поддержка после запуска

Не бросил систему после внедрения: продолжал поддерживать её и помогать команде.

Видео инструкция
Видео инструкция на 17 минут
Инструкция в журнальном варианте
Инструкция в журнальном варианте

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

Результаты

Время на урок: 8 ч → 4 ч

Раньше один дизайнер закрывал 1 урок в день, теперь 2. Расчёт по рабочим часам и закрытым карточкам на kanban-доске в трекере.


Срок дизайна к запуску курса: 4 → 2 мес.

Черновики материалов приходили за 4 месяца до старта оба раза. Раньше на дизайн уходил весь срок, теперь 2 месяца. Освободившееся время стало резервом на правки и проверку до старта.


Ресурс: 20 → 8 дизайнеров на продукт

Раньше на продукт выделяли 20 дизайнеров, теперь 8. Решение принял Head of Design с учётом новой скорости работы: часть дизайнеров закрывала задачи за двоих. Освободившиеся 12 человек перешли на маркетинг и PR-задачи.

Чему научился

Автоматизация не дошла до конца

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


Системное мышление у творческих людей

Графические дизайнеры привыкли мыслить макетами, а не компонентами. Поэтому я внедрял систему постепенно, от простых элементов, и поддерживал её видео, мастер-классами и чатом. Вывод: внедрение системы на 50% обучение людей и только на 50% сама система.

Признание и менторство

Главный новатор года

Статуэтку вручила CEO компании.

Фото с награждения

Менторство

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

Менторство: дизайнеры с сертификатами
Следующий кейсAGRO