Адаптивный дизайн лендинга. Как сделать дизайн адаптивного лендинга в фотошопе

แชร์
ฝัง
  • เผยแพร่เมื่อ 15 พ.ย. 2024

ความคิดเห็น • 31

  • @HawkStyle1
    @HawkStyle1  6 ปีที่แล้ว

    Адаптивный дизайн лендинга. Как сделать дизайн адаптивного лендинга в фотошопе?
    Присоединяйтесь в мой блог ВК: vk.com/hawkstyle_vkdesign

  • @ИринаКочубей-я3ш
    @ИринаКочубей-я3ш 6 ปีที่แล้ว +3

    Алексей, спасибо за видео. Все очень четко, понятно объяснили. Да еще и лайфхаками с нами поделились, полезное видео получилось!)

  • @katrinafedoroba4622
    @katrinafedoroba4622 5 ปีที่แล้ว +2

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

  • @boykodmitriy
    @boykodmitriy 6 ปีที่แล้ว

    Крутой прием по работе в десктопной версии, обязательно попробую. Спасибо.

  • @КоучЮлияГребенюк
    @КоучЮлияГребенюк 6 ปีที่แล้ว +2

    Спасибо за видео, все понятно. Алексей, подскажите:
    1. Расстояние между блоками для мобильной версии делать лучше где-то в 2 раза меньше, чем для веб-версии? Примерно 50 рх
    2. Мобильную версию дизайнер отрисовывает по умолчанию или это надо обсуждать с заказчиком? Или заказчик говорит: надо вот это. И ты уже по умолчанию рисуешь и для мобилки, и для планшета. Или все-таки все форматы обсуждаются с заказчиком и есть доплата за еще один формат? Интересен этот вопрос ценообразования.
    Хотелось бы увидеть видео, как вы передаете свою работу верстальщику: в каком формате, какие приписки делаете.
    Еще интересны видео, в котором рассказывается, как сделать какие-то эффекты в фотошопе
    Спасибо)

    • @HawkStyle1
      @HawkStyle1  6 ปีที่แล้ว +1

      1. Да, примерно 50 px в среднем
      2. Обязательно заранее обсуждать это с клиентом, потому что это влияет на цену проекта. Я всегда даю на выбор 2 цены: с моб версией и без неё, чаще всего заказывают с моб., потому что сейчас более половины трафика на сайте идет с телефонов и важно чтобы она была.
      Спасибо за идеи для новых видео)

  • @Lucky.manifest
    @Lucky.manifest 6 ปีที่แล้ว

    Отличные уроки, спасибо!

  • @AndreyPopov
    @AndreyPopov 5 ปีที่แล้ว

    Спасибо ! Узнал много нового для себя !

  • @lavalexse
    @lavalexse 6 ปีที่แล้ว

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

    • @HawkStyle1
      @HawkStyle1  6 ปีที่แล้ว

      Такой фон сохраняется в формате PNG (с прозрачным фоном) и без проблем интегрируется в верстку

  • @andrTaylor
    @andrTaylor 5 ปีที่แล้ว

    Алексей, вы забыли адаптировать pop up 1 и 2) в целом справился сам на основе предъидущих адаптаций)

    • @HawkStyle1
      @HawkStyle1  5 ปีที่แล้ว +1

      Я специально их не адаптировал, потому что верстальщик на основе одного окна может всё сделать сам

  • @timurubaydullaev5282
    @timurubaydullaev5282 4 ปีที่แล้ว

    Бомба

  • @Maresto1000
    @Maresto1000 5 ปีที่แล้ว

    Здравствуйте! Спасибо за полезное видео. У меня к вам вопрос, помогите, пожалуйста, разобраться в таких нюансах:
    1. Если я делаю мобильную версию в 320 px , то получается, что это вертикальная версия отображения сайта в мобильном, под какой размер мне нужно ориентироваться, чтобы сделать также горизонтальную?
    2. Слышала версию, что макет под планшет размером в 720 px (портрет) делать необязательно, что он просто может в данном случае отображаться как мобильная версия (альбом). Правда ли это или лучше сделать две отдельные версии? И нужно ли, чтобы эта версия была похожей на мобильную (я имею ввиду нужно ли делать уже на данном этапе слайды в один ряд, карточки из нескольких рядов в один и т.д.)
    3. Как мне правильно передать верстальщику работу мобильной версии в тех моментах, где я делаю слайды в один ряд. Нужно ли мне все карточки наложить друг на друга в фотошопе и скрыть все ненужные слои? Тоже самое касается кнопки «Смотреть все проекты». Мне нужно также отрисовать отдельно каждый «скрытый» проект или ленту всех «скрытых» проектов и также отключить эти слои в макете?

    • @HawkStyle1
      @HawkStyle1  5 ปีที่แล้ว

      1. Я никогда не делаю макет для горизонтального моб.вида., это не нужно.
      2. Под планшет не делаю макеты, на нем отображается также как в вебе.
      3. Просто скрытыми слоями в psd оставить.

    • @Maresto1000
      @Maresto1000 5 ปีที่แล้ว

      @@HawkStyle1 благодарю за ответ! Извините за назойливость, но помогите понять, как же тогда будет себя "вести" мобильная версия, если пользователь перевернет телефон горизонтально?
      И как планшет отобразит все как в вебе, если я делаю макет сайта размером 1170 px, а размер планшетной версии в 720 px? Ведь места по ширине станет намного меньше.
      Благодарю за внимание!

    • @HawkStyle1
      @HawkStyle1  5 ปีที่แล้ว

      @@Maresto1000 Если работать с нормальным верстальщиком, то он расставит всё ровно и для 720 и для 1170. Если верстальщик тугой, то лучше рисовать вообще все возможные размеры

    • @Maresto1000
      @Maresto1000 5 ปีที่แล้ว

      @@HawkStyle1 спасибо, стало понятнее. Благодарю за ответы!

  • @jaymahone9354
    @jaymahone9354 6 ปีที่แล้ว

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

    • @HawkStyle1
      @HawkStyle1  6 ปีที่แล้ว

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

  • @imeegogg6884
    @imeegogg6884 5 ปีที่แล้ว

    В том блоке, где 6 шагов к новому дому, нужно ли остальные 5 шагов редактировать и подгонять под размеры первого шага?

    • @HawkStyle1
      @HawkStyle1  5 ปีที่แล้ว

      Можно не подгонять

  • @veronikan.121
    @veronikan.121 5 ปีที่แล้ว

    Добрый день. Спасибо за видео. Меня измучал вопрос, как уменьшать фотографии (smart objects) через crtl+t, если при сжатии лезут пиксели и фотография все-равно выглядит отвратно при приближении....
    Спасибо большое, заранее

    • @HawkStyle1
      @HawkStyle1  5 ปีที่แล้ว

      А какой изначально размер фотографии в пикселях?

    • @veronikan.121
      @veronikan.121 5 ปีที่แล้ว

      @@HawkStyle1 7760х10376, 4МБ, то есть фотка сама по себе хорошего качества, как и другие фотографии на макете, но при изменении размера через кнтрл+т (уменьшаю) все становится расплывчатым. Так и должно быть? Или при верстке берутся оригиналы фотографий? Где уверенность, что при заливке на сайт фотографии не потеряют своего качества и будут нормально видны. Спасибо заранее за ответ.

    • @HawkStyle1
      @HawkStyle1  5 ปีที่แล้ว

      @@veronikan.121 Такие большие фото в виде смарт объекта становятся расплывчитыми только в тот момент пока они трансформируются через CTRL+T, но когда трансформирование завершено и вы это подтвердили через ENTER - фото снова становится четким.

  • @GoodmanAlexandr
    @GoodmanAlexandr 6 ปีที่แล้ว +1

    Фотошоп в 18 году для веб? Серьезно?

    • @HawkStyle1
      @HawkStyle1  6 ปีที่แล้ว +2

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

    • @МадиярСыздыков-м2м
      @МадиярСыздыков-м2м 6 ปีที่แล้ว +2

      H2M а что еще есть? Я просто с поселка

    • @nagoloe.r.a.5593
      @nagoloe.r.a.5593 6 ปีที่แล้ว +1

      Громко прокричи свое SKETCH!