Веб-разработка

Онлайн-курс «Инженерия дизайн-систем»

Создавать и сопровождать дизайн-систему как продукт для нескольких команд. Обучение построено вокруг практики и завершается самостоятельной итоговой работой.

Автор и составитель программы

Дамир Шарифьянов

Full-stack разработчик и автор образовательных материалов

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

Опыт и проекты автора →

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

Визуальная карта курса «Инженерия дизайн-систем»Путь от изучения темы к практике и готовому проектуВЕБ-РАЗРАБОТКАИнженерия дизайн-системСтруктура → интерфейс → публикация1Разобратьсяс понятиями2Применитьна практике◫Создать проектдля портфолио
12 модулейот основ до проекта
33–45 часовв удобном темпе
Автопроверкаобратная связь сразу
Сертификатс проверкой подлинности
О программе

Кому подойдёт курс и чему вы научитесь

Курс подходит

  • Новичкам в создании сайтов
  • Дизайнерам и контент-специалистам, расширяющим навыки
  • Разработчикам, которым нужен законченный веб-проект

Практические навыки

  • Разбирать «Аудит интерфейсов» на практическом примере
  • Проектировать «Принципы системы» на практическом примере
  • Применять «Токены» на практическом примере
  • Проверять «Архитектура компонентов» на практическом примере
  • Сравнивать решения для «Состояния и варианты» на практическом примере
  • Объяснять результат по теме «Доступность» на практическом примере
Программа обучения

Что вы изучите и создадите

Каждый модуль объясняет отдельную тему простыми словами и закрепляет её практикой.

Модуль 1 · Основа

Аудит интерфейсов

«Аудит интерфейсов» простыми словами — это умение собрать фактические данные, отделить симптом от причины и оформить приоритетные выводы. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 2 · Основа

Принципы системы

«Принципы системы» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 3 · Основа

Токены

«Токены» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 4 · Сборка

Архитектура компонентов

«Архитектура компонентов» простыми словами — это умение выделить сущности, границы и связи, затем проверить схему на основном и аварийном сценариях. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 5 · Сборка

Состояния и варианты

«Состояния и варианты» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 6 · Сборка

Доступность

«Доступность» простыми словами — это умение собрать основной пользовательский сценарий и проверить его на узком экране, с клавиатуры и при ошибке. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 7 · Сборка

Темизация

«Темизация» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 8 · Сборка

Документация

«Документация» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 9 · Проверка и усиление

Версионирование

«Версионирование» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 10 · Проверка и усиление

Visual regression

«Visual regression» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 11 · Проверка и усиление

Governance и внедрение

«Governance и внедрение» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Модуль 12 · Защита

Итоговая дизайн-система

«Итоговая дизайн-система» простыми словами — это умение связать смысл страницы с действием пользователя и проверить все состояния интерфейса. Мы превращаем смысл и действия пользователя в интерфейс, который остаётся понятным на любом устройстве.

Результат

версионируемая библиотека компонентов с токенами, документацией и governance

По ходу курса ученик выполняет практические задания, проверяет себя и постепенно готовит итоговую работу.

Что нужно знать до начала

Уметь работать с файлами и браузером. Если курс посвящён отдельной веб-технологии, пригодятся основы HTML, CSS и JavaScript. Курс не вводный: желательно заранее выполнить небольшой проект по этой теме.

Инструменты курса

Figma, design tokens, TypeScript, Storybook, visual tests

Формат

Теория простыми словами, разобранный пример, практика, автопроверка и итоговый проект

Можно начать сразу

Перейдите от программы к практике

Доступ ко всем модулям, автопроверке и сертификату — 22 900 ₽.

Начать обучение →

Ответы на вопросы

Подойдёт ли курс новичку?

Это не вводный курс. Перед началом желательно: Уметь работать с файлами и браузером. Если курс посвящён отдельной веб-технологии, пригодятся основы HTML, CSS и JavaScript. Курс не вводный: желательно заранее выполнить небольшой проект по этой теме..

Как проверяются задания?

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

Когда я получу сертификат?

Именной сертификат освоения основной части программы автоматически выпускается после зачёта 80% модулей. В нём указано, сколько модулей пройдено; обучение можно продолжить до 100%.

Купить за 22 900 ₽