Дизайн сайта в Figma с нуля

4.8 84 участников

Полный пошаговый онлайн-курс о том, как работать с программой Figma, создавать дизайн сайтов с нуля без специального образования и навыков. Автор курса — основатель дизайн-студии, работает в веб-дизайне более 13 лет, сотрудничал с такими компаниями, как Vichy, La Roche Posay, Lancome, Garnier, NYC и другими.

Автор: Процко Иван
Последнее обновление: июль 2021
1490₽ 14900₽ Скидка 90%

Данная цена доступна до: 18 сентября
До конца распродажи: 0:00:00
Бонус: 15 дней бесплатного демо доступа к 160+ курсам EDSTON по саморазвитию
Вернем деньги, если курс не подойдет


Курс о том, как

  • Работать с программой Figma.
  • Работать с готовыми блоками в Figma.
  • Проектировать и создавать визуально привлекательные, продающие сайты.
  • Работать с текстом, цветом и композицией.
  • Создавать коммерческие сайты.
  • Делать удобные сайты, которые будут простыми и понятными для пользователя.
  • Готовить материалы для публикации на сайте.
  • Оценивать свою работу, искать и взаимодействовать с заказчиками, договариваться об оплате и прочее.
Показать еще

Курс включает в себя

101 видеоурок общей продолжительностью 167 минут
PDF-файл с материалами к курсу
Полный доступ без ограничения по времени
Доступ к курсу с мобильного приложения на телефоне, планшета или компьютера

Почему стоит выбрать этот курс?

В этом курсе Иван подробно расскажет, как работать в Figma — одной из самых популярных бесплатных графических программ, разберет весь ее инструментарий и принципы его использования.

Пошагово продемонстрирует создание продающих сайтов с нуля или с использованием готовых блоков, делая акцент на удобном пользовательском интерфейсе. Даст базовые знания по сайтостроению и веб-дизайну, покажет, как работать с текстом, цветом, композицией, как создавать коммерческие сайты, адаптивный дизайн, и многое другое.

Отдельный модуль курса посвящен тому, как взаимодействовать с заказчиками, рассчитывать стоимость своих услуг. Эта информация будет актуальной для тех, кто захочет перейти на фриланс и использовать полученный навык как основной или дополнительный вид деятельности.

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

Показать еще

Учебный план

102 видео уроков
О курсе

Модуль 1. Введение в профессию

Об авторе.

Ответы на вопросы во время курса.

Введение в профессию.

Основы сайтостроения.

Проектирование продающего сайта.

Минимальные системные требования для запуска Figma.

Модуль 2. Практика создания дизайна

Как скачать и начать пользоваться Figma.

Нюансы перед началом работы.

Копирование файла библиотеки компонентов.

Настройка содержания блоков.

Создание сайта из готовых блоков.

Ввод текста.

Добавление изображений.

Оформление блоков и элементов страницы.

Модуль 3. Пошаговая инструкция создания дизайна сайта с нуля

Пошаговая инструкция создания дизайна сайта.

Модуль 4. Справочник Figma

Как скачать программу Figma.

Как открыть программу Figma.

Недавно просмотренные файлы (Recently Viewed) в программе Figma.

Поиск файлов по ключевому слову (Search) в программе Figma.

Черновики (Drafts) в программе Figma.

Панель закладок (Panel of tabs) в программе Figma.

Контекстная панель первого экрана в программе Figma.

Техническая поддержка в программе Figma.

Создание новой команды (New team) в программе Figma.

Создание нового проекта и обзор интерфейса экрана проекта в программе Figma.

Контекстная панель экрана проекта.

Создание нового файла в программе Figma.

Обзор интерфейса редактирования файла в программе Figma.

Панель инструментов в программе Figma.

Перемещение объекта (Move Tool) в программе Figma.

Инструмент масштабирования (Scale Tool) в программе Figma.

Создание арт-борда (Frame Tool) в программе Figma.

Срез (Slice Tool) в программе Figma.

Фигуры в программе Figma.

Прямоугольник (Rectangle Tool) в программе Figma.

Текст (Text Tool) в программе Figma.

Панель свойств в программе Figma.

Свойства текста в программе Figma.

Модуль 5. Теория и практика веб-дизайна. Часть 1

Копирование, дублирование, переименование файла и создание арт борда.

Создание интерфейсной и колоночной сетки.

Практика использования инструментов Text и Rectangle.

Сборка дизайна из готовых компонентов секций.

Создание блоков и секций сайта с нуля.

Перенос текста из брифа в макет.

Добавление изображений в макет.

Изменение цвета фона секций.

Уровни цвета и их применение в дизайне.

Инверсия цвета.

Самостоятельное задание. Создание цветового оформления и блоков сайта с нуля.

Самостоятельное задание. Создание проекта для портфолио в свободном стиле.

Модуль 6. Теория и практика веб-дизайна. Часть 2

Блочный стиль.

Сборка секций из деталей.

Рисуем блок «Захват внимания».

Создание секции «Список товаров».

Создание блока «Контактов» и «Карты проезда».

Перенос текста из ТЗ от клиента.

Объединение секций по смыслу с помощью общего фона.

Создание и поиск векторных изображений.

Поиск, копирование и вставка растровых изображений.

Контраст по цвету.

Контраст светлого и темного, а также монохромная палитра.

Контраст противоположных цветов.

Скругления углов.

Подкрашивание темного и светлого, оттенки для текста, цвет фона карточек товаров.

Самостоятельная работа. Оформление в «детском» стиле.

Самостоятельная работа. Перерисовка элементов дизайна.

Модуль 7. Теория и практика веб-дизайна. Часть 3

Пошаговая инструкция создания дизайна сайта.

Бесшовный стиль.

Сборка из секций выполненных в бесшовном стиле.

Уместный текст.

Поиск и добавление изображений.

Бесшовная сетка.

Модульная сетка.

Пропорции блоков.

Окраска разделяющих линий и стили для свойств.

Затемнение текста.

Контраст холодного и теплого.

Самостоятельная работа. Повторение эталона бесшовного стиля.

Самостоятельная работа. Оформление дизайна в легком стиле.

Самостоятельная работа Иная сфера деятельности.

Модуль 8. Теория и практика веб-дизайна. Часть 4

Комбинированный стиль.

Адаптивный и резиновый дизайн.

Резиновый компонент.

Размеры сеток для адаптов.

Первый экран и подкат.

Сетка для Desktop+.

Адапт Desktop+.

Сетка для Tablet.

Адапт для Tablet.

Сетка для Smartphone.

Адапт для Smartphone.

Состояния элементов.

Состояния компонентов.

Инлей и Оверлей.

Таблица состояний.

Исходные файлы.

Самостоятельная работа. Повторение материала.

Самостоятельная работа. Портфолио Минимум.

Самостоятельная работа. Портфолио Медиум.

Самостоятельная работа. Портфолио Максимум.

Модуль 9. Как работать с заказчиками?

Оценка стоимости услуг и оплата работы.

Автор курса:
Процко Иван

  • Более 13 лет работы в веб-дизайне.
  • Основатель дизайн-астудии «Hiiro».
  • Создал сотни дизайн-проектов, сотрудничал с более 30 дизайн-студиями России.
  • Работал с такими брендами, как Vichy, La Roche Posay, Lancome, Garnier, NYC и другими.
  • Автор образовательных курсов по дизайну.
Показать еще

Вернем деньги,
если курс не подойдет

Вы ничем не рискуете. Если курс не оправдает ваши ожидания в первые два дня после покупки, мы вернем полную стоимость на карту без выяснения причин. Просто напишите в поддержку на hello@edston.com

После оплаты вы сразу можете начать заниматься

  • Нажмите кнопку "Начать заниматься", введите ваш email в поле и вы перейдете на безопасную страницу оформления заказа

  • Завершите оформление заказа и вы моментально получите пароль для доступа в личный кабинет EDSTON

  • Скачайте приложение EDSTON в App Store или Google Play чтобы удобно заниматься в любое время и в любом месте

  • Проходите уроки, выполняете практические задания, задаете вопросы автору и открываете для себя новые курсы


Проходите курсы на телефоне, компьютере или планшете

В браузере или мобильном приложении

Получите полный доступ
к курсу со скидкой

1490₽ 14900₽ Скидка 90%

Данная цена доступна до: 18 сентября
До конца распродажи: 0:00:00
Бонус: 15 дней бесплатного демо доступа к 160+ курсам EDSTON по саморазвитию
Вернем деньги, если курс не подойдет


Ответы на часто задаваемые вопросы

Навсегда. Можете не торопиться и проходить уроки в комфортном для вас темпе и в удобное время.

Курс состоит из записанных видеоуроков. После регистрации и оплаты вам на почту придёт доступ в личный кабинет. Вы сразу можете приступать к обучению или сделать это тогда, когда у вас появится время.

После оплаты и регистрации вам на почту придёт письмо с ссылкой доступа и паролем для входа в личный кабинет, где уже будут находиться все материалы курса.

Курс можно оплатить абсолютно любой банковской картой Visa, MasterCard, Maestro, Visa Electron, Мир. Также с помощью Google Pay или Apple Pay в нашем бесплатном мобильном приложении

Наша платежная система принимает карты любого банка любой страны.

Да. Для этого, при регистрации на курс, укажите адрес электронной почты человека, которому предназначен подарок. Ему на почту придет письмо для авторизации и входа в личный кабинет.

Да, можно. Вы ничем не рискуете. Если курс не оправдает ваши ожидания в первые два дня после покупки, мы вернем полную стоимость на карту без выяснения причин. Просто напишите в поддержку на hello@edston.com

1490₽
14900₽