Подробный курс по Фигме. Урок 5 - Модульная сетка в Фигме

Поделиться
HTML-код
  • Опубликовано: 25 окт 2024

Комментарии • 326

  • @alexeybychkov_
    @alexeybychkov_  5 лет назад +26

    Alex Losev, спасибо! :)
    Хотел какой-нибудь коротыш записать, а в итоге сделал полноценный урок из своего будущего курса:
    0:12 - про бутстраповские сетки
    0:48 - определяемся с шириной файла
    1:38 - добавляем сетку
    1:48 - сетка с шагом 8 х 8 пх для разработчиков мобильных приложений
    2:30 - перенастраиваем дефолтную сетку
    5:58 - накладывает 2-ую сетку сверху 1-ой
    7:09 - сетки и адаптив
    8:17 - сетки в открытом доступе на figma.help/files/
    9:17 - сетка не обязательно должна быть только у самой страницы, можно добавлять в блоки

    • @УМНОЕКИНО
      @УМНОЕКИНО 5 лет назад +1

      Так все таки курс будет? Я все не теряю надежды на положительный ответ)))

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +2

      Ну я точно подумаю над этим)

    • @УМНОЕКИНО
      @УМНОЕКИНО 5 лет назад +1

      @@alexeybychkov_ Отличная новость!) Может и правда дождемся!)

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +1

      @@УМНОЕКИНО Вот жирки разгоню, чтобы стримы можно было начать проводить. На них потренируюсь живому телевещанию из своей радиорубки :)

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +1

      УМНОЕ КИНО это я себя так мотивирую не откладывать в очередной раз до весны ;)

  • @SeregaParadox
    @SeregaParadox 4 года назад +77

    Тупо боженька) все что я искал пересматривая другие уроки часами тут за 10 минут по полочкам) топ, сразу подписка)

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +3

      Спасибо! :)

    • @SeregaParadox
      @SeregaParadox 4 года назад +4

      Alexey Bychkov понравилось, что про ширину сказал, что как и какую брать, ато это было непонятно)

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +3

      @@SeregaParadox ну класс)

    • @maryyarsich9781
      @maryyarsich9781 3 года назад

      точно боженька!)

  • @vick4692
    @vick4692 5 лет назад +60

    ты первый человек кто учёл ширину скрола рассказывая про сетку, почему то ораторы его игнорят

  • @Andrew_chaser
    @Andrew_chaser 3 года назад +8

    Огромная благодарочка двум людям : кто придумал Фигму и автору этого видео, это топ!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад

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

  • @Ivik.13
    @Ivik.13 2 года назад +1

    Алексей, вы просто гуру! Спасибо!

  • @pridari
    @pridari Год назад

    Спасибо большое, что делитесь с наси бесценным опытом- это безумно круто!!😃😃😃😃

  • @emmaghazaryan7600
    @emmaghazaryan7600 3 года назад +2

    Единственное видео про сетку, когда все коротко и понятно, спасибо

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      супер) рад, что понравилось! ☀️

  • @lana_svetlana.
    @lana_svetlana. Год назад +1

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

  • @malinamalina9857
    @malinamalina9857 2 года назад +1

    очень понятно объясняете! спасибо, лайк!

  • @keks_o4162
    @keks_o4162 3 года назад +3

    Какие же важные вещи вы объясняете! Просто, ёмко. Для новичка ваш канал один из лучших источников для обучения. Большое вам спасибо!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      супер) рад, что нравится!

  • @litvin23
    @litvin23 4 года назад +10

    Классная подача материала!
    Не занудно, а очень живо.
    Надеюсь не забросишь канал.

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      Спасибо) Если аудитория будет поддерживать, то не заброшу ruclips.net/video/rcw2sK_xuYY/видео.html

  • @daria__1262
    @daria__1262 4 года назад +25

    Манера подачи очень живая. Вас приятно слушать. Не только новое узнаешь. Но ещё и настроение поднимается))

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +4

      супер) рад, что нравится)

  • @sblv
    @sblv 2 года назад +1

    офигенская подача. будто лично мне, дурочке, объяснил. спасибо)

    • @alexeybychkov_
      @alexeybychkov_  2 года назад +1

      спасибо) этот ролик из 2019, есть его обновление из 2021

  • @УМНОЕКИНО
    @УМНОЕКИНО 5 лет назад +26

    Класс!) Придет время и я научусь все понимать с первого просмотра) А пока глаза в кучу, не дышу, чтобы все услышать, думаю так же быстро, как ты говоришь, но к концу видео уже ничего не помню))) Буду смотреть с начала!) Спасибо! Как всегда высший пилотаж!

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +3

      в последних видео я уже старался чуть помедленнее тараторить :)

    • @УМНОЕКИНО
      @УМНОЕКИНО 5 лет назад +4

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

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +5

      ​@@УМНОЕКИНО это потому что вас, подписчиков, немного, а комментируют и вовсе единицы) Вот когда обещанная куча народу подойдет, придется отпуск брать, чтобы ответы отвечать :)

  • @АлександрМаляров-о4э

    Отличные уроки, доходчиво, быстро и интересно. Спасибо!

  • @maryyarsich9781
    @maryyarsich9781 3 года назад +2

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

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +2

      а я наоборот не пользуюсь) Наоборот слишком неудобно и только мешают

    • @maryyarsich9781
      @maryyarsich9781 3 года назад

      @@alexeybychkov_ интересно, надо попробовать с ними, чтобы определиться

  • @onefluffy6035
    @onefluffy6035 3 года назад

    ОЧЕНЬ приятно было смотреть видео

  • @helga3542
    @helga3542 3 года назад +1

    Браво! Благодарю Вас за Ваши уроки!

  • @ЕкатеринаКо
    @ЕкатеринаКо 3 года назад +1

    только нужная информация, без водяного слоя..спасибо за видео!) подписана, будем дальше смотреть..)

  • @peace_creator17
    @peace_creator17 4 года назад +3

    и голос прям такой приятный для обучения. Благодарю!)

  • @МаргаритаСабо-з2ж
    @МаргаритаСабо-з2ж 4 года назад +1

    Божечки, как же всё задорненько и, главное, подробненько раскрыта тема. Спасибо)

  • @ЕленаБирюкова-ц9м
    @ЕленаБирюкова-ц9м 3 года назад +1

    Спасибо, Учитель!

  • @ДарьяБизяева-я5ы
    @ДарьяБизяева-я5ы 2 года назад +1

    Спасибо за урок! Всё чётко и понятно

  • @nazarkorol5489
    @nazarkorol5489 4 года назад +2

    Очень красиво и просто объясняете, хоть я и имел некоторое понимание в сетках, но это расширило мое видение. Спасибо вам!

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      Супер) Рад, что помог)

  • @alekseygulyantsev6099
    @alekseygulyantsev6099 4 года назад +2

    Видео №1 по сетке в сети, снимаю шляпу! За 10 мин изложил все доступно, что и искать больше нигде не приходится.

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      Ну класс) рад, что полезно!

  • @alexandrpechnik6163
    @alexandrpechnik6163 4 года назад +1

    Без лишних слов скажу одно - подписка однозначно!

  • @nexusway8640
    @nexusway8640 5 лет назад +10

    Вот оно как оказывается) Спасибо что объяснил про бутстрапы эти)

  • @letta_luck310
    @letta_luck310 2 года назад +1

    Спасибо! Сетки уже в моей библиотеке)

  • @hang2relax
    @hang2relax 5 лет назад +2

    Лёха, спасибо за рекомендации и лайфхаки!) внятная и интересная подача большая редкость в нашем сегменте. Так держать!)

  • @yuliyapershina825
    @yuliyapershina825 2 года назад +1

    Спасибо, узнала еще вариант как сделать сетку для дашборда) Теперь настраивать сетки легко)

  • @СергейШимко-ю5о
    @СергейШимко-ю5о 5 лет назад +2

    наикрутейший урок про сетки!!

  • @taniazaz2004
    @taniazaz2004 4 года назад +2

    Спасибо большое за уроки, сплошная полезная информация, кааайф.
    "Дай тоби Боже миллион подписчиков, добрый челочек"))))

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      Спасибо :) Тоже очень хочу миллион! ☀️ Но, видимо, не в этой жизни) За полтора года еще даже 10к не подписалось)

    • @taniazaz2004
      @taniazaz2004 4 года назад +1

      @@alexeybychkov_ Максимально не справедливо. Нужно запускать платный курс, тогда может подтянутся. Почему-то так иногда работает )

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      Все платное сразу же появляется на торрентах, складчынах, шервудских разбойниках и тд. Проверил на себе: пишешь книгу, тратить полгода времени, а потом... пишешь вторую и через день после релиза тоже самое. Какой-нибудь мудак тратит 500 рублей, чтобы ты в итоге меньше заработал. Да и для курсов нужен же тот, кто будет все это дело вести, проверять домашку и тд. А у меня только 2 руки и 1 голова :)

    • @Gulnara_Oshima
      @Gulnara_Oshima 4 года назад

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

  • @assel290385
    @assel290385 3 года назад +1

    наконец-то я поняла тему сеток, огромное спасибо!!!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      Супер) рад, что полезно!

  • @alexandrasagidullina429
    @alexandrasagidullina429 3 года назад +1

    Спасибо, теперь стало понято насчет бутстрапа. И что сетки можно, а то и нужно делать не только для страницы!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      ну класс) пожалуйста!

  • @VitaliiMaevskii
    @VitaliiMaevskii 4 года назад +1

    Здорово! Спасибо за урок!

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      спасибо за коммент! :)

  • @Alexandraizotova727
    @Alexandraizotova727 Год назад

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

  • @MrAlcoholekz
    @MrAlcoholekz 4 года назад +1

    очень крутой стиль изложения, который слышал и видел! *лайк-подписка-колокольчик*

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      Супер) рад, что нравится!

  • @НупростопеснякакВкусно

    спасибо, Лёша

  • @Mary_veri
    @Mary_veri 4 года назад

    5:31 самое воодушевляющее, что я слышала за весь свой путь в дизайне :)

  • @iam_brightspark
    @iam_brightspark 3 года назад +1

    Сетку твою скачала на твоем сайте по фигме) Огромное спасибо)

  • @U.Kazinets
    @U.Kazinets Год назад

    Всё вопросы по сетке сняты, поторопился ! :D

  • @ЛилияКурочкина-м7к
    @ЛилияКурочкина-м7к 3 года назад +1

    спасибо, замечательное видео !!!🙏

  • @ГалинаМихайлова-ш5ъ

    Полезный урок, спасибо

  • @capmercury442
    @capmercury442 3 года назад +1

    Спасибо, лучший!

  • @samjdare
    @samjdare 4 года назад +2

    Желаю удачи в продвижении, благодаря твоему каналу я повысил свои скиллы процентов на 500

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +3

      Супер) классные показатели 🚀 Спасибо)

  • @h2643
    @h2643 Год назад

    Спасибо за это!

  • @donbao
    @donbao 4 года назад +1

    Спасибо, полезненько!

  • @TheAlenaVolkova
    @TheAlenaVolkova 2 года назад

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

  • @alexaale5103
    @alexaale5103 4 года назад +4

    Отлично излагаешь! Быстро, без воды. Я то эти вступления по 5 минут, реклама Рейдов, болтовня в потолок порядком поднадоели)

  • @ДімаКоноверський
    @ДімаКоноверський 3 года назад +1

    Спасибо! Годное видео

  • @stratosfera4241
    @stratosfera4241 3 года назад +1

    А я ломала голову три дня, как же мне в 12 колонок впихнуть фильтры и 4 товара....а тут все так просто... Спасибо огромное за видео!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      пожалуйста огромное!

  • @СлаваКушнир-э6р
    @СлаваКушнир-э6р 4 года назад +1

    Годнота, ,без воды

  • @nikstark1546
    @nikstark1546 4 года назад +1

    спасибо! очень понятно!

  • @Milky_Way_Galaxy95
    @Milky_Way_Galaxy95 4 года назад +2

    Super bistro, prosta super, super bloger

  • @nikitoffe
    @nikitoffe 4 года назад +3

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

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +4

      сейчас такое видео уже не особо-то и нужно. Это раньше во времена фотошопа нужно было хорошо готовить файл. А теперь в фигме они уже даже панелью слоев не пользуются - ведь до любого элемента можно добраться в 1 клик

  • @TheBorninmotion
    @TheBorninmotion 4 года назад +1

    Спасибо огромное, очень полезно !

  • @yolikim8268
    @yolikim8268 4 года назад +2

    О Господи, неужели кто-то наконец назвал вещи своими именами и послал подальше бустраповские сетки. Пересмотрела кучу роликов, выслушала целые дебаты про ширину столбцов, почему они должны быть не 68 пикселей, а 65😅Чем больше смотрела, тем больше возникало вопросов. А причина всех бед просто в ленивых верстальщиках 😂 Быстро, емко, легко. Спасибо! Пойду с чистой совестью рисовать по сеткам "как надо"

    • @alexeybychkov_
      @alexeybychkov_  4 года назад

      Да, все спихнём на верстальщиков 😀

  • @МираСыдыкова-з5л
    @МираСыдыкова-з5л 2 года назад +1

    Супер

  • @АндрейСпинко
    @АндрейСпинко 5 лет назад +2

    При создании вертикального ритма не нужно ставить 500 линеек, можно поставить Auto и тогда горизонтальная сетка всегда будет на весь фрейм.

  • @АнастасіяКолмик
    @АнастасіяКолмик 3 года назад

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

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +2

      Про библиотеку отдельное видео есть ruclips.net/video/PPyU8Wi_pLA/видео.html

  • @МарияОрлова-щ4з
    @МарияОрлова-щ4з 3 года назад +1

    Добрый день! Подскажите, почему мы начинаем работать именно от фрейма шириной в 1240? И почему бутстраповские сетки так плохи, если в конечном итоге на них и ориентируются верстальщики? Может ли такое быть, что сетка растянута на весь фрейм или должен быть какой-то минимальный отступ? Заранее спасибо за ответ, Ваш канал очень полезен!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +2

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

  • @АдильКабдыгали-п5с
    @АдильКабдыгали-п5с 3 года назад

    Понял от А до Я

  • @MR-br2uv
    @MR-br2uv 4 года назад +1

    Спасибо!

  • @nickrybak7834
    @nickrybak7834 5 лет назад +2

    Алексей, спасибо за ролики! Всё очень круто, не мог бы ты поделиться своим брифом для заказчика или сделать видео на тему его составления?

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +2

      Не за что :) Так а бриф лежит у меня на сайте alexeybychkov.com/brief/ Может, когда-нибудь запишу видео почему мой бриф такой, какой он есть и как я к такому пришел. Было много разных версий. Но этот не менял уже пару лет

    • @nickrybak7834
      @nickrybak7834 5 лет назад +1

      @@alexeybychkov_ Спасибо!

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +1

      Не за что)

    • @850Ksu
      @850Ksu 4 года назад

      @@alexeybychkov_ спасибо вам за урок👏👏👏 бриф почему то не открывается

  • @dimkinn1
    @dimkinn1 4 года назад +1

    Ну только маленькая поправка про ширины колонок разных версий bootstrap. по умолчанию для третий версии они 67,5, для четвертой версии 65, а не 70, как вы сказали в видео.

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      наверное) я не сторонник этой истории, поэтому мог запросто напутать. Бутстрап настолько плох, что оказывается у него даже сетка в полупикселях 😄

  • @Medved1z
    @Medved1z 3 года назад +3

    Спасибо Диzа;жнер))))
    очень полезно!!!!!

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

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

  • @daryarusanenko1490
    @daryarusanenko1490 3 года назад +1

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

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +5

      1920 - стандартная ширина монитора. FullHD. 1280 - совсем старенький монитор. Нужно макеты делать под большинство, а не под себя

    • @daryarusanenko1490
      @daryarusanenko1490 3 года назад

      @@alexeybychkov_ Спасибо )

  • @helga3542
    @helga3542 3 года назад +1

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

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      если его нужно учитывать - то 24 пх с запасом хватит

    • @helga3542
      @helga3542 3 года назад

      @@alexeybychkov_ благодарю Вас за ответ! Учусь по Вашим уроком) Очень рада, что нашла Вас! Спасибо за Ваш труд и успехов Вам!)

  • @850Ksu
    @850Ksu 4 года назад +1

    @ Alexey Bychkov еще раз спасибо за уроки!!! я новичек)) немного не поняла... если делаем под мобильное приложение, то сетку всегда нужно строить на 8пикс, или строят и на 10? Если все же строим сетки на 8 пикс, то размер ячеек и промежутков должен быть кратен 8ми?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +3

      в мобильных приложениях очень много всякого рода иконок и элементов вроде табов, кнопок и тд. Причем многое уже задано гайдами от андроида или иоса (т.е. своего не добавишь - есть требования, будь добр выполняй или мы твое приложение в магазин не добавим -- ну условно). Все они кратны 8 (особенно иконки): 24 х 24 - стандарт. 32 х 32, 16 х 16 и тд. Поэтому и сетку делают в 8 пх. В вебе же без разницы какого размера иконка, кнопка и тд. Вот видео в котором я наглядно показал, почему использовать в вебе 8 пх плохо ruclips.net/video/WDiQ8tR3KGk/видео.html

  • @motherhoods6599
    @motherhoods6599 4 года назад +1

    Спасибо за Ваш труд. Подскажите пожалуйста как новичку самоучке, после того как размер вытянули на 1920 сетка осталась с ушами ) это норма ? Как правильно расставлять весь дизайн по сетке ? благодарю.

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      Рад, что нравится) Про сетку - посмотри разбор первой работы в этом ролике ruclips.net/video/3EtklVjacv4/видео.html начиная с 4-ой минуты ответ на твой вопрос про сетку

  • @SinwiseAM
    @SinwiseAM 4 года назад +1

    Очень классная подача материала! Но все же, почему не делать шаг в 8px? ну и сетку в соответвствии этому ?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      вот подробно рассказал почему 8 пх так себе затея ruclips.net/video/WDiQ8tR3KGk/видео.html

  • @bargamut
    @bargamut 4 года назад +2

    7:12 - в "Layout Grid" кликаю на иконку с 4 точками и вижу пустой список, никаких сеток нет, пишет "No Grid Styles". Только если свои собственные стили создавать.
    Это на платном тарифе там сетки есть или что-то не так?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      Сетки доступны на бесплатном тарифе тоже. Вот тут подробно как их установить ruclips.net/video/PPyU8Wi_pLA/видео.html

    • @bargamut
      @bargamut 4 года назад +1

      @@alexeybychkov_ спасибо за ответ! Досмотрел видео до конца, там, оказывается, говорили, что позже разберём вопрос добавления. Поторопился. )

  • @artemfe6884
    @artemfe6884 4 года назад +2

    Алексей, а как сделать, чтобы при 1920 растягивалось на весь экран. Если стартовать при 1280, то на 1920 остаются поля(

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      Сменить режим сетки на stretch (растягивание) prnt.sc/qxdqe9

    • @artemfe6884
      @artemfe6884 4 года назад +1

      Спасибо!

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      @@artemfe6884 не за что

  • @alexanderplotnikov1424
    @alexanderplotnikov1424 3 года назад +1

    Надо бы обновить картинку на ФигмаХелп на странице "полезное" с рекламой ютуб-канала. Сейчас аватар более дружелюбный и картинка другая уже и более информативная. имхо.

  • @natalianagirnyak
    @natalianagirnyak 2 года назад

    Алексей, спасибо за видео! Всегда использовала значение stretch в настройках, мне кажется это очень удобно. Не могу понять, почему нужно использовать center, а не stretch?

    • @alexeybychkov_
      @alexeybychkov_  2 года назад +1

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

    • @natalianagirnyak
      @natalianagirnyak 2 года назад +1

      @@alexeybychkov_ Спасибо!

  • @ann_babych
    @ann_babych 5 лет назад +3

    Мы должны отталкиваться от минимальной ширины экрана 1280px или 1366px, можна сделать сетку от 1440px? Или лучше от минимальной?

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +2

      Можно делать любой ширины, главное чтобы это не стало сюрпризом для заказчика :)

  • @Roman_Tsarev
    @Roman_Tsarev 4 года назад +1

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

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      самоучка. Вот тут расписал подробно свою трудовую alexeybychkov.com/experience/

    • @Roman_Tsarev
      @Roman_Tsarev 4 года назад +1

      @@alexeybychkov_ спасибо )))

  • @valeryoks8847
    @valeryoks8847 4 года назад +1

    Super! Srazu podpiska!!!!!

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      спасибо за подписку! )

  • @skychanel5159
    @skychanel5159 4 года назад +1

    Ты крутой)

  • @FlashViolet
    @FlashViolet 4 года назад +1

    а как эти пресеты себе перетащить? ну, чтобы они не только в одном файле Алексея применялись, но и везде во всех новых моих проектах?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      Вот тут подробно как библиотеку подключить ruclips.net/video/PPyU8Wi_pLA/видео.html

  • @МаргаритаРоманова-и1п

    Где найти информацию, почему картинка под сетку уходит?

    • @alexeybychkov_
      @alexeybychkov_  2 года назад

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

  • @antonzhuravka
    @antonzhuravka 5 лет назад +4

    Спасибо за урок!
    1440 ширину можно использовать?

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +4

      Не за что. Ну а чего ж нет) Главное предупредить заказчика и уточнить какая у него ширина. Если сделаешь дизайн шире, чем монитор заказчика - могут возникнуть трудности после верстки. Макеты то он посмотрит и далеко не факт что в 100% масштабе, а когда ему сверстают будет тебе барабанить в личку за объяснением почему у него сайт не помещается в экране.
      Если в проекте будет адаптив, а такие проекты сейчас практически все, то сайт в любом случае подстроится под любую ширину экрана. (опять же при хорошем настроении верстальщика) Но я в брифе в своем все равно оставил пункт, где спрашиваю какой ширины делать контент и указал, что по умолчанию делаю 1280. А так-то можно любой делать)

    • @antonzhuravka
      @antonzhuravka 5 лет назад +2

      @@alexeybychkov_ спасибо за ответ!

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +1

      не за что

    • @antonzhuravka
      @antonzhuravka 5 лет назад +2

      @@alexeybychkov_ а как использовать сочитание клавиш CTRL + D? Почему-то у меня объект копируется в тоже самое место.

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +1

      ​@@antonzhuravka Если объект не двигался, то и дубликат появится в том же месте. Если объект сдвигали, то и новый появится на таком же расстоянии

  • @Mbe.25
    @Mbe.25 3 года назад +1

    Блин. Почему у меня нет строчки “layout grid” справа когда я создаю объект? Если выбрать изначально “desktop” то там это строка есть. А добавляя на экран элементарный «rectangle” справа только “layer” в котором из выбора только “pasa through”

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      Настройка сетки - это опция фрейма. У фигур ее нет)

    • @Mbe.25
      @Mbe.25 3 года назад +1

      @@alexeybychkov_ спасибо😅 тогда я вообще запуталась. Мне видимо нужно знать горячие клавиши. Потому что я думала что на видео вы вставляете обычный квадрат 😅😅

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +2

      @@Mbe.25 вставляю фрейм квадратной формы)

  • @antischulz
    @antischulz 4 года назад +2

    Окей. Спасибо!
    как всегда, очень круто! Спасибо тебе!
    А для екрана 1440 нет у тебя сеток?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      Не за что :) Для 1440 не делал, но можешь запросто сделать из моей просто скопировав и поменяв ширину в настройках

    • @antischulz
      @antischulz 4 года назад

      Сорри, я не понял тебя. Можешь помочь: www.figma.com/file/tB2te1IWdpjNCgPx1kDq3t/grids-Copy?node-id=0%3A1
      Мне по англиском было лучее написать.

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      @@antischulz не могу редактировать файл

    • @antischulz
      @antischulz 4 года назад +1

      @@alexeybychkov_ Сорри...ешё раз ссылька: www.figma.com/file/tB2te1IWdpjNCgPx1kDq3t/grids-Copy?node-id=1%3A6

    • @antischulz
      @antischulz 4 года назад +1

      www.figma.com/file/tB2te1IWdpjNCgPx1kDq3t/grids-Copy?node-id=1%3A6 - тепер походу ОК! 🙏🏻🙏🏻🙏🏻🙏🏻

  • @ilowash
    @ilowash 3 года назад +2

    почему у меня нет заготовленных сеток в фигме(

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

      Библиотеку с сетками подключить нужно ruclips.net/video/PPyU8Wi_pLA/видео.html

  • @АнастасияХопчева
    @АнастасияХопчева 5 лет назад +1

    Алексей, такой вопрос. Если использовать инструмент Scale при создании адаптива и уменьшить, например, целиком шапку сайта, то все размеры элементов становятся в формате "143.61" и т.п. Это нормально? Так и оставлять размеры для верстки? Или нужно потом всё приводить к целым значениям?

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +2

      Нельзя целиком скейлить блоки :) Можно уменьшать фотографии, фоны. А всякого рода иконки нужно оставлять в первоначальном размере, если речь про какие-то мелкие вроде телефонной трубки, конверта и тд. А если речь про большие иконки преимуществ, то можно обойтись двумя, максимум тремя размерами (компы, смартфоны или компы, планшеты, смартфоны). Про тексты вообще отдельный разговор: как правило уменьшаются заголовки (например, 36, 36, 32, 32, 28) а текст контента при этом меняется только на смартфонах: 17, 17, 17, 15, 15. В общем, если просто все скейлить, то какой смысл тогда заказчику в принципе обращаться к дизайнеру?) Верстальщик сможет и сам все пропорционально сжать :)

    • @АнастасияХопчева
      @АнастасияХопчева 5 лет назад +1

      @@alexeybychkov_ Спасибо большое за такой оперативный и подробный ответ! Вы мне очень помогли ☺️

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +1

      ​@@АнастасияХопчева супер :)

  • @ВикторияЧернякова-п8ф

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

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +2

      Я что-то убежден был, что сетка им помогает :) Наверное, зависит от человека. Например, многие пользуются текстовыми стилями в фигме. А я их терпеть не могу и никогда не использую)

  • @obavolka
    @obavolka 3 года назад

    Вопрос: какой делать отступ от верхнего края сетки до контента? Есть рекомендации в пикселях?)

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +1

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

    • @obavolka
      @obavolka 3 года назад +1

      @@alexeybychkov_ прямо камень с души сняли)))

  • @ЮляЛинсина
    @ЮляЛинсина 4 года назад

    Здравствуйте, скажите пожалуйста как включить сетку, если в меню View(Layout Grids) когда включаешь она не отображается, как её можно ещё включить, или нужно другую версию скачать программы?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

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

    • @ЮляЛинсина
      @ЮляЛинсина 4 года назад +1

      Да, только я это все пробовала, ничего не работает, хорошо спасибо

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      @@ЮляЛинсина попробуй этот же макет в браузерной версии открыть (или наоборот в десктопном клиенте)

  • @sofillotush
    @sofillotush Год назад

    А не будет ли резать глаза от того, что во внутреннем фрейме сетка не совпадает с основным? Контент не будет между собой конкурировать в выравнивании? И стоит ли вообще так делать?

  • @kristine.matevosyan
    @kristine.matevosyan Год назад

    А как сделать чтобы сетка была под дизайном?)

    • @alexeybychkov_
      @alexeybychkov_  Год назад

      сетка включается shift + G (если она в панели справа настроена)

  • @andreyp2632
    @andreyp2632 5 лет назад +1

    Привет, а где видео как уже готовые сетки интегрировать , что то не нашел.

    • @alexeybychkov_
      @alexeybychkov_  5 лет назад +2

      Привет. В уроке про библиотеку ruclips.net/video/xTIL19sDeHo/видео.html

    • @andreyp2632
      @andreyp2632 5 лет назад

      @@alexeybychkov_ спасибо

  • @mariamstepanyan8606
    @mariamstepanyan8606 2 года назад

    Помогите понять почему для экрана шириной 1280 px мы делаем 1920 px?

    • @alexeybychkov_
      @alexeybychkov_  2 года назад

      потому что кроме 1280 экрана, есть и другие: 1366, 1440, 1680, 1920. И чтобы не городить под каждый отдельный макет, который будет отличаться только фоном и элементами на нем - делают ширину контента около 1200, а фон 1920

  • @kseniyaalive3772
    @kseniyaalive3772 3 года назад

    А уже достапа к сайту помощи нет?

    • @alexeybychkov_
      @alexeybychkov_  3 года назад

      В некоторых регионах работает только через впн. Знаю, что в Минске на белтелекоме так. Может ещё где-то

  • @yurisamarin8200
    @yurisamarin8200 4 года назад +4

    ты забронировал себе место в раю)))

  • @nikitoffe
    @nikitoffe 4 года назад +1

    *Контент должен располагаться только на сетке?*

    • @alexeybychkov_
      @alexeybychkov_  4 года назад +1

      нет, конечно. Вот еще одно видео про сетку, в котором подробно ответил на этот вопрос ruclips.net/video/WDiQ8tR3KGk/видео.html

  • @Sky-mp5ek
    @Sky-mp5ek 4 года назад

    Напишите пжл как отключить основную сетку .

    • @alexeybychkov_
      @alexeybychkov_  4 года назад

      ctrl + shift + 4

    • @Sky-mp5ek
      @Sky-mp5ek 4 года назад

      Почему на моем ноутбуке Acer клавиши ctrl+shift+4 выдает скриншот ?

    • @alexeybychkov_
      @alexeybychkov_  4 года назад

      @@Sky-mp5ek какая-то программа перехватывает хоткеи. Может яндекс.диск или еще что

  • @nikkilev4931
    @nikkilev4931 3 года назад

    Хм, а если верстка не резиновая и надо делать адаптив под несколько мониторов пк, можем ли мы от адаптива к адаптиву варьировать не только ширину колонок, но и отступы? (и можем ли вообще варьировать ширину колонок)

    • @alexeybychkov_
      @alexeybychkov_  3 года назад +2

      можно, но обычно отступы не меняют

    • @nikkilev4931
      @nikkilev4931 3 года назад

      Нерезиновая верстка - зло) Спасибо за пояснение)

  • @alexwest5057
    @alexwest5057 3 года назад

    На сегодня есть смысл подгонять под минимальный размер 320 пикселей? В статистике размера на 320 уже не видно в обращении gs.statcounter.com/screen-resolution-stats/mobile/worldwide

    • @alexeybychkov_
      @alexeybychkov_  3 года назад

      Да, есть. Почему-то многие забывают про коэффициент Density, который подтягивает на смартфоны макет 320 пикселей, даже если они 480 или 640 или еще какие-то
      640 с коэффициентом х2 - макет 320
      480 с коэффициентом х1,5 - макет 320
      и тд
      320 -- это не только про 320 :)
      Это как на компах с ретиной. Например, при 2560 отображается разрешение 1280, чтобы все было нормального размера, а не мельче в 2 раза.

    • @alexwest5057
      @alexwest5057 3 года назад

      @@alexeybychkov_Так в ссылке разрешения с учетом коэффициента указаны. 360 самый минимальный получается на текущий момент. Может всего пара процентов еще осталась всяких старых айфонов 5

    • @alexeybychkov_
      @alexeybychkov_  3 года назад

      там просто указаны разрешения, про коэффициент не нашел

  • @ДарьяВасилевич
    @ДарьяВасилевич 3 года назад

    а файл ещё рабочий? у меня не открывается по какой-то причине)

    • @alexeybychkov_
      @alexeybychkov_  3 года назад

      какой файл? не помню уже про что рассказывал)