Мир 1 / Зона новичка
Практический курс по созданию UI-компонентов и дизайн-системы для React Native: buttons, badges, cards, progress, states и финальный UI Kit. Пройди уроки, чтобы открыть следующую зону. Финальный босс-проект ждет в конце мира.
Лес интерфейсов учит строить читаемые экраны, навигацию и аккуратные reusable components.
Проводник: Layout Scout
Навык-награда: UI pathfinding
Задача: Проходи уроки, решай задачи, забирай XP и открывай следующий участок карты.
Бесплатный квест
0 / 12 уроков
Статус
Мир
Время
Карта
Уроки
Войдите, чтобы сохранять прогресс и XP.
Цель мира: Собрать маршрут экранов, который не разваливается на мобильных размерах.
Собираемый навык: UI pathfinding
/course-assets/lessons/ui-components/design-tokens.svg
Практические уроки по UI-компонентам без шаблонных заглушек.
Зона 1: Tokens, buttons и badges. Закрой миссии внутри зоны, чтобы зарядить путь к следующему региону.
Миссия 1
Миссия 1: Design tokens: цвета и отступы. Прочитай briefing, реши практику и забери XP.
Миссия 1: Design tokens: цвета и отступы. Прочитай briefing, реши практику и забери XP.
Миссия 2: Button variants: primary и secondary. Прочитай briefing, реши практику и забери XP.
Миссия 3: Badge component: FREE, PRO, NEW. Прочитай briefing, реши практику и забери XP.
/course-assets/lessons/ui-components/stat-card.svg
Практические уроки по UI-компонентам без шаблонных заглушек.
Зона 2: Карточки и progress. Закрой миссии внутри зоны, чтобы зарядить путь к следующему региону.
Миссия 4: StatCard: карточка метрики. Прочитай briefing, реши практику и забери XP.
Миссия 5: ProgressBar: прогресс курса. Прочитай briefing, реши практику и забери XP.
Миссия 6: CourseCard UI: карточка курса. Прочитай briefing, реши практику и забери XP.
/course-assets/lessons/ui-components/empty-state-component.svg
Практические уроки по UI-компонентам без шаблонных заглушек.
Зона 3: Состояния интерфейса. Закрой миссии внутри зоны, чтобы зарядить путь к следующему региону.
Миссия 7: EmptyState: пустое состояние. Прочитай briefing, реши практику и забери XP.
Миссия 8: Loading и Error states. Прочитай briefing, реши практику и забери XP.
Миссия 9: Skeleton card. Прочитай briefing, реши практику и забери XP.
Миссия 10: NoticeCard: info/warning/error. Прочитай briefing, реши практику и забери XP.
Босс-уровень
Практические уроки по UI-компонентам без шаблонных заглушек.
Босс-зона: Композиция и финальный UI Kit. Здесь знания собираются в финальный квест и портфолио-доказательство. Финальный босс-проект.
Босс-миссия: SegmentedControl: tabs-переключатель. Собери все паттерны зоны в один финальный результат. Собрать маршрут экранов, который не разваливается на мобильных размерах.
Босс-миссия: Финальный проект: UI Kit screen. Собери все паттерны зоны в один финальный результат. Собрать маршрут экранов, который не разваливается на мобильных размерах.
