Анимация в фигме за 10 минут | Пошаговый урок создания анимации в

Поделиться
HTML-код
  • Опубликовано: 17 сен 2023
  • В этом видео мы создадим эффектную анимацию разреза в Figma используя базовые инструменты.
    Такая анимация может оживить любой ваш проект или стать отличным шотом для Dribbble.
    💫 Сайт Пижамной Академии Веб-дизайна
    web-design.academy/
    Чтобы узнать более детально об обучении в Пижамной Академии напишите нам в Instagram / webdesign.academy или Telegram t.me/pajamaacademy
    Больше про UX дизайн в Инстаграм:
    / webdesign.academy
    подписывайся 💛
    Заглядывай в телеграм комьюнити:
    t.me/pajamaacademy
    Ставь лайк 👍 этому видео и подписывайся на канал, здесь много полезного про UX и Веб дизайн!
    #uiuxdesign #animation #figmaanimation #дизайнвфигме #анимациявеб

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

  • @kseniamomot9810
    @kseniamomot9810 10 месяцев назад +2

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

  • @yurymaslov8647
    @yurymaslov8647 4 месяца назад

    красавчег!

  • @user-ct1jw1ex3u
    @user-ct1jw1ex3u 9 месяцев назад

    Супер

  • @user-tv5tz9fu9u
    @user-tv5tz9fu9u 9 месяцев назад +1

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

    • @design_academy_pj
      @design_academy_pj  9 месяцев назад

      Большое спасибо, возьмём в учёт 🤓✌️

  • @anastasiakonivetc5388
    @anastasiakonivetc5388 8 месяцев назад +1

    Подскажите пожалуйста, почему после того как провела все манипуляции с головой, копирую ее и вставляю во фрейм, и включаю прототип, чуда не происходит ?🫠

    • @design_academy_pj
      @design_academy_pj  8 месяцев назад

      Может вы что-то пропустили? Попробуйте ещё раз 🤓✌️

  • @AskaTyan
    @AskaTyan 10 месяцев назад

    Для чего нужно оборачивать во фрейм? Видела в видеоуроках многие делают автолейаут. 😅

    • @design_academy_pj
      @design_academy_pj  10 месяцев назад +1

      Auto layout также яляется фреймом. Поэтому вы можете использовать и просто фрейм, и фрейм с Auto layout, всё зависит от ваших целей и задумки 🤓

    • @AskaTyan
      @AskaTyan 10 месяцев назад

      @@design_academy_pj спасибо! 😊

  • @AdeldiGGital
    @AdeldiGGital 6 месяцев назад

    Никита, привет. Помоги. Мне нужно сделать анимацию кардиограммы не понимаю как. На чёрном фоне летит капля крови превращается в точку из точки появляеться линия и на линии уже кардиограмма, в готический стиле. Помоги плиз

    • @design_academy_pj
      @design_academy_pj  6 месяцев назад

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

  • @cbicbi5740
    @cbicbi5740 3 месяца назад

    Очень классный урок. Не до конца только понял, как задавать направление движения строк. Можете уточнить? Спасибо заранее!

    • @design_academy_pj
      @design_academy_pj  3 месяца назад +1

      У вас 2 фрейма с одинаковым положением текстовых слоёв (строк) в них. В одном фрейме, например в верхнем, вы проваливаетесь внутрь фрейма чтобы был выбран именно текстовый слой и сдвигаете его внутри фрейма влево. Во второй строке соответсвтенно вправо. И создаёте анимацию между этими 2-мя фреймами. Если вам нужно, чтобы строка в другую сторону бежала, то соответствено сначала сдвигаете строку вправо, а во втором фрейме влево.

    • @cbicbi5740
      @cbicbi5740 3 месяца назад

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

  • @plaksa1111
    @plaksa1111 13 дней назад

    А для чего делать анимацию в фигме? Её потом можно перенести на таплинк или Тильду вообще? Если да, то как..

    • @design_academy_pj
      @design_academy_pj  13 дней назад

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

  • @1marken306
    @1marken306 2 месяца назад

    у меня кнопка change to горит серым, кто-нибудь знает как решить эту проблему?

    • @design_academy_pj
      @design_academy_pj  2 месяца назад

      Возможно у вас уже есть какая-то привязка и поэтому другая недоступна

  • @kiki_van_gog
    @kiki_van_gog 3 месяца назад

    ты как-то очень странно пользуешься пером...

    • @design_academy_pj
      @design_academy_pj  3 месяца назад

      А как вы пользуетесь?

    • @kiki_van_gog
      @kiki_van_gog 3 месяца назад

      @@design_academy_pj я потом догадался, что это элемент дизайна, не сразу понял (: