Веб дизайн урок по анимации || 3d слайдер в Figma

  Переглядів 11,980

THE LIKE Design School

THE LIKE Design School

Рік тому

Веб дизайн урок по анимации || 3d слайдер в Figma
Добро пожаловать на мой урок по созданию анимации 3d слайдера в Figma без использования дополнительных плагинов! В этом уроке вы узнаете, как использовать встроенные возможности Figma для создания потрясающей анимации трехмерного слайдера.
Мы начнем с основных принципов анимации и рассмотрим, как создать трехмерный эффект, который захватит внимание зрителей.
Вы узнаете, как использовать временные функции и кривые анимации для создания плавных переходов и динамичных эффектов.
Основываясь на этих знаниях, вы сможете создать собственный трехмерный слайдер, который будет выглядеть профессионально и захватывающе.
Не требуется никакого предварительного опыта в анимации или использовании Фигмы. Этот урок подойдет как начинающим, так и опытным дизайнерам, желающим расширить свои навыки и создать захватывающую анимацию трехмерного слайдера. Присоединяйтесь к нам и дайте своим проектам новое измерение с помощью Фигмы!

КОМЕНТАРІ: 25
@Nelya_web
@Nelya_web Рік тому
Спасибо, очень интересно.
@thelikedesign
@thelikedesign 10 місяців тому
Благодарю!
@Nelya_web
@Nelya_web Рік тому
Попробовала, всё получилось
@thelikedesign
@thelikedesign Рік тому
Отлично!
@goose_home
@goose_home 2 місяці тому
Спасибо за урок! Подскажите, пожалуйста, анимацию, созданную из прототипов можно сохранить как видеоролик?
@thelikedesign
@thelikedesign 2 місяці тому
В фигме нет такой функции, но есть плагин Export to GIF/Video. Попробуйте 👍
@veneravap3401
@veneravap3401 4 місяці тому
Каким образом вы подогнали картинку стикера? Вы показываете , как накладываете на него прямоугольник, закругляете углы, а дальше у вас уже готовый обрезанный стикер. Только непонятно как это получилось, момент на 2 минуте Спасибо.
@thelikedesign
@thelikedesign 4 місяці тому
Видимо обрезала этот момент на монтаже. Вы накладываете эллипс на наклейку, затем помещаете наклейку выше эллипса на один слой, выбираете оба слоя и нажимаете кнопку Intersect selection. Она находится сверху по центру черной панели инструментов и активизируется, когда выбраны два слоя.
@user-rk5wt1pf5c
@user-rk5wt1pf5c 25 днів тому
как задать привязку к полю для фрейма с фруктами?
@madmouzel
@madmouzel Рік тому
спасибо! эту анимацию потом как-то выгружать для разработчика или программист сможет использует код?
@thelikedesign
@thelikedesign Рік тому
Честно говоря, думаю, что нельзя это сделать. Возможно есть плагины для этих целей. Надо изучить вопрос 🤔
@user-ye3yi5pe8d
@user-ye3yi5pe8d 6 місяців тому
А нельзя воспользоваться vimeo,чтобы загрузить видео?
@Vit_Army
@Vit_Army Місяць тому
Сделать в фигме анимацию не проблема..как ее вытащить потом...бессмыслица какая то
@nikolay9386
@nikolay9386 2 місяці тому
Важен ли формат картинки .png? Или с jpeg?
@thelikedesign
@thelikedesign 2 місяці тому
Картинка должна быть на прозрачном фоне, потому лучше пнг или удалите фон с помощью плагина bg remove.
@nikolay9386
@nikolay9386 2 місяці тому
@@thelikedesign благодарю! Но как то не получается наложить картинку на банку )) этот intersect selection не вижу )
@nikolay9386
@nikolay9386 2 місяці тому
@@thelikedesign эта баночка сведет меня с ума )))
@thelikedesign
@thelikedesign 2 місяці тому
@@nikolay9386 😅
@lil4361
@lil4361 11 місяців тому
Попробовала сделать баночку, получилось! Спасибо большое)
@thelikedesign
@thelikedesign 11 місяців тому
Супер!
@user-po6xs4tb3m
@user-po6xs4tb3m 3 місяці тому
Классно!!! Но у меня ничего не получилось(😢 Не смогла вырезать и не нашла таких наклеек в строчку... Расстроилась(
@ArthurKa-yd5un
@ArthurKa-yd5un 2 місяці тому
😢
@user-vv1wz4uo9z
@user-vv1wz4uo9z 26 днів тому
@@ArthurKa-yd5un здравствуйте, где найти такие наклейки?
@ArthurKa-yd5un
@ArthurKa-yd5un 26 днів тому
@@user-vv1wz4uo9z, здравствуйте. Я не знаю 😢 Спасибо за обращение, до свидания.
Дизайн сайта в Figma || Speed Art
27:18
THE LIKE Design School
Переглядів 411
Анимация в фигме за 10 минут | Пошаговый урок создания анимации в #figma
14:28
Пижамная академия веб дизайна
Переглядів 9 тис.
Їжа Закарпаття. Великий Гід.
1:00:29
Мiша Кацурiн
Переглядів 681 тис.
Kitten has a slime in her diaper?! 🙀 #cat #kitten #cute
00:28
Level 1 to 100 Mystery Buttons
00:46
A4
Переглядів 8 млн
Figma Tutorial: 3D Carousel Slider (+ free files 🎁)
18:18
UI Adrian
Переглядів 472 тис.
Профессия UI/UX-дизайнер - путь в нищету?
29:57
Юзкейс | Use Case
Переглядів 62 тис.
42 приема Midjourney V6 | Большой гайд 2024
16:46
ITSCOOL | Школа новых пайплайнов в CG
Переглядів 3,7 тис.
WebGL: как сделать сайт с интерактивной 3D-графикой
39:08
Digital-агентство Мэйк
Переглядів 14 тис.
3D Carousel in Figma Using Smart Animate | Prototyping Tutorial
7:59
Теория и практика анимации Сайтов
16:10
Max Shirko / Design Inspiration
Переглядів 30 тис.
Їжа Закарпаття. Великий Гід.
1:00:29
Мiша Кацурiн
Переглядів 681 тис.