«Веб дизайн в Figma - Продвинутый уровень | Самостоятельный курс (2025) [stepik]» [Дмитрий Фокеев]

Освойте правила современного веб-дизайна и создавайте профессиональные макеты в Figma. (Бонус: использование нейросетей в дизайне) Чему вы научитесь Научитесь создавать современные и стильные макеты сайтов Изучите десятки правил современного веб-дизайна Научитесь применять правила веб-дизайна на практике в реальных задачах Научитесь строить сетки и направляющие для структуры макета Научитесь настраивать отступы, ритм и визуальный порядок в макете Изучите методы работы с типографикой Изучите правила композиции в веб-дизайне Научитесь создавать аккуратные и модульные композиции Изучите методы работы с цветом: палитры, контраст, акценты Научитесь использовать тени, скругления и эффекты корректно и профессионально Изучите правила консистентного дизайна Научитесь анализировать дизайн логически и находить ошибки Научитесь развивать насмотренность и работать с референсами Научитесь создавать оригинальные концепции сайтов с нуля Научитесь применять ИИ Midjourney и Adobe Firefly в веб-дизайне Создадите 2 проекта для портфолио Для кого этот курс Для начинающих веб-дизайнеров Для тех, кто изучил основы программы Figma, но хочет улучшить дизайн своих работ Для веб-разработчиков Начальные требования Необходимы базовые знания программы Figma (Знание программы Figma) Цвет Проблема подхода 60·30·10 Как создавать цветовую шкалу Создаем шкалу на практике Правило 60·30·10 и шкала цвета Необязательно использовать только 3 цвета Используйте системные цвета Используйте холодный или теплы серый Цветовые ассоциации Как использовать градиент в дизайне Пара советов по работе с цветом ИИ Цвет Практика # 4 — Примените цвет к макету Практика # 4 — Выполненная ч.1 Практика # 4 — Выполненная ч.2 Изображения Как размещать текст на изображениях Какие изображения использовать Как работать с иконками Как использовать скриншоты в дизайне Искусственный интеллект в изображениях Про ИИ-изображения Функционал и цены на ИИ Удаление заднего фона с помощью ИИ Удаление объектов с помощью ИИ Расширение границ изображений с помощью ИИ Увеличение разрешения изображения с помощью ИИ Редактирование изображений с помощью ИИ Гармонизация изображений с помощью ИИ Генерация изображений Дополнительные возможности ИИ Тени О тенях Техники и приемы работы с тенями Практика # 5 — Применяем эффекты теней правильно Мобильный дизайн Особенности мобильного дизайна Размер текста на мобильных устройствах Размеры и выравнивание элементов Практика # 6 — Адаптируйте первый проект Практика # 6 — Выполненная ч. 1 Практика # 6 — Выполненная ч. 2 Практика # 6 — Выполненная ч. 3 Визуальные приемы в дизайне О визуальных приёмах Полезные ресурсы для веб-дизайнеров Второй проект – Редизайн сайта Обзор и задачи проекта Подготовка и поиск референсов Создаём Hero Section Создаем навигационное меню Создаем декоративные линии Создаем вторую секцию сайта, ч. 1 Создаем вторую секцию сайта, ч. 2 Создаем третью секцию сайта Создаем четвертую секцию сайта Создаем форму для сайта Создаем footer для сайта Завершаем сайт Заключение Тест для получения сертификата