Figma с нуля до котика | Урок для начинающих дизайнеров

Видеоурок по работе с программой Figma для начинающих. Обучение в Фигме с 0.
Основы веб (UI/UX) дизайна!
В этом видео Ксюша Есипова, спикер марафонов и курса по веб-дизайну от Логомашины, рассказывает, как пользоваться основными инструментами программы Figma. Урок отлично подойдёт тем, кто ни разу не открывал эту программу или графические редакторы в целом.
Подготовим открытку для инстаграмм, с котиком, текстом и фотографией.
за 30 минут.
Будем использовать инструменты фигмы. Просто повторяй за экспертом на видео и у тебя все получится!
Ссылка на регистрацию на день рождения Логомашины в июне, с подарками для дизайнеров в телеграм
salebot.site/lmbirthday_1?utm...
Ссылка на установку Figma: www.figma.com/downloads/
В этом видео я покажу вам основные шаги, которые нужно предпринять, чтобы начать работать с Figma. Мы рассмотрим все ключевые аспекты, которые помогут вам создавать красивые и профессиональные макеты. Вот что мы будем изучать:
Установка и настройка Figma: Я покажу вам, как скачать и установить Figma на ваш компьютер, а также поделюсь некоторыми полезными настройками, которые помогут вам повысить эффективность работы.
Интерфейс и инструменты: Разберем основные элементы интерфейса Figma и функциональность каждого инструмента. Вы узнаете, как использовать слои, группировку, выравнивание, инструменты рисования и многое другое.
Работа с макетами: Я продемонстрирую вам, как создавать и управлять макетами в Figma. Вы узнаете о сетках, направляющих, масштабировании и адаптивности, чтобы создавать удобные и гибкие дизайны.
Совместная работа: В Figma вы можете совместно работать с другими дизайнерами и командами. Я расскажу вам о функциях совместной работы и совместного редактирования, чтобы вы могли легко делиться своими проектами и получать обратную связь.
Интеграции и плагины: Figma предлагает широкий спектр интеграций и плагинов, которые могут улучшить ваш опыт работы. Я покажу вам некоторые полезные инструменты, которые помогут вам ускорить и улучшить ваш рабочий процесс.
Это только некоторые из ключевых тем, которые мы рассмотрим в этом видео. Независимо от того, являетесь ли вы начинающим дизайнером или хотите узнать больше о Figma, я уверен, что вам понравится и найдете много полезной информации в этом видео.
Не забудьте подписаться на мой канал, чтобы получать больше интересных видео о дизайне и современных инструментах. Благодарю вас за просмотр, и до скорой встречи в следующем видео!
---
01:00 Вводный урок по фигме
04:20 Создаем фрейм
06:40 Рисуем котика
22:20 Готовим фон фрейма
22:45 Готовим текст
28:50 Вставляем фотографию
37:30 Экспорт подготовленного поста

[@karina-db2qd]

Как классно и доступно для новичка, кажется, прямо сейчас пойду и всё сходу идеально сделаю😆 Было очень приятно вас слушать)

[@ffff-nx3wy]

Девушка-преподаватель молодец

[@user-hn7dz8rv9q]

Спасибо большое , очень полезное видео )Жду не дождусь следующего ))))

[@user-zg7hw8gr6d]

Огромное СПАСИБО! Я все поняла и сделала открыточку. Сама бы не справилась.... Тыкалась, тыкалась и бросила это дело. Вы мне очень помогли !

[@elenachudakova9578]

Большущее спасибо! Суперский урок! Все понятно)

[@user-me8ql4zy4t]

Спасибо за урок! всё очень доступно и понятно

[@rhamep]

Спасибо! Теперь можно спокойно понаделывать открыток на любой праздник!

[@natashalukadea-t1941]

Очень хороший урок, спикер прекрасно рассказывает😍

[@flo_werart243]

Клааас! Давайте еще подобное по фигме )))

[@user-fj3or6cb8j]

Какая прелесть!!! Спасибо!!!

[@user-vm9eb1dh2v]

Спасибо! Отличный урок! Все понятно.

[@user-qh5fr3yo1w]

Ну просто супер. Я очарован. Так просто рассказать о figma.

[@user-nq7lz3wv2p]

Спасибо за урок.хорошее обьяснение.все понятно

[@dyrnayadama]

Спасибо за урок! Немножко тупила, но так всё поняла и сделала милую открытку с коричневым котиком и оранжевым градиентом.

[@scvirtix]

о спасибо, как раз хотел начать работать в фигме

[@allasosnina8341]

Спасибо все доходчиво и лаконично

[@juliamail5276]

Спасибо, Ксюша )) 👍

[@user-cp3ue3ym2c]

спасибо, очень доступно объяснили

[@lena_robot]

Очень понятно и интересно! Спасибо большое! ❤

[@user-qd2zf4ts3q]

Спасибо!!!💜

[@daria_stroganova_]

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

[@Brillen00]

Большое спасибо! Это лучший урок по Figma для новичков

[@user-xx6st4of2p]

Мне нравится, что сразу практика, обожаю!!

[@lyubanyashka]

Огромное спасибо за видео! У меня получилось нарисовать котика и вышло так удачно, что я сделала из него стикер в телеграме, которым теперь пользуются друзья! Подскажите, а как научиться создавать картинки самостоятельно, а не по образцу? Срисовать у меня теперь получится, но хотелось бы научиться придумывать самой

[@loksyka]

Не поняла как выделять два элемента, чтобы после объединить их в группу.

[@user-my1wd3py9q]

Святая женщина, спасибо огромное 😅😅😅😅

[@user-bk3ow8te7k]

Спасибо за урок, за вдохновение и полезные советы.

[@user-jh1up3um6r]

Скажите, пожалуйста в этом приложении бесплатный доступ не ограничен?

[@Galla_Grattage]

Меня одну все занятие оставшиеся напрягало Учитья вместо УчитьСя?

[@mycherry5050]

Здравствуйте, спасибо большое за урок! Не совсем поняла откуда сердечко взялось, а потом когда фиолетовый круг вставляла в рамку, текст «все получится» почему то остался на белом фоне…. 👩‍💻

[@kseniaes]

Сердечко я просто скопировала из телеграмма, это просто смайлик:) Про фон белый под текстом - проверь, что у тебя нет заливки у прямоугольника, который вокруг него! Скорее всего там белый остался!

[@user-ig9bi7yo5e]

А почему у меня фигма по-другому выглядит ничего не понятно?

[@nati_nati8]

Сколько популярных преподавателей UX UI пересмотрела - вы понятнее всех объясняет. Спасибо! Скажите, а как линейку (разметку) файла сделать, как у вас на экране?

[@user-im8ef5kh8b]

Вы разобрались с вопросом?

[@user-if6dq8lc8h]

Я люблю Марету

[@user-lk8so6lw4s]

Почему у меня не получается вставить это сердееечкооо, уже откуда только не копировала его??((

[@oksanapodolskaya9618]

Спасибо огромное ,Ксюша ,вы очень хороший учитель! Я смогла всё, кроме ,как поставить сердечко в один слой с надписью)))

[@SmachnayaASS]

21:08 - cat is finished !

[@Anya-Forger_]

Спасибо посмотрела , посмеялась. С таким простым и и легким приложением справится 10ти летний ребенок.

[@arishadeen8385]

Крутое объяснение. Жаль что фигма не на русском. Быстрее бы можно было разобраться самому))

[@nosn0w]

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

[@idkwidi7467]

возможно уже поздно, но все равно отвечу, нужно в настройках фрейма в панели справа нажать галочку рядом с "Clip content", таким образом элемент скроется за границами фрейма :)

[@Elena-wu1sg]

ребят, я не знаю объясняется ли это дальше по ходу видоса, но кто так же задался вопросом о том как быстро менять зум ctrl + колесико мышки (на винде))

[@user-qb5yn5pu9w]

Ещё ctrl "+" и ctrl "-"

[@Lemoony14]

Как выделить 2 элемента без объединения их мышкой? Когда я нажимаю Ctrl + G у меня сразу создается группа с одним элементом, а 2 выделить никак не выходит

[@irina_kkk]

Вариантов несколько. Можно зажать shift и выбрать нужные элементы в панели слоев. Второй вариант - зажать shift и кликнуть на два нужных элемента во фрейме. А дальше уже объединять в группу. Кстати, таким же образом можно и перемещать несколько элементов одновременно

[@Vika-sq7gj]

Здравствуйте я Вика интересное видио

[@user-iv9hu5zz8o]

А что делать, когда просит подписку? Выбрать start for free?

[@smmemshica]

Да

[@user-su7ou4oy1n]

Здравствуйте! Скажите, пожалуйста, почему текст не получается вставить? Кликаю внутри, и ничего. Я час сидела над этим🤦😥

[@user-im8ef5kh8b]

Разобрались?

[@user-qh5fr3yo1w]

Скорее всего он у вас скрыт верхним слоем. Поднимите слой с текстом наверх.

[@r_guliaev]

Название нереально умилительное🥺

[@user-tq5rt4wv2j]

как объединили усики я не поняла, так же, как и объединили лапки

[@illustriel]

группировка усов ctrl+g а сложить -сверху посредине два квадрата и там Union Selection

[@Lemoony14]

@@illustriel у меня на ctrl+g сразу создается группа из 1 усика, как выделить 2?

[@Sabinaa158]

У меня вообще не получается найти создать картинку

[@user-sf5ex2pb7j]

я не поняла как копировать объекты 😢

[@illustriel]

с кнопкой альт

[@FAKKER_rap]

Анимация там же делается?

[@kseniaes]

Какие-то базовые анимации можно настроить в фигме, через прототипирование. И есть плагины, которые помогают делать прямо посложнее штуки! Но вообще для анимации используют другие программы, где больше возможностей ( например, After Effects)

[@Spiritwsk]

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

[@user-qh5fr3yo1w]

@@kseniaes Хорошая вещь Афтер, но у меня анимация персонажа не получилось.

[@xxx_qyqx_xxx]

Я так и не поняла как зарегаться..(

[@stels_karl]

найс урок

[@and3499]

кто тоже с интенсива?

[@Aya_artsunais]

тоже не понимаю как вставить сердечко в текст😭

[@user-yv8fr9nw1x]

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

[@user-qh5fr3yo1w]

Нормально всё рассказывает. Есть такой термин. Учись играючи. Вот так она и учит.

[@user-qw2lt9ol1i]

Не обзывайте мою Мию