Сложная анимация в фигме за 15 минут. Веб-дизайн.
HTML-код
- Опубликовано: 10 авг 2023
- Как сделать анимацию в фигме всего за 15 минут?
В этом видео отрисуем пошагово несколько экранов и настроим сложную анимацию
► Мои соц. сети:
Телеграм канал для скачивания ресурсов: t.me/kutuzova_webdesign
Instagram: / kutuzova_alesya
Pinterest: / kutuzova_alesya
#вебдизайн #webdesign #uxuiдизайн #фигма #анимация
Очень нужная и полезная информация. Спасибо
Я рада, что нравится ❤
Очень интересный вариант анимации, над попробовать :D Спасибо за видео-урок ❤
Обязательно попробуй☺️✨🥰
Подписалась. Очень приятно видеть человека ,котрый спокойно, планомерно и по существу доносит информацию! Спасибо.Хочу научиться работать в Figme ,с вашей помощью это вполне реально.
Спасибо 🙏🏻
Спасибо за урок ❤️🔥
Сразу пошла повторять
Жду следующие уроки 🥰
Ты умничка ❤
Давай ❤ обязательно будут новые 🚀🥰
Вау, все выглядит просто супер! Не думал что за такое время можно получить что то подобное. Спасибо!
Я рада, что откликается ❤🙌
Ааааа суууупер, так просто на первый взгляд, чувствуется ваш опыт. Подробно и интересно объясняете! С нетерпением жду новых разборов, спасибо)))❤
Спасибо большое ☺️ я очень рада, что откликается ❤
Очень классная анимация! Спасибо, Алеся, за такой крутой урок! ❤
Настя, спасибо большое 🥰🥰
Спасибо ❤ рада, что нравится🌸
Спасибо Алеся!!! Ты как всегда умничка❤❤❤
Пользуйся ❤
Алеся, спасибо большое! Без воды, быстро, понятно) бегу смотреть другие твои видео 🤩
Благодарю за лайфхаки. Я подписываюсь и учусь вместе с вами. Я рада, что нашла вас.
Отличный урок! Все чётко, понятно. Спасибо.
Спасибо 🙏🏻
Алеся, вы прекрасны! Повторила ваш урок с удовольствием!
Алеся, урок супер!!! Очень все понятно и интересно! RESPECT за контент!❤🔥
Я только учусь на курсах, твое видео очень помогло, спасибо!!! Пошагово, доходчиво, круто
Одно удовольствие вас слушать, огромное спасибо за урок!
Вам спасибо 🙏🏻
Классная анимация! Молодчинка, Алеся....Подписалась, чтобы наблюдать за Вашими работами. Мне эта тема очень интересна.
Так, ну однозначно полезный материал! Сделан хорошо, музыка фоновая задаёт ритм и настрой, сама работа выглядит очень профессионально. Отдельная приятность в виде плагина Unsplash. До этого только сайт юзал. Ещё, Алеся, ты приятная и красивая девушка, отчего смотреть хочется вдвойне. Единственное побольше бы деталей для новичков. Я только начинаю работать с Фигмой и за тобой не поспеваю в плане деталей. Так-то на паузу поставил, да, посмотрел, но вот некоторые вещи и текст у тебя готовые и как они создались, это подумать надо. Хотя наверное неплохо это) Подумать то есть) Как бы то ни было я очень благодарен за такой материал!) И приятно, что такая девушка милейшая нам его создаёт и делится им.
Поняла, буду обращать внимание на мелочи . Спасибо 🙏🏻 скоро будут новые видео
Спасибо большое за видео! Сделала свою первую анимацию в фигме❤️
Классное видео❤ спасибо за информацию
Пользуйся ❤😊
Ваши работы потрясающие! Спасибо, что делитесь таким полезным контентом
Спасибо ❤️
Спасибо большое за видео урок по анимации, он был очень полезен для меня) 😀
Спасибо Алеся за полезную информацию.Всё подробно объяснили.
Пожалуйста ❤️🙏🏻
Потрясающий ролик! Было не только интересно и полезно, но и приятно смотреть на такую красоту 😍
Спасибо, я рада, что откликается ❤
Как хорошо, что ты есть в ютюб)
Спасибо Вам больше, у меня все получилось. Желаю Вам творческих успехов
спасибо большое! очень помогли, подписываюсь и дальше смотрю ваши полезные ролики!:)
Вы крутая ! Очень интересно
Отлично вышло очень красиво🎉❤❤
Огромное спасибо! очень полезно
То что нужно) Ещё бы не помешали таймкоды, для тех кому интересна только сама анимация, чтобы не искать на какой секунде она начинается
Замечательно, великолепно. Хотелось бы подобный ролик посмотреть с русскими шрифтами)
Большое спасибо за такое видео! ❤
Я рада, что откликается 🥰🙏🏻❤️
Спасибо большое! Очень классно и интересно! ❤❤❤❤❤
Очень рада что нашла Вас в Ютубе!❤❤❤❤
Спасибо 🙏🏻, вы очень вдохновляете ❤️
ОСОБЕННО это ШУУУХ))
Алеся, спасибо вам за видео!) вдохновили))
Рада, что нравится ❤
Наконецто одыкватное видио про анимацию, Алеся раскажи про инструменты Фигмы😊
Хорошо, запишу )
очень круто, спасибо)
You explained it well, Thank you a lot.
круто спасибо)
Супер 👏 Спасибо большое!!
❤️
Благодарю автора. Интересно 👍
Спасибо 🙏🏻
спасибо, красивый дизайн
Спасибо 🙏🏻
Спасибо за урок! реально классно!
Спасибо 🙏🏻
спасибо вам за видео!🌷👍👍
Рада, что нравится ❤️ завтра будет новое
Очень круто. Подписываюсь)
Спасибо ❤️
круто!!! А не могли бы Вы сделать ролик, как эту всю красоту на Figma перенести? Было бы очень интересно 🤩
Жду новые видео с нетерпением!
Скоро будет ✨🙌
Класс!!!
Спасибо ❤
круто, у меня сработало с первого раза․Спасибо
Очень рада ❤️
Спасибо, очень круто, но оставлю это видео на потом). Для первого урока анимации в фигме очень сложно, по ходу ролика непонятно было - для чего то или иное действие. Подскажите, пожалуйста, потом это все можно сохранить в формат видео?
Спасибо.
спасибо
Пожалуйста 🙏🏻 ❤
Я новичок, но так все интересно! Хотелось бы увидеть какие плагины у Вас установлены, а главное как их установить!🙏
супер👍
Спасибо 🥹
Очень классно! Так здорово все описала, и очень понятно. Алеся, подскажи, анимация в Фигме больше для презентации? Все тоже самое отдельно создаем и переводим в Тильде, я правильно поняла?
Для презентации и для верстальщика , чтобы он видел, как работают блоки . На тильде не всю анимации можно реализовать , но в целом принцип такой да , добавляешь все элементы и настраиваешь каждый элемент
❤❤❤❤
👍👍👍
Спасибо ☺️
Фронтендер оценит😂
Ничего сложно здесь нет)
Подскажите пожалуйста , вы говорите в телеграм канале есть материалы ( бутылка итд ) но их нет ((( я уже все просмотрела , все файлы , ссылки , не вижу
Очень полезная информаци!Сам дизайн просто волшебный!А как сохранит данную анимацию файлом на компьютер ?
Спасибо! Есть плагин export to gif или просто сделать запись экрана
Скажите пожалуйста а как сделать такую же анимацию при скролле а не при нажатии мышки?
можете сделать видео с переносом дизайна из фигмы на тильду
Здравствуйте, а как выгрузить результат в видео или гиф?
Почему когда я начинаю делить экран для анимации, то все мои нижние блоки подтягиваются на первый блок?
у меня получилось , только времени ушло пару часов
Получается на глаз ориентируетесь по экранам?
А у меня не переворачивается бутылочка в воздухе( . Точнее она выпрямляется, но только как будто одна из другой дублируется. Где-то косякнула
Алеся, привет! Спасибо вам за урок! Скажите, пожалуйста, почему после завершения анимации меня перекидывает на первый экран вместо того, чтобы оставаться там, где я кликаю? Я делала по вашему видео клик для горизонтального скролла, но меня перекидывает на первый экран зачем-то
Связь не стоит ?
Скажите пожалуйста как сохранять это ? Так де как фрейм?
Шууух))
Добрый день. Подскажите, как скачать теперь видео?
Какая Алеся 😍
Какая ? 😅
Здравствуйте! Можете, пожалуйста, сделать подробный туториал по анимации для презентации портфолио? Видела у Вас в пинтерест (там еще картины эпохи Возрождения), но не смогла повторить: анимация какая-то рваная получается. Буду очень благодарна
Привет) ты имеешь ввиду анимацию скролла страницы ?
@@kutuzova_alesya да такую же анимацию хотим увидеть)) при скролле вниз) если вам не сложно 🤗
а в гиф это можно экспортировать ?
Здравствуйте очень круто получилось а можно сделать такое видео сделать и загрузить в инстаграм?
Привет❤️ да, делай)
Прекрасная и полезная информация. Что делать если текст в фигме не виден???
Мб текст не принадлежит фрейму? Проверьте панель слоев
Хотим больше обучающих роликов
Работа по 16 часов без выходных пока не дает возможности 🥲 скоро будет )
Хороший урок, но к сожалению это не за 15 минут, вы заготовили тексты заранее, не совсем онлайн формат получился и данные как в таблице с процентом алкоголя не каждый новичок сможет сделать. Но занятие хорошее и полезное, благодарю за ваш труд.
Набирать текст в реальном времени смысла нет) с этим каждый справится самостоятельно. В процентах тоже только текст , графики никакой нет
Недавно видел сайты крупных застройщиков Москвы и Питера, там всё красиво с крутейшей анимацией, видно что дизайнеры постарались, но как это реализовано, просто капец! Походу всë это залили на обычный хостинг, всë тормозит, секунд по 10 прогружается, короче пользователь не будет на таком задерживаться, фишка в быстрой загрузке в 1-2 секунды, пусть он будет статичным но это не приведет к тому что человек нажмëт на крестик во вкладке и уйдет так и не дождавшись полной загрузки главной страницы.
Походу когда заказчики просят дизайнеров налепить по максимуму скриптов и графических элементов сами не понимают что творят😂
Все зависит от того, как реализовано . Посмотрите сайты awwards, там везде анимация, но все отлично работает и быстро , код должен быть чистый
@@kutuzova_alesya согласна на все 100% сейчас сайты без анимации кажутся устаревшими и неживыми какими-то)
сложная пздц никогда таких сложных не видела
16:45 результат конечный
Я не понимаю откуда взять текст для этого проекта?
Жаль бутылка не прозрачная
Здравствуйте! А как попасть к вам на обучение?
Привет) 30 октября будет третий поток, полностью обновлённая программа, открытие продаж 11 сентября) следи за анонсом в нельзяграме @kutuzova_alesya ❤
@@kutuzova_alesya Спасибо за ответ)) ушла в нельзяграм)
Алеся, напишите пожалуйста как это сохранит в формате видео. Все скачанные мной плагины некорректно работают.
Только запись экрана, плагины сейчас только платные )
До второго блока, пока Вы последовательно всё объясняли, у меня ВСЁ получалось.. НО, после Вашей рекламы, во втором блоке ничего не получается у меня... Вы перепрыгнули и так ВСЁ быстро говорите, что не получается у меня повторить этот avto layout и ничего не могу понять ПОЧЕМУ? Простите, если звучит как претензия к Вам...🤷♂
Поставь скорость 0,5)
@@kutuzova_alesya да, ставила.. здесь не в скорости видео всё дело)
Потом это же сверстать нужно )
Если заказчик готов платить , то почему бы и нет 😊
Все зависит от бюджета )
@@kutuzova_alesya Какой бы ни был бюджет размер макета нужно выбирать правильный? 1920*1080, вы серьёзно, в браузере полоса прокрутки "кушает" часть пространства, поле ввода и поле вкладок ещё "съедает" высоту. Меню "Пуск" "съедает" высоту и на выходе мы получаем далеко не 1920*1080. У меня тоже были такие ошибки на старте, только я никому вредные обучалки не записывал. Алеся, сначала научитесь, поработайте с верстальщиком, а когда у вас наберётся хотя бы штук 20 правильно собранных сайтов, тогда и торопитесь кого-нибудь научить. Можно легко сделать резиновый сайт, который будет на всех устройствах смотреться корректно, просто нужно знать основы, да даже знание autolayout вам банально в этом поможет!
Как это потом залить на сайт. В тильде, например?
На вордпресс сверстать
ребят, подскажите пожалуйста, я не знаю как выделять элементы поочередно, у меня если выделяютcя, то сразу все элементы, подскажите как сделать так, чтобы они выделялись поочередно, как на видео
Зажимаешь shift и выбираешь те, которые тебе необходимы)
Норм, молодец. Только с сетками бяда. Зачем их было создавать, если их не придерживаться?
а как вернуться назад на один шаг
в действии?
Ctrl+z
Интересно зачем создавать лишний клик на бургер, если там дофига места, тут дизайн ради дизайна получился
А так в целом видео очень хорошее и анимация крутая
"вьюф ол"
Блэт
Алеся, здравствуйте, в телеграмме именно этот файл недоступен
Привет) нужно разархивировать
объяснит мне кто нибудь, что эта программа делает и зачем?
Фигма, рисуем дизайн сайтов
В основном размечать макет сайта, блоки, картинки, шрифт, кнопки. Всё
Что если там нету анимации😢
можно ссылка на проект?
В телеграм-канале все материалы )
нет функции clip content
Значит не сделала фрейм)
Смотреть нужно на минус два)))