Figma Components

Let's talk about components in Figma. We will go from simple things to complex: what are the components and why they are needed, how to create and edit them, what attributes we can change at the instances, how to use the components in real work, etc.. The topic is big and very important, so the video turned out to be voluminous :)

Пікірлер: 161

  • @arturshelaev9556
    @arturshelaev95564 жыл бұрын

    без сомнений это самое топовое видео по компонентам в русскоязычном сегменте ютуба.

  • @vvasilyev11
    @vvasilyev115 жыл бұрын

    Спасибо что вышел за рамки, показал как можно с этим работать. А то у большинства в тутроиалах только вода про компоненты

  • @IsHardynafthardynaft

    @IsHardynafthardynaft

    3 жыл бұрын

    А у них и в голове вода. Делают уроки для количества. Влоххеры бля))

  • @radistelectric6216
    @radistelectric62164 жыл бұрын

    Супер! Я с десяток видео посмотрел, чтобы найти как заменять изображение в компонентах, а нашёл толковое объяснение только здесь! Переделал свой собственный проект по этому уроку, и всё отлично получилось.Огромное спасибо автору!

  • @cifratura
    @cifratura5 жыл бұрын

    Я посмотрел 13 видео до этого и только в этом понял ценность компонентов! Очень круто!

  • @mariamat4907
    @mariamat49075 жыл бұрын

    Первое действительно полезное видео из подобных! Спасибо!

  • @narinehvardumyan3219
    @narinehvardumyan32193 жыл бұрын

    Я просто в восторге от вашей подачи. Смотрю и улыбаюсь))

  • @NataliaGold92
    @NataliaGold923 жыл бұрын

    Большое спасибо за ваш труд. Прекрасные видео и все сразу становится понятно.

  • @user-gx3io6sb6q
    @user-gx3io6sb6q3 жыл бұрын

    Самые крутые уроки. Понятно про компоненты сразу все стало! Спасибо огромное!

  • @ihorvorobiov
    @ihorvorobiov4 жыл бұрын

    Спасибо большое за годный урок! Доступное объяснение материала и живой пример - отличное сочетание. Так держать)

  • @ksenya7793
    @ksenya77933 жыл бұрын

    Нашла ваше видео и наконец разобралась с компонентами. Огромное спасибо, за такой качественный контент!))) Лучшее видео по компонентам.)

  • @user-tl1rv4jh1v
    @user-tl1rv4jh1v3 жыл бұрын

    Огромное спасибо! Очень подробно разжевано. Привел отличные практические примеры. Я в восторге от урока!

  • @libertyanka
    @libertyanka5 жыл бұрын

    ура, наконец-то что-то дельное по компонентам, спасибо большое!)

  • @pavelzharko7116
    @pavelzharko71165 жыл бұрын

    Нашел то, что искал! Спасибо тебе :)

  • @GeknForever
    @GeknForever4 жыл бұрын

    Лучший урок! Авторитетно заявляю это как уберчайник. Очень понравилось.

  • @user-ch8oz1yq3l
    @user-ch8oz1yq3l4 жыл бұрын

    Отличное видео, наконец-то дошло до меня , как работать с компонентами. Спасибо))

  • @igorstocky2228
    @igorstocky22284 жыл бұрын

    У Вас талант преподавания! Спасибо! Очень полезная информация.

  • @Aegiro_07
    @Aegiro_074 жыл бұрын

    Большое спасибо за прекраснейший контент, продолжай в том же духе!!)

  • @nataliiaalbul9625
    @nataliiaalbul96254 жыл бұрын

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

  • @disarto.digital

    @disarto.digital

    4 жыл бұрын

    Рад слышать :)

  • @rovsheneyubov1539
    @rovsheneyubov15395 жыл бұрын

    полезный урок и без воды )) Спасибо

  • @ennhomenko
    @ennhomenko4 жыл бұрын

    Исчерпывающе, спасибо на добром слове!

  • @user-yo7yf1pf9n
    @user-yo7yf1pf9n4 жыл бұрын

    да!да!да!)я Вас люблю и уважаю с первой секунды этого урока- просто начать с того, о чем сказано в заголовке,и слушатели счастливы.спасибо за урок,очень круто.не исчезайте пожалуйста)

  • @diekunstUA
    @diekunstUA5 жыл бұрын

    с удовльствием посмотрел видео- полезно. спасибо

  • @viktoriya-photo
    @viktoriya-photo2 жыл бұрын

    Хочу присоединиться ко всем комментариям) прекрасное объяснение!! Спасибо вам огромное🤗

  • @Drampam
    @Drampam3 жыл бұрын

    Безумно крутой стиль у вас и урок полезный!

  • @manikawow5866
    @manikawow58664 жыл бұрын

    Спасибо за урок, все четко, понятно и приятно слушать

  • @big_papa_Joe
    @big_papa_Joe3 жыл бұрын

    Спасибо, автор! Приятно смотреть, приятно слушать. Контент топ. Лайк, подписка.

  • @zairahajiyeva4511
    @zairahajiyeva45113 жыл бұрын

    Вы просто разложили все по полочкам! Спасибо!

  • @DKniazeff
    @DKniazeff4 жыл бұрын

    Наконец кто-то доступно разжевал. Спасибо!

  • @wonderfulworld8667
    @wonderfulworld8667 Жыл бұрын

    Спасибо, все просто и понятно! Давно работаю в фигме, но через костыли ctrl+c > ctrl+v, но пришла серьезная задача, где такой механикой не обойтись, поэтому улучшаю знания, и ваше видео просто топ!

  • @VictoriaSyvak
    @VictoriaSyvak3 жыл бұрын

    Дуже дякую за те, що все з компонентами нарешті прояснилось:) дуже доступно) Після перегляду зрозуміла, що можна витрачати значно менше часу на дизайн, якщо не робити все вручну)

  • @alinashchebetun1000
    @alinashchebetun10005 жыл бұрын

    Огромное спасибо за видео!)

  • @user-wt2rc8er7j
    @user-wt2rc8er7j3 жыл бұрын

    Спасибо! Ваше видео просто спасение! :)

  • @valeryoks8847
    @valeryoks88473 жыл бұрын

    Супер! очень понятно и доходчиво))

  • @sashazlobin
    @sashazlobin5 жыл бұрын

    Отличный урок, спасибо 👍🏻

  • @anastasiapavlova_kuzmina3378
    @anastasiapavlova_kuzmina33784 жыл бұрын

    Спасибо большое! все четко и понятно!

  • @annasedova6386
    @annasedova6386 Жыл бұрын

    Доступно объяснил, спасибо!

  • @sergiiandrosov1729
    @sergiiandrosov17294 жыл бұрын

    Спасибо большое за удобоваримую подачу.

  • @alinarolinsky3404
    @alinarolinsky34045 жыл бұрын

    Большое спасибо! Всё по делу :)

  • @andriihelever1793
    @andriihelever17934 жыл бұрын

    Спасибо, очень круто и хорошие примеры на практике

  • @natalitarasova5449
    @natalitarasova54494 жыл бұрын

    Класс! Спасибо за видео

  • @amanrozyev5527
    @amanrozyev55273 жыл бұрын

    блин наконец видео которое нужно. А не эта вода сплошная кругом. Теперь ясно как делать иконки. и карточки на практике. Спасибо большое! ПОДПИСКА :)

  • @spagettification
    @spagettification Жыл бұрын

    В компонентах уже случилось много изменений. Например, уже нет необходимости делать 8 компонентов для состояний. Появилась функция Variants, чтобы стейт можно было выбрать в параметрах компонента. Очень удобно. Спасибо за ваше видео :)

  • @___KS___
    @___KS___ Жыл бұрын

    Спасибо. Я так сам догадался до кое чего. Но теперь интуитивное стало осознанным. 😎🤗

  • @raevskaya_elizaveta
    @raevskaya_elizaveta2 жыл бұрын

    Супер, спасибо, очень полезно и понятно 🤍

  • @adamsteklov
    @adamsteklov2 жыл бұрын

    Вообще не знал что это, но после просмотра видео, видимо придется посмотреть еще раз и попробовать :D

  • @hyper_hal
    @hyper_hal4 жыл бұрын

    Отличный видос. Спасибо :)

  • @user-tt2vv9qo6e
    @user-tt2vv9qo6e5 жыл бұрын

    Спасибо! Лучшее видео про компоненты на ютуб! Жду отдельное видео)

  • @kodjaka
    @kodjaka5 жыл бұрын

    Супер! Давай еще про Стили!

  • @liteleak4049
    @liteleak40493 жыл бұрын

    Спасибо. Очень хороший урок вышел.

  • @yanapapikian
    @yanapapikian2 жыл бұрын

    Useful lesson, thanks a lot!

  • @user-od2qn1kp1d
    @user-od2qn1kp1d3 жыл бұрын

    Очень ценное видео! Спасибо

  • @juliya_kim
    @juliya_kim2 жыл бұрын

    супер материал, спасибо!

  • @catriarchiv
    @catriarchiv4 жыл бұрын

    Спасибо за крутой контент.

  • @uuu78798b
    @uuu78798b5 жыл бұрын

    спасибо, было интересно))

  • @AndrewConfident
    @AndrewConfident3 жыл бұрын

    Очень полезный видос! кнопка ctrl (deep selection) мне оочень упростила жизнь)

  • @alsoualsou9
    @alsoualsou93 жыл бұрын

    ОГРОМНЕЙШЕЕ СПАСИБО !!!!

  • @user-vx1yv9wg2h
    @user-vx1yv9wg2h3 жыл бұрын

    шикарне відео!!!

  • @boykodmitriy
    @boykodmitriy5 жыл бұрын

    Спасибо! Продолжа ;)

  • @MaximGuzko
    @MaximGuzko2 жыл бұрын

    Большое спасибо за информацию 🙏

  • @dmitriyzhukov4592
    @dmitriyzhukov45924 жыл бұрын

    Спасибо. Очень полезно.

  • @romans8324
    @romans83245 жыл бұрын

    Двойнуя работу сделал, молодец, очень полезная фича)

  • @nickchernitsyn3354
    @nickchernitsyn33545 жыл бұрын

    Брат, спасибо, друг!

  • @user-dw5rz5cs4y
    @user-dw5rz5cs4y4 жыл бұрын

    Интересно! Можно больше реальных примеров на практике? Спасибо за видео! Лайкос! !!

  • @user-vz8ce9pv2o
    @user-vz8ce9pv2o3 жыл бұрын

    чувак, ты просто бог!

  • @diekunstUA
    @diekunstUA5 жыл бұрын

    отличное видео. спасибо.

  • @MobilStok
    @MobilStok3 жыл бұрын

    очень хорошие видео !!

  • @websharkstudio
    @websharkstudio3 жыл бұрын

    Спасибо за видео!

  • @user-hs3yp8vi8m
    @user-hs3yp8vi8m3 жыл бұрын

    Ууух, прокачался, спасибо громадное

  • @leonid_anat
    @leonid_anat2 жыл бұрын

    Топове видео, спасибо

  • @user-zk6om8yd3p
    @user-zk6om8yd3p Жыл бұрын

    дай бог тебе здоровья!

  • @girlblueeyedrnd
    @girlblueeyedrnd3 жыл бұрын

    спасибо! полезно и наглядно!

  • @Frie666
    @Frie6663 жыл бұрын

    Хороший видос! Было бы круто чтобы подсвечивались комбинации клавиш

  • @marynakuryshka3583
    @marynakuryshka35835 жыл бұрын

    Файнае відэа, дзякуй!

  • @komkoff91
    @komkoff914 жыл бұрын

    Очень крутые уроки по Figme! Я прохожу курс от Skillbox по Figme, так там одна вода и ничего не понятно, приходится на ютубе искать более подробную информацию. У тебя классный контент!

  • @disarto.digital

    @disarto.digital

    4 жыл бұрын

    Спасибо. Приятно слышать 🙂

  • @Mi-jt6nn
    @Mi-jt6nn4 жыл бұрын

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

  • @aleks3388
    @aleks33883 жыл бұрын

    спасибо ! все понятно

  • @user-hm6qe5yh3g
    @user-hm6qe5yh3g3 жыл бұрын

    супер, спасибо большое

  • @va1ga
    @va1ga3 жыл бұрын

    Компоненты очень удобно с вариантами комбинировать =)

  • @user-lz9nd9pr1e
    @user-lz9nd9pr1e3 жыл бұрын

    Жаль что не приближаете во время пояснений...было бы крупнее и нагляднее :)

  • @irinapalamarchuk4688
    @irinapalamarchuk46884 жыл бұрын

    Спасибо!!!!

  • @AnnaDavtyan
    @AnnaDavtyan4 жыл бұрын

    спасибо!

  • @danyadanyadanyadanya1592
    @danyadanyadanyadanya15924 жыл бұрын

    спасибо!!!!!!!

  • @vikasytnik
    @vikasytnik4 жыл бұрын

    дякую)

  • @ValentinaSmirnova9
    @ValentinaSmirnova93 жыл бұрын

    Большое спасибо за урок! Вопрос: а как редактировать инструментом "Перо"? Есть что-то похожее на работу с "пером" в "Иллюстраторе"?

  • @anton_youtube_1
    @anton_youtube_14 жыл бұрын

    Почему когда меняешь текст в копии компонента его потом нельзя выровнять относительно плашки? Что в этом случае делать и как его редактировать?

  • @glebklochkov2823
    @glebklochkov28234 жыл бұрын

    Как быстро копировать объекты в столбец, как показывается в видео уроке ?

  • @met4ltech
    @met4ltech4 жыл бұрын

    Даже сохраню.

  • @ekaterinasaltanova2541
    @ekaterinasaltanova25415 жыл бұрын

    Огромное спасибо за видео! Я только пошла на курсы веба и как-то тяжеловато пошло с компонентами... Хотя они ведь облегчают жизнь!!! Можно спросить, таблицу тоже делают из компонентов? Может есть какая-то ссылочка на рисование таблиц?

  • @disarto.digital

    @disarto.digital

    5 жыл бұрын

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

  • @artemcherniavsky2410
    @artemcherniavsky24104 жыл бұрын

    так и не понял как скопировать через промежутки так быстро? ) слой на слой вставляется )

  • @artemcherniavsky2410

    @artemcherniavsky2410

    4 жыл бұрын

    кто не понял - разобрался.. (нужно не скопировать, вставить, а дублировать слой. контрл/комманд+D) сделали слой, контрл+Д, отодвинули новый слой и нажали снова контрл+д нужное кол-во раз.

  • @kseniapolza1852
    @kseniapolza18523 жыл бұрын

    Отличное видео! А как вы копируете так быстро? после того как два элемента с отступом сделали, дальше как-будто остальны копии с отступом через клавишу идут.

  • @disarto.digital

    @disarto.digital

    3 жыл бұрын

    Ctrl + D (на windows)

  • @qqqq2412
    @qqqq24125 жыл бұрын

    Привет! Во-первых благодарю за уроки! Во-вторых хочу узнать откуда можно скачать уже готовые иконки? По схеме как ты скачивал ассеты для ios11 с фб для скеча (кстати они уже там есть специально для Фигмы). Спасибо! Пожалуйста записывай еще уроки по фигме! Супер!

  • @user-yz1vs3qy6r

    @user-yz1vs3qy6r

    4 жыл бұрын

    я тоже хочу узнать где лучше поскачивать все необходимое!

  • @vitaliy9948

    @vitaliy9948

    4 жыл бұрын

    плагин с иконками flaticon.com есть.

  • @CrazyDreamCD
    @CrazyDreamCD Жыл бұрын

    Здравствуйте! Подскажите, пожалуйста, как вы поотдельности форматируете логотипы (т.е. выбираете нужный фрагмент и вставляете его в заготовленное место)? Или может вы скачали откуда-то такой формат? Я сколько провозилась, так и не смогла вырезать то же яблоко , чтобы его вставить(( обычной картинкой пока поставила, как вы показывали в предыдущем уроке

  • @Midi25

    @Midi25

    Жыл бұрын

    просто логотип сделан из кривых на черном фоне а фон отдельный слой от вектора. Если вы поставите на паузу в момент когда лого apple выделено, вы увидите слева в слоях, что лого состоит из эллипса, и двух векторных фигур (листочек и сама форма яблока). Вам надо просто сделать такой векторный обьект сразу в фигме или скачать откудато отдельно векторный белый символ apple. И тогда перетянется разумеется чисто лого яблока, поскольку это отдельная векторная фигура.

  • @vovk389
    @vovk3894 жыл бұрын

    в фш есть смарт объекты (да их использование тот еще гемор, но энивей они есть)

  • @user-qe8hx7xe4j
    @user-qe8hx7xe4j4 жыл бұрын

    Спасибо за урок. Подскажите , пожалуйста, как один из элементов , образованных из компонента, сделать снова просто элементом, на который компонент больше не влияет? Возможно ли это?

  • @disarto.digital

    @disarto.digital

    4 жыл бұрын

    Разумеется, для этого нажмите на элемент правой кнопкой мыши и выберите Detach Instance (отсоединить экземпляр).

  • @vneplanov299
    @vneplanov2994 жыл бұрын

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

  • @FAILZONEVIDEOS
    @FAILZONEVIDEOS4 жыл бұрын

    Какой горячей клавишей вы делаете сразу подряд несколько копий на одинаковом расстоянии?

  • @disarto.digital

    @disarto.digital

    4 жыл бұрын

    Ctrl + D

  • @vladislavvelev432
    @vladislavvelev4323 жыл бұрын

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

  • @disarto.digital

    @disarto.digital

    3 жыл бұрын

    Приветствую. Да, варианты в большинстве случаев будут удобнее.

  • @ValeriyTokarev
    @ValeriyTokarev3 жыл бұрын

    Когда я меняю текст в дочернем компоненте, в панели Layers текст дочернего компонента не изменяется и остается таким же как и родительского компонента, приходится менять текст вручную. Что делать? Подскажите пожалуйста

  • @alizhilov1391
    @alizhilov13914 жыл бұрын

    здравствуйте а если я случайно сделал компонент страницы, как нибудь можно убрать?

  • @IgorShkarin
    @IgorShkarin2 жыл бұрын

    Чем отличается создание компонента, а потом применение авто лейаут, от обратного: Сначала сделать авто лейаут, а потом компонент?

  • @disarto.digital

    @disarto.digital

    2 жыл бұрын

    В целом - ничем. Однако, если создавать Auto layout для одного слоя, появятся стандартные отступы 10px. В остальном разницы нет.