Zебра
Организатор
- #1
[Udemy] Веб дизайн в Figma 2022 - с нуля до результата, основы UX/UI [Дмитрий Фокеев]
- Ссылка на картинку
Привет!Меня зовут Дима и это курс по веб дизайну в Figma, с нуля до результата!
Если вы давно искали что то интересное по веб дизайну, добро пожаловать!)
Этот курс для абсолютных новичков в дизайне, по этому вам не нужно обладать какими либо знаниями для прохождения данного курса!
Вместе, вы и я, пройдем путь - от установки программы Figma до уровня UI дизайнера, который уверенно может брать заказы на фриланс и гордиться своей работой!
Мы начнем с самых основ и вместе, шаг за шагом изучим все необходимые инструменты Figma, так, что в конце курса, вы будете чувствовать себя профессионалом!
Мы станем профи в подборе цвета, научимся сочетать на нашем сайте любую картинку с фоном и конечно же научимся подбирать красивые комплементарные цвета для любых элементов на нашем сайте, как настоящие профи колористы!
Изучим множество трюков по работе с изображениями, такими как экстримальная обрезка, мягкая обрезка, работа с контрастностью фото и тем какое изображение лучше выбрать для вашего сайта! И конечно узнаем много мест, где вы сможете найти идеальное фото, для вашей работы!
Конечно, мы изучим все что необходимо знать о работе со шрифтами, начиная от мест где вы найдете лучшие шрифты до их установки! И конечно в конце курса, у вас исчезнет вопрос, какой же шрифт лучше подобрать для вашего сайта!
Мы научимся использовать пустое пространство в свою пользу, работать с контрастом, профессионально накладывать изображения друг на друга, изучим тонкости и правила в веб дизайне и много многое другое!
Этот курс направлен в первую очередь на развитие навыков User Interfaces дизайнера, но конечно, в курсе мы коснемся обеих сторон профессии как UX – User Expirience так и UI - User Interfaces
В этом курсе сделан большой акцент на практику! В каждом, небольшом уроке, без лишней болтовни, мы будем шаг за шагом создавать
2 красивых, уникальных проекта, которые, вы сможете использовать в своем портфолио – web дизайнера.
Поэтому вы можете забыть про скучные уроки, где просто перечисляют какой инструмент, как называется!
И конечно, мы узнаем как адаптировать их под разные, мобильные версии сайта, как анимировать каждый элемент макета и даже научимся создавать красивые слайдеры и красивую анимацию счетчика прямо в figma! Поверьте, скучно не будет!
Дополнительно, мы поговорим о том, как договариваться с заказчиком, как развиваться в дизайне, где искать идеи, как создавать оригинальные творческие работы, как наработать свой стиль и узнаем множество мест, где дизайнеры и художники находят вдохновение!
Ну и куда же без бонусов и приятных плюшек!)
Вы конечно же, не станете профи, без минимальных знаний по обработке изображений! И именно по этому, бонусом, в этом курсе, будет блок, где мы научимся всем необходимым знаниям по работе в photoshop.
Мы научимся вырезать человека из одного изображения и помещать его в другое, сможем удалять ненужное из изображений, увеличивать фон наших изображений и узнаем пару эффективных трюков по работе в photoshop!
И если у вас еще остались сомнения, этот курс предоставляет возможность вернуть деньги потраченные на него, в течении 30 дней, без каких либо вопросов!
Загляните ко мне в инстаграм, там вы найдете всю необходимую информацию о моих курсах и спец предложениях!
Присоединяйтесь ко мне и мы вместе начнем создавать, прекрасный дизайн, в figma!
До встречи на уроках!
Для кого этот курс:
- Для начинающих дизайнеров, верстальщиков, веб-программистов, творческих людей!
- Для тех кто любит изучать новое!
- Вы изучите все инструменты Figma
- Вы изучите современные техники и приемы дизайна
- Вы научитесь азам Photoshop
- Вы узнаете больше про профессии UX UI дизайнер
- Вы научитесь работать с изображениями в Figma
- Вы научитесь подбирать правильные цвета для ваших сайтов
- Вы научитесь подбирать правильные шрифты для ваших сайтов
- Вы узнаете как работать с контрастом на веб страницах
- Вы научитесь управлять пустым пространством на веб страницах
- Вы научитесь сочетать элементы на веб страницах
- Вы узнаете что такое адаптивный дизайн
- Вы научитесь адаптировать под любое мобильное устройство, любой сайт
- Вы поймете как договариваться с заказчиком
- Вы узнаете как составлять бриф с заказчиком
- Вы научитесь создавать Wireframes
- Вы узнаете как ускорить вашу работу в Figma
- Вы научитесь техникам обрезки изображений
- Вы научитесь удалять ненужные элементы из изображений в Photoshop
- Вы научитесь расширять границы изображений в Photoshop
- Вы научитесь вырезать человека из одного изображения и вставлять в другое
- Просто работающий компьютер
Программа курса:
Общая продолжительность 13 ч 42 мин
01. Введение
- Вступление
- Немного технических вопросов
- Скачиваем Figma и материалы для работы с курсом
- Оставайтесь со мной на связи
- Создаем первый макет, узнаем размеры сайта
- Что такое Grid система. Работа с направляющими сетками
- Немного про "Wareframe" или "каркас сайта"
- Основы работы с изображениями
- Базовая работа с текстом
- Работа с иерархией элементов в документе
- Что такое UX и UI
- Как заимствовать цвет из изображений
- Практика: как подбирать цвет из изображений
- Углубленная работа с цветом + HSB
- Дополнительные ресурсы работы с цветом + углубленная работа с фигурами
- Как использовать градиент
- Где искать вдохновение и как заимствовать цвета у других дизайнеров
- Как увеличить контрастность фото
- Как на практике тонировать и затемнять фото
- Техника экстремальной обрезки изображений
- Техника мягкой обрезки изображений
- Практика по мягкой обрезке
- Удаляйте лишний фон
- Подбирайте классные фото
- Как работать с иконками
- Как создать собственную иконку
- Создаем кнопку и работаем с эффектами
- Разбираемся с форматами изображений
- Углубленная работа с текстом
- Почему шрифты это важно
- Главные типы шрифтов
- Где искать шрифты - 1
- Где искать шрифты - 2
- Рыбный текст + установка плагинов
- Практика по поиску шрифтов
- Как использовать в дизайне настройку шрифтов
- Создаем лист со стилями сайта
- ТЕХНИЧЕСКОЕ ВИДЕО: Продолжаем создавать макет
- Как работать с масками слоя
- Как работать с линиями
- Практика по работе с пером
- Доделываем сайт портфолио
- Трюки с наложением элементов друг на друга
- Одинаковые элементы на странице
- Трюки с повторениями
- Трюки с контрастом
- Трюки с пустым пространством
- Как развиваться в дизайне
- Пара слов и продолжаем!
- Бриф с заказчиком
- Создаем Mood Board
- Как делиться проектом
- Что такое Figma Jam
- Недавние обновления Figma Jam
- Создаем Wireframe нового проекта ч.1
- Создаем Wireframe нового проекта ч.2
- Создаем Wireframe нового проекта ч.3
- Создайте wireframe
- Constraints + grid
- Различие между фреймами и группами
- Применяем Constraints к макету портфолио
- Практика: Constraints на макете портфолио
- Как работать с компонентами
- Как работать с Auto lay out
- Предисловие к блоку
- Стилизуем макет ч.1
- Стилизуем макет ч.2
- Подбираем шрифты
- Стилизуем макет ч.3
- Стилизуем макет ч.4
- Практика: Стилизуем оставшиеся 2 страницы сайта
- Теория адаптивного дизайна
- Адаптивный дизайн под планшет ч.1
- Адаптивный дизайн блога ч.2
- Горячие клавиши
- Как создать компоненты с помощью плагинов
- Быстрый адаптив
- Полезные плагины
- Практика: Ускоряемся в создании мобильной версии сайта
- Основы прототипирования
- Углубленные настройки прототипирования
- Анимируем подсказку
- Анимируем мобильную версию меню
- Анимируем кнопки
- Анимируем ручной слайдер
- Анимируем автоматический слайдер
- Анимируем красивый счетчик с помощью "смарт анимации"
- Как взаимодействуют прототипы с компонентами
- Variants в компонентах
- Разница между платной и бесплатной версией программы Figma
- Как работать с Библиотеками
- Экспорт файлов из Figma
- Передача в разработку
- Подготовка программы
- Работа со слоями в Photoshop
- Расширяем границы изображений
- Удаляем ненужное из фото
- Как вырезать человека из одного фото и вставить его в другое
- Как работают маски в фотошоп
- Экспорт файлов из фотошоп
- Что дальше?
- До свидания!
Зарегистрируйтесь
, чтобы посмотреть скрытый авторский контент.