Открыто

[HTML Academy] Онлайн-курс «Дизайн-системы для фронтендеров»

Тема в разделе "Курсы по программированию", создана пользователем pikylbkaNomer, 7 дек 2022.

Цена: 4830р.
Взнос: 338р.-93%

Основной список: 17 участников

Резервный список: 1 участников

  1. 7 дек 2022
    #1
    Топикстартер
    Топикстартер ЧКЧлен клуба
    [HTML Academy] Онлайн-курс «Дизайн-системы для фронтендеров»

    [​IMG]

    Умение выделять систему из дизайна и переносить её в код сокращает время на создание новых частей больших продуктов. Даже на небольших проектах такие системы упрощают процесс разработки и поддержки.
    Раздел 1

    Введение
    Общие сведения о дизайн-системах. Рассмотрим разные типы и свойства дизайн-систем, разберём примеры.

    — Базовые знания по дизайн-системам
    — Тест по разделу
    — Отличие дизайн-систем от UI-китов
    — Плюсы и минусы использования дизайн-систем
    — Основы работы в Figma

    Раздел 2

    Декомпозиция
    Разберём выделение компонентов и научимся работать с токенами.

    — Токены
    — Пошаговая демонстрация: разбираем демо-проект
    — Практика: выделение токенов
    — Кейс: эталонная реализация
    — Промежуточный тест
    — Компоненты и блоки
    — Практика: выделение компонентов
    — Кейс: эталонная реализация
    — Тест по разделу

    Раздел 3

    Техническая реализация
    Перейдём к практике и начнём работать с кодом. Реализуем компоненты.

    — Подготовка
    — Пошаговая демонстрация: разбираем компоненты
    — Практика: токены, текст и шапка
    — Кейс: эталонная реализация
    — Практика: лейаут, подвал, иконки
    — Кейс: эталонная реализация
    — Практика: логотип, поле поиска и кнопка
    — Кейс: эталонная реализация
    — Практика: горизонтальный переключатель, боковая навигация, ссылка
    — Кейс: эталонная реализация
    — Практика: карточка и коллапс
    — Кейс: эталонная реализация
    — Тест по разделу
    — Альтернативные способы организации стилей в проекте

    Раздел 4

    Расширение дизайн-системы
    Научимся работать с изменениями в макетах.

    — Почему происходят изменения и что с этим делать
    — Пошаговая демонстрация: реализация изменений
    — Практическое задание: реализация новых компонентов в дизайн-системе
    — Кейс: эталонная реализация

    Раздел 5

    Дизайн-система и командная работа
    Разберёмся, с кем и как взаимодействует команда дизайн-системы.

    — Принципы организации дизайн-системы
    — Описание и документирование частей дизайн системы
    — Разбор бэклога
    — Тест по разделу

    Раздел 6

    Заключение
    Подведём итоги и закрепим полученные знания.

    — Итоги курса
    — Финальный тест



    Нужен организатор, который сможет выдать материал в удобном html формате как здесь

    Продажник: Скрытая ссылка
     
  2. Последние события

    1. everhard
      everhard не участвует.
      9 мар 2024
    2. everhard
      everhard участвует.
      25 окт 2023
    3. Ivasi
      Ivasi участвует.
      20 окт 2023
    4. lxcphotogweb
      lxcphotogweb участвует.
      16 сен 2023

Поделиться этой страницей