Обновление Figma 2023 - Всё про режим Dev Mode

  Рет қаралды 23,712

Анна Блок

Анна Блок

Күн бұрын

✅ Регистрируйся на бесплатный интенсив "Старт в веб-разработку": frontendblok.com/marathons/we...
На интенсиве:
- сделаешь сайт, используя HTML, CSS и JavaScript
- узнаешь, как получить первый заказ в 2023 году
- поймешь, что нейросети станут вашими лучшими помощниками
- получишь дополнительные подарки, бонусы и скидки
*****
Figma выпустила крупное обновление - Dev Mode. В этом видео вы узнаете больше о возможностях, которые открываются для разработчиков при использовании этой фичи.
Про Dev Mode - www.figma.com/dev-mode/
Обзор Figma - • Figma за 13 минут для ...
Обзор Pixso - • ЭТО уничтожит Figma - ...
Единицы измерения (ч.1) - • Единицы измерения CSS ...
Единицы измерения (ч.2) - • Единицы измерения CSS ...
Расширение Figma для VS Code - marketplace.visualstudio.com/...
Таймкоды:
00:00 Про Dev Mode
01:06 Что нового появилось?
02:08 Dev Mode на старых макетах
02:24 Интенсив по веб-разработке
02:47 Продолжаем изучать Dev Mode
08:43 Dev Mode в новых макетах
11:40 Расширение Figma для VS Code
13:29 Linear и Jira в Figma
13:59 Github/Gitlab в Figma
15:00 Итоги
🔵 Дзен - zen.yandex.ru/annblok
🔵 ВК - tpverstak
🔵 Telegram - t.me/tpverstak
🔵 Чат Telegram - t.me/tpverstakchat
🔵 Instagram - / annblok
🔵 TikTok - / annblok_webdev
🔴 Задать вопрос - frontendhelp.me/ru
🔴 Обучение - frontendblok.com/

Пікірлер: 104
@annblok_webdev
@annblok_webdev 11 ай бұрын
✨ Поддержать выход нового полезного контента можно на Boosty: boosty.to/annblok
@typical_man6696
@typical_man6696 11 ай бұрын
То самое чувство, когда документация не прочитана, понимания зачем это - нету... а говорить о чем-то нужно...
@flyeron1981
@flyeron1981 11 ай бұрын
Ну и зачем это нужно верстальщику? Хотя бы несколько плюсов сильно выраженных. Я максимум значения в rem могу выделить. Но и то вряд ли дизайнер будет с ними заморачиваться отдавая вам проект на вёрстку
@IrinaChernikova90
@IrinaChernikova90 11 ай бұрын
Мультиколор в тренде! Судя по модному настроению,в этом сезоне нужно окружать себя яркими красками.
@user-gq4lg1fq9u
@user-gq4lg1fq9u 11 ай бұрын
При каждом обновлении фигмы жду твою реакцию. Она самая содержательная и практическая. Спасибо. И заранее спасибо за новый курс по фигме. Предыдущий уже до дыр засмотрен))
@user-xc2yu7ib3r
@user-xc2yu7ib3r 11 ай бұрын
Большое спасибо за разбор! Круто будет если выпустишь новый курс по Фигме 3.0 =)
@user-sq9mb8qo3e
@user-sq9mb8qo3e 11 ай бұрын
Я считаю, что это хорошо, когда разработчики следят за своим продуктом и делают его лучше. Спасибо за видео, было приятно посмотреть и послушать!
@dimka_tregubov
@dimka_tregubov 11 ай бұрын
Прив, знаешь что-нибудь о работе с токенами из фигмы? Можно ли как-то экспорнтнуть их все сразу в один CSS файл?
@tetyana5295
@tetyana5295 11 ай бұрын
хорошо, что у программы теперь такое новое обновление, с таким намного удобнее работать всем пользователям, спасибо, что рассказали об этом
@Svet__alya
@Svet__alya 11 ай бұрын
Обновление понятно,хорошо пояснили, теперь буду знать то что осталось и то что поменялось😊
@user-nz3hf7nb4i
@user-nz3hf7nb4i 11 ай бұрын
Каждый день что то новое😊 спасибо за обзор, очень доступно 👍
@alexschaus1909
@alexschaus1909 11 ай бұрын
Спасибо за хорошее обучающее видео просмотрел сбольшим удовольствием всё ясно и доступно.
@user-hs7fi5se4f
@user-hs7fi5se4f 11 ай бұрын
Понятно и просто всё объяснили , видео получилось информативным и полезным.
@mybestislands8646
@mybestislands8646 11 ай бұрын
Очень люблю и коллекционирую лекции и гайды по работе с программами , ведь если инструкция не пригодится завтра , понадобится послезавтра . Спасибо и лайк .
@mystreetlifting76
@mystreetlifting76 11 ай бұрын
Ничего в этом не понимаю, но тоже собираю такие видосы на будущее)))
@al1ve2022
@al1ve2022 10 ай бұрын
Спасибо за видео =) У меня такой вопрос - недавно меня попросили составить аудит сайта - найти его визуальные и технические недостатки и как их улучшить. Как в плане вёрстки, так и в плане сео. Можете записать ролик по написанию и составлению аудита сайта на конкретном примере? Было бы интересно посмотреть такое видео.
@user-ct2dv3vr1n
@user-ct2dv3vr1n 11 ай бұрын
Хорошая инструкция, можно прислушаться и попробыаать свои силы. Спасибо за информацию .
@user-FedorVorobyev
@user-FedorVorobyev 11 ай бұрын
Да, спасибо, интересно было узнать о возможностях, которые открываются для разработчиков при использовании этой фичи.
@user-iz9qp7xt2d
@user-iz9qp7xt2d 11 ай бұрын
Обучалка хороша, всегда приветствую таких людей, благодаря им мы знаем много и нетратив свое драгоценное время на поиск и обучение
@user-dw2tc4cq9x
@user-dw2tc4cq9x 11 ай бұрын
Чем проще командам проектировать, документировать, находить и реализовывать высококачественные проекты, не упуская при этом из виду работу и друг друга, тем лучше результаты продукта.
@farmlingarchontas2216
@farmlingarchontas2216 11 ай бұрын
Неплохо, неплохо... Я давно перестал следить и редко захожу, но посмотреть что вышло нового всегда интересно.
@user-ol8wp5fs4l
@user-ol8wp5fs4l 11 ай бұрын
смотря ваш канал я многому научилась многое узнала хорошая спасибо большое за то что да делайте такие видео обзоры который можно научиться воспользоваться спасибо большое
@leoclu8939
@leoclu8939 11 ай бұрын
скоро потеряем Фигма
@martix3090
@martix3090 11 ай бұрын
Нововведения слабые, Профит сомнителен, потеря маловероятна
@Zyprion
@Zyprion 10 ай бұрын
​@@martix3090в vs code есть плагин. Фигму уже и открывать не надо
@marinagor
@marinagor 11 ай бұрын
очень интересно и познавательно получилось, спасибо за видео!
@PearlDpUa
@PearlDpUa 11 ай бұрын
9:30 я уже давно привыкла к пикселям и не знала что можно иначе
@elinalara1752
@elinalara1752 11 ай бұрын
Спасибо за обзор обновлений
@sergeymickolaenko1161
@sergeymickolaenko1161 11 ай бұрын
Отличная новость, спасибо что подробно рассказали об этом обновлении к приложению👍👍
@user-tg7cz5ox9u
@user-tg7cz5ox9u 11 ай бұрын
Очень важный обзор и своевременно представленная информация с демонстрацией возможностей. Очень актуально.
@FullFilmus
@FullFilmus 11 ай бұрын
Здравствуйте Анна, можете на практике создать сайт и показывая всем как вы это делаете, надеюсь меня услышат!
@user-me8cn1hk6j
@user-me8cn1hk6j 11 ай бұрын
Новые возможности, тем более продуктивные всегда радуют. Спасибо за обзор.
@tolasnisar2494
@tolasnisar2494 11 ай бұрын
Отличный у вас канал, много полезной информации узнал от вас.
@911allcausticcamera9
@911allcausticcamera9 11 ай бұрын
Будет чем заняться в ближайшие часы смотреть в чём обновление и как работать
@gamestudio9722
@gamestudio9722 11 ай бұрын
Да, интересно получилось, мне нравится такой подход.
@fcvaivai...............1268
@fcvaivai...............1268 11 ай бұрын
много полезной информации узнал от вас...
@Youtuber__I
@Youtuber__I 11 ай бұрын
спасибо за обзор нового обновления все новые функции объяснили
@lex_nel3097
@lex_nel3097 11 ай бұрын
Копирование текста через контент и раньше было.
@sashabest1479
@sashabest1479 11 ай бұрын
Нужно будет протестировать их новое обновление и приложение, посмотрим что эти ребята создали и как оно работает.
@user-olena_shatun
@user-olena_shatun 11 ай бұрын
Лично для меня в новинку, но многое я всетаки взяла на заметку 😊
@vavanmozg2915
@vavanmozg2915 11 ай бұрын
Ничего не понял, но очень интересно!!!😁
@cooperanderson8651
@cooperanderson8651 11 ай бұрын
Если приложение обновляется - то значит оно живет! И естественно развивается в лучшую сторону.
@via754
@via754 11 ай бұрын
Не понял как теперь выделить несколько текстовых слоев для копирования. Реньше можно было это делать с зажатой cmd
@Arvest135
@Arvest135 11 ай бұрын
Ребят, помогите, столкнулся с проблемой. Установил плагин в VS Code и при нажатии на Log in после установки ничего не происходит...
@azizkalandarov7768
@azizkalandarov7768 11 ай бұрын
Если возможно, не могли бы вы предоставить ссылку на фигму модели кота, показанного в этом видео 😅
@Stanley19708
@Stanley19708 11 ай бұрын
Не потерял ни минуты свободного времени зря, здесь хорошо рассказывают про обновления
@alinaevhenivn6
@alinaevhenivn6 11 ай бұрын
Круто что есть обновление 😍и можна узнать как пользоваться приложением
@jmol1003
@jmol1003 11 ай бұрын
Как и прежде надо следить за обновлениями и не пропускать что будет нового
@Obraveliss
@Obraveliss 11 ай бұрын
Я не понял сама фигма будет платная или этот девмод?
@LavandaKicK
@LavandaKicK 11 ай бұрын
Да как в этом режиме объединить одним блоком три элемента чтобы посмотреть размер для создания блока внутри того же контейнера, так и не понял. Раньше было лучше.
@user-gz7mj1qj6h
@user-gz7mj1qj6h 11 ай бұрын
Обновление, действительно, хорошее и полезное! Спасибо!
@stalker8828
@stalker8828 11 ай бұрын
вот это на самом деле хорошие новости!
@CityGorsk
@CityGorsk 11 ай бұрын
Я так понял фигма будет теперь платное приложение? А есть ли аналоги, хоть более менее удобные? И можно на них обзор.
@aleksmev4099
@aleksmev4099 11 ай бұрын
Figma выпустила новое приложение 2023! Спасибо за профессиональный обзор про режим Dev Mode!Полезный контент!Удачи!
@viktordybach8763
@viktordybach8763 11 ай бұрын
Отличное видео для тех кто интересуется данной темой
@Pinkka177
@Pinkka177 8 ай бұрын
А как отключить эту версию?
@roxone314
@roxone314 11 ай бұрын
Ощущение что этот девмод - подготовка к тому, чтобы дизайнеры постепенно стали сами делать сайты, без верстальщиков
@killmepls.
@killmepls. 11 ай бұрын
Что? Девмод усложнил работу верстальщиков же
@oliverst5302
@oliverst5302 11 ай бұрын
До этого обновления как-то проще и удобней было
@rojiblanco5553
@rojiblanco5553 11 ай бұрын
Nach wie vor müssen Sie die Aktualisierungen verfolgen und nicht verpassen, was neu sein wird
@FozGenKo
@FozGenKo 10 ай бұрын
Честно, новое объявление мне не понравилось, поведение в некоторых макетах фигмы стало просто неадекватным, откопал один старый макет, там был чекбокс, который я верстал, и это был один из тех случаев когда свойство position: absolute и координаты top, right... и тд я смело переносил в проект, ползунок с точкой, а после обновления фигма считает, что чекбокс это нераздельный элемент, можно только экспортировать как картинку... Только через дизайн мод можно извлечь размеры, но позиции уже нет, понимаю что можно, да, но это уже не так удобно. И я как только это заметил перешёл в пиксо. По поводу "новых" изменений, которые вы назвали... Ну, не хочу вас обижать, но тут вы неправы, копирование текста было очень давно, год точно, скорее даже два, переключение между ios Android, css, тоже было...
@artemgrunin2011
@artemgrunin2011 11 ай бұрын
Честно говоря этот дев мод шляпа полная. Мне вкладка inspect больше нравится
@user-nt8uy4gg7g
@user-nt8uy4gg7g 11 ай бұрын
Inspect есть, вы чо
@tarque_
@tarque_ 11 ай бұрын
В автолайаутах убрали space between режим(((
@user-qc8ic8tb3x
@user-qc8ic8tb3x 11 ай бұрын
А по мне ужасно. - Они предлагают свойство gap для флексов, которое не работает в сафари < 14.1 версии. - Они так и не сделали алиасы каких-то значений в CSS переменные или константы препроцессоров (только для цветов). А эта фича есть в авокоде c 2014 года. - Родные полупиксели фигмы никуда не делись, но режим дев появился. - Анимации все еще нельзя экспортировать в видео или apng формат. Даже нарезать на картинки. - Все еще кроме CSS нет никаких других форматов веба типа стайлед компонентов, SCSS и прочего. В авокод есть препроцессоры. Из плюсов - Сторибук интеграция это интересно, но она уже была в виде плагинов. Я не очень понял, для кого это. Если бы я был верстальщиком на конвейере, я бы выбрал Avocode, сильно больше функционала, открывает разные форматы. Продуктовым фронтам тоже не подходит, CSS не так много, чтобы покупать себе инструмент для оптимизации его написания. Экономия времени на наборе css свойств крайне мизерная, учитывая, что CSS свойства помогает быстро писать emmtet.
@user-ct8dn5xj3o
@user-ct8dn5xj3o 11 ай бұрын
а вам не обязательно гэп использовать)
@user-qc8ic8tb3x
@user-qc8ic8tb3x 11 ай бұрын
@@user-ct8dn5xj3o не, это да. Просто они презентовали так свой дев мод, будто "как вы жили без этого раньше?! Купите и измените жизнь!". А по сути ничего нового, чего не было в фигме до этого (кроме переменных для цветов). Может будут ещё дорабатывать, не знаю.
@Tafratov
@Tafratov 11 ай бұрын
Я дизайнер и сейчас погрузился в ноукод разработку, которая не совсем ноукод, так как используются скрипты и часто менять приходится что-то в кастомных решениях руками, поэтому в css копаюсь часть, я работаю на Webflow и глядя на фигму, я вижу, что они начинают походить друг на друга, много фишек в вебфлоу реализуют по типу работы в фигме, а фигма движется в сторону реализации работы, похожую на то, что сейчас есть в вебфлоу. Итог такой, что я сейчас как дизайнер начинаю заглядывать на поляну фронтендера, самого слабенького и очевидного, но кайф для меня и для работодателя, что я полностью могу собрать крутой дизайн, повторить его на вебфлоу и реализовать все так, как это задумано изначально. Туда же со временем я добавлю знание сложных анимаций и 3д. Как итог - нет испорченного телефона и быстрая скорость разработки от первого наброска до полностью функционального сайта. Причем я говорю не про лендосы и примитивы, сейчас я работаю над сайтом с cms системой на трех языках, где на сегодняшний день 1000 страниц и которые будут масштабироваться дальше. Конечно для сервисов огромных это еще так себе идея, но большинство задач всех пользователей - покрывается. Как итог, появление режима разработчика в продукте для дизайнера говорит о том, что грань между этими направлениями больше начинает стираться. Многие дизайнеры этому не очень рады, но лично мне интересно работать с продуктом не только на уровне выбора цвета, шрифтов и сетки.
@WERWOLION
@WERWOLION 11 ай бұрын
Не можешь ты ничего реализовать. Ты можешь сделать продукт мусор. Фирма совсем не сечёт в технологии. Весь подход для дурака. И в целом фирма не может фронт. rem на фирме мусор потому что ремы Делаются в Sass в 100 раз удобнее.
@saluteismyname
@saluteismyname 11 ай бұрын
Куда пропала вкладка Inspect??? 😢
@annblok_webdev
@annblok_webdev 11 ай бұрын
Это теперь Dev Mode
@saluteismyname
@saluteismyname 11 ай бұрын
@@annblok_webdev и это станет платным скоро?
@saluteismyname
@saluteismyname 11 ай бұрын
А как посмотреть font weight? У меня не показывает
@war_criminal_
@war_criminal_ 11 ай бұрын
Здрасьте
@user-fg2cw7ui1c
@user-fg2cw7ui1c 11 ай бұрын
Самое конченное и не удобное обновление в figma, подскажите пожалуйста можно его как-то отключить? Или как вернуть вкладку inspect в верхний правый угол? Заранее благодарен.
@AntonioBenderas
@AntonioBenderas 9 ай бұрын
Сразу видно руку Adobe. Фигма стаёт похожей на Dreamviewer. Испоганили Фигму и ещё деньги за это просят
@dmitryn.4506
@dmitryn.4506 11 ай бұрын
Первые минуты видео. Просто потёк: "О да, детка! Вот теперь-то заживём! 🤪" Чуть дальше: "Всё тлен! Это божественное изобретение будет доступно только избранным, а все остальные будут страдать." Потом: "Ладно я найду способы оплатить это божественное творение! Это того стоит!!" Ближе к концу видео: "Падажжите! То есть вот эта вот хрень на постном масле, которая на практике в работе ничего не меняет, а ещё скорее всего и будет только вредить, как обычно напихивая всякой ненужной фигни от фигмы в стили, это ещё и денег будет стоить?! Вообще поохренели и зажрались! Всякую туфту недоработанную втюхивают! 😕" Видео - полный эмоциональный расколбас 😂
@amelianceskymusic
@amelianceskymusic 11 ай бұрын
Пожалуйста, не нужно про rem такое говорить. Может какие-то верстальщики-фрилансери без дизайнера и юзают рем, но в каких кейсах ето оправдано разработчику на продукте?
@raselbabu2486
@raselbabu2486 11 ай бұрын
Nice
@andreylagno2372
@andreylagno2372 11 ай бұрын
впервые вижу такой ролик про сервис фигма пока ничего не понял
@DoFurther
@DoFurther 11 ай бұрын
Круто конечно. Столько нововведений для разработчиков. А дизайнерам завезли превью в панели выбора шрифтов 😂
@annblok_webdev
@annblok_webdev 11 ай бұрын
Думаю, дизайнерам постоянно обновы завозят. А тут именно в сторону разработки мощные изменения сделали.
@alexander_stark
@alexander_stark 11 ай бұрын
ты точно смотрел: что завезли для дизайнеров???
@flyeron1981
@flyeron1981 11 ай бұрын
В общем пока этот dev mode по большому счёту не нужен. И смысла за него платить нет
@WERWOLION
@WERWOLION 11 ай бұрын
Сделали бутстрап мусор
@ayni9
@ayni9 11 ай бұрын
Если вы не разработчик то смысла нет, если вы разработчик то это имеет огромный смысл
@eg3896
@eg3896 11 ай бұрын
Аня ❤
@The_Witcher_Of_Rivia
@The_Witcher_Of_Rivia 11 ай бұрын
А можно с тобой познакомиться? Я любился в тебя)))))
@BugzzV
@BugzzV 11 ай бұрын
таким приложением нужно учится пользоваться и набираться опыта
@Ricky_motionless
@Ricky_motionless 11 ай бұрын
АХАХАХА Я СИЖУ СЕЙЧАС, ДЕЛАЮ СТРАНИЦУ САЙТА И У МЕНЯ НА ГЛАЗАХ ВСЕ МЕНЯЕТСЯ. Я ТЕПЕРЬ НИЧЕГО ПОНЯТЬ НЕ МОГУ ТАМ
@robo_tyaga
@robo_tyaga 11 ай бұрын
Все это очень плохо работает, когда макет делают криворукие дизайнеры, коих так-то много. А итоге постоянно приходится переключаться этот дев мод обратно на дизайн, исправлять дизайнерские косяки и опять переключать обратно, чтобы копировать стили
@alexander_stark
@alexander_stark 11 ай бұрын
2000 р в месяц за возможность ускорить работу ровным счетом ничего не стоит...
@killmepls.
@killmepls. 11 ай бұрын
Дев мод замедляет работу, кнопка "посмотреть код" была удобнее
@-shakirov
@-shakirov 11 ай бұрын
Фигма с новой обновой верстальщикам по мелочи много чего испортила. Текст теперь полным блоком копируется нельзя по строчке. Цвета и некоторые свойства как-то не по копировать-вставить френдли задаются для верстки. Падинги не выделяются верно и ширина контента - приходится визуальные расчеты делать) лишняя путаница. Ужс короче. По мелочи по мелочи все, а мешает и замедляет плюс ошибки по внимательности надо лишний раз перепроверять опять таки на проектах лишнее время. Как веб версию откатить? Или хотя бы десктоп ? Та кто думал адоб купит фигму и сделает говно
@annblok_webdev
@annblok_webdev 11 ай бұрын
Паддинги и раньше не корректно отображались
@-shakirov
@-shakirov 11 ай бұрын
Есть такое но было удобнее. Сейчас вот макет верстаю, часть высоты от расстояния между блоками отображает как высота плюс верхний паддинг нижнего блока 😂 текст так вообще по слову только можно копирнуть либо всем блоком. Буду обходняк искать или на более сподручные решения переходить 😀 интересно ИИ сможет сайт верстать по макету ? Мне кажется с позиционированием все же проблемы возникнут.
@user-nt8uy4gg7g
@user-nt8uy4gg7g 11 ай бұрын
При выделении текста в inspect есть content там текст, который выделен, можно копировать часть текста
@-shakirov
@-shakirov 11 ай бұрын
@@user-nt8uy4gg7gа но опять таки неудобно когда ставит дизайнер списком текст и между ними отступы в одном контейнере. Раньше кликнул на строку два раза копирнул вставил. Тут выделил от и до один элемент, скопировал потом след выискиваешь выделяешь, ну тупо же. Зачем портить то, что было хорошо
@user-xj6ur2ei9k
@user-xj6ur2ei9k 11 ай бұрын
Жаль, что Figma становится платной, но к этому уже привыкаем, что за все нужно платить!
@killmepls.
@killmepls. 11 ай бұрын
Как не професионнальный верстальщик выскажу свою позицию. Обновление просто убило все прелести фигмы, когда ты аолностью копируешь весь css и меняешь буквально пару параметров. Теперь верстка занимает времени раз в 5 больше, дак еще и платным будеь 😂 воруют время за деньги) Так что я в Pixso, надеюсь там на такое позорное обновление не решаться
@u-kob
@u-kob 11 ай бұрын
В 2023 году вёрстка занимает во много раз меньше времени, чем было раньше. Я помню, ещё в 2008 году, когда начинал, вёрстку под IE6; как нужно было извратиться с картинкой, чтобы сделать резиновый блок с закруглёнными краями. А сейчас это решается одним свойством border-radius. Сейчас просто лафа для верстальщика, да и инструментов сейчас гораздо больше, а раньше пользовались только Photoshop, Dreamweaver ну и Fireworks, была такая прога у Adobe 😉
@krakanosh
@krakanosh 11 ай бұрын
Полностью с тобой согласен, это обновление отвратительное и его надо откатить.
Sketch App Tutorial for Coders
13:49
Анна Блок
Рет қаралды 22 М.
Figma для верстальщика | Как пользоваться фигмой?
12:13
Илья Ландар | WEB РАЗРАБОТКА
Рет қаралды 15 М.
Cute Barbie Gadget 🥰 #gadgets
01:00
FLIP FLOP Hacks
Рет қаралды 35 МЛН
Make me the happiest man on earth... 🎁🥹
00:34
A4
Рет қаралды 5 МЛН
How To Learn Algorithms? Why? #codonaft
19:22
codonaft
Рет қаралды 559 М.
Figma теперь в VS Code???
8:24
Анна Блок
Рет қаралды 69 М.
⚡ Замена компонентам? Большое обновление Фигмы 2024
19:34
Study Kvo. Обучение веб-дизайну и UX UI
Рет қаралды 16 М.
Figma Tutorial: Master Figma Dev Mode in 8 Minutes
8:52
DesignWithArash
Рет қаралды 29 М.
Figma Tutorial in 13 minutes for web designers and web developers
13:33
Анна Блок
Рет қаралды 308 М.
Cute Barbie Gadget 🥰 #gadgets
01:00
FLIP FLOP Hacks
Рет қаралды 35 МЛН