На 97,5% полностью адаптивный дизайн в Figma за 16 минут

  Рет қаралды 72,325

Further

Further

2 жыл бұрын

Ссылка на проект в фигме с обучающими материалами:
www.figma.com/file/2LliqYqtW6...
Дизайн практика: Адаптивный дизайн в Figma / 11 - 17 июля
dofurther.gumroad.com/l/adaptive

Пікірлер: 152
@syndromtorrenta
@syndromtorrenta 3 ай бұрын
ааа как же приятно видеть , что человек, на голову выше меня, тоже ошибается в простых вещах, методом тыка ищет вариант решения задачи очень успокаивает внутреннего самокритика))
@katerinakozhevnikova9185
@katerinakozhevnikova9185 2 жыл бұрын
Материал очень насыщенный, мне нужно будет несколько раз пересмотреть, чтобы прям осознать всё. Идея,где ты используешь предметы реального мира, чтобы объяснить функционал очень классная и запоминающаяся. Появляющаяся фотка Девида Блейна - это так забавно и супер врезается в память,ну мне по крайней мере😆
@Chihuahua-du5zx
@Chihuahua-du5zx 2 жыл бұрын
По хорошему все лучше повторить)
@katerinakozhevnikova9185
@katerinakozhevnikova9185 2 жыл бұрын
@@Chihuahua-du5zx Ну так то согласна, нужно повторять)
@Qundoff
@Qundoff Жыл бұрын
women 😇
@zzz7net
@zzz7net 2 жыл бұрын
Если Вассермана обычно слушают на скорости 1.5, то здесь ставьте максимум 0.75, чтобы ничего не пропустить. Пожалуйста!
@Net_Lenka
@Net_Lenka 2 жыл бұрын
Давно ждала такое видео. Правда понимаю, что нужно еще пару раз пересмотреть и попрактиковаться) Спасибо!
@EugeneD456
@EugeneD456 2 жыл бұрын
Видно, что материал очень детально проработан и самое важное понятно рассказан! Ребята большие молодцы 👍Смотрел с удовольствием, так держать
@aigerimsabyrbek5010
@aigerimsabyrbek5010 11 ай бұрын
Ура, все курсы по UX дизайну в одном видео! Лет 6 видимо ждала такое подробное видео, а это за все время изучения и появления фигмы 😭😭😭🙏🙏🙏 Благодарна от души 💓💖
@pavelsemenov8433
@pavelsemenov8433 Жыл бұрын
Блин! Это очень изящно! Но, походу, придётся раза 2 ещё посмотреть) спасибо!
@user-bz9go4jy2z
@user-bz9go4jy2z Жыл бұрын
Вау, находка❤ спасибо Все четко, инсталляции вобще шикарны))😍
@user-ep7im9or1t
@user-ep7im9or1t Жыл бұрын
Бомба, смотрю Ваши видосы уже 6 часов, и не могу оторваться, продолжайте в том же духе 😂
@paperfacesingold2
@paperfacesingold2 Жыл бұрын
Видео-урок по фигме это просто супер!
@Johnsson25
@Johnsson25 28 күн бұрын
Очень круто! Всех вам благ и миллиона подписчиков!
@defaultalf5161
@defaultalf5161 2 жыл бұрын
Огромное спасибо, это прям то, что я хотел найти! Подробный разбор автолейаута) Так главное попалось видео случайно, в рекомендациях!)) Подпишусь!
@christinahofmann7658
@christinahofmann7658 Ай бұрын
это бесценный урок......... спасибо огромнейшее!! тысячи огоньков❤‍🔥❤‍🔥❤‍🔥❤‍🔥❤‍🔥 точно буду в свободное время пересматривать и тренироваться по этому уроку
@atthefirstopportunity
@atthefirstopportunity 2 жыл бұрын
Спасибо дружище! Береги себя и близких пожалуйста 🤍
@Sergeydk
@Sergeydk 11 ай бұрын
Подход на 10 баллов по 5 бальной системе. Рассказал и показал просто огонь. Для новичков просто топ
@npavelchenko
@npavelchenko 2 жыл бұрын
Безумно полезное видео! Спасибо большое!
@user-dk4qj3lj3p
@user-dk4qj3lj3p 2 жыл бұрын
Зная твою обстановку в какой ты оказался,ты просто молодец!!!
@uxlana
@uxlana 4 ай бұрын
Очень крутое видео, информация изложена четко. Непростая тема, я пересмотрю еще пару раз, но многие вещи встали на свои места. Редко встретишь настолько подробное видео с простым объяснением. Классные фишки для себя записала. Благодарю!
@Alex-qm9mf
@Alex-qm9mf 2 жыл бұрын
Огромное спасибо, лучший контент)
@Elenciaa
@Elenciaa 7 ай бұрын
огромное спасибо за такой подробный и крутой урок!!
@kooknuke
@kooknuke 2 жыл бұрын
Как всегда топ! Спасибо!
@redocean1005
@redocean1005 2 жыл бұрын
Прекрасная работа, спасибо
@user-rn9lh3ei5x
@user-rn9lh3ei5x Жыл бұрын
Игорь, большая благодарность тебе за твои видео. Тебя очень интересно смотреть, здорово, что коллега посоветовал твой канал. Тоже верстаю на вебфлоу и иду по твоему пути, в какой-то мере. Мне тоже скоро 35) Выздоравливай!!! А самое главное, желаю тебе проснуться в мирной и свободной стране, а себе в стране не дураков, а гениев. Пусть даже и через 100 веков. Берегите себя, ребята.
@DoFurther
@DoFurther Жыл бұрын
Спасибо за пожелание и цитирование Талькова )
@GrayDelta-ql3kg
@GrayDelta-ql3kg Жыл бұрын
Очень качественний контент, спасибо
@angelstirlitz696
@angelstirlitz696 2 жыл бұрын
Найкращий, лови вподобайку! Як креативно подаєш матеріал, підтримаю тебе дуже давно і вдячна за кожен ролик. Люблю!
@ostrovmuzy
@ostrovmuzy Ай бұрын
Со знанием дела. Очень интересно!
@sergiosokolovski7154
@sergiosokolovski7154 2 жыл бұрын
Очень круто, просто и доступно. Спасибо большое! Делай, пожалуйста побольше такого, полезного контента =)
@DoFurther
@DoFurther 2 жыл бұрын
Что-то базовое и практическое?
@sergiosokolovski7154
@sergiosokolovski7154 2 жыл бұрын
@@DoFurther практическое, пожалуйста ☺️
@freemsg
@freemsg 2 жыл бұрын
Очень крутой материал для изучения! Спасиб
@taneka88
@taneka88 11 ай бұрын
Огромное спасибо! Ни в одном платном курсе не видела, чтобы так показывали про адаптивность. Там на уровне: создаем новый фрейм под планшет и под айфон, переносим и собираем 😵‍💫
@gamer83m
@gamer83m 2 жыл бұрын
Блин.... эти видео должны быть платными... Это же целая супер сила!!!
@sergeyglushakov6002
@sergeyglushakov6002 Жыл бұрын
Вот это пушка контэнт !)
@user-kt9wi9ee6w
@user-kt9wi9ee6w 2 жыл бұрын
Спасибо огромное за такой титанический труд¡
@DoFurther
@DoFurther 2 жыл бұрын
По правде говоря, я действительно подзадолбался пока делал это видео )
@KillJoy1113
@KillJoy1113 29 күн бұрын
Это было супер полезно!!!
@Cherusenberg
@Cherusenberg Жыл бұрын
Оч крутое видео, спасибо)
@germanshaburnikov1032
@germanshaburnikov1032 2 жыл бұрын
Чувак, а че так сочно то а? Офигенно снятно и хорошо рассказано, лови лайков в тачанку)) оч круто!
@levanczcm3720
@levanczcm3720 Жыл бұрын
И вот я снова вернулся пересматривать, чтобы сделать новый заказ наглядно адаптивным)
@matteriya6637
@matteriya6637 Жыл бұрын
Ого это очень круто ❤😊😊
@stanislavak7778
@stanislavak7778 Жыл бұрын
Спасибо ) Польза!!!
@ilyasafronov2421
@ilyasafronov2421 2 жыл бұрын
Здорово, спасибо!
@ballantines8617
@ballantines8617 2 жыл бұрын
Игорь, ты мой кумир! я уже собираю фигурку тебя из ЛЕГО!!!
@DoFurther
@DoFurther 2 жыл бұрын
Круто ) Обязательно скинь что получиться. Кепки, кстати сложно делать из лего ;)
@yeahLively
@yeahLively 2 жыл бұрын
Что за контент ,🎉 спасибо !
@Milevi4
@Milevi4 2 жыл бұрын
Великий лайк, друже!) Дуже корисний матеріал)
@zivart_ua
@zivart_ua 2 жыл бұрын
Як завжди контент на висоті! Надіюсь, колись щось подібне буде рідною мовою.
@DoFurther
@DoFurther 2 жыл бұрын
Я теж на це сподiваюсь XD
@dariaserhiienko3876
@dariaserhiienko3876 2 жыл бұрын
Оце так контент! Дякую безмежно, давно шукала такий туторіал на живому проекті ,а не просто окремих елементів)
@DoFurther
@DoFurther 2 жыл бұрын
Я так и хотел )
@ksusha_kaban
@ksusha_kaban Жыл бұрын
Материал хорош, но боже, что за инсталляции с крафтовым картоном 😍😍😍😍😍
@armazet8081
@armazet8081 11 күн бұрын
Сейчас покажусь дураком. Но я всё время думал, что сетка просто для удобной ростановки, и никаких функций не несёт 😳. Вот это нифига себе 😆
@Anton_Ivaniuk
@Anton_Ivaniuk Жыл бұрын
Супер полезно!
@Alexenuuu
@Alexenuuu 2 жыл бұрын
Привет) Cуперский видос!!! Было б интересно как верстать этот адаптивный в WIX или WebFlow
@andriy-kos
@andriy-kos Жыл бұрын
Присоединяюсь
@dikaleto9681
@dikaleto9681 2 жыл бұрын
супер кайф!
@aleksey22095
@aleksey22095 2 жыл бұрын
По началу, думаю как и все, все группировал по папкам. Потом через констреинс, когда на фигму перешел. Но как я кайфанул, когда наконец осилил Auto layout. Госпади, спасибо разработчикам фигмы. Особенно последнее обновление порадовало, когда добавили абсолютное позиционирование. Если все нормально настроил для десктопа, то на адаптив времени немного нужно. Как вспомню времена, когда в фш все приходилось переделывать, аж вздрагиваю))
@DoFurther
@DoFurther 2 жыл бұрын
То были темные времена XD
@dsurkovv
@dsurkovv Жыл бұрын
привет, а можешь в видео обьяснить, как правильно дизайнить сайты для школ/колледжей учитывая стандарты от государства?
@exfobae
@exfobae 2 жыл бұрын
пока досмотрел ролик и узнал про движуху, все места уже раскупили 😶
@DoFurther
@DoFurther 2 жыл бұрын
Это я жестко натупил с настройками. Сам чешу репу, почему только один человек записался (*вытираю слезы*)
@andriy-kos
@andriy-kos Жыл бұрын
Салют. Через какой плагин можно экспортировать этот дизайн в html? Типо в Елементор на Вордпрес или какие-то плагины Фигмы? То есть задача в том, чтобы оживить дизайн уже в вебе
@IgorBobyrev
@IgorBobyrev Жыл бұрын
Где вы раньше были, где? 😭
@andriibalyberdin5648
@andriibalyberdin5648 2 жыл бұрын
Дуже круто!
@dariaserhiienko3876
@dariaserhiienko3876 Жыл бұрын
Привіт, а коли розпочнеться дизайн практика? я підписалася та дуже чекаю на початок)
@alexbov
@alexbov 2 жыл бұрын
Спасибо
@graysnake6143
@graysnake6143 2 жыл бұрын
Хахахахах. Я в шоке! Ну красавчик. Точно дэвид блэйн! Подписываюсь.
@dimaerlikh8887
@dimaerlikh8887 11 ай бұрын
Привет, спасибо за видос! Очень круто. Подскажи, пожалуйста, почему у меня у компонента article_thumb нет возможности "fill conteiner", а у тебя есть?)))
@MarcusRambo1991
@MarcusRambo1991 Жыл бұрын
класс!
@nataliya336
@nataliya336 Жыл бұрын
Игорь, подскажите pls,kind of got stuck... я сделала 8 frames. They adapt, вроде как works smoothly. Можете уделить немного времени,накопились вопросы?
@litvin23
@litvin23 2 жыл бұрын
4:35 в Adobe XD есть такая штука как Stack (единственное чего не хватает в Figma) - разное расстояние между группой слоёв. Можно менять порядок слоёв, а общий принцип остаётся
@VadimIlyin
@VadimIlyin 2 жыл бұрын
Да ладно
@DoFurther
@DoFurther 2 жыл бұрын
Посмотрел на KZfaq, прикольная фича. Есть чего ожидать от фигмы в следующем году )
@user-dt8tk3xy5g
@user-dt8tk3xy5g Жыл бұрын
Блен, а шо делать если бэкграунд не монолитный по цвету?
@KattyKkk
@KattyKkk Жыл бұрын
класс класс класс!
@vitavika
@vitavika 2 жыл бұрын
Класна робота! Найчастіше приходиться робити адаптив саме для мобільного екрану і там буде дуже багато ручних доопрацювань, перебудови блоків і тд.
@sashfomin
@sashfomin 9 ай бұрын
Звучит так, будто без 100 гр. не разобраться. Вроде понятно, но цепочка не выстраивается в голове. Но все равно круто, спасибо за видео))
@miranbuke
@miranbuke 2 жыл бұрын
Верстка макета. Уровень "Боженька"
@jsnezhik
@jsnezhik Жыл бұрын
круть
@desssigner
@desssigner 2 жыл бұрын
Очень полезная вещь для тех кто начинает. Для тех кто с опытом тоже полезно, если что :))
@alexunknown5152
@alexunknown5152 Ай бұрын
Так через что ты там загрузил бл***скую Фигму?)
@user-ek1wi2pv4o
@user-ek1wi2pv4o 2 жыл бұрын
Дякую, друже
@alionacandvi
@alionacandvi Жыл бұрын
Теперь спросите верстальщиков нужно ли им это и не усложнит ли это им жизнь. Я уже спросила- они не понимают зачем это нужно и с такими макетами им работать сложнее
@DoFurther
@DoFurther Жыл бұрын
Мои клиенты - не верстальщики.
@Karnassix
@Karnassix Жыл бұрын
Наглядно и понятно, заодно еще пару полезных нюансов показал. Но побуду граммарнаци. Это не адаптивность. Это «респонсив» дизайн. Фактически это то, из чего в свое время адаптивность выросла
@user-jr6qt5rj8b
@user-jr6qt5rj8b 3 ай бұрын
Куда делся Space Between в 2024?
@gypsy2109
@gypsy2109 2 жыл бұрын
Пятая минута ролика.. А я уже запуталась.
@DoFurther
@DoFurther 2 жыл бұрын
Так иногда бывает. Открой исходник в фигме и постарайся повторить. На слух сложнее воспринимать в сравнее с тем, когда повторяешь действие по примеру.
@user-gt5gi9df9f
@user-gt5gi9df9f Жыл бұрын
Это еще не чёрная магия, а так серая. Вот если ты делал бы всё в автолайаутах и с адаптивными компонентами и добавлял переменные использую плагин гугл таблицы вот тогда была бы чёрная магия. Ну ты молодец я тоже все собираю компонентами и авто лайаутами. 😉👍
@user-zj2bb2pj8u
@user-zj2bb2pj8u 4 ай бұрын
Переменные только при платной подписке! Что для новичков и так без денег будет ужасно дорого
@EugeneD456
@EugeneD456 2 жыл бұрын
3:00 лол))) это очень смешно!!
@Fliger-G
@Fliger-G 2 жыл бұрын
Я новичек. Посоветуйте что начать изучать, Adobe XD или Figma?
@DoFurther
@DoFurther 2 жыл бұрын
Figma
@lettaluck
@lettaluck 5 ай бұрын
Если вы посмотрите это видео, а потом повторите пару раз, то можете считать, ято фигму вы выучили.
@anya6182
@anya6182 2 жыл бұрын
Мне кажется следующий шаг это выгрузка дизайна фигмы сразу в код. Или такой плагин уже есть? Ведь по сути все эти блоки это дивы в html а настройки автолейаута это настройки css ))
@DoFurther
@DoFurther 2 жыл бұрын
Ага. Это то к чему нас подталкивают инструменты в Фигме.
@vgenm2457
@vgenm2457 2 жыл бұрын
Он есть, толь в твоих мечтах 😄
@andriy-kos
@andriy-kos Жыл бұрын
Такие плагины уже есть)) но они лишь хтмл выдают)) однако можно потом натянуть на ВП
@user-zj2bb2pj8u
@user-zj2bb2pj8u 4 ай бұрын
Plugin -> Figma to Code
@ankis_yt
@ankis_yt Жыл бұрын
👍
@urumova_elina
@urumova_elina 6 ай бұрын
у меня не получаааетсяяя 🥲 что-то я делаю не так
@ArtCamp999
@ArtCamp999 Жыл бұрын
Очень красиво и ничего не понятно
@user-py1jc4rt1g
@user-py1jc4rt1g Жыл бұрын
один вопрос, а для чего это нужно?
@alionacandvi
@alionacandvi Жыл бұрын
Вот и мне интересно. Разработчики при чем говорят, что это бред и для них такое точно не нужно. Только жизнь им усложняют
@wswanter
@wswanter 2 жыл бұрын
Требую фулл название файла!!!!!!😄
@DoFurther
@DoFurther 2 жыл бұрын
Да там всё вместилось ) Все три недели отчаяния, когда я выносил стационарный компьютер, чтобы при помощи телефона за 40 минут запустить фигму и занести включенный компьютер обратно в мастерскую. Короче говоря, без интернета - трудно )
@kirf2
@kirf2 2 жыл бұрын
можно было просто назвать Кайфую от автолейаута)) 16 минут не понял зачем дивайдер рисовать, если можно просто добавить бордер в автолейаут?
@DoFurther
@DoFurther 2 жыл бұрын
Потому что тогда у нас получится отступ до бордера с фиксированным значением.
@user-mb8rm5mg5x
@user-mb8rm5mg5x Жыл бұрын
Спасибо за видео! Почти все понятно 😅 Есть замечание, вот тут*; в конце, после создания отступов у всего макета «сломался» дизайн, по задумке горизонтальные линии должны идти до конца макета без отступов (ну или должны быть полные границы вокруг). *kzfaq.info/get/bejne/eLJ7rc-Hz629pJs.html Еще не очень понятно, почему такое решение: дивайдеры вместо обводки дочерних контейнеров.
@VnukKonyaBudennogo
@VnukKonyaBudennogo 2 жыл бұрын
Как оплатить тариф в фигме? В free версии всего 3 страницы можно создавать
@DoFurther
@DoFurther 2 жыл бұрын
Что-то я такое впервые слышу про 3 страницы.
@VadimIlyin
@VadimIlyin 2 жыл бұрын
?? сотни страниц, просто все лежат в drafts
@VnukKonyaBudennogo
@VnukKonyaBudennogo 2 жыл бұрын
@@DoFurther то есть я могу без проблем отрисовать 10-30 страниц для своего сайта услуг к примеру?
@DoFurther
@DoFurther 2 жыл бұрын
@@VnukKonyaBudennogo конечно
@user-gw5bp6nn8u
@user-gw5bp6nn8u 2 жыл бұрын
@@DoFurther нет, на базовом тарифе только 3 страницы
@antimczenko
@antimczenko 2 жыл бұрын
АААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААА!!!!!!!!!!!!!!!!!!!!!!!!!
@QWERTY-ks8gf
@QWERTY-ks8gf Жыл бұрын
а зачем нужен адаптивный дизайн только для дизайна под мобилки ?
@andriy-kos
@andriy-kos Жыл бұрын
Да, потому что 80% трафика с моба
@il-2000
@il-2000 Жыл бұрын
я испортил круглую цифру "100" своим 101-м комментом :)
@user-pg5bo6no5b
@user-pg5bo6no5b Жыл бұрын
ничего непонятно (( к автору видео нет никаких претензий. но я даже не понимаю о чем вообще идет речь. вАаабще(( и это после 8 месяцев после курса "Веб дизайн" делаю макет лендинга ( уже 2 месяц) и хочется чтобы всё адаптивно тянулось. но увы, не приблизился к решению даже на 5% видимо в 38 лет только коробки переставлять могу. извиняюсь, что здесь сорвался, но уже почти целый год никаких результатов в этой сфере
@user-py1jc4rt1g
@user-py1jc4rt1g Жыл бұрын
я уверен все старания, если не сдашься, очень хорошо окупятся ;)
@piskovaia
@piskovaia Жыл бұрын
6:30
@user-it4hc1sl9x
@user-it4hc1sl9x 2 жыл бұрын
Какой в этом смысл? Верстальщик и так знает что между брейк поинтами контент сужается и отступы между элементами уменьшаются
@DoFurther
@DoFurther 2 жыл бұрын
Можно же на основе автолейаута продолжить делать и мобильную версию, которая будет значительно отличаться от веб версии. Но такой подход будет полезен не только при работе с адаптивом, но и на стадии внесения изменений в дизайн.
@dasha_ccheese6545
@dasha_ccheese6545 2 жыл бұрын
Всем привет! Кто как начинал свой путь в веб-дизайне? Я сейчас пытаюсь устроиться в студию, т.к опыта мало, но вакансий нет вообще или игнор. Кто как получил свой первый оффер? Крик души уже :((((((
@DoFurther
@DoFurther 2 жыл бұрын
Нужно разбираться, что у тебя с работами, а также с тем как ты ищещь работу (собеседования, отправка e-mail, коммуникация в соц. сетях). Для начала глянь моё видео «Как устроиться в студию» (там Тема Лебедев на обложке).
@NataGrig
@NataGrig 2 жыл бұрын
а сколько ты ждешь? мне приходило несколько предложений спустя 2-3 месяца как отправляла св)
@dasha_ccheese6545
@dasha_ccheese6545 2 жыл бұрын
@@NataGrig отклики с тестовыми быстро приходят, а дальше обычно тишина после того как высылаю тестовое
@NataGrig
@NataGrig 2 жыл бұрын
@@dasha_ccheese6545 после тестового еще месяц может пройти
@SHonda-fq3gp
@SHonda-fq3gp 9 ай бұрын
получилось то, что мы и хотели - ... ничего 😄
@divside
@divside 2 жыл бұрын
03:00 - проорал в голос)
@tw1x234
@tw1x234 Жыл бұрын
Я который ничего не понимаю. Кажется что это китайский язык. Есть такие?))
@DameliDautkanovalancaster
@DameliDautkanovalancaster 3 ай бұрын
где найти этот долбаный constraint? ну почему нет хотя бы одного урока со всеми доступными объяснениями. вечно обо что-то спотыкаешься. у меня задача срочная, а я не могу разобраться, как сделать мультиадаптивный дизайн для всех экранов. даже к дизайну не подошла
@user-gw5bp6nn8u
@user-gw5bp6nn8u 2 жыл бұрын
Родительский компонент лучше не держать в макете
@DoFurther
@DoFurther 2 жыл бұрын
100%
@andriy-kos
@andriy-kos Жыл бұрын
Поясните пожалуйста детальнее… почему и где тогда держать?
Всё об Auto Layout в Figma
12:57
Наука Дизайна
Рет қаралды 19 М.
We Got Expelled From Scholl After This...
00:10
Jojo Sim
Рет қаралды 62 МЛН
ТАМАЕВ vs ВЕНГАЛБИ. Самая Быстрая BMW M5 vs CLS 63
1:15:39
Асхаб Тамаев
Рет қаралды 4,8 МЛН
Дизайн сайта за 160 000 ₽ | Показываю реальный проект на фрилансе
18:33
КруТа в дизайне ❘ Блог Крупиной Татьяны
Рет қаралды 22 М.
Figma UX tutorial for beginners - Mockup
13:45
Aliena Cai
Рет қаралды 98 М.
Фигма обновила Auto Layout 🔥 Ускоряем работу х10
9:31
КруТа в дизайне ❘ Блог Крупиной Татьяны
Рет қаралды 4,6 М.
Figma. Дизайн сайта за 90 минут | Часть 1
28:52
Макс Куратов
Рет қаралды 15 М.
We Got Expelled From Scholl After This...
00:10
Jojo Sim
Рет қаралды 62 МЛН