Дизайн сайта в Figma с нуля (Иван Процко)

Полный пошаговый онлайн-курс о том, как работать с программой Figma, создавать дизайн сайтов с нуля без специального образования и навыков. Автор курса — основатель дизайн-студии, работает в веб-дизайне более 13 лет, сотрудничал с такими компаниями, как Vichy, La Roche Posay, Lancome, Garnier, NYC и другими
Курс о том, как
• Работать с программой Figma.
• Работать с готовыми блоками в Figma.
• Проектировать и создавать визуально привлекательные, продающие сайты.
• Работать с текстом, цветом и композицией.
• Создавать коммерческие сайты.
• Делать удобные сайты, которые будут простыми и понятными для пользователя.
• Готовить материалы для публикации на сайте.
• Оценивать свою работу, искать и взаимодействовать с заказчиками, договариваться об оплате и прочее.
Описание
В этом курсе Иван подробно расскажет, как работать в Figma — одной из самых популярных бесплатных графических программ, разберет весь ее инструментарий и принципы его использования.
Пошагово продемонстрирует создание продающих сайтов с нуля или с использованием готовых блоков, делая акцент на удобном пользовательском интерфейсе. Даст базовые знания по сайтостроению и веб-дизайну, покажет, как работать с текстом, цветом, композицией, как создавать коммерческие сайты, адаптивный дизайн, и многое другое.
Отдельный модуль курса посвящен тому, как взаимодействовать с заказчиками, рассчитывать стоимость своих услуг. Эта информация будет актуальной для тех, кто захочет перейти на фриланс и использовать полученный навык как основной или дополнительный вид деятельности.
Информация подается простым языком, все этапы работы с программой наглядно демонстрируются на экране. Курс подойдет как новичкам, так и тем, кто уже работает в веб-дизайне, но хочет углубить свои знания. Для закрепления и отработки полученных навыков по прохождению каждого модуля есть домашние задания. После прохождения курса выдается диплом.
Учебный план
Модуль 1. Введение в профессию.

• Об авторе.
• Ответы на самые часто задаваемые вопросы.
• Какими бывают веб-дизайнеры?
• Основы сайтостроения.
• Проектирование продающего сайта.
• Минимальные системные требования для запуска Figma.

• Как скачать и начать пользоваться Figma?
• Нюансы перед началом работы.
• Копирование файла библиотеки компонентов.
• Настройка содержания блоков.
• Создание сайта из готовых блоков.
• Ввод текста.
• Добавление изображений.
• Оформление блоков и элементов страниц.

• Как скачать программу?
• Как открыть программу?
• Экран недавно просмотренных файлов.
• Поиск файлов.
• Черновики.
• Панель закладок.
• Контекстная панель экрана.
• Техническая поддержка в Figma.
• Создание новой категории.
• Создание нового проекта.
• Создание нового файла в программе.
• Обзор интерфейса.
• Панель инструментов.
• Инструмент перемещения.
• Инструмент масштабирования.
• Создание арт-бордов.
• Фигуры в программе.
• Работа с текстом в программе.

• Копирование, дублирование арт-бордов.
• Создание интерфейсной и колоночной сетки.
• Практика использования инструментов Text и Rectangle.
• Сборка дизайна из готовых компонентов секций.
• Создание блоков и секций сайта с нуля.
• Перенос текста из брифа в макет, добавление изображения.
• Изменения цвета фона секций.
• Уровни цвета, их применение в дизайне.
• Домашняя работа.

• Блочный стиль.
• Сборка секций из деталей.
• Перенос текста из технического задания от клиента.
• Объединение секций с помощью общего фона.
• Создание поисков и векторных изображений.
• Работа с цветом и контрастом.
• Домашнее задание.

• Бесшовный стиль, закономерности его построения.
• Уместный текст.
• Поиск и добавление изображений.
• Бесшовная модульная сетка.
• Пропорции блоков.
• Затемнение текста.
• Домашнее задание.

• Комбинированный стиль.
• Адаптивный и резиновый дизайн.
• Размеры сеток для адаптов.
• Кликабельные элементы и их состояние.
• Таблица состояний.
• Исходные файлы.
• Домашнее задание.

• Оценка стоимости своей работы.
• Как и где искать клиентов?
• Как взаимодействовать с клиентами, договариваться об оплате?