Auto Layout в Figma. Как Дизайнить в 10х Раз Быстрее

Поддержать канал

Если ты хочешь владеть черным поясом по автолейаутам в figma, то прежде всего тебе необходимо понять, что это за инструмент и зачем он нужен. В этом видео я не буду делать акцент на том как сделать настраивать автолейаут, а хочу показать тебе насколько быстро с его помощью можно дизайнить сайты, а не только делать кнопки. Заодно глянем какие обновления autolayout нам подготовила figma.

[anfrolova]

Ахринеть просто, во всем ютубе ты единственный, у кого я нашла достойный пример автолейаута. Остальные все максимум показывают, как кнопку создать) а уже сложнее конструкцию не показывают) подписка!

[Sinicavrukelive]

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

[GoodArtRaidler]

Наткнулся на видосик с реков, очень рад, что посмотрел его!
Сергей, продолжайте в том же духе, очень понятно и интересно

[mariia-petrova]

Отличное видео! Обязательно снимите про каждую крутилочку ещё 🙌

[Анна-юхф]

Сергей, спасибо за подробное обучающее видео! Всё очень доступно

[АлексейЯснов-ищ]

Спасибо большое за видео! Давно искал информацию на такие темы — упрощение работы в Figma и ускорение всех процессов. Очень полезно! Буду благодарен, если ты выпустишь еще одно видео с более детальным разбором этой темы. Спасибо!

[TheMxdn]

Крутой ролик. Дизайнить на автолейаутах оно конечно правильно с точки зрения дальнейшей верстки, но ведь не быстрее. Без автолейаутов такой сайт можно сверстать за 5 минут вместо 15.

А ведь это просто механическое копирование. А в процессе дизайна, вместо того чтоб думать о «композиции, цвете и прочем» тебе приходится думать, как сложить это все в автолейаут, ничего не сломав, жанглируя правками от заказчика. И чем больше элементов, тем дольше верстка.

Автолейаут крутая штука, но делать все только через него — это сомнительная затея. С таким же успехом можно и сразу верстать html =)

[НатальяРомашова-ъщ]

Сергей, спасибо за видео! Наконец смогла чуть разобраться в этой теме и ваша спокойная подача очень комфортна для восприятия) В видео речь идёт про ножницы, не поняла - это скриншотер какой-то или в фигме есть инструмент?

[hanzohasashi]

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

1. - если мы говорим за адаптивный сайт, он же может быть сделать через рем, особенно если речь идет о лэндингах и корп сайтах. простым славами, сайт имеет пропорциональное масштабирования, а не динамическое.
- представим, что мы видим сайт в обычном адаптиве, так тогда для веб делается фиксированный контейнер
2. в цело мы не откидаем того, что таким образом можно сделать адаптив, но адаптив какого сайта и насолько он будет релевантный? если я выше описал, что есть рем для многих случаев и есть статический контейнер, тогда можно представить, что еще может быть веб приложения, дашборт на всю область веб версии, где нужно сохранить пропорции, но таким образом, мы закроем вопрос только веб версии, мобилка сразу отпадает, а планшет версия выйдет нерентабельной, 100% должна быть оптимизация и для этого нужно будет распаковывать все, что-то новее добавлять, отнимать, уменьшать.
выходит можно использовать такой адапив в редких случаях, например в веб приложении, но на это уйдёт сколько же времени сколько и на одну промежуточною веб версию (что достаточно), которая буде более продуманная и точно без косяков, после лейаута.
3. забиваем на сетку полностью, просто сжали все и вуаля)
4. автор на видео взял проект, где его компоновка это самая малая часть, проект не сложный, но в нем есть идея, анимация, вот на это пойдут усилия, а не на то как подвигать тест, что по сути можно быстро сделать в ручную. уж лучше если что-то показывать в виде примера использования лейаута, это занудный магазин, с кучей полей, фильтров, карточками, вот там такое будет еще актуально, но снова таки, в примитивных рамках.
5. не в укор автору, но лучше бы сказал бы, что отступ в текст контейнере, должен быть одинаковый сверху и снизу и за этим нужно следить))
я не раз заходил в макеты, которые просили заредизайнить, там каждая крупица была в лейауте, там ногу можно поломать, главное что все в лейауте, но вот с дизайном, структурой, порядком все было просто круто (нет).
есть не менее важные вещи чем тех часть, но это не все понимают ибо игнорирую.
меньше надо сильно заморачивается, как упаковать очередной шаблонный сайт в контейнер, а лучше все осмыслить и придумать интересною идею, динамичною вовлекающею структуру, применить в базовом виде компоненты и контейнеры, все отсортировать и на выходе получить не только качественный, но и авторский продукт.

[Sara-mwwl]

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

[wisa]

Спасибо, очень наглядно. Но пока что работа с авто лояутом кажется мне усложнением работы, нужно руку набить на нем)
Интересно при работе с большими проетаки дизайнеры обычно все объекты превращают в авто лояут?

[evgeniyodeskiy]

Подскажи пожалуйста, всегда нужно основной фрейм делать автолеятом, или можно создать просто фрейм например 1240 и в нем уже элементы закидывать в автолеяют?

[eniseylitvinov]

А это нормально? Что когда ты все используешь в автолояут, создается большое количество фреймов и каждый нужно подписывать. А как потом это будет программироваться?