Складчина Каталог
Мои курсы

Основы дизайна и Figma

4 участника
АЛ Автор Антон Ларичев Школа PurpleSchool

О чём курс

Курс «Основы дизайна и Figma» начинается с установки Figma и знакомства с базовыми инструментами, формами и текстом. Вы изучите типографику, теорию цвета и иерархию в веб-дизайне, а затем создадите макет страницы регистрации и landing page.

Чему вы научитесь

  • Создавать макеты в Figma.
  • Разбираться в основах типографики.
  • Понимать основы цветовой теории.
  • Использовать Auto Layout для адаптивных интерфейсов.
  • Работать с иконками и векторными элементами.
  • Использовать принципы атомарного дизайна.
  • Работать с Figma на базовом уровне.
  • Применять правила композиции и контраста.

Об авторе

Антон Ларичев — основатель PurpleSchool и бывший CTO. Он занимается разработкой более 14 лет и работал с JavaScript, TypeScript, Php, Go, C#, Swift и Python. Внедряет гибкие методологии разработки и внутреннее обучение для команд.

Другие авторы

Елена Кострикова — ведущий веб-дизайнер с опытом более пяти лет. Работала над сайтами, лендингами и CRM-системами для бизнеса. В своей работе сочетает удобство, красоту и функциональность и стремится создавать визуальные решения, которые помогают пользователям.

Программа обучения

    1. Введение
    • 1.1 О веб-дизайне
    • 1.2 Как устроен курс
    • 1.3 Обзор проектов
    • 1.4 Обзор курсов
    • 1.5 Знакомство с преподавателем
    • 1.6 Работа на платформе
    • 1.7 AI и тренажёры
    1. Настройка окружения
    • 2.1 Знакомство с Figma
    • 2.2 Регистрация в Figma. Тарифы
    • 2.3 Установка Figma - MacOS
    • 2.4 Установка Figma - Windows
    • 2.5 Установка шрифтов
    1. Основы работы в Figma
    • 3.1 Обзор интерфейса. Часть 1
    • 3.2 Обзор интерфейса. Часть 2
    • 3.3 История версий. Хоткеи
    • 3.4 Frame, группа, секция
    • 3.5 Привязки в Figma
    • 3.6 Страницы. Слои. Поиск
    • 3.7 Булевы операции
    • 3.8 Упражнение - Черновой прототип
    • 3.9 Тест - Основы работы в Figma
    1. Типографика
    • 4.1 Принцип близости
    • 4.2 Инструмент - Текст. Часть 1
    • 4.3 Инструмент - Текст. Часть 2
    • 4.4 Отступы в дизайне
    • 4.5 Вёрстка текста. Часть 1
    • 4.6 Вёрстка текста. Часть 2
    • 4.7 Плагин для работы с текстом
    • 4.8 Упражнение - Отступы
    • 4.9 Упражнение - Вёрстка текста
    • 4.10 Текстовые стили
    • 4.11 Тест по типографике
    1. Работа с цветом
    • 5.1 Основы работы с цветом
    • 5.2 Заливка
    • 5.3 Градиенты
    • 5.4 Работа с изображениями
    • 5.5 Цветовые модели в Figma
    • 5.6 Система для работы с цветом
    • 5.7 Подбор цветовой палитры
    • 5.8 Упражнение - Подбор цвета
    • 5.9 Цветовые стили
    • 5.10 Упражнение - Цветовые стили
    • 5.11 Эффекты
    • 5.12 Тест - Работа с цветом
    1. Auto layout
    • 6.1 Расположение элементов
    • 6.2 Отступы и выравнивание
    • 6.3 Поведение элементов
    • 6.4 Абсолютное позиционирование
    • 6.5 Min и max по высоте и ширине
    • 6.6 Создание списка при помощи
    • 6.7 Инструмент Обводка
    • 6.8 Упражнение - Создание табов
    • 6.9 Упражнение - Создание карточки
    • 6.10 Тест - Auto layout
    1. Работа с иконками
    • 7.1 Формат, виды, основные принципы работы с иконками
    • 7.2 Инструмент Scale
    • 7.3 Упражнение - Создание инпутов и подбор иконок
    • 7.4 Тест - Работа с иконками
    1. Атомарный дизайн
    • 8.1 Определение, основные понятия
    • 8.2 Основные преимущества использования
    • 8.3 Сбор формы
    • 8.4 Тест - Атомарный дизайн
    1. Практический блок
    • 9.1 Дизайн лендинга. Часть 1
    • 9.2 Дизайн лендинга. Часть 2
    • 9.3 Дизайн лендинга. Часть 3
    • 9.4 Дизайн лендинга. Часть 4
    • 9.5 Дизайн лендинга. Часть 5
    • 9.6 Дизайн лендинга. Часть 6
    • 9.7 Дизайн лендинга. Часть 7
    1. Куда двигаться дальше
    • 10.1 Куда двигаться дальше
Складчина создана 1 ноября 2026 г.

Теги курса

Профессии
Веб-дизайнер
Навыки
Веб-дизайнLanding PageFigma
Инструменты
Figma

Другие материалы автора 12

АЛ Антон Ларичев Все материалы
Angular 21 Angular 21 200 ₽ 3 999 ₽ −95%Next.js 14 - с нуля, React TypeScript, Hooks, SSR и CSS Grid 2024 Next.js 14 - с нуля, React TypeScript, Hooks, SSR и CSS Grid 2024 376 ₽ 2 999 ₽ −87%Продвинутый дизайн и Figma Продвинутый дизайн и Figma 1 045 ₽ 3 999 ₽ −74%Telegram-боты на Telegraf.js Telegram-боты на Telegraf.js 0 ₽ Современный Agile для разработчиков Современный Agile для разработчиков 280 ₽ 3 799 ₽ −93%Основы C# Основы C# 653 ₽ 3 999 ₽ −84%Next.js 15 - с нуля, React TypeScript, Hooks, SSR и CSS Grid Next.js 15 - с нуля, React TypeScript, Hooks, SSR и CSS Grid 520 ₽ 3 299 ₽ −84%Основы тестирования ПО Основы тестирования ПО 3 999 ₽ React state менеджер Zustand React state менеджер Zustand 500 ₽ 3 699 ₽ −86%Fullstack разработка Fullstack разработка 3 433 ₽ 26 000 ₽ −87%Основы Golang Основы Golang 3 999 ₽ Продвинутый Golang Продвинутый Golang 3 999 ₽

Ещё интересные курсы 12

Ещё интересные курсы

1 306 ₽ 3 999 ₽