Продвинутый урок по Figma от арт-директора. Автолейауты, компоненты и эффект портрета из текста

Поділитися
Вставка
  • Опубліковано 8 чер 2024
  • 🔥 Бесплатный курс по дизайну с бесплатной обратной связью: t.me/freeeducation_uprockbot
    Продвинутый урок по Figma от арт-директора
    Евгений Кузьмин (CEO & Art-director студии UPROCK) делится своим опытом, рисует актуальный дизайн, и разбирает главные ошибки в UX/UI.
    0:00 Вступление
    0:46 Сетка
    1:15 Хедер
    3:59 Заголовок
    4:45 Описание
    6:59 Создание эффекта портрета из текста
    8:52 Заголовок второго блока
    11:02 Карточки
    15:40 Заключение
    🚀 Ждём вас в школе UX/UI дизайна №1 UPROCK: school.uprock.ru/middle
    ☀️ Написать менеджеру школы: t.me/uprocksale
    ПОЛЕЗНОЕ ДЛЯ UX/UI-ДИЗАЙНЕРОВ:
    Скачать бесплатно кириллические шрифты: www.fonts.uprock.ru/
    Все самые полезные сайты и мокапы для дизайнеров: www.baza.uprock.ru/
    Бесплатная онлайн-книга по UX/UI-дизайну: www.uprock.ru/education
    Зарубежные статьи по UX: www.uprock.ru/all-articles
    Видео-уроки по дизайну: t.me/uprockdesign
    НАШИ СОЦ. СЕТИ:
    Личный инстаграм Евгения: / zhenya.ninja (запрещен в РФ)
    Крутые анимации из наших кейсов: dribbble.com/uprockpro
    Лучшие сайты на Behance: www.behance.net/uprockawards
    Заказать дизайн сайта или брендинг компании: www.agency.uprock.ru
    #вебдизайн #figma #ux #uprock

КОМЕНТАРІ • 67

  • @UPROCK
    @UPROCK  10 місяців тому +3

    🔥 Бесплатный курс по дизайну с бесплатной обратной связью: t.me/freeeducation_uprockbot
    Материалы к уроку - www.figma.com/file/PnVcoSuMNcbx06o8Pyu1iH/21.04.2023---%D0%9F%D0%BE%D1%80%D1%82%D1%80%D0%B5%D1%82-%D0%B8%D0%B7-%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0-%D0%BE%D0%B1%D0%BB%D0%BE%D0%B6%D0%BA%D0%B0-(%D0%BF%D1%80%D0%B0%D0%BA%D1%82%D0%B8%D0%BA%D0%B0)?type=design&node-id=65-70&mode=design&t=XQJrmYuBQ733fPNP-0

  • @user-gc8hy7ji3v
    @user-gc8hy7ji3v 11 місяців тому +5

    Благодаря этим урокам уровень отрисовки работ вырос в десятки раз! :)
    Спасибо большое, Сенсей)

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

      Супер, очень рад это слышать, Анастасия👍 Всегда пожалуйста)

  • @Tima_ropolicks
    @Tima_ropolicks 2 місяці тому +1

    Огромное спасибо, хотелось бы больше такого контента!

    • @UPROCK
      @UPROCK  2 місяці тому

      Салют! На канале есть много уроков такого типа, а так же бесплатный курс с обратной связью по ссылке freeschool.uprock.ru/

  • @user-qu3fv4tv8r
    @user-qu3fv4tv8r 2 місяці тому +1

    спасибо за урок! крутой дизайн!

    • @UPROCK
      @UPROCK  2 місяці тому +1

      Пожалуйста☺️

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

    Очень круто!!! Спасибо за подробные комментарии и урок! Буду ждать еще такие))

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

      Всегда пожалуйста, рад, что урок понравился) В плейлисте ua-cam.com/play/PLgP78sMGTxfDPkmubjSFA3Nkl_lHCemGz.html есть много подобных уроков, и я регулярно выпускаю новые, так что следите за оповещениями 😉

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

      @@UPROCK даа, буду смотреть и старые и новые!

  • @user-cc7xv7vv3s
    @user-cc7xv7vv3s 11 місяців тому +2

    Очень красиво и познавательно. Спасибо урок

    • @UPROCK
      @UPROCK  11 місяців тому +1

      Пожалуйста, Екатерина!👍

  • @dingoman856
    @dingoman856 11 місяців тому +4

    Продвинутый урок от начинающего дизайнера: чтобы заменить текст, но при этом оставить стиль, при вставке выделяете весь заменяемый текст и нужно нажать Ctrl+Shift+V / Cmd+Shift+V.

    • @UPROCK
      @UPROCK  11 місяців тому +1

      Да полезная фича, сам постоянно этим пользуюсь

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

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

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

      Салют, Денис! Пожалуйста👍

  • @user-gg6ti6kd4c
    @user-gg6ti6kd4c 3 місяці тому

    спасибо вам большое за бесплатные уроки

    • @UPROCK
      @UPROCK  3 місяці тому

      Всегда пожалуйста, Яна! 👍

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

    Отличный урок! Спасибо, буду повторять)

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

      Всегда пожалуйста, Людмила👍

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

      @@UPROCK 😊 помучилась немного, и не так быстро как вы, но довольна результатом))

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

    Спасибо за урок! Было бы здорово показать, если бы этот макет еще перенести на один из конструкторов, ту же Тильду со всеми адаптивами.

    • @Chihuahua-du5zx
      @Chihuahua-du5zx 11 місяців тому

      Перенеси самостоятельно) тут уроки по фигме, тильда отдельный инструмент, и если это всё переносить в прямом эфире этой займёт гораздо больше времени)

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

      Может проще ко мне сразу в школу дизайна?) school.uprock.ru/middle

  • @user-hp4jc7ki4x
    @user-hp4jc7ki4x 11 місяців тому +2

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

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

      Спасибо за такой позитивный отклик, Чингис🙏

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

    Какое интересное решение- эти уголки 😍

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

      Спасибо, что отметили, Юлия👍

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

      Спасибо вам, Евгений, что щедро делитесь опытом.

  • @UPROCK
    @UPROCK  11 місяців тому +1

    Материалы к уроку - goo.su/BqmiiU

    • @user-rt4cb8qt5x
      @user-rt4cb8qt5x 11 місяців тому

      у меня не открывается ссылка

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

      не открывается

  • @andreas8999
    @andreas8999 11 місяців тому +3

    Почаще бы подобные уроки) можно даже чуть посложнее что то

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

      Запрос принят) Буду работать над этим👍

  • @VeronikaVolkova-fy7xo
    @VeronikaVolkova-fy7xo 11 місяців тому

    Крутые уроки

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

      Спасибо, Вероника🙏

  • @natalya6761
    @natalya6761 11 місяців тому +1

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

    • @UPROCK
      @UPROCK  11 місяців тому +1

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

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

      @@UPROCK поняла, спасибо за ответ!)

  • @user-qt4dv3oc2w
    @user-qt4dv3oc2w 3 місяці тому

    Добрый день! Какую команду вы использовали для создания инстанс на 2:47? У меня иконки создаются как родительские компоненты, а не как дочерние.

    • @UPROCK
      @UPROCK  3 місяці тому

      Здравствуйте, Милена! Мы создаём родительские компоненты иконок, потом делаем их копии. Копии остаются в макете, а родительские компоненты переносим в ui-kit

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

    что делать если нет функции spacing mode? ее как-то включить можно или доплачивать за нее нужно?

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

      В новом обновлении вместо spacing нужно набрать интервал между объектами в автолейауте, а для space-between нужно набрать в поле интервала auto

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

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

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

      Да, там большое классное обновление, у меня в инсте есть пост про него👍

  • @mansur_terla
    @mansur_terla 11 місяців тому +3

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

    • @UPROCK
      @UPROCK  11 місяців тому +1

      Спасибо большое, Мансур. В будущем как-нибудь подготовлю, просто он реально очень длинный этот путь, тут надо морально собраться)

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

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

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

      Здравствуйте, Мария! Конечно, Вы можете задавать любые вопросы прямо куратору) Ещё можете пересмотреть урок про автолейауты в бесплатном курсе по фигме, здесь, на канале👍

  • @Livuj.Cherevuk
    @Livuj.Cherevuk 11 місяців тому

    15:30
    Не совсем понятное движение, можно ведь просто увеличить внутренний (зеленый) компонент до 1880px, правильно ?

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

      Да, всё верно

  • @user-zr8xv5on7o
    @user-zr8xv5on7o 11 місяців тому

    Хотелось бы что-то более функциональное, нежели 2 симпатичных блока. Составить CJM, собрать небольшой разветвленный сценарий, поработать с "полученными" метриками и тд

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

      Привет, посмотри пожалуйста на канале много разных видео на разные запросы

  • @user-kw3uy5qy3s
    @user-kw3uy5qy3s 11 місяців тому

    У меня после обновления пропал параметр Inspect, что с этим делать?

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

      Привет! Там теперь целый мод для этого функционала

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

    В каком фотостоке вы берете такие качественные фото? очень интересно😮

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

      Салют! В самых разных, у нас нет какого-то определённого стока. Качественные фото сейчас везде😉

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

    Круто, а можно больше упор на моб версии сайтов, так как это более 80% трафика это телефоны, а в некоторых сферах 90%, и на мобильнике в 10 раз сложнее дизайн клепать, не смотря не то что там меньше пространства

    • @UPROCK
      @UPROCK  11 місяців тому +3

      Салют, Иван! Не могу с тобой согласиться ни по одному пункту🤷‍♂️
      Во-1х откуда у тебя такая статистика по трафику сайтов? Во-2х адаптивы практически всегда представляют собой сильно упрощенную версию десктопа в силу целого ряда объективных причин

    • @ipellya
      @ipellya 11 місяців тому +1

      @@UPROCK Статистику можно взять с нескольких источников, желательно свежих. Там наглядно и понятно можно увидеть, весь мир перешел в мобильный интернет еще с начала 2012 года начался активный переход. Такие сфере как би ту би еще более менее в приоритете. Также для создателей контента и работы, десктоп нужен. Но сферы для потребителей уже все в мобильном мире. Трафик смотрел в разных сферах с 2013 года по 2022 до начало войнушки, затем пришлось завязать с маркетинговым агенством. Сейчас другие проекты и там трафик 80% это мобилка. Но что еще важно и конверсии тоже с мобилок больше чем с десктопа. То что на мобилке все упрощено, так это и понятно, но там в 10 раз сложнее все делать в этом и фишка, так как на десктопе там 10034324 вариантов дизайном можно запилить, а на мобилке будешь продумывать каждый пиксель. Просто многие делают акцент на том что проще, а забубень отличный сайт на мобилке, там не только дизайн нужен, скорость - основная метрика, простота, удобство и тд. Вообщем я к тому что хочется больше мобильных сайтов видеть в плане дизайна.

    • @ipellya
      @ipellya 11 місяців тому +1

      да и дизайн же делается для чего-то для продаж например, а не для красоты, а то круг по середине и есть идеальный дизайн, только нахрена он нужен :)

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

    Подбухнул мальца.

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

      Я?) Или ты во время просмотра?)

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

      @@UPROCK Вы на видосе немного не такой как обычно на остальных видосах. Может жарко.

    • @user-nt9fu9jr5e
      @user-nt9fu9jr5e 11 місяців тому

      Наверное @judgedreed5257 как и я на скорости 0,5 смотрел !)))иначе я просто не успевала! Женя Супер! Спасибо за урок!!! Обожаю!