За это junior дизайнеров ненавидят верстальщики

Поділитися
Вставка
  • Опубліковано 26 тра 2022
  • Почему верстальщики ненавидят веб дизайнеров? Справедливо?
    Где бесплатно учиться веб-дизайну:
    • Веб дизайн с нуля. Как...
    Учись дизайну на чужих работах:
    • Копируем лендинг в Fig...
    Подробный разбор иллюстрации в Photoshop:
    • Коллаж в photoshop. ПО...

КОМЕНТАРІ • 292

  • @daniktitanik7246
    @daniktitanik7246 2 роки тому +111

    Очень интересно послушать про вёрстку сайтов которые готовятся для awwwards. Как дизы сотрудничают с верстальщиками. Как устроены сетки и есть ли они вообще, т.к. ощущение что их там вообще нет. В каких прогах верстают ребята, ток в vs или ещё в других. В каких прогах делают анимации и кто их делает. Какие то мелочи, именно в сложных и сочных сайтах. Так же, было бы интересно послушать про то как устроена система работы таких студий. У тебя уже было интервью с Obys, но хотелось бы узнать подробнее про то что написал выше. Кто ещё хочет такой видосик напишите вопросы в ответы, что бы Further было легче понять на какие вопросы можно было поспрашивать ребят. Очень надеюсь то что снимешь такой видос)

    • @nevmyr
      @nevmyr 2 роки тому

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

    • @enotbert
      @enotbert 2 роки тому +4

      @@nevmyr мне кажется, кто как хочет, так и др... налаживает рабочий процесс. Например у нас на проекте за анимацию отвечает тот же дизайнер, которые ее придумал. Более того, он должен предоставить раскадровку и референс или собрать анимацию где ему будет удобно.
      Мой личный опыт подсказывает, что доверять верстальщикам самим придумывать правила поведения для элементов сайта или анимацию - очень плохая идея. Все что для дизайна важно, должно быть так или иначе жестко определено и задокументированно, а все что не задукоментированно - не важно и может быть изменено в угоду удобства\валидности\семантичности верстки.

    • @kaihoso2677
      @kaihoso2677 2 роки тому +2

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

    • @ktoya..
      @ktoya.. 2 роки тому +2

      Обычно верстает и дизайнит на таких сайтах один человек. Readymag или Webflow

    • @user-yd3yr1pw3x
      @user-yd3yr1pw3x 2 роки тому

      Верстают в том, что удобно. От VSCode и Sublime до Emacs и Vi, и обратно)

  • @dmitry_kejana
    @dmitry_kejana 2 роки тому +56

    А в чем проблема посмотреть отступ зажав alt? Зачем на глаз? В чем проблема экспортировать изображение из группы, чтобы слои слились в один? Лень делать параллакс? Ну там давайте вообще без эффектов делать деревянные сайты просто чтобы верстальщикам было меньше работы). В дизайне есть понятие оптическая компенсация, если вам оно не знакомо изучите, тогда поймете почему круглые иконки могут быть на пару пикселей больше квадратных. Их обычно оборачивают в одинакового размера фреймы, но если вы лезете прям до самой иконки, как это понятно из видео, то видимо сами не умеете пользоваться фигмой и экспортить объекты правильно))

    • @petroniusarbiter4193
      @petroniusarbiter4193 2 роки тому +30

      Это не твой ли макет я верстал, где header был просто растровой картинкой? И мне пришлось чуть ли не линейкой вымерять расстояние элементов?)

    • @art.kornilov
      @art.kornilov 2 роки тому +3

      По факту всё

    • @DoFurther
      @DoFurther  2 роки тому +1

      пахахахахаха

    • @dmitry_kejana
      @dmitry_kejana 2 роки тому +2

      @@petroniusarbiter4193 Врядли, и причем тут это?

  • @deniov4
    @deniov4 2 роки тому +33

    Я сам начинал с верстки на html css, понял что это не мое и начал заниматься дизайном и тут мне здорово помогли навыки html, чтобы верстальщику было удобно работать и он не вставал в ступор после каждого блока, со словами что за ***дец

    • @ArtemKobyakov
      @ArtemKobyakov 2 роки тому +1

      Тоже самое, зачёт

    • @user-nz5co1gr3n
      @user-nz5co1gr3n 2 роки тому

      тоже самое)

    • @aau8
      @aau8 2 роки тому +1

      Плиз, дизайнеры, будьте все такими)))

    • @Beast8833
      @Beast8833 2 роки тому +6

      проблема в том, что многие дизайнеры не умеют в базовый html+css, отсюда все проблемы
      но в то же время, каждый верстальщик умеет в базовый "дизайн"....
      вывод: дизайнерам нужно проходить курсы базовой верстки

    • @ReaperArcheon
      @ReaperArcheon 2 роки тому

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

  • @roxone314
    @roxone314 Рік тому +3

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

  • @stepanmereutsa8444
    @stepanmereutsa8444 2 роки тому +51

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

    • @user-xm3dc9fo5h
      @user-xm3dc9fo5h 2 роки тому +4

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

    • @Headik
      @Headik 2 роки тому +4

      @@user-xm3dc9fo5h Получается круто если верстальщик делает дизайн вместе с вёрсткой, за зарплату верстальщика

    • @DoFurther
      @DoFurther  2 роки тому +8

      Круто когда решения дизайнера обоснованы: логикой, выполнением поставленных задач и соблюдением технических требований.

    • @Konichel
      @Konichel Рік тому +4

      Тогда можно делать простецкий дизайн на уровне 00 ых или начала 10 х годов, вот тогда, да верстальщиков загружать не будут, надеюсь они там еще сериальчик будут смотреть параллельно, а дизайнеры не будут заморачиваться над дизайном, выгодно? Выгодно. Прогрессивно? Нет.

    • @NuBreakz1990
      @NuBreakz1990 Рік тому +1

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

  • @kooknuke
    @kooknuke 2 роки тому +4

    Спасибо за видео. Интересно послушать как всегда. Про «капусту» в слоях хорошее замечание. Но когда у тебя 100 фоток постеров или шмоток для онлайн магазина и все разных пропорций - кропать их в ручную… ну сам понимаешь) но совет хороший, прислушался.
    А по поводу кодинга, тяну до последнего 😅 Ошэнь страшна лезть туда. Да и когда долгое время работаешь с одними разработчиками мотивация изучать код как-то пропадает.

  • @alexsichevoy
    @alexsichevoy 2 роки тому +29

    Еще есть "веселые" заказчики. Был опыт сотрудничества с заказчицей, которая умеет в дизайн полиграфии и решила что умеет в веб. Нужно было ее готовые макеты с шириной овер 4к рабочей области и в цмуке привести к более-менее верстабельному виду. У нее в макетах было все: разные отступы и в т.ч. вертикальные, десятичные размеры шрифтов, разной формы кропаные изображения, логически одинаковые заголовки, которые разные визуально от макета к макету. Вишенка на торте - исходники обязательно в ФШ и у нее ретина, а у меня нет) Работаю в фш, для показа джипеги макетов гружу в фигму))) Я просто проклинал все на свете, 10 раз ей пытался объяснить что принципы размещения и решения в ее макетах это просто неверстабельное *авно, показывал примеры моих макетов и результат их верстки, но она просто непробиваемая была. В итоге я просто сделал как она просила и на этом мои полномочия все. Оч жаль того, кто согласился это все верстать

    • @DoFurther
      @DoFurther  2 роки тому +5

      Ожидается день оффигительных историй в комментах 😅

    • @vgenm2457
      @vgenm2457 2 роки тому

      🤣

    • @user-ge8gc5uu9v
      @user-ge8gc5uu9v 2 роки тому +2

      Была похожая ситуация, дизайн сайта выглядел, как рекламная листовка с акцией. Я сразу понял, что его делал дизайнер по полиграфии.

    • @sergeytomkovich2741
      @sergeytomkovich2741 2 роки тому +4

      в 2022 году если приносят дизайн в ФШ - можно сразу отказываться как по мне) Так как это либо дизайн собранный полиграфистом, либо каким-то древним динозавром.

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      @@sergeytomkovich2741 А если за него хорошую сумму плотят 😁

  • @lika_cola
    @lika_cola Рік тому +1

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

  • @denizdezigner
    @denizdezigner 2 роки тому +26

    Дизайнер, стань верстальщиком, и отними работу у ленивых верстальщиков

    • @luxarmiger5729
      @luxarmiger5729 2 роки тому +8

      Точно, стань верстальщиком, изучи html, css, js и еще вагон сопутствующих технологий, потрать на это пару лет и тогда поймешь: это верстальщик ленивый или может наоборот. А может получиться так, что изучение верстки приведет к тому, что станешь реально хорошим дизайнером.

    • @WERWOLION
      @WERWOLION 11 місяців тому

      @@luxarmiger5729 а потом 4 года изучай на практике архитектцрную-семантику.
      И Гори с того какой говно код ты писал вчера.

    • @WERWOLION
      @WERWOLION 11 місяців тому

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

  • @shamsumova
    @shamsumova Рік тому

    3:41 здравствуйте, подскажите что за прозрачные «листы» и маркеры?

  • @anton_youtube_1
    @anton_youtube_1 2 роки тому +3

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

  • @D_o_m_i_n_u_S
    @D_o_m_i_n_u_S 2 роки тому +58

    Ох сколько я за все время встречал дизайнеров, которые творческие люди :)
    Ничего не имею против, них :)
    Но если это сложно для условного недельно/месячного проекта, то представте как это. сложно на более сложных и обьемных проектах!
    Меня часто вот выносили люди которые на больших проектах где мы сами пилили по сути UI либу для приложение под наш дизайн. Так вот когда они добавляют к примеру поведение кнопки на новой странице или какой-то модалке при наведении не темнее от главного цвета а к примеру, светлее... Казалось бы тю да что там, но по факту это уже другой компонент :) Новая кнопка которой еще не было :)
    Приходишь к ним и такой, "Че за фигня, походу бага", а тебе в ответ "Нет фича, а мы что так не можем?"
    И начинаешь обьяснять что всему должно быть аргументация, у нас утвержденный дизайн и UX тоже :) Ну в общем тратишь уйму времени чтобы обьяснить что надо использовать готовые компоненты и из них собирать мокапы а если нужна кнопка то нужно ее добавлять глобально и в UiKit тоже :) А не тупо типа сделай модалку а там вообще другое поведение... И все эстимации коту под хвост :)
    Ну в общем я никогда особо не злился на джунов, только если они на контакт ну совсем не идут. Мне более печально от опытных такой кейс ловить.
    ПС В целом думаю дизайнеру полезно немного разбираться в технической части, понимать как с этим дальше работать будут. Я хоть и фронт но смежные области иногда ресерчу. Дизайн, менеджмент, бэкенд. Настолько глубоко, чтобы понимать как это работает и чтобы это приносило пользу для моей основной деятельности.
    Спасибо за видео :)

    • @aau8
      @aau8 2 роки тому +4

      Охохо, как мед на душу))) Некоторые дизайнеры не только не думают о тех. части, но и не учитывают то, как юзер будет пользоваться их дизайном. Одно слово - красиво. А толку от этого красиво, если не понять как этим пользоваться???
      Мне один раз дизайнер, в ответ моим правкам по дизайну, привел в пример сайты awwwards. Типа, вон как у них все нестандартно, у нас также будет. Ага, ради бога, только не за верстку за 20к. После слов о цене и пару тонн аргументов, желание "сделать как на awwwards" сразу ушло. Кстати, дизайн там был далек от awwwards

    • @sergeytomkovich2741
      @sergeytomkovich2741 2 роки тому +2

      @@aau8 ну если сайт делается для того чтобы попасть на awwwards, то там обычно удобство уходит на второй план. Ведь основная цель не удобство юзера - а получить награду>стать чуточку знаменитей>получить новых клиентов. Частая практика у молодых дизайн агентств, хотя есть некоторые которые на этом только и специализируются. Но у них и разработчики обычно свои, которые шарят всякие либы для всяких модных вау эффект.
      Другая беда - когда дизайнеры пытаются awwwards стиль применить везде. Сам раньше грешил этим, когда пытаешься аккуратность дизайна заместить креативом. С опытом переобулся наоборот в максимально аккуратные, минималистичные и понятные сайты.
      Ну и знать тех.часть для дизайнера я считаю мастхэв. Во-первых ты приходишь к верстальщику не с идеей в голове, а уже с референсами с codepen) Плюс доводить дизайн до идеала проще не условным "подвинь на 5 пикс тут", а через инспектор глянуть реально нужный отступ для элемента и скинуть уже куском CSS.

    • @grechaa82
      @grechaa82 2 роки тому

      Странно, почему верстальщик, у которого свои задачи ходит и делает правки дизайнеру, который делал макет. Просто Если макет сделан, его утвердили выше стоящие люди, значит надо делать его (само собой если те для кого это все устраивает и это хоть немного нужно). Но приходи какой-то верстальщик, который говорит что это делать не будет, потому что испльзуется цвет которого он не видел раньше.. весьма странно, может тогда тебе стать дизайнером?
      Однако не исключенно что челики (дизайнеры), просто ничего не понимающие ду*рочки

    • @grechaa82
      @grechaa82 2 роки тому

      Странно, почему верстальщик, у которого свои задачи ходит и делает правки дизайнеру, который делал макет. Просто Если макет сделан, его утвердили выше стоящие люди, значит надо делать его (само собой если те для кого это все устраивает и это хоть немного нужно). Но приходи какой-то верстальщик, который говорит что это делать не будет, потому что испльзуется цвет которого он не видел раньше.. весьма странно, может тогда тебе стать дизайнером?
      Однако не исключенно что челики (дизайнеры), просто ничего не понимающие ду*рочки

    • @D_o_m_i_n_u_S
      @D_o_m_i_n_u_S 2 роки тому +6

      @@grechaa82вопрос вы работали на больших проектах?
      На самом деле такие кейсы вполне реальны. И все очень просто. Когда уже проведён бизнес анализ, написана спека, сделан UX, нарисовали UI. Расшили задачи и накидали спринтов на всю команду. И основной функционал допилили и сделали первый релиз. Тогда появляется время для второстепенных фичей. И чаще всего с проекта могут снять опытных дизайнеров на другой проект, особенно если это аутсорсовая компания. На проект могут поставить джуна, это не только дизайнеров касается. Но все же речь о них.
      Так вот как раз в таком случае это плодотворная среда для джуна. И не только джуна. Например просто челика который дизайнил раньше на фрилансе. Толковый, взяли на мидла к примеру. Но у него очень мало опыта в больших проектах и в команде.
      На счёт ‘ходит делать правки дизайнеру’ думаю вы не совсем внимательно прочитали мой коммент.
      ‘Что делать не будет, потому что используется цвет которого раньше не видел’ - комментарий на уровне челика который не шарит о чем говорит. Ну во первых я не про цвет говорил а его поведения. Думаю если бы вам знакома была эта тема такую хрень не писали бы. Во вторых да не буду верстать и не должен этого делать по нескольким причинам. Цвет должен быть утверждён, внесён в документацию как минимум UIKit. В эстимации задачи должен учитываться кейс реализации дополнительного компонента. Я писал выше что этого не учитывали.
      Но думаю тебе это все не знакомо, так что рекомендации свои оставь себе.
      Плюс есть такое понятие как софт скилы. В нормальных компаниях это учитывают и токсичных людей могут и кликнуть с команды какой бы крутой он спец не был бы.
      Так вот про софт скилы, одним из них является имя коммуникация. Ну объясню для маленьких, все делают ошибки. И дизайнеры и верстальщики и фронты ну тенденцию ты понял надеюсь. И в нормальной команде тот кто замечает ошибку должен о ней заявится на митах. В зависимости от проекта миты могут отличатся. Вот к примеру я на дейлике заявился и мы обсудили этот вопрос. Или ты думал я пешком к нему ходил дядя?

  • @H1roHamada
    @H1roHamada 2 роки тому +5

    Считаю, что в нашем время веб дизайнер должен знать основы html/css/js
    Чтобы понимать, как будет реализовываться тот или иной элемент/функционал и возможно ли, вообще, это сделать

    • @markgober5969
      @markgober5969 Рік тому +1

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

  • @blackteamanga
    @blackteamanga 2 роки тому +15

    Спасибо за видео) Хотелось бы прокомментировать и поспорить с некоторыми моментами. В целом, с проблематикой согласен. Далеко не все дизайнеры, очевидно, грамотно работают с макетами. И всегда легко накреативить трендовые красивые штуки, не подумав о разработчиках...
    Тем не менее, к середине видео я стал несогласен с выдвигаемыми аргументами. Да, верстать куда легче, когда все красиво и четко расположено в контейнерах, но и верстальщик не должен злиться, что ему нужно добавить один паддинг) Это если я правильно понял суть вопроса, конечно. Также не соглашусь по поводу отвлекающих иллюстраций - да, может быть, в конкретном примере это не выглядит привлекательно. Но что же это получается, что надо сайты сугубо из текста делать, чтобы ничего не отвлекало? Вот такой посыл у вас получился в этом моменте, понимаю, что ненамеренно, но хотел обратить внимание.
    С чем категорически не согласен - это с критикой всплывающих окон, разработчик не должен ругаться на такое, я считаю. Если с точки зрения UX не предусмотрена фиксированная контактная форма на главной, то есть какие-то аргументы для таких решений. И это важная часть сайта, и критиковать попап - все равно что критиковать наличие любой дополнительной внутренней страницы только потому, что это +работа. Предельно важно тут не вселить в дизайнеров страх делать полноценный функционал)) Нужно делать все необходимые элементы, и мобильную версию дизайнить тоже, кстати.
    Еще раз спасибо)

    • @DoFurther
      @DoFurther  2 роки тому +2

      Главный посыл для дизайнеров, который я хотел донести - принимать взвешенные решения, которые помогают добиться поставленных задач.

    • @WERWOLION
      @WERWOLION 11 місяців тому

      Просто если дизайн сложнее то и стоимость работы уже не 50$ а 200$

  • @anya6182
    @anya6182 2 роки тому +3

    В такие моменты я рада что в начале я и дизайн делала и верстала сама. Пара раз помучалась с вёрсткой и потом все оступы-элементы делала одинкаовые/пропорциональные))) а уж иконки не поместить в компоненты в фигме это вообще как то ..

  • @d1namis
    @d1namis 2 роки тому +7

    8 минут нытья от junior верстальщика, на junior дизайнера.
    Единственная реальная проблема в видео - полное отсутсвие привязки к сетке. На все остальное мне было бы совершенно насрать, клиент всеравно платит почасовую ставку.

    • @DoFurther
      @DoFurther  2 роки тому +1

      Я не поверю, что ты не понял, что «нытьё» здесь только для иронии. Задача же была показать дизайнерам, что некоторые вещи делать не обязательно и наоборот, есть важные нюансы, которые должны быть учтены.
      Я стараюсь не использовать подход в работе: мне насрать что делать, если клиент платит.
      Мне как клиенту было бы страшно обратиться к: врачу, юристу, строителю, дизайнеру - с таким подходом в работе.

    • @d1namis
      @d1namis 2 роки тому +2

      @@DoFurther если ты хочешь именно научить дизайнера как правильно нарисовать сайт за счет зананий смежной профессии, то для начала посмотри гайд по верстки книги или брошуре, и увидешь что там точно такая же база. Совершенно идентичная, любую хорошую книгу можно сверстать в сайт как бы безумно она не выглядела по своему устройству, потому что там человек продумал ее структуру. Так вот, если дизайнер получил образование и до сих пор не может нормально сверстать сайт - то ты никогда его уже ничему не научишь, он уже давно проф. непригодный. И это я не к тому что книга или брошура сложней, но я не поверю что человек который зарабатывает дизайном на жизнь никогда не трогал inDesign.

  • @ktoya..
    @ktoya.. 2 роки тому

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

    • @DoFurther
      @DoFurther  2 роки тому

      Я notion использую по большей части для ведения канала. Лучше глянуть что есть на ютубе по этой теме, особенно если знаешь английский.

  • @kseniabarsi2935
    @kseniabarsi2935 Рік тому

    Очень классно !!! Спасибо я начинающий дизайнер, очень полезно!!

  • @MaxDuran-gf3gi
    @MaxDuran-gf3gi 2 роки тому +2

    Дякую за відео. Було б цікаво ще дізнатися, які часті помилки зустрічаються при дизайні апок.

    • @jullfill6256
      @jullfill6256 2 роки тому

      Дуже цікаво було б послухати.

  • @alexbov
    @alexbov 2 роки тому +1

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

  • @mrrrksmith
    @mrrrksmith 2 роки тому +4

    Я дизайнер в компании, и когда захожу в макеты коллег просто поражаюсь тому, какой там хаос в размерах элементов, в слоях. Папка в папке в папке в папке - это прям боль постоянная.

    • @ElenkaZP
      @ElenkaZP 2 роки тому +2

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

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      Такой человек и в жизни.

    • @MaxDuran-gf3gi
      @MaxDuran-gf3gi 2 роки тому +1

      @@ElenkaZP з автолейаутами це прямо в яблучко)))

  • @MikhailBoychenko
    @MikhailBoychenko 2 роки тому +3

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

  • @Miqueza_life
    @Miqueza_life 11 місяців тому

    А можно комплимент? Ты крутой и круто рассказываешь. Круто показываешь.

  • @caramellame
    @caramellame 10 місяців тому

    Люди, помогите советом дизайнеру! Вот если я делаю дизайн по минимальным размерам 1400*1024, 320*480, то как сделать, чтобы при верстке качество картинок было хорошее?
    Потом смотришь на мобильном или десктоп 1920 и все картинки растянутые в пикселях! Хотя они есть в большом размере, но как их передать на верстку. Верстают то макет, не смотрят ничего. Никакие доп материалы не просят и не видят.

  • @caramellame
    @caramellame 10 місяців тому

    Полезно, спасибо)

  • @ilabeazZzz
    @ilabeazZzz 7 місяців тому

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

  • @kirk1257
    @kirk1257 2 роки тому

    Хорошая тема для ролика, сенк ю! Возможно расширить тематику и показать на одном примере/макете тру подход и не тру?

    • @DoFurther
      @DoFurther  2 роки тому +2

      Это буквально тема следующего видео )

  • @marinastockaya9727
    @marinastockaya9727 2 роки тому

    Очень полезное видео! Часто говорят что верстальщики ругаю дизайнеров, а за что конкретно было не ясно)) У меня случается дробление размеров элементов когда я в Auto Layout их засовываю. Буду рада если подскажешь почему это происходит.

    • @user-yc7tn4ro3x
      @user-yc7tn4ro3x 2 роки тому

      Spacing mode поменяй, либо у тебя не четные размеры областей.

  • @sellerofhappiness2848
    @sellerofhappiness2848 11 місяців тому +2

    Мужик спасибо тебе за золотые истины! Я как фронт разработчик видел такие макеты что и страшном сне не приснятся) надеюсь те кто делает их посмотрят тебя и научатся уважать труд других. Спасибо!

  • @nefedorbondarchuk7662
    @nefedorbondarchuk7662 2 роки тому +4

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

    • @DoFurther
      @DoFurther  2 роки тому +4

      Так а зачем их делать? Почему сразу не сделать CTA блок, без всплывающего окна?

    • @wov2004
      @wov2004 2 роки тому +1

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

    • @MyNameIsChira
      @MyNameIsChira 2 роки тому +2

      Модальные окна если и делать - то это должны быть только небольшие уведомляшки с краю экрана. Но точно ни как не полноэкранные элементы побуждающие совершить целевое действие. Вы даже собственную реакцию на них посмотрите. При всплытии модалки, да ещё и в не подходящее время - единственное действие которое она побуждает сделать - закрыть её.

    • @David_Bowman
      @David_Bowman Рік тому +1

      @@MyNameIsChira сейчас бы все в одну кучу сваливать.
      Как насчёт окна с подтверждением удаления? Тоже бесит?

    • @MyNameIsChira
      @MyNameIsChira Рік тому

      @@David_Bowman Сейчас бы отвечать на комменты, не читая их. Нет не бесит, я не об этом писал.

  • @madbrother1987
    @madbrother1987 2 роки тому

    Дробные значения чаще всего возникают изза инструмента скейл, а он в свою очередь часто появляется когда весь дизайн уже нарисован и тут заказчик просит сделать логотип покрупнее или что-то в этом роде. Есть округлялки но они работают как попало. А что никто особо не старается такое бывает - задание на сайт приходит просто как идея без контента в виде текста и картинок дизайнер придумывает тексты, рисует картинки, придумывает структуру менеджерит и часто его уже не хватает на вылизывание макета под верстку.

    • @DoFurther
      @DoFurther  2 роки тому

      Так если сразу делать нормально, то таких проблем не возникнет.

    • @madbrother1987
      @madbrother1987 2 роки тому

      @@DoFurther что значит нормально? типа увеличивать не скейлом? да конечно, по хорошему надо нормально увеличивать) ПРосто какой размер устроит заказчика никто не знает))))

    • @DoFurther
      @DoFurther  2 роки тому

      Явно не тот размер, который усложняет работу над проектом.

  • @annamartirosyan183
    @annamartirosyan183 Рік тому +1

    То чувство, когда мой лид собирает макеты именно с этими ошибками, так ещё и без компонентов, в каждом блоке элементы новых размеров, про отступы вообще молчу 😭 и мне приходится также делать, иначе будет дудос атака(

  • @alexandrameas4436
    @alexandrameas4436 2 роки тому

    Насчет чисел с десятичными значениями: чаще всего причина - это использование autolayout, который растягивает элементы внутри контейнера. Получается, с точки зрения вестальщиков надо вообще отказываться от использования fill в лейауте? А если это календарь, например, который должен быть адаптивным? Тогда надо делать отдельный варианты для экрана ширины? Тогда наверняка будет жалоба, что прислали 100500 вариантов, и в них фиг разберешься.

    • @DoFurther
      @DoFurther  2 роки тому

      Автолейаута в макете не было. Но да, такая проблема есть. Параметры fill в автолейауте и scale в constraints делают делов.

  • @kateshaykh1500
    @kateshaykh1500 10 місяців тому

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

  • @sergeyageev2913
    @sergeyageev2913 2 роки тому

    Ищу хороший курс по Webflow. возможно кто-то сможет подсказать где искать или к кому обратиться?

  • @user-df5fm8tw6e
    @user-df5fm8tw6e 2 роки тому

    Ребята, я начинающий веб-дизайнер, но сразу созрел вопрос, как работать с верстальщиком используя кастомные сетки, отходя от 12 колоночной?

    • @Beast8833
      @Beast8833 2 роки тому

      "сетка" не ограничивается 12-колоночной системой, это более обширное понятие
      элементы могут быть за пределами этой сетки на определенных брейкпоинтах, но это если используется общий принцип на всем сайте или приложухе
      а не так, что при появлении новой страницы в будущем, всю сетку шлют на хер и лепят элементы, отходя от первоначального принципа в схожих блоках

    • @DoFurther
      @DoFurther  2 роки тому

      Начинающий и что-либо «кастомное» - плохо сочетаемые понятия )

  • @prostoxleb9567
    @prostoxleb9567 11 місяців тому

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

  • @draftermyself
    @draftermyself Рік тому

    Есть смысл, дело говоришь 😅

  • @stasdyda
    @stasdyda 2 роки тому +1

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

    • @DoFurther
      @DoFurther  2 роки тому

      Оооо, я такое говно делал с 5 летним опытом работы дизайнером, что страшно вспомнить 😂

  • @user-st3lb5jt1x
    @user-st3lb5jt1x 2 роки тому

    По поводу сеток - не уверена. Общалась со многими дизайнерами, которые делали макеты по сеткам и не по сеткам - никогда не было у них проблем с верстальщиками. А если не возможно запихнуть дизайн в сетку 12 колонок, если нужна кастомная? Пофиг? Главное чтобы верстальщику было удобно?

    • @DoFurther
      @DoFurther  2 роки тому +4

      Дело не в кастомности сетки, а в том что нужно быть системным. Сетка может быть кастомной, но тогда ее нужно придерживаться, а не делать дизайн решения на основе «просто-потому-что».

    • @ThePirateHistory
      @ThePirateHistory 2 роки тому

      Нашли """радость"""""", которая видать веб дизайном занимается и не выкупает за сетку, систему, да и просто головой думать, за сроки за всё ост. Ведь накуивертить на листе бумаге может каждый, засунул туда сюда норм

  • @adeptussilicium2821
    @adeptussilicium2821 2 роки тому +2

    1. По большей части со всем согласен. Но претензии по всплывающим окнам с формами, если честно, не понял. Вроде до сих пор довольно часто данный приём встречается и если хорошо задизаннен и свёрстан то проблем не вызывает.
    2. По сложным анимациям: да, в примере акцент с текста теряется (ну там вроде задумка с движением руки и лампочки, типа работа с идеей, и тут ошибка скорее в акцентах, что запихав туда эту анимацию забили на текст, с ним надо было тогда поработать), но надеюсь это был не в общем и целом камень в огород на сложных и красивых анимаций? Иначе мы придём к тому, что все сайты будут похожи один на другой и будут отличаться только картонками, текстом и соотношениями между блоками. И иногда анимации наоборот позволяют сделать акцент и компактным образом разместить информацию, увести взгляд пользователя туда, куда тебе надо, сделать акцент на UI элементах активных…
    3. Ну а что не понятно, как адаптировать последний кусок - так наверное дизайнер должен был ещё сделать макет для мобильной версии, после десктопной, если в макете подобная перегруженность экрана или я не прав?

    • @DoFurther
      @DoFurther  2 роки тому +1

      Пришлось работать с тем что было. Клиента поджимали сроки. С попап формами выкрутились на остальное временно оставили так.
      По анимации и фото. Всё должно работать для решения задач, а не во вред. Есть множество примеров уместной анимации. Я показывал такие примеры в разборах сайтов с awwwards (видео есть на канале).

  • @amelianceskymusic
    @amelianceskymusic 2 роки тому +1

    Как junior UX/UI вообще не пойму как такое реально.
    Еще к тому же недавно прошел подготовительный для фронтендщика (и пошел дальше, если кому интересно все бесплатно), так теперь стал сразу в дизайне все подписывать и готовить как будто потом верстать буду.
    Кстати нам на курсе где-то такие макеты и давали, ох у меня и подгорало под конец когда пытаешься систематизировать как-то, а приходиться костылизировать
    Единственное, что считаю оправданной некую вложенности, когда макет сделан полностью на autolayout, тогда быстрее верстать, потому что он уже как будто на флексбоксах собран

    • @DoFurther
      @DoFurther  2 роки тому

      Круто что у тебя такой подход к самообучению.

  • @wov2004
    @wov2004 2 роки тому +4

    01:55 Какой может быть баг из-за несовпадения в один пиксель или при дробных значениях? Чота чушь. Берешь блок с иконкой и конвертируешь в SVG - задача решена.
    02:25 Только юным подаванам нужна сетка для вёрстки, джедаи пользуются относительным расположением. Выравнивание по сетке для лохов.
    3:50 А не хер пользоваться Webflow для вёрстки. Для вёрстки нужен браузер и текстовый редактор, если редактор с подсветкой синтаксиса то просто приятнее будет.
    4:20 Используйте именование классов и вёрстку по БЭМ - будет вам щастье.
    05:40 для изображений есть фильтры, при нормальной вёрстке проблем никаких. А можно картинку фоном, а поверх полупрозрачный пиксель.
    -----------
    Согласен, что дизайнер должен своей шкуре испробовать вёрстку. Но только не на Webflow...

    • @user-dv9fk1hd3s
      @user-dv9fk1hd3s 2 роки тому +1

      Хоть один голос разума)

    • @user-tw3or3zc7e
      @user-tw3or3zc7e 2 роки тому

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

  • @yoursweetacid
    @yoursweetacid 2 роки тому

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

    • @DoFurther
      @DoFurther  2 роки тому +2

      Круто что мне хоть до кого-то донести суть видео.

  • @kirf2
    @kirf2 2 роки тому +5

    Надо за подготовку к верстке отдельный прайс выставлять 😄

    • @DoFurther
      @DoFurther  2 роки тому

      Верстальщикам или дизайнерам?

    • @kirf2
      @kirf2 2 роки тому

      @@DoFurther верстальщикам) им же приходится разгребать

    • @vgenm2457
      @vgenm2457 2 роки тому

      Что бы ваш кривой гемор разбирать 😅

  • @Poofikate
    @Poofikate 2 роки тому

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

    • @DoFurther
      @DoFurther  2 роки тому

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

    • @Poofikate
      @Poofikate 2 роки тому

      @@DoFurther мы сейчас про фигму?) если да, то нет (после обновы примерно 1.5-2 года назад), при смешивании пикчи и маски, они становятся едины, при экспорте, можно только выбрать брать ли в экспорт фон сзади, если ошибаюсь, буду рад узнать решение этого очень неприятного, как по мне, казуса

  • @olenadobravska6353
    @olenadobravska6353 2 роки тому +1

    Не совсем поняла комментария касательно параллакс эффекта: а если о нем попросил клиент, то причем тут дизайнер?

    • @DoFurther
      @DoFurther  2 роки тому +1

      У дизайнера на этот счет есть замечательный вопрос для клиента, если у него есть какие-то предложения по дизайну: «Что мы получим/выиграем, если это сделаем?» И тут же на ответ клиента есть контр аргумент с усложенением и удорожанием работы верстальщика.

    • @olenadobravska6353
      @olenadobravska6353 2 роки тому

      @@DoFurther Но это не всегда работает. Иногда у клиентов есть свое виденье дизайна и никакие советы и аргументы им не нужны. Возможно это именно тот самый кейс, где так решил клиент и ему не важно, будет это работать или нет.

    • @DoFurther
      @DoFurther  2 роки тому +1

      Да, такое бывает, но не в этом случае. Я работаю с клиентом напрямую и ряд изменений удалось легко отстоять при минимальной аргументации.

  • @vladislavabakumov3289
    @vladislavabakumov3289 10 місяців тому +2

    Ко всему перечисленному еще можно накинуть:
    1) Беспорядок в цветах(когда в макете в схожих элементах используются очень близкие, но все-таки разные оттенки, будто бы на глаз подбирались)
    2) Беспорядок в шрифтах (Использование отдельных шрифтов для каких-то единичных мест или использование в макете платных шрифтов/шрифтов которые не поддерживают язык целевого пользователя)
    3) Беспорядок в иконках (Использование в макете не векторных иконок).
    Если вы начинающий веб дизайнер, и только начинаете свой путь пожалуйста избегайте подобных вещей. Меньше будут гореть уши.

    • @bloha1929
      @bloha1929 9 місяців тому

      спасибо за совет)

  • @ksenyaD
    @ksenyaD 2 роки тому

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

  • @vgenm2457
    @vgenm2457 2 роки тому +7

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

    • @DoFurther
      @DoFurther  2 роки тому

      Гипотетически это могло бы помочь.

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      @@DoFurther Оно то помогает, а то будет у каждого 100500 методов и седи голову ломаешь на вся кую фигню

    • @Irenicus33
      @Irenicus33 2 роки тому

      @@vgenm2457 тогда и получать они должны в разы больше.

    • @liisaification
      @liisaification Рік тому +1

      Иногда и верстальщику не мешает идти проштудировать как что либо сверстать.

    • @vgenm2457
      @vgenm2457 Рік тому

      @@liisaification Что зацепило . 😅

  • @Galaxzier
    @Galaxzier 2 роки тому +7

    Я думаю каждый веб дизайнер должен уметь верстать сайты или хотя бы знать основы разметки, чтобы таких казусов не случалось

  • @Vladimir_Alexsandrovich_I
    @Vladimir_Alexsandrovich_I 2 роки тому +2

    Занимаюсь кухнями, что то похожее происходит при проектировании. И не объяснишь, что технически будет сложно, но я сделаю, но потом то через какое то время замучаетесь переделывать и не нужно оно вам окажется.

    • @DoFurther
      @DoFurther  2 роки тому +2

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

    • @serhiis_
      @serhiis_ 2 роки тому

      @@DoFurther А что электрики делают такого? Там начинка розеток, щитков и люстр вся скрыта и удобна для обслуживания.Вы разве розетку и люстру ни когда не меняли сами? Что там сложного и где подвох? Дизайн розетки и люстры может быть какой угодно, но внутри они все одинаковые

  • @userKras
    @userKras 2 роки тому

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

    • @ThePirateHistory
      @ThePirateHistory 2 роки тому

      Сегодня верстал, в декстопе таблица, в мобиле список при этом внутренность изменилась полностью, сама структура, появились новые заголовки которых не было вообще в десктопе и не должно быть в мобиле. И всё это буду скоро натягивать.

  • @luxarmiger5729
    @luxarmiger5729 2 роки тому +3

    Привет, все отлично рассказал. А еще сталкиваюсь с такими вещами, за которые дизайнеру хочется выразить "особую благодарность": в макете для десктопа элемент находится в одном месте, например, корзина товаров в header___top, затем при адаптиве (разрешение планшет) она перескакивает в header__center, а в мобильной версии эта же корзина должна быть в header__bottom. Это полностью нарушает логику верстки. Ну или как вариант дублировать эти корзины товаров в разных дивах, скрывать на каких-то разрешениях, на каких-то показывать.
    Короче, вывод: дизайнер должен понимать логику верстки.

    • @ThePirateHistory
      @ThePirateHistory 2 роки тому

      Брат, мой родной брат, мне знакома твоя боль, и я рот еб дизайнеров те что никогда не смотрели что такое компухтер. Решение такой проблемы на js, на пасте бин в бей GdewNRZC там нужно будет подправить потому что я сразу бахнул на меньше 980 и ок

    • @user-ed7wi6xn5n
      @user-ed7wi6xn5n 2 роки тому +4

      Да, это жесть. Или бывает что элемент с абсолютным позиционированием в пяти разных разрешениях расположен в пяти рандомных местах без всяких причин. На маленьком экране книга где-то справа сверху блока, на экране чуть побольше она слева в центре, на следующем экране она опять слева, но чуть ниже, на следующем экране её нет вообще, а на следующем она опять возникает там же была на первом экране, но на пять пикселей левее и на два выше. Верстаешь это и думаешь: какого хуя, блядь!

    • @ThePirateHistory
      @ThePirateHistory 2 роки тому

      @@user-ed7wi6xn5n жизааа

    • @vintprox
      @vintprox 2 роки тому +3

      это писец, согласен

    • @ksenyaD
      @ksenyaD 2 роки тому +1

      Да это просто бееесииит😑

  • @yaoleynikov
    @yaoleynikov 2 роки тому

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

    • @DoFurther
      @DoFurther  2 роки тому

      Случаи бывают разные. Главное чтобы сам дизайнер не становился причиной ненужных проблем 🙂

  • @kaihoso2677
    @kaihoso2677 2 роки тому

    Честно говоря это мой самый большой страх, на курсах про верстку говорят мало и вообще не делают акцент на этом. Пройдя 4 курса я толком не понимала, только когда начинаешь работать с реальными проектами потихоньку доходит.

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      А зачем вам все знать, главное вас много на выпускать, а к финишу мало доходят .

    • @kaihoso2677
      @kaihoso2677 2 роки тому +1

      @@vgenm2457 согласна, сейчас пошла на "профессиональный курс" думала там будет прям супер подробно и глубоко рассмотрены разные темы. В итоге будто для новичков курс, настолько сыро и устарело. Хотя описания были многообещающие.

    • @vgenm2457
      @vgenm2457 2 роки тому

      @@kaihoso2677 Профессионалом нужно стать самому и на своём опыте , Курсы это только в водной инструктаж, а дальше человек должен сам развиваться .

    • @kaihoso2677
      @kaihoso2677 2 роки тому

      @@vgenm2457 да, полностью согласна, жаль чт о я это поняла только после покупки курса, дальше они бесполезны

  • @AlekseyLoykuts
    @AlekseyLoykuts 2 роки тому

    Честно очень похоже на стоковый макет. Вот сколько их открывал - всегда там шляпа по верстке и иерархии. Что в былые времена для фотошопа, что сейчас для фигм и скетчей.

  • @sashakalinsky715
    @sashakalinsky715 2 роки тому +2

    Фразу "Я дизайнер - я так вижу", можно использовать лишь профи, которые пол жизни делали все как надо

    • @DoFurther
      @DoFurther  2 роки тому

      Даже им приходится аргументировать свои решения.

  • @user-zz7ko2vj2f
    @user-zz7ko2vj2f 2 роки тому

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

  • @anikserigatikov3350
    @anikserigatikov3350 10 місяців тому

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

  • @etsoSo
    @etsoSo 2 роки тому +1

    ну чувак ты в чемто прав конечно и интересно было но ты и усложняешь. Например ты предлагаешь сделать из картинки с маской и слоями одну растровую картинку, хотя фигма это векторный редактор. И в этом случае ты не думаешь о том как юзать дальше этот макет дизайнерам. Если захотят его изменить или поддерживать. На счет десятичных значений я уже слышал это, но это происходит из-за того, что ты масштабируешь элементы. Для того чтобы потом убрать десятичные значение тратиться уйму времени. Может кто знает какой-то плагин или пункт в настройках?

    • @serhiis_
      @serhiis_ 2 роки тому +1

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

    • @DoFurther
      @DoFurther  2 роки тому

      Картинки же находятся в векторном шейпе с параметром fill 🤷🏻‍♂️.
      По десятичным значениям нужно будет покопаться, так как заметил что и в автолейауте вылетает тоже самое при адаптиве.

  • @XilenFXNiceTeam
    @XilenFXNiceTeam Рік тому

    Говоря про padding и margin с ними вообще никогда неудобно работать. НО! С другой стороны верстальщик должен уметь работать с такими "неструктурированными элементами", а они чаще всего реализуются через margin и padding. Ну, и поскольку порой нестандартные элементы могут быть самыми захватывающими, но этот самый "нестандартный элемент" должен быть хорошо продуман дизайнером изначально, и он должен уметь его объяснять. Я не профессиональный дизайнер с миллионом рабочего стажа. Просто исходя из своего опыте в вёрстке и опыта в дизайне в целом делюсь. Тут важно понимание и того, как может это сверстать человек, и то как дизайнер придумает концепцию. Не уверен, что правильно донёс свою мысль, но да ладно

  • @flashback6836
    @flashback6836 2 роки тому +7

    Веб флоу конечно хорошо, но лучше попробовать чистую вёрстку.
    Дизайнер обязан знать что умеет чистый html/css, пишу как Дизайнер/Верстальщик.

    • @DoFurther
      @DoFurther  2 роки тому

      Думаю да, главное разобраться с приоритетами особенно джунам. Вебфлоу мне видится, как правильный шаг в этом направлении. Со временем так или иначе захочется делать более сложные проекты и без умения фигачить в «чистый код» уже будет сложно. Поэтому в какой-то момент это станет необходимостью, а значит и учить будет легче.

    • @DoFurther
      @DoFurther  2 роки тому

      Может еще что-тоо добавишь к сказанному в видео?

    • @flashback6836
      @flashback6836 2 роки тому +6

      @@DoFurther
      1. Перестать делать лендинги с рандомно разбросанными блоками.
      2. Выносите повторяющиеся элементы (Кнопки, шрифты, поля ввода, палитру) и их состояния в отдельный фрейм uikit.
      Верстальщик прописывает это в первую очередь.
      3. Не старайтесь делать по 5 разновидностей кнопок и других интерактивных элементов.
      4. Забудьте про параллакс с кучей не прибитых pngшек.
      5. Не делайте странных отступов ( верх 5, низ 3, лево 9, право 1).
      6. Старайтесь соблюдать квадратное соотношение сторон у контейнера иконок. Особенно если делаете сложные масштабируемые системы.
      7. Не делайте больше 4-6 размеров шрифта:
      Заголовок;
      Под заголовок;
      Основной шрифт;
      Мелкий тест.
      8. Учитывайте изменения размера контейнеров и их содержимого.

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      У них тогда мозги потекут, 😅

    • @MaxDuran-gf3gi
      @MaxDuran-gf3gi 2 роки тому

      @@flashback6836 Привіт, питання по 7 пункту: чи допускається використання декількох стилів для одного розміру шрифта, наприклад regular, medium, semibold. Чи краще використовувати чим по менше стилів?

  • @user-kt1kx6th7z
    @user-kt1kx6th7z 2 роки тому +1

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

  • @WERWOLION
    @WERWOLION 11 місяців тому

    Это всё просто идёт в счёт работы.
    Легко увидеть что одинаковые модули не вынесены и добавить Прайс за работу.
    Насчет выравнивания бред.
    На ПК делаем быстро сетку и кидаем пудинги.
    Так что если дизайнер сделал криво вообще без разницы.
    Дальше при адаптиве обнуляем пудинги и всё.

  • @vitamin_03
    @vitamin_03 Рік тому

    Я даже ещё не Джуниор, но глаза у меня от этого всего болят сильно

  • @egoregorov4670
    @egoregorov4670 2 роки тому +1

    Работаю в полиграфии допечатником, от 99% дизайнеров приходит полная лажа, которую приходится переделывать. Вывод у меня такой: дизайнером может назваться любой, кто открыл фотошоп/ корел/иллюстратор/индизайн, еще в более худшем случае "специализированный" сайт, где он сделает визитку/открытку/буклет/листовку для печати.

    • @user-sc9xe4dm6m
      @user-sc9xe4dm6m 2 роки тому

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

    • @caramellame
      @caramellame 10 місяців тому

      А под словами полная лажа, что имеется ввиду? По подготовке к печати, по цветам или по сетке...?

  • @user-jf1qc4fg4y
    @user-jf1qc4fg4y 2 роки тому

    - ну попводу не целых значений, это скорее вопрос к Фигма. Меня это просто выносит. Зачем это делать? Может из-за того что Фигма хочет быть редактором и для графдизайнеров?
    - по поводу блоков и сетки, дизайнеров нужно и можно заставлять рисовать по сетке (как минимум бутстрап) и делать 3 версии (лучше 4) экрана для разных ширин (Десктоп ФулХД, ХД , планшет и смартфон). Тогда он сам увидет как его "красота" адаптируется.)))
    - про картинки с эфектами - это по моему не изличимо, )))) - ну поэтому есть джуны - которые это все причесывают. Мидлы и сеньйоры страдают вирусом мальнькой власти)))
    По моему мненеию, для лечения этих болячек у дизайнеров, в Фигме есть автолеаут. Когда фигачиш макет используя эту фичу, претензий у кодеров поменьше.
    Спасибо за видос. Все классно рассказал.

    • @DoFurther
      @DoFurther  2 роки тому +1

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

  • @frizz9175
    @frizz9175 2 роки тому +1

    И теперь представить, что к этому всему заказчик требует пиксель перфект, ммм)

    • @DoFurther
      @DoFurther  2 роки тому +1

      Только с линейкой, которую нужно будет держать прислоняя к монитору 😂

  • @user-tk1re2hd2y
    @user-tk1re2hd2y 2 роки тому +1

    position: relative - всему ответ. Ну или transform: translate 🤔

    • @ThePirateHistory
      @ThePirateHistory 2 роки тому

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

  • @CtesiC
    @CtesiC 2 роки тому +2

    Пожалуйста ставь триггер ворнинг для таких фигма макетов: рандомные имена для элементов, группы вместо фреймов, маски в 2022м, отсутствие и намёка на ауто лайоут. Брр, у меня валерьянки столько нет.
    Но по поводу элементов, действительно не факт что всё от дизайнера зависело. У нас(продуктовая компания) пару лет назад отдел маркетинга решил заняться обновлением сайта, вместо того что бы нанять проверенную Украинскую студию с которой уже работали, нашли кого-то подешевле и готового выполнять все прихоти CMO. Получился мягко говоря пиздец, особенно в плане вёрстки. После того как мой фидбек по этому поводу проигнорировали чуть более чем полностью, я решил сидеть в сторонке и запастись попкорном. В итоге: верстальщик был найден с третьей попытки, первые два бросили не доделав и хом-пейдж, разработка затянулась на несколько месяцев. Но смешнее всего итог: в изначальном виде хом прожил всего месяц от силы, после чего был заменён на что-то более адекватное и поддающееся A/B-тестам и стилистически теперь несколько отличается от всего остального.

    • @DoFurther
      @DoFurther  2 роки тому +1

      Опыт командой успешно получен 😅

  • @Tornado-ln7fq
    @Tornado-ln7fq Рік тому

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

  • @yanabobina778
    @yanabobina778 2 роки тому +1

    В UX не стоит верстальщикам лезть)) ладно когда какие-то технические споры, но не в свою область не стоит :) бывает, что заказчик говорит, хочу так-и хоть ты тресни, влияет это на конверсию или нет.

  • @nataleesha3633
    @nataleesha3633 2 роки тому +2

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

    • @DoFurther
      @DoFurther  2 роки тому

      Если прочитать коммент без контекста, то да - чушь полнейшая. Я имел в виду, что в вебфлоу для класса можно задать дополнительный тэг (не путать с html тэгом), в котором отдельно можно задать параметр padding.

    • @user-mz4nk3ob2i
      @user-mz4nk3ob2i 2 роки тому

      @@DoFurther Это комбо класс называется

  • @hawardgreenwich3249
    @hawardgreenwich3249 2 роки тому +1

    Забавно
    *Красиво тупить не запретишь* дизайнеру
    😂😮

  • @RomanDoktorov
    @RomanDoktorov 2 роки тому

    а что с непрозрачностью текста? а то мне прилетало

    • @z1mmex
      @z1mmex 2 роки тому +3

      Вроде в дизайне всегда нужно использовать определенные цвета. Например, серый цвет может быть как оттенок, а может быть просто чёрный с 50% прозрачностью. Так вот, нужно брать именно серый, а не чёрный с прозрачностью. Посмотри в инете, я где-то давно видел небольшую статью про это

    • @serhiis_
      @serhiis_ 2 роки тому

      @@z1mmex Нет. серый и полупрозрачный это совершенно разные вещи. Под полупрозрачным текстом можно видеть другию картинку. А под серым ты ни чего не увидишь. Цвета с альфа каналами еще 10 лет назад поддерживаются в мобилках и тем более в хроме. Только у криворукихх верстальщиков могут быть проблемы с цветам с альфа каналами

  • @agraiskr
    @agraiskr 2 роки тому +1

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

  • @user-vt6iz5bt8f
    @user-vt6iz5bt8f 2 роки тому +1

    + 100500 по всем фронтам (хоть и не верстальщик, а ПМ и техдир)
    а, особо люто лучи "доброты и благорасположения" вызывают именно авторы подобного возомнившие себя при этом "без трёх минут профи".
    И, с непоколебимой уверенностью демонстрирующие это.
    Классические идейные дилетанты по Даннингу-Крюгеру, не желающие учиться, без системного мышления и с ЧСВ размером с галактику.
    Это треш...
    (а, особый треш, когда подобное проехало по ушам заказчику, и/или выступает с его стороны. в таких случая, зачастую целесообразнее отказать клиенту в сотрудничестве вообще, т.к. нередко это может являться индикатором и дальнейших "увлекательных приключений" с данными персонажами и тратой времени в пустую (при чём впустую несмотря на вроде бы "деньги"))

  • @user-rv8gg5xj9t
    @user-rv8gg5xj9t Рік тому

    1:02 что это?

    • @DoFurther
      @DoFurther  Рік тому

      потороченное межбуквенное расстояние в словах

  • @ElenkaZP
    @ElenkaZP 2 роки тому +1

    Дизайн прям грустный. Рискну предположить, что делал его или сам клиент, или его племянник, или джун-фрилансер за копейки. И верстальщика нанял наверняка ж не самого дорогого, ибо дизайнер, который умеет фронтенд, дешевле, чем настоящий опытный фронтендщик. Вот и вышло, что на всех этапах попаболь, ибо дёшево же.
    А вы любите выходить из зоны комфорта, я погляжу )) Я тоже дизайнер и тоже умею верстать, но всегда стараюсь отпетлять от вёрстки, ибо скучно очень, плюс кроссбраузерная совместимость печалит иногда)
    По опыту (верстальщики а разрабы приложений могут со мной общаться если им надо) могу сказать, что больше всего неприятностей верстальщикам доставляют странные фоновые картинки, которые вылазят за границы фрейма и при сохранении получается фигня какая-то. Кроме того я один раз протупила и использовала режим наложения для плашки, который в цсс нереализуем. Ну и последнее: разработчики очень не любят кастомные элементы вроде красивый календарей с альтернативной логикой , которые сложно и долго реализовывать.

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      Просто нарисовать то легко, а воплотить это другое дело когда не знаешь всех тонкостей дела .

    • @ThePirateHistory
      @ThePirateHistory 2 роки тому

      "но всегда стараюсь отпетлять от вёрстки, ибо скучно очень" всё говорит само за себя.

    • @vgenm2457
      @vgenm2457 2 роки тому +1

      @@ThePirateHistory ну да а другие пускай е..б

  • @Kindly_Otter
    @Kindly_Otter 2 роки тому +4

    Капец верстальщики обленились)

    • @DoFurther
      @DoFurther  2 роки тому

      Так-то можно подумать что тебе по телефону рассказывал суть видео 🤣

  • @Karnassix
    @Karnassix 2 роки тому +5

    Ох, чувак ты триггернул. Конечно, аккуратный и грамотный хендофф никто не отменял, вопросы к применению тех или иных эффектов и решений на этапе дизайна - тоже, но все остальные твои претензии - это ной верстальщика, который делает наотъебись.Размеры иконок разные? Покажи мне верстака, который не будет тупо через контрол выделять и экспортить кривые из иконки даже если эта иконка вставлена как компонент из библиотеки (с унифицированными размерами и отступами), я ему лично пожму мужественную руку. Модульная сетка? Верстаки делятся на два типа: одни вообще не в курсе как ее включать и что это такое, а у других бутстрап головного мозга, и они не знают что делать с блоком если он вдруг не списан четко в сетку (и не приведи ктулху, если сетка у тому же не двенадцатиколоночная). Это уже не говоря о том, что модульная сетка это инструмент для облегчения организации композиции и унификации, а не незыблемые рельсы, от которыхнельзя отступать. Подблоки с иконками расположены на разных уровнях? ЭТО НЕВОЗМОЖНО ТЕХНИЧЕСКИ РЕАЛИЗОВАТЬ!!!! ← моя любимая отговорка у верстаков, которым просто впадлу хоть немного шевелить мозгом, при этом они будут делать все что угодно, вплоть до прикладывания к экрану прозрачных пленок с картинками, лишь бы не включать мозг и не делать свою работу, которая заключается в реализации дизайна на фронтэнде. Параллакс? Оказывается, в 2022 году реализовать простейший параллакс оказывается сложно, трудоемко и вообще ТЕХНИЧЕСКИ НЕВОЗМОЖНО для реализации адаптивности. Придирка на тему впихивания всех эффектов в один слой имеет место быть только в случае, когда тебе самому еще надо редактировать макет, потому как вынесенная на отдельный слой полупрозрачная заливка отдельно от картинки скорее всего означает, что в верстке поверх картинки должен накладываться корректирующий слой чтобы условно любая картинка встявлялась на это место без предварительной обработки. Если все это впихнуть слоями внутри объекта в 99,9% случаев верстак экспортнет этот объект целиком, даже не подумав о слоях внутри и зачем они там. А вот на тему адаптивности и мобильной версии получается странно - макет был что ли без проработанных базовых брейкпойнтов? Не, ну тогда все что выше конечно можно и простить)

    • @DoFurther
      @DoFurther  2 роки тому +2

      я думаю пусть будет такое «спорное» видео для новичков: как думать что ты делаешь, потому что еще после тебя будут работать люди - чем вообще никаких видео на эту тему.

  • @lady_fantasy
    @lady_fantasy Рік тому

    Для меня, как для дизайнера, это было бы личным позором.

  • @Zargarov
    @Zargarov 2 роки тому +1

    да всё сохранить картинкой и замапить линками =)

    • @DoFurther
      @DoFurther  2 роки тому

      Смотрю староверы здесь? 😅

  • @VladDraculator
    @VladDraculator 2 роки тому

    Слава богу я больше практически не верстаю. В таких случаях имеешь полное право делать все на глаз. Если такого дизайнера взяли на работу, значит во всем остальном заказчик, менеджер разбирается примерно так же. Также плохо. Не нужно с такими работать.

  • @ThePirateHistory
    @ThePirateHistory 2 роки тому

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

    • @Beast8833
      @Beast8833 2 роки тому

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

  • @user-tw9ny5rg4b
    @user-tw9ny5rg4b 2 роки тому

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

    • @DoFurther
      @DoFurther  2 роки тому

      Гыгыгыг. В следующем видео как раз буду исправлять такой макет.

  • @oWeRQ666
    @oWeRQ666 2 роки тому +1

    Поржал с проблем автора, показанный дизайн ради дизайна даже разбирать нечего, верятно такую хрень лучше всего вообще каким-нибудь tailwind’ом верстать, попутно немного округляя отступы, управлять таким контентом все равно нереально. Реальная беда, когда есть набор простых и функциональных элементов, а дизайнер придумывает кастомную вундервафлю на ровном месте. Или забывает, что контент динамический, высота и ширина элементов может меняться и гриды с флексами не справляются, приходится откапывать js костыли времен флоатов.

  • @Dasha_koip
    @Dasha_koip 2 роки тому +1

    Через 3 месяца оканчиваю курсы ui|ux диза... И чувствую, буду учиться ещё и вёрстке... 👌

    • @DoFurther
      @DoFurther  2 роки тому +1

      Хорошее решение

  • @alexanawinter
    @alexanawinter 6 місяців тому

    как я тебя понимаю... ненавижу дизайнеров

  • @mr.gregor877
    @mr.gregor877 2 роки тому +2

    Ладно все по группам оккуратно расписать , шапка и.т.д . Но что теперь делать сайты 2010 годов что бы верстальщику меньше работы было при этом испортить свою работу?

    • @DoFurther
      @DoFurther  2 роки тому +1

      Можешь кинуть таймкод, где я к этому призываю?

  • @madhed85
    @madhed85 2 роки тому

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

  • @Sergeydk
    @Sergeydk Рік тому

    Можно про ленивых front end разрабов 😂

  • @user-zk4ip3su2o
    @user-zk4ip3su2o 2 роки тому +1

    Что за херню ты несёшь? 150 на 150.88? Вы что там верстаете? 0.88 пикселей realy? Браузер некоторые макеты вообще не сможет отобразить идеально пиксель в пиксель. Хоть усрись.Пиксель перфект для жёстких косяков используется щас. Проблема дизайнеров это произвольные отступы от балды для адаптива. И разные ваще абсолютные отступы от балды на однотипных страницах . Вот это гемор. Или произвольные размеры на 4х медиа запросах. Это хороший пример как ты говоришь что ты когда верстаешь картины пишешь. Щас востребованы сайты с хорошей бизнес логикой. Ну или если красоты то это канвас с крутыми анимациями а не лендинг пиксель в пиксель.

  • @CHELOVEK89
    @CHELOVEK89 2 роки тому

    на самом деле не дизайнер решает а менеджер или клиент.

    • @DoFurther
      @DoFurther  2 роки тому

      Но в силах дизайнера консультировать клиента о лучших решениях, подкрепляя их очевидной аргументацией.

  • @masterskayaisaeva
    @masterskayaisaeva 2 роки тому

    Устал ждать новое видео

  • @batskalevich
    @batskalevich 2 роки тому

    да картинкой вставил такие буквы поехавшие и все))

    • @DoFurther
      @DoFurther  2 роки тому

      В формате tiff 😅🤝

  • @user-wr7lj7wq6h
    @user-wr7lj7wq6h Рік тому

    веб-дизайн всё ещё актуально на 2022?

    • @DoFurther
      @DoFurther  Рік тому

      Как посмотреть. На этом еще точно можно зарабатывать.

    • @user-wr7lj7wq6h
      @user-wr7lj7wq6h Рік тому

      @@DoFurther но эта ниша уже занята?

  • @user-xw5bb4cu7t
    @user-xw5bb4cu7t 2 роки тому

    в 2022 еще используют слово верстальщик ?

    • @DoFurther
      @DoFurther  2 роки тому

      Да, старые пердуны, типа меня XD

  • @maximmaslennikov4038
    @maximmaslennikov4038 2 роки тому +1

    Кто, скажите. заказывает работы у настолько криворуких дизайнеров, которые даже базовых вещей не понимают. И ладно дизайнер не до конца понимает, как готовить макет к верстке, но криворукий, пожёванный дизайн отдавать, это жесть. Если только это не стоит 3 копейки...

    • @xezdx
      @xezdx 2 роки тому

      Ну все-таки примеры в видео скорее для сайтов типа презентации, там акцент как раз на вот этот разброс, так что требовать чтобы там было всё выравнено как в экселе неправильно. Да и картинки можно самому подрезать под нужные размеры. Я не верстальщик, я программист, я бы большинство этих картинок просто задним фоном положил и никто бы не узнал 150 там пикселей или 151.

    • @maximmaslennikov4038
      @maximmaslennikov4038 2 роки тому +1

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

    • @serhiis_
      @serhiis_ 2 роки тому

      @@maximmaslennikov4038 Этот человек что делает прикольно - называется дищайнер в IKEA. Там они получают по миллиону евро/год. И делают как раз фигню, которая максимально дешевая по материалам. А технари должны разработать тех процесс изготовления, дизайнеру все равно что технарь с этим не справляется, значит выгонят технаря и пойдут к китайцам. Китайцы сделают любую прихоть дизайнера с IKEA. Так что не будь плохим технарем, а то в рашку отправят с швейцарии быстро, там будешь за 3к долларов работать это потолок по зарплате. Ну пока доллар не упадет....

    • @maximmaslennikov4038
      @maximmaslennikov4038 2 роки тому

      @@serhiis_ ну кто считает, что это все правильно, пусть и становится верстаком и пашет на таких идиотов)