Как делать адаптив сайта с автолейаутом на самом деле, а не вот это вот всё 😂 Стрим #68

[@alexeybychkov_]

Вторая часть - kzbin.info/www/bejne/rGa0XnSqod6Gftk Файл из ролика - www.figma.com/file/QRmeDMIE3sK8E2BpsbVgEP/adaptives-template

[@alexeybychkov_]

Спасибо, что заглянули! :) А за комменты и лайки отдельные обнимашки ♥

[@МарияМухина-с3ш]

Посмотрела в записи! Спасибо большое! Скорость удобная, логика понятная, советы и рекомендации по адаптации взяла на заметку в следующие проекты) Еще раз - огромная благодарность за такие разборы!

[@alexeybychkov_]

спасибо за просмотр!

[@МаржанаБатирмирзаева]

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

[@alexeybychkov_]

Супер 💯

[@mikowaez]

Пожалуй это самый лучший канал о Фигме. Благодарю автора за проделанную работу. Буду ждать продолжения😉

[@alexeybychkov_]

очень рад! 🥳

[@NatalyS28]

Спасибо! Алексей, смотрю Вас теперь постоянно. Классная подача, просто, живенько.

[@alexeybychkov_]

рад, что нравится! 🎉

[@lenakot6118]

Супер. Обожаю такие видосы. Пересматриваю по несколько раз. Жду продолжения 👍

[@alexeybychkov_]

рад, что нравится!

[@ТатьянаФедорович-ы9ж]

Просто шикардос, продолжай в том же духе ☀️

[@alexeybychkov_]

Спасибо за просмотр)

[@rakyshkarakyshka9193]

Огромное спасибо тебе за возможность посмотреть стрим в записи .

[@alexeybychkov_]

пожалуйста!

[@Linusik_online]

Большое спасибо! Как на лекциях) ждём следующую пару)))

[@alexeybychkov_]

пожалуйста)

[@elenashchotkina1602]

Каййййф! Супер-стрим. Обожаю твою манеру и скорость изложения - это пушка-ракета! Благодарю за полезности 🔥🙃👍

[@alexeybychkov_]

рад, что нравится! 🥳

[@aleksand135]

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

[@alexeybychkov_]

рад, что нравится!

[@The0Dash0]

у нас был такой препод в универе. Только он постоянно забывал исходную тему и вопрошал "к чему я это приплел" 😄

[@ОляНарижная-н6н]

2 часа как на одном дыхании. Просто лучший 👏🏻

[@alexeybychkov_]

Огонь)

[@olgachirkova5389]

Спасибо! Впервые смотрела стрим))) я обожаю верстку - посмотреть расположение контента от дизайнера- полезная штука. Хорошо , если моб.версию приложат, а планшет -это ж глаза в кучу- как все расположить (для меня).. вместо того , чтоб кайфофать от написания кода- сидишь и ломаешь голову- куда все этт впихнуть🤪 и действительно, когда голова сломалась- планшет выглядит как мобилка а-ха-хах))) Вообщем , спасибо! Полезно посмотреть перестроение. Обязательно посмотрю следующий стрим)) нет.. жду с нетерпеньем!!!!👌👍👍👍

[@alexeybychkov_]

спасибо за просмотр)

[@irynamelnychenko88]

Спасибо большое! Было очень полезно, настройка автолейаутов особенно 🔥

[@alexeybychkov_]

Пожалуйста большое!

[@Докс-д2е]

Очень информативные ролики. Даже запись стрима, самый бичевый формат, но смотрится бодро, хоть и перематываю некоторые моменты. По большей части, нуждаюсь в демонстрации. Поэтому, такая скорость донесения материала - однозначный плюс. Самое важное, придерживаться последовательности , что "из А, сделав Б, получаем В". Но фигма не так уж сложна, чтобы пропуск некоторых моментов стал критичным. Однако, полезно делать отсылки, где о пропущенном рассказывается подробнее. Хотя, на канале, похоже, есть просто всё и обо всём. Смотри и преисполняйся знаниями

[@alexeybychkov_]

круто) Рад, что нравится!

[@Sergio-gc2lh]

37:36 Алексей, называйте всё своими словами.....не обманули, а на хутор послали за дикообразами (LOL). Бомба, адвайсы и типсы, просто шик. Сколько не пересматриваю, отрываю для себя всё новые и новые моменты, огонь-огненный!!!

[@alexeybychkov_]

)) спасибо за просмотр 🥳

[@Татьяна-ю1р2м]

Спасибо за полезный стрим. Очень много важной инфы и отличный формат, когда можно наблюдать за твоей работой и еще вопросы задавать!!!! Агонь=))

[@alexeybychkov_]

Агонь))

[@natalie_web_designer]

Мой самый любимый канал, подача материала просто огонь 🔥

[@alexeybychkov_]

Ееее ❤️ спасибо!

[@prostovictoria748]

смотрю) правда в записи=) но уже норм. вспомнила всё) спасибо)

[@alexeybychkov_]

🥳

[@mariyapodgayskaya5053]

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

[@alexeybychkov_]

супер)

[@AL_V_P]

Я не новичок, поэтому ваши видео обычно смотрю х2 и все понимаю😁 а для новичков у вас отличный курс на канале есть😏 Спасибо за ролик👍🏻

[@elenashchotkina1602]

На х2 прям очень хорошее восприятие🙄. Я пока максимум на х1,5 😜

[@AL_V_P]

@@elenashchotkina1602 чем больше роликов смотришь, тем быстрее хочется их воспроизводить) инфы много везде, а времени на все не хватает, вот и приходится ускоряться)

[@elenashchotkina1602]

@@AL_V_P поддерживаю🔥

[@alexeybychkov_]

спасибо за просмотр)

[@U.Kazinets]

Классный стрим всё суперкруто, отдельное спасибо всем в чатике

[@alexeybychkov_]

Спасибо за просмотр!

[@its_no_way]

Два часа на одном дыхании! Огонь 😍

[@alexeybychkov_]

ну класс)

[@alexwayhome]

Отличный канал, всё очень понятно объясняешь. Спасибо большое!

[@alexeybychkov_]

очень рад)

[@puding_sakura]

Благодарю! Супер полезный стрим!😃

[@alexeybychkov_]

Ну класс, пожалуйста!

[@ИринаГуринович-к8т]

Ждем продолжения, спасибо за стрим! 🔥

[@alexeybychkov_]

Спасибо за просмотр!

[@pridari]

Очень интересно наблюдать за работой профессионала!👍🏼👍🏼

[@alexeybychkov_]

🥳

[@yevgeniiagalushchak9566]

Крутое видео! Ты лучший🤗

[@alexeybychkov_]

спасибо 🥳

[@alinalazchenko8310]

Спасибо большое, Алексей) очень жду вторую часть)

[@alexeybychkov_]

Пожалуйста!

[@Maribette]

Посмотрела стрим, буду ждать продолжение и макет! Очень много полезной информации, обязательно потренируюсь) Спасибо!👐🏻

[@alexeybychkov_]

Отличный план!

[@TsvetAnna]

Как всегда познавательно и зажигательно! Спасибо))

[@alexeybychkov_]

Ну класс! 🎉

[@TheAlenaVolkova]

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

[@alexeybychkov_]

пожалуйста!

[@TheFIrina]

Супер!! Столько полезной информации, спасибо огроменное))))

[@alexeybychkov_]

пожалуйста!

[@grobka]

Спасибо за такой полезный стрим!

[@alexeybychkov_]

пожалуйста!

[@baursak5820]

не могу найти то что о чем говорится 2:30 пофигме япофигме фигмахелп. Помогите пожалуйста

[@alexeybychkov_]

тут лежит pofig.me/files/

[@anitas_video]

Алексей,спасибо! Отличный эфир. Даже вроде болтаете, а все равно по делу. И куча полезной инфы. Пошла смотреть продолжение

[@alexeybychkov_]

Спасибо за просмотр)

[@gringreen2793]

Полезно и понятно, ждём вторую часть)

[@alexeybychkov_]

вот и хорошо)

[@its_no_way]

Как хорошо что продолжение завтра и мне не придется ждать его три месяца 😄

[@alexeybychkov_]

да уже завтра)

[@lana_svetlana.]

Супер, очень полезный стрим, время проходит быстро и интересно, жду следующий🔥

[@alexeybychkov_]

Рад, что нравится!

[@buka_jaz]

Спасибо! Всё ещё интересно, с удовольствием слушала.

[@alexeybychkov_]

вот и замечательно!

[@chopppi]

Опоздал на стрим, теперь с чайком пересматривать буду))

[@alexeybychkov_]

Хорошо, что запись есть!

[@chopppi]

@@alexeybychkov_ это прекрасно

[@ylazima]

Какой полезный стрим! А главное как раз сейчас в тему)

[@alexeybychkov_]

Супер)

[@harbinger856]

Кто-то уже написал про «кавычки-ёлочке» на Маке? Лёш, есть специальный хоткей: включаешь РУ-раскладку на маке и жмёшь option+shift+= («) или option+= (») 🙂

[@alexeybychkov_]

Это если раскладка Бирмана не установлена. А она установлена

[@ЛияЗалещенко]

Вчера успела на кусочек стрима, остальное в записи смотреть буду. А вот с буквой б - в точку, сама недавно в такую ситуацию попала.

[@alexeybychkov_]

Спасибо за просмотр!

[@gunelhuseynova6589]

Спасибо за стрим! Было очень интересно

[@alexeybychkov_]

пожалуйста! 🥳

[@sergenu]

Алексей, ёлочки на клавиатуре мака, включаем русскую раскладку: Option + ] это будет "«", а Option + Shift + ] это будет "»". Только что сам прописал на этом же примере. Если не получается, возможно ваша раскладка не Russian PC, нужна именно такая.

[@alexeybychkov_]

у меня раскладка Бирмана установлена. Это у многих так на маке - в фигме кернинг текста перехватывает елочки. В других программах елочки ставятся без проблем

[@sergenu]

@@alexeybychkov_ Так, бирман. В целом возможно сделать кастомную раскладку под себя, и убрать кавычки в другое место. Можно отредактировать пакет с сайта бирмана и переместить символы на другие кнопки, чтобы и фигма не хватала и они доступны были. Файл с .keylayout в установщике легко редактируется через Text Edit.

[@vladlena_gold]

Жду файлик и второй стрим ♥ Тема супер!

[@alexeybychkov_]

Скоро 2 стрим проведу

[@egorbraun1261]

Крутой стрим❤, все понятно, жду продолжение! Леха филл хуг!🎉

[@alexeybychkov_]

Фил Хуг)

[@МихасьЛакі]

дядько !!!! ТОБІ респект ти так гарно розазуєш шо дух захватує

[@alexeybychkov_]

Круто))

[@pinkpanther2349]

Спасибо большое! 👍👍👍 Очень полезно. ☀️☀️☀️

[@alexeybychkov_]

пожалуйста!

[@romangribov2680]

Спасибо за контент)🙏🏻

[@alexeybychkov_]

Пожалуйста!

[@Karina-rz4bs]

Супер полезный стрим, спасибо! Много полезного для себя узнала)

[@alexeybychkov_]

вот и замечательно!

[@ВладиславВладислав-с7р]

Алексей, благодарю! Отличный видос и канал🤜🏻🤛🏻

[@alexeybychkov_]

Спасибо за просмотр)

[@ЛёхаЕроскин]

Если на сайте используются одинаковые карточки товаров, которые частично меняются на другом разрешении, разве не нужно по прежнему использовать component cloner чтобы сделать независимый мастер и настраивать на новом разрешении отступы и все остальное отдельно как того требует новое разрешение?

[@alexeybychkov_]

теперь можно адаптивить через настройки АЛ. Раньше нельзя было менять отступы не зависимо от мастера и приходилось запускать компонент-клонер. Теперь не надо)

[@ЭлладаСухова]

Алексей, спасибо за интересную информацию!

[@alexeybychkov_]

пожалуйста!

[@ВикторияХоревина]

Очень крутой и интересный стрим! Спасибо большое 🔥

[@alexeybychkov_]

Вот и хорошо 🥳

[@chopppi]

18:49 Прям неожиданный момент про литеры в адресе: 12б. Действительно можно в суете на маленьком экране телефона перепутать б и 6. Никогда об этом не задумывался...

[@alexeybychkov_]

да, есть такое дело)

[@ВалентинаЖадько-е3с]

спасибо, очень полезный стрим!

[@alexeybychkov_]

🥳

[@ElenaHorbik]

Спасибо! Интересно и очень полезно, как всегда😄

[@alexeybychkov_]

спасибо за просмотр!

[@darkblue5512]

Подскажите где лежат файли фреймов для адаптива. Спасибо.

[@alexeybychkov_]

На сайте по фигме pofig.me

[@КристинаВинтер-у7к]

какой же вы чертовски полезный ! не знаю как иначе сказать ) блин , обняла приподняла , спасибо !

[@alexeybychkov_]

рад, что полезно

[@leonidkniazev1609]

Здравствуйте, спасибо бесконечное за стрим ! Не могу понять только где вторая часть, этот 68, новогодний 70, а 69 не могу найти на канале. хотелось бюы тоже понажимать кнопки) Спасибо!

[@alexeybychkov_]

Привет. Второй части еще не было. После праздников уже продолжать будем

[@bibimoi_ru]

Когда же научусь пользоваться автолейаутом нормально))) пока частенько все "ломается". Но после курса думаю все станет ясно))) жду апрель. Спасибо!

[@alexeybychkov_]

Время быстро пролетит)!

[@its_no_way]

Спасибо за классный стрим🔥

[@alexeybychkov_]

пожалуйста!

[@Иришка-с8ь]

спасибо!!!!!!))) за все видео!!! огонь!!! от души

[@alexeybychkov_]

пожалуйста!

[@svetlanapakhmutova1825]

Спасибо за труд, очень познавательно!!!

[@alexeybychkov_]

пожалуйста!

[@lilium_crl]

Спасибо большое!!!

[@alexeybychkov_]

Пожалуйста 🎉

[@vaykiki]

Спасибо за контент 👍🏽

[@alexeybychkov_]

пожалуйста!

[@JD-trip]

Было очень полезно, спасибо!

[@alexeybychkov_]

пожалуйста!

[@НадеждаЛяшук-х3п]

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

[@alexeybychkov_]

рад, что понравилось сtrl + shift + 3 или shift + O (о, не ноль)

[@beatz1784]

Привет Алексей! Видео того года, не знаю узнал ты о кавычках ёлочки или нет, напишу на всякий)) На маке на английской раскладке ставится option+\=« и shift+option+\=» и на русской shift+option+(+/=)=« и option+(+/=)=» )))

[@alexeybychkov_]

👋 не у всех работает(

[@tinamako5965]

Привет! Спасибо за контент! Вопрос про неразрывные пробелы: в Фигме не ставится через Ctrl+Shift+Space на Винде. (при этом в Ворде всё работает) Это только у меня такая проблема? Хэлп. 😭

[@alexeybychkov_]

привет. Пользуюсь раскладкой Бермана и горя не знаю) просто альт + пробел

[@tinamako5965]

@@alexeybychkov_ Спасибо тебе, святой человек! Жменю добра тебе в карму! 💙

[@Natalia-f4g9j]

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

[@alexeybychkov_]

Режим контуров шифт + О

[@mrakovej6997]

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

[@mrakovej6997]

Или можно надублировать через component cloner и потом подстроить под каждый размер экрана? Просто за вопрос, как бф тупо не звучало, но не могу не спросить...

[@alexeybychkov_]

часто 1 мастер позволяет использовать компонент на несколько разрешений. А с обновленным АЛ так и вовсе 2 мастер не нужен) 1 хватает почти всегда на все разрешения Компонент клонер не запускал уже несколько месяцев)

[@mrakovej6997]

@@alexeybychkov_ сколько всего я еще не знаю…Леша, огромное тебе еще раз спасибо! 👏🏻👏🏻👏🏻

[@Nordictt]

А скажи пожалуйста почему constraints не надо использовать? Для каких обычно случаев constraints? Спасибо за такие могучие уроки❤

[@alexeybychkov_]

Как не надо) надо иногда) например в абсолютном позиционировании элементы как раз через привязки настраиваются

[@Midi25]

Привет! Я вот вижу в этом видосе промелькнул кадр с макетом где написано elements_open_catalog. И народ в чате спрашивал, как показывать заказчику, где все эти всплывашки, наведения и тд. У меня возникла просьба. Сделай пожалуйста видео, как и где создавать эти пояснялки для верстальщика, чтобы показать разные состояния элементов (дропдауны-аккордеоны, ховеры, всплывашки, цвет при наведении и тд) Что именно должно находится в файле фигмы который отдается заказчику? Должны ли там лежать дополнительно все компоненты, UI-Kit, - их прикладывать как-то отдельно или прямо в этом же файле? Можно ли создавать пояснялки (аккордеон/иконка курсора/и тд) прямо в адаптивах? Хорошо бы на примере реального файла увидеть своими глазами а то по этому моменту в голове немного уже каша. Нужно ли писать заказчику PDF-ку, обьясняя каждое своё решение? Пожалуйста сделай урок по этим техническим моментам 🙏

[@alexeybychkov_]

привет. на бусти есть такой файлик. А на курсе есть отдельный стрим про все это) на канале нет, и не знаю появится ли

[@viktorriiuus]

Спасибо, про адаптивы как раз вовремя) На счет скорости, это огромный плюс, только смотря твои видео мне не хочеться включать х2!

[@alexeybychkov_]

рад, что нравится!

[@tamarahakobyan4384]

Спасибо классное инфо ❤

[@alexeybychkov_]

пожалуйста!

[@РузанаБикбетовна]

Спасибо бро, за годный контент

[@alexeybychkov_]

пожалуйста!

[@its_no_way]

2:11 о, это то что нужно, а то я в последнее время сажусь тренироваться и далеко не всегда АЛ ведет себя как мне надо, столько нервов на это уходит))

[@alexeybychkov_]

ну класс)

[@katiekits6723]

​Алексей, подскажы как в реальном проекте клиент передает тебе тексты под сайт? Не совсем понимаю этот процес, чтобы правильно понять где и что должно быть. Спасибо за то что делишся своими знаниями.😇

[@alexeybychkov_]

Если тексты финальные, то это отличный план. Если их нет, нуууу терпим, и делаем с временными

[@katiekits6723]

@@alexeybychkov_ еммм, не поняла🤪

[@diker5864]

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

[@alexeybychkov_]

рад, что полезно

[@urumova_elina]

я нашла второго Куплинова 😂😂❤

[@alexeybychkov_]

я матом не ругаюсь)

[@danmeddd]

Алексей, спасибо за классный материал. Глупый вопрос: надо ли для каждого макета (360, 400, 768, 1000, 1280) создавать отдельный kit с компонентами и вариантами? 🙂

[@alexeybychkov_]

Нет, не надо

[@НастяФилиппова-э7к]

Добрый день, спасибо за видео. Но я не очень понимаю работу с сеткой. Если менять в адаптиве сетку под контент( сначала две колонки, потом три) , то их лучше оставлять в макете? Или как это происходит? Как верстальщик будет работать, если в одном фрейме использовали разные сетки? Простите за тупой вопрос, но я просто не понимаю (((

[@alexeybychkov_]

Привет. Оставляешь одну какую-то, все не нужно

[@karianna_]

Привет! У меня есть вопрос. Насколько хорошо делать группирование елементов, автолейаут, группирование контента во фрейм для верстальщика? Ведь со множеством группировок верстальщику неудобно смотреть на свойтва, он пока провалится к нужному елементу то потеряет много времени. Буду благодарна ответу с:

[@alexeybychkov_]

привет. С зажатым ctrl проваливается сразу в 1 клик туда, куда ему надо)

[@marinaguc7802]

Два часа стрима, ого, как долго) Обо всех ты думаешь ...и верстальщики бедные мучаются от наших дизайнерских способностей, а теперь ещё и курьеры бедняги) эти знания из собственного опыта, наверно)) 😀

[@alexeybychkov_]

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

[@csc_annem]

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

[@alexeybychkov_]

Есть ролик на канале про висячие предлоги, там рассказал

[@Bonaidea]

Режим контура в плане поиска всякого ненужного очень актуален при переносе в Тильду, а то я там раньше (до ваших видео) после переноса находила странные объекты :)

[@alexeybychkov_]

Спасибо за просмотр)

[@ВиталийР-ж3т]

Привет! Вопрос. Сразу начинать делать десктопную версию и на убввание или начинать с мобильной версии? Как правильно? Спасибо!

[@alexeybychkov_]

Привет. Если вкратце: от большего к меньшему. Мобайл-ферст - это про верстку, а не про дизайн)

[@liudmyla4706]

@@alexeybychkov_ у вас на канале есть ролики про мобайл-ферст? Спасибо

[@youandme_2023]

получается для портфолио можно делать 1920 и 360, с учетом адаптивности?

[@alexeybychkov_]

Да можно

[@gitem2119]

Супер

[@alexeybychkov_]

🥳

[@sviatlanaharokh3623]

Так и не поняла, какая ширина контента оптимальная для 1920?

[@alexeybychkov_]

в районе 1200

[@DJ-mv4re]

90% случаев когда касается дело адаптива быстрей / проще / понятней сделать адаптив самому чем по дизайну мобилки

[@alexeybychkov_]

наверное)

[@its_no_way]

Пришла пора готовиться к завтрашнему стриму 😅

[@alexeybychkov_]

да!

[@ArtyomSazonov]

жду продолжения

[@alexeybychkov_]

Спасибо за просмотр)

[@DimaSemenoff]

Не могу найти Fill conteiner - убрали из меню?

[@alexeybychkov_]

чтобы был фил - должен быть автолейат

[@DimaSemenoff]

@@alexeybychkov_ дак это понятно, я его ставлю ( куда скинуть скрин?)

[@DimaSemenoff]

@@alexeybychkov_ О! Появилась! Я только все равно не понял в каких случаех она повляется в меню (автолейат понятно что должен быть). Я все перепробовал. И вот чисто случайно ( для меня) она вылезла.

[@ElenkaZP]

Я использую типогнафскую раскладку Бирмана для ёлочек, тире и всего остального, но на маке есть сочетание клавиш встроенное для ёлочек. Не помню правда какие, гуглила, последнее время на виндоус сижу.

[@alexeybychkov_]

вот у меня из-за раскладки Бермана елочки не срабатывают

[@ElenkaZP]

@@alexeybychkov_ странно, у меня не было проблем. Может надо выбрать только её, а вторую русскую удалить?

[@olesiagt2822]

Как можно поставить неразрывный пробел на винде? (то, что советуют в интернете - ctrl+shift+space - не работает)

[@alexeybychkov_]

советую установить раскладку Бирмана