Тёмный

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

Further
Подписаться 29 тыс.
Просмотров 69 тыс.
50% 1

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

Опубликовано:

 

27 июн 2022

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 149   
@syndromtorrenta
@syndromtorrenta 2 месяца назад
ааа как же приятно видеть , что человек, на голову выше меня, тоже ошибается в простых вещах, методом тыка ищет вариант решения задачи очень успокаивает внутреннего самокритика))
@katerinakozhevnikova9185
@katerinakozhevnikova9185 Год назад
Материал очень насыщенный, мне нужно будет несколько раз пересмотреть, чтобы прям осознать всё. Идея,где ты используешь предметы реального мира, чтобы объяснить функционал очень классная и запоминающаяся. Появляющаяся фотка Девида Блейна - это так забавно и супер врезается в память,ну мне по крайней мере😆
@Chihuahua-du5zx
@Chihuahua-du5zx Год назад
По хорошему все лучше повторить)
@katerinakozhevnikova9185
@katerinakozhevnikova9185 Год назад
@@Chihuahua-du5zx Ну так то согласна, нужно повторять)
@Qundoff
@Qundoff Год назад
women 😇
@Net_Lenka
@Net_Lenka Год назад
Давно ждала такое видео. Правда понимаю, что нужно еще пару раз пересмотреть и попрактиковаться) Спасибо!
@EugeneD456
@EugeneD456 Год назад
Видно, что материал очень детально проработан и самое важное понятно рассказан! Ребята большие молодцы 👍Смотрел с удовольствием, так держать
@aigerimsabyrbek5010
@aigerimsabyrbek5010 10 месяцев назад
Ура, все курсы по UX дизайну в одном видео! Лет 6 видимо ждала такое подробное видео, а это за все время изучения и появления фигмы 😭😭😭🙏🙏🙏 Благодарна от души 💓💖
@pavelsemenov8433
@pavelsemenov8433 Год назад
Блин! Это очень изящно! Но, походу, придётся раза 2 ещё посмотреть) спасибо!
@user-bz9go4jy2z
@user-bz9go4jy2z Год назад
Вау, находка❤ спасибо Все четко, инсталляции вобще шикарны))😍
@user-ep7im9or1t
@user-ep7im9or1t Год назад
Бомба, смотрю Ваши видосы уже 6 часов, и не могу оторваться, продолжайте в том же духе 😂
@christinahofmann7658
@christinahofmann7658 21 день назад
это бесценный урок......... спасибо огромнейшее!! тысячи огоньков❤‍🔥❤‍🔥❤‍🔥❤‍🔥❤‍🔥 точно буду в свободное время пересматривать и тренироваться по этому уроку
@defaultalf5161
@defaultalf5161 Год назад
Огромное спасибо, это прям то, что я хотел найти! Подробный разбор автолейаута) Так главное попалось видео случайно, в рекомендациях!)) Подпишусь!
@atthefirstopportunity
@atthefirstopportunity Год назад
Спасибо дружище! Береги себя и близких пожалуйста 🤍
@user-rn9lh3ei5x
@user-rn9lh3ei5x Год назад
Игорь, большая благодарность тебе за твои видео. Тебя очень интересно смотреть, здорово, что коллега посоветовал твой канал. Тоже верстаю на вебфлоу и иду по твоему пути, в какой-то мере. Мне тоже скоро 35) Выздоравливай!!! А самое главное, желаю тебе проснуться в мирной и свободной стране, а себе в стране не дураков, а гениев. Пусть даже и через 100 веков. Берегите себя, ребята.
@DoFurther
@DoFurther Год назад
Спасибо за пожелание и цитирование Талькова )
@Sergeydk
@Sergeydk 10 месяцев назад
Подход на 10 баллов по 5 бальной системе. Рассказал и показал просто огонь. Для новичков просто топ
@taneka88
@taneka88 10 месяцев назад
Огромное спасибо! Ни в одном платном курсе не видела, чтобы так показывали про адаптивность. Там на уровне: создаем новый фрейм под планшет и под айфон, переносим и собираем 😵‍💫
@user-dk4qj3lj3p
@user-dk4qj3lj3p Год назад
Зная твою обстановку в какой ты оказался,ты просто молодец!!!
@paperfacesingold2
@paperfacesingold2 Год назад
Видео-урок по фигме это просто супер!
@uxlana
@uxlana 2 месяца назад
Очень крутое видео, информация изложена четко. Непростая тема, я пересмотрю еще пару раз, но многие вещи встали на свои места. Редко встретишь настолько подробное видео с простым объяснением. Классные фишки для себя записала. Благодарю!
@sergiosokolovski7154
@sergiosokolovski7154 Год назад
Очень круто, просто и доступно. Спасибо большое! Делай, пожалуйста побольше такого, полезного контента =)
@DoFurther
@DoFurther Год назад
Что-то базовое и практическое?
@sergiosokolovski7154
@sergiosokolovski7154 Год назад
@@DoFurther практическое, пожалуйста ☺️
@npavelchenko
@npavelchenko Год назад
Безумно полезное видео! Спасибо большое!
@Alex-qm9mf
@Alex-qm9mf Год назад
Огромное спасибо, лучший контент)
@gamer83m
@gamer83m Год назад
Блин.... эти видео должны быть платными... Это же целая супер сила!!!
@Elenciaa
@Elenciaa 6 месяцев назад
огромное спасибо за такой подробный и крутой урок!!
@kooknuke
@kooknuke Год назад
Как всегда топ! Спасибо!
@redocean1005
@redocean1005 Год назад
Прекрасная работа, спасибо
@GrayDelta-ql3kg
@GrayDelta-ql3kg Год назад
Очень качественний контент, спасибо
@freemsg
@freemsg Год назад
Очень крутой материал для изучения! Спасиб
@zzz7net
@zzz7net Год назад
Если Вассермана обычно слушают на скорости 1.5, то здесь ставьте максимум 0.75, чтобы ничего не пропустить. Пожалуйста!
@user-kt9wi9ee6w
@user-kt9wi9ee6w Год назад
Спасибо огромное за такой титанический труд¡
@DoFurther
@DoFurther Год назад
По правде говоря, я действительно подзадолбался пока делал это видео )
@angelstirlitz696
@angelstirlitz696 Год назад
Найкращий, лови вподобайку! Як креативно подаєш матеріал, підтримаю тебе дуже давно і вдячна за кожен ролик. Люблю!
@germanshaburnikov1032
@germanshaburnikov1032 Год назад
Чувак, а че так сочно то а? Офигенно снятно и хорошо рассказано, лови лайков в тачанку)) оч круто!
@levanczcm3720
@levanczcm3720 Год назад
И вот я снова вернулся пересматривать, чтобы сделать новый заказ наглядно адаптивным)
@sergeyglushakov6002
@sergeyglushakov6002 Год назад
Вот это пушка контэнт !)
@ostrovmuzy
@ostrovmuzy 13 дней назад
Со знанием дела. Очень интересно!
@Cherusenberg
@Cherusenberg Год назад
Оч крутое видео, спасибо)
@zivart_ua
@zivart_ua Год назад
Як завжди контент на висоті! Надіюсь, колись щось подібне буде рідною мовою.
@DoFurther
@DoFurther Год назад
Я теж на це сподiваюсь XD
@stanislavak7778
@stanislavak7778 Год назад
Спасибо ) Польза!!!
@ksusha_kaban
@ksusha_kaban Год назад
Материал хорош, но боже, что за инсталляции с крафтовым картоном 😍😍😍😍😍
@ballantines8617
@ballantines8617 Год назад
Игорь, ты мой кумир! я уже собираю фигурку тебя из ЛЕГО!!!
@DoFurther
@DoFurther Год назад
Круто ) Обязательно скинь что получиться. Кепки, кстати сложно делать из лего ;)
@matteriya6637
@matteriya6637 11 месяцев назад
Ого это очень круто ❤😊😊
@aleksey22095
@aleksey22095 Год назад
По началу, думаю как и все, все группировал по папкам. Потом через констреинс, когда на фигму перешел. Но как я кайфанул, когда наконец осилил Auto layout. Госпади, спасибо разработчикам фигмы. Особенно последнее обновление порадовало, когда добавили абсолютное позиционирование. Если все нормально настроил для десктопа, то на адаптив времени немного нужно. Как вспомню времена, когда в фш все приходилось переделывать, аж вздрагиваю))
@DoFurther
@DoFurther Год назад
То были темные времена XD
@ilyasafronov2421
@ilyasafronov2421 Год назад
Здорово, спасибо!
@yeahLively
@yeahLively Год назад
Что за контент ,🎉 спасибо !
@dariaserhiienko3876
@dariaserhiienko3876 Год назад
Оце так контент! Дякую безмежно, давно шукала такий туторіал на живому проекті ,а не просто окремих елементів)
@DoFurther
@DoFurther Год назад
Я так и хотел )
@Milevi4
@Milevi4 Год назад
Великий лайк, друже!) Дуже корисний матеріал)
@Alexenuuu
@Alexenuuu Год назад
Привет) Cуперский видос!!! Было б интересно как верстать этот адаптивный в WIX или WebFlow
@andriy-kos
@andriy-kos Год назад
Присоединяюсь
@dsurkovv
@dsurkovv 11 месяцев назад
привет, а можешь в видео обьяснить, как правильно дизайнить сайты для школ/колледжей учитывая стандарты от государства?
@andriy-kos
@andriy-kos Год назад
Салют. Через какой плагин можно экспортировать этот дизайн в html? Типо в Елементор на Вордпрес или какие-то плагины Фигмы? То есть задача в том, чтобы оживить дизайн уже в вебе
@dariaserhiienko3876
@dariaserhiienko3876 Год назад
Привіт, а коли розпочнеться дизайн практика? я підписалася та дуже чекаю на початок)
@dimaerlikh8887
@dimaerlikh8887 10 месяцев назад
Привет, спасибо за видос! Очень круто. Подскажи, пожалуйста, почему у меня у компонента article_thumb нет возможности "fill conteiner", а у тебя есть?)))
@litvin23
@litvin23 Год назад
4:35 в Adobe XD есть такая штука как Stack (единственное чего не хватает в Figma) - разное расстояние между группой слоёв. Можно менять порядок слоёв, а общий принцип остаётся
@VadimIlyin
@VadimIlyin Год назад
Да ладно
@DoFurther
@DoFurther Год назад
Посмотрел на RU-vid, прикольная фича. Есть чего ожидать от фигмы в следующем году )
@sashfomin
@sashfomin 8 месяцев назад
Звучит так, будто без 100 гр. не разобраться. Вроде понятно, но цепочка не выстраивается в голове. Но все равно круто, спасибо за видео))
@exfobae
@exfobae Год назад
пока досмотрел ролик и узнал про движуху, все места уже раскупили 😶
@DoFurther
@DoFurther Год назад
Это я жестко натупил с настройками. Сам чешу репу, почему только один человек записался (*вытираю слезы*)
@graysnake6143
@graysnake6143 Год назад
Хахахахах. Я в шоке! Ну красавчик. Точно дэвид блэйн! Подписываюсь.
@vitavika
@vitavika Год назад
Класна робота! Найчастіше приходиться робити адаптив саме для мобільного екрану і там буде дуже багато ручних доопрацювань, перебудови блоків і тд.
@dikaleto9681
@dikaleto9681 Год назад
супер кайф!
@Anton_Ivaniuk
@Anton_Ivaniuk Год назад
Супер полезно!
@IgorBobyrev
@IgorBobyrev 11 месяцев назад
Где вы раньше были, где? 😭
@alexbov
@alexbov Год назад
Спасибо
@nataliya336
@nataliya336 Год назад
Игорь, подскажите pls,kind of got stuck... я сделала 8 frames. They adapt, вроде как works smoothly. Можете уделить немного времени,накопились вопросы?
@miranbuke
@miranbuke Год назад
Верстка макета. Уровень "Боженька"
@user-dt8tk3xy5g
@user-dt8tk3xy5g Год назад
Блен, а шо делать если бэкграунд не монолитный по цвету?
@andriibalyberdin5648
@andriibalyberdin5648 Год назад
Дуже круто!
@user-gt5gi9df9f
@user-gt5gi9df9f Год назад
Это еще не чёрная магия, а так серая. Вот если ты делал бы всё в автолайаутах и с адаптивными компонентами и добавлял переменные использую плагин гугл таблицы вот тогда была бы чёрная магия. Ну ты молодец я тоже все собираю компонентами и авто лайаутами. 😉👍
@user-zj2bb2pj8u
@user-zj2bb2pj8u 3 месяца назад
Переменные только при платной подписке! Что для новичков и так без денег будет ужасно дорого
@desssigner
@desssigner Год назад
Очень полезная вещь для тех кто начинает. Для тех кто с опытом тоже полезно, если что :))
@Karnassix
@Karnassix 11 месяцев назад
Наглядно и понятно, заодно еще пару полезных нюансов показал. Но побуду граммарнаци. Это не адаптивность. Это «респонсив» дизайн. Фактически это то, из чего в свое время адаптивность выросла
@anya6182
@anya6182 Год назад
Мне кажется следующий шаг это выгрузка дизайна фигмы сразу в код. Или такой плагин уже есть? Ведь по сути все эти блоки это дивы в html а настройки автолейаута это настройки css ))
@DoFurther
@DoFurther Год назад
Ага. Это то к чему нас подталкивают инструменты в Фигме.
@vgenm2457
@vgenm2457 Год назад
Он есть, толь в твоих мечтах 😄
@andriy-kos
@andriy-kos Год назад
Такие плагины уже есть)) но они лишь хтмл выдают)) однако можно потом натянуть на ВП
@user-zj2bb2pj8u
@user-zj2bb2pj8u 3 месяца назад
Plugin -> Figma to Code
@gypsy2109
@gypsy2109 Год назад
Пятая минута ролика.. А я уже запуталась.
@DoFurther
@DoFurther Год назад
Так иногда бывает. Открой исходник в фигме и постарайся повторить. На слух сложнее воспринимать в сравнее с тем, когда повторяешь действие по примеру.
@MarcusRambo1991
@MarcusRambo1991 Год назад
класс!
@fligerg1512
@fligerg1512 Год назад
Я новичек. Посоветуйте что начать изучать, Adobe XD или Figma?
@DoFurther
@DoFurther Год назад
Figma
@user-mb8rm5mg5x
@user-mb8rm5mg5x 10 месяцев назад
Спасибо за видео! Почти все понятно 😅 Есть замечание, вот тут*; в конце, после создания отступов у всего макета «сломался» дизайн, по задумке горизонтальные линии должны идти до конца макета без отступов (ну или должны быть полные границы вокруг). *ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-BLKzlVjGYtg.html Еще не очень понятно, почему такое решение: дивайдеры вместо обводки дочерних контейнеров.
@EugeneD456
@EugeneD456 Год назад
3:00 лол))) это очень смешно!!
@KattyKkk
@KattyKkk Год назад
класс класс класс!
@user-jr6qt5rj8b
@user-jr6qt5rj8b 2 месяца назад
Куда делся Space Between в 2024?
@kirf2
@kirf2 Год назад
можно было просто назвать Кайфую от автолейаута)) 16 минут не понял зачем дивайдер рисовать, если можно просто добавить бордер в автолейаут?
@DoFurther
@DoFurther Год назад
Потому что тогда у нас получится отступ до бордера с фиксированным значением.
@user-ek1wi2pv4o
@user-ek1wi2pv4o Год назад
Дякую, друже
@wswanter
@wswanter Год назад
Требую фулл название файла!!!!!!😄
@DoFurther
@DoFurther Год назад
Да там всё вместилось ) Все три недели отчаяния, когда я выносил стационарный компьютер, чтобы при помощи телефона за 40 минут запустить фигму и занести включенный компьютер обратно в мастерскую. Короче говоря, без интернета - трудно )
@alexunknown5152
@alexunknown5152 11 дней назад
Так через что ты там загрузил бл***скую Фигму?)
@ArtCamp999
@ArtCamp999 Год назад
Очень красиво и ничего не понятно
@VnukKonyaBudennogo
@VnukKonyaBudennogo Год назад
Как оплатить тариф в фигме? В free версии всего 3 страницы можно создавать
@DoFurther
@DoFurther Год назад
Что-то я такое впервые слышу про 3 страницы.
@VadimIlyin
@VadimIlyin Год назад
?? сотни страниц, просто все лежат в drafts
@VnukKonyaBudennogo
@VnukKonyaBudennogo Год назад
@@DoFurther то есть я могу без проблем отрисовать 10-30 страниц для своего сайта услуг к примеру?
@DoFurther
@DoFurther Год назад
@@VnukKonyaBudennogo конечно
@user-gw5bp6nn8u
@user-gw5bp6nn8u Год назад
@@DoFurther нет, на базовом тарифе только 3 страницы
@urumova_elina
@urumova_elina 5 месяцев назад
у меня не получаааетсяяя 🥲 что-то я делаю не так
@jsnezhik
@jsnezhik Год назад
круть
@user-py1jc4rt1g
@user-py1jc4rt1g Год назад
один вопрос, а для чего это нужно?
@alionacandvi
@alionacandvi Год назад
Вот и мне интересно. Разработчики при чем говорят, что это бред и для них такое точно не нужно. Только жизнь им усложняют
@alionacandvi
@alionacandvi Год назад
Теперь спросите верстальщиков нужно ли им это и не усложнит ли это им жизнь. Я уже спросила- они не понимают зачем это нужно и с такими макетами им работать сложнее
@DoFurther
@DoFurther Год назад
Мои клиенты - не верстальщики.
@user-oc7bd7dn9z
@user-oc7bd7dn9z 6 месяцев назад
зачем эти мемасы не уместные, столько воды
@SHonda-fq3gp
@SHonda-fq3gp 8 месяцев назад
получилось то, что мы и хотели - ... ничего 😄
@ankis_yt
@ankis_yt Год назад
👍
@il-2000
@il-2000 Год назад
я испортил круглую цифру "100" своим 101-м комментом :)
@lettaluck
@lettaluck 4 месяца назад
Если вы посмотрите это видео, а потом повторите пару раз, то можете считать, ято фигму вы выучили.
@user-pg5bo6no5b
@user-pg5bo6no5b Год назад
ничего непонятно (( к автору видео нет никаких претензий. но я даже не понимаю о чем вообще идет речь. вАаабще(( и это после 8 месяцев после курса "Веб дизайн" делаю макет лендинга ( уже 2 месяц) и хочется чтобы всё адаптивно тянулось. но увы, не приблизился к решению даже на 5% видимо в 38 лет только коробки переставлять могу. извиняюсь, что здесь сорвался, но уже почти целый год никаких результатов в этой сфере
@user-py1jc4rt1g
@user-py1jc4rt1g Год назад
я уверен все старания, если не сдашься, очень хорошо окупятся ;)
@antimczenko
@antimczenko Год назад
АААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААААА!!!!!!!!!!!!!!!!!!!!!!!!!
@dasha_ccheese6545
@dasha_ccheese6545 Год назад
Всем привет! Кто как начинал свой путь в веб-дизайне? Я сейчас пытаюсь устроиться в студию, т.к опыта мало, но вакансий нет вообще или игнор. Кто как получил свой первый оффер? Крик души уже :((((((
@DoFurther
@DoFurther Год назад
Нужно разбираться, что у тебя с работами, а также с тем как ты ищещь работу (собеседования, отправка e-mail, коммуникация в соц. сетях). Для начала глянь моё видео «Как устроиться в студию» (там Тема Лебедев на обложке).
@NataGrig
@NataGrig Год назад
а сколько ты ждешь? мне приходило несколько предложений спустя 2-3 месяца как отправляла св)
@dasha_ccheese6545
@dasha_ccheese6545 Год назад
@@NataGrig отклики с тестовыми быстро приходят, а дальше обычно тишина после того как высылаю тестовое
@NataGrig
@NataGrig Год назад
@@dasha_ccheese6545 после тестового еще месяц может пройти
@piskovaia
@piskovaia Год назад
6:30
@QWERTY-ks8gf
@QWERTY-ks8gf Год назад
а зачем нужен адаптивный дизайн только для дизайна под мобилки ?
@andriy-kos
@andriy-kos Год назад
Да, потому что 80% трафика с моба
@divcase
@divcase Год назад
03:00 - проорал в голос)
@tw1x234
@tw1x234 Год назад
Я который ничего не понимаю. Кажется что это китайский язык. Есть такие?))
@user-it4hc1sl9x
@user-it4hc1sl9x Год назад
Какой в этом смысл? Верстальщик и так знает что между брейк поинтами контент сужается и отступы между элементами уменьшаются
@DoFurther
@DoFurther Год назад
Можно же на основе автолейаута продолжить делать и мобильную версию, которая будет значительно отличаться от веб версии. Но такой подход будет полезен не только при работе с адаптивом, но и на стадии внесения изменений в дизайн.
@11sparks52
@11sparks52 9 месяцев назад
Урок не актуальный. В фирме поменялись какие-то фичи и верстка не тянется
@DameliDautkanovalancaster
@DameliDautkanovalancaster 2 месяца назад
где найти этот долбаный constraint? ну почему нет хотя бы одного урока со всеми доступными объяснениями. вечно обо что-то спотыкаешься. у меня задача срочная, а я не могу разобраться, как сделать мультиадаптивный дизайн для всех экранов. даже к дизайну не подошла
@user-gw5bp6nn8u
@user-gw5bp6nn8u Год назад
Родительский компонент лучше не держать в макете
@DoFurther
@DoFurther Год назад
100%
@andriy-kos
@andriy-kos Год назад
Поясните пожалуйста детальнее… почему и где тогда держать?
@user-oc7bd7dn9z
@user-oc7bd7dn9z 6 месяцев назад
супер неудобная подача, не смогла даже минуту посмотреть
Далее