Тёмный
No video :(

Create After Effects-Like Animations in Figma?! 

DesignCourse
Подписаться 1,1 млн
Просмотров 167 тыс.
50% 1

Опубликовано:

 

27 авг 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 94   
@DesignCourse
@DesignCourse 3 года назад
What do you use to create presentations of UI animations? Is it After Effects, Figmotion, or something else? (or nothing 😁)
@anasniazi
@anasniazi 3 года назад
was using Adobe premiere for the animation part but this looks so much easy to use directly with figma definitely going to use it, thanks for the tip!!
@mr.niceguy242
@mr.niceguy242 3 года назад
Jitter, but the problem is that the Quality of the final export as a GIF, is really bad!
@sunil5656
@sunil5656 2 года назад
*Thanks gary i will learn how to stay updated always from you. Amazing*
@NavesNiche
@NavesNiche 2 года назад
I love you have the humbleness to leave your mistakes in. that's real confidence! Thanks for the awesome videos!
@AmaltheaVimes
@AmaltheaVimes 3 года назад
Thanks! That was a good intro for a beginner like myself, who cannot currently afford courses. (Judging from the quality of the content you share here, I imagine your courses are pretty great!) Apparently your hair is a topic in the comments. I think it looks cool, kinda classic.
@DesignCourse
@DesignCourse 3 года назад
I used to have very short hair since forever, so people comment about it.
@danishkamran9036
@danishkamran9036 2 года назад
dude i ve been learning through your videos and let me tell you're the best of all, bow down to the king, top notch stuff. so thanks a lot . the things that you're doing is awesome keep it up so I can learn more
@Novaprod-jn4kq
@Novaprod-jn4kq 2 года назад
If you kept it going till now you have all the respect that I can give
@vatsalaykhobragade
@vatsalaykhobragade 3 года назад
Make a video on how to animate basic UI elements using after effects. Pls Gary 🙏🏻
@bvs455
@bvs455 2 года назад
Amazing tutorial! Imagine that implemented to Figma and being able to link shapes and having a smart animate feature for those animations through animation layers/compositions!
@tofunwatoyinbo
@tofunwatoyinbo Год назад
Speak English please
@elsapakopoulou2465
@elsapakopoulou2465 2 года назад
that's exactly what I was looking for. Thanks, Gary!
@mikhail2876
@mikhail2876 3 года назад
Adobe XD: Great at prototyping, sucks at everything else Figma: Great at wireframing, sucks at prototyping
@adaskalov
@adaskalov 3 года назад
Figma: doesn't stop working every once in a while like XD
@elivegba8186
@elivegba8186 2 года назад
@@adaskalov it does
@touseefahmed656
@touseefahmed656 Год назад
Good effort and tool for basic animations, styles and effects not working like drop shadows
@4988raja
@4988raja 2 года назад
So glad that you shared! Amazing!
@anigrigoryan1951
@anigrigoryan1951 2 года назад
thank you, finally I got the basics))
@ease1appears
@ease1appears 2 года назад
Might be a dumb question but... When it comes down to showing these animations to devs, how would you usually show them? Would you put an mp4/gif into a FigJam document or just like straight up send them the mp4 file and be like ''i want it this way'' or...? I just dont understand how would you present this in a proffesional manner/environment. Im trying to make a noise dissolve type animation and ive no idea if its even possible to make it Figma, which is not a problem I can make it in After Effects, but how do i present this to the devs is what I cannot grasp lmao
@huntyBot
@huntyBot 2 года назад
please somebody answer this call for help
@graceige6203
@graceige6203 2 года назад
You could share the figma file with the developer
@ease1appears
@ease1appears 2 года назад
@@graceige6203 yes, but like i said you can't do complex animations in figma itself
@views-re2om
@views-re2om 2 года назад
you can share video thats how we all share :) for complex animations please use after effects.
@12XFactor
@12XFactor 2 года назад
Looks like the built animations are not connected to the prototyping feature. Too bad.
@maxmagnus777
@maxmagnus777 Год назад
it's been a year since you've made this tutorial, did motion graphics in Figma became a thing?
@tusarmondal7068
@tusarmondal7068 7 месяцев назад
why this plugin not working in same window right now. when i try to open this plugin it pop a code and a link to another figmotion web page, then how can i animate without seeing my elements!
@Sainzcreativecorner
@Sainzcreativecorner Год назад
Thanks for the super content knowledge which you providing us is very helpful for me.. love content stuff & offcourse your way of describing the things are very easy to understand..
@hautewire
@hautewire Год назад
Super glad to discover this. Flash was my jam. Ae an Animate exist but all in FIGMA would be great. What about real animating? Like along a path? You can already animate like this, without a plug-in. Resizing am moving on a straight line… or am I thinking of XD? Also better practice would be to change the opacity as it moves in, or something. What if your bg isn’t a solid color? Guess this is for beginners. Hope to find more advanced tips for this. Suppose testing it out would be a good thing, too 😂 Thanks Mr Poppins
@sebastiangudino9377
@sebastiangudino9377 Год назад
If you need to animate along a path just use AE my dude. And if you don't really need keyframes then yeah, just use the SmartAnimate prototyping feature already in Figma. Which interpolates between a series of steps to animate an object. Remember, this is a tool. It has some pretty cool uses for some cool animated demos for web. But it's not a replacement for what Figma already has, not big motion design software like AE. This has its use cases, and you should keep those use cases in mind
@hautewire
@hautewire Год назад
@@sebastiangudino9377 totally! As I was fiddling in AE the other night a lightbulb 💡 exploded at it occurred to me, like duh! If I want to design assets in FIGMA that’s one thing, but for motion just export that shit and bring it into AE. Thanks for the reply.
@sebastiangudino9377
@sebastiangudino9377 Год назад
@@hautewire Yeah! Now THAT's the workflow. And dude, if you are not already using it you NEED to look up AEUX. It's a free plugin for both Figma and AE that allows you select a layer or a shape or whatever in figma, and make it appear in after effects LIVE, without having to export of anything, is basically a way to copy a figma group and paste it in AE as a pre-comp, and it is wonderful. Makes the animation process a delight
@sakshamchaturvedi9087
@sakshamchaturvedi9087 3 года назад
Helpful Gary 👌🏻❤️
@pablomonteoliva1793
@pablomonteoliva1793 2 года назад
Thanks for the video! I was wondering if the JSON export is or it can be easily converted into a lottie.
@nkechichizim783
@nkechichizim783 3 года назад
Wow! Thanks, really needed this
@simonlasky1034
@simonlasky1034 Год назад
the figmotion plugin is not working why ? Any help
@mrnickb
@mrnickb 3 года назад
Jitter is great too, and has a free trial.
@aminelouni
@aminelouni 3 года назад
The outro suitable with the haircut
@lakshmichaitanya1316
@lakshmichaitanya1316 3 года назад
we need a vue 3 tutorial
@eodeun
@eodeun 2 года назад
Thanks you. It was useful for me.
@jkl.guitar
@jkl.guitar 2 года назад
Can you go over the path animation option in figmotion, i'm having a hard time understanding how to use it. My goal is to create line animations for charts
@ismyalak1419
@ismyalak1419 2 года назад
Path animations are usually used for an object to follow the path, for example. . . . A car that is animated on the certain type of road.
@dilankamadushan9736
@dilankamadushan9736 2 года назад
Awesome awesome stuff !!
@Umiempi
@Umiempi 2 года назад
Is there a way to make the animation work on the figma preview? Thanks!
@kapeeshgupta9756
@kapeeshgupta9756 3 года назад
I am so used to adobe XD, it’s very difficult to switch
@DesignCourse
@DesignCourse 3 года назад
I do like Adobe XD's prototyping, but my god, I still can't get over the fact that they won't allow us to change the canvas background color!
@nmoschen
@nmoschen 3 года назад
You changed my guy! Oh no wait, just a different hairstyle. Nevermind.
@aaronaaroon108
@aaronaaroon108 3 года назад
Almost didn't recognize you. Lol. Thank you so much for this awesome tutorial. SN: I'd like to team up with some designers, if you're interested, please hit me up! 😁
@mathewakinbanjo2570
@mathewakinbanjo2570 3 года назад
Interested
@christopherbrown2389
@christopherbrown2389 2 года назад
Interested
@gunasekar4554
@gunasekar4554 2 года назад
Awesome tutorial, thanks a lot.
@dimitrisqq
@dimitrisqq 3 года назад
Hey Gary, in the upcoming UI Course which app you will be using?
@ansora9031
@ansora9031 3 года назад
hi which software do you use to record screen? along with webcam?
@SioPao105
@SioPao105 2 года назад
Can you render the gif and add it to your prototype?
@mr.niceguy242
@mr.niceguy242 3 года назад
Thanks Gary 🤪
@carlocarnevali7790
@carlocarnevali7790 2 года назад
Would the animation actually work if I publish the website directly with figma for a quick mock-up?
@thallesdesouza
@thallesdesouza 3 года назад
thank you so much for everything
@Gilloozz
@Gilloozz Год назад
hey i was wondering if you know how to animate logo icon it goes up when i click on it and then sign in bars shows up ? thank you
@josephnetherland880
@josephnetherland880 3 года назад
I like your channel so I've decided to bombard it with comments.
@muhammadadenugraha2299
@muhammadadenugraha2299 3 года назад
As-salāmu‘alaikum, I thank you for the knowledge. May I imitate and modify this method for commercial purposes?? without including your name / youtube name??
@avatr7109
@avatr7109 2 года назад
The thing i don't like about adobe is their SUBSCRIPTION BASED APPS but here in Indian companies Adobe is tool required in skillset
@CRYPTOBIZON
@CRYPTOBIZON 3 года назад
Very cool, thx a lot
@theisoj
@theisoj 3 года назад
Thanks 🙂
@danishkamran9036
@danishkamran9036 2 года назад
thank you sir
@aletarin10
@aletarin10 3 года назад
Came for the hair, stay for the content.
@anothermouth7077
@anothermouth7077 2 года назад
@14:30 yes yes you can take this to show to your developer....and enjoy his face reaction turning into horrors to come into development 🤣😆 jk
@ramannegi3729
@ramannegi3729 Год назад
Hi... bro.. could you help me to add video in figma project
@nancynancy4879
@nancynancy4879 2 года назад
謝謝分享 這個好好用喔!
@gangostudio7282
@gangostudio7282 2 года назад
FRRRR all the layering n buttons i cant keep up
@keyyaaf
@keyyaaf 2 года назад
Tomorrow I have a Physics Exam. Yet I am here learning soft soft. I don't even know what I am.
@omaryassir5885
@omaryassir5885 3 года назад
Awesome stuf
@tofunwatoyinbo
@tofunwatoyinbo Год назад
Awesome, but unfortunately the mistake made it unclear and hard to replicate
@theChefnut
@theChefnut Год назад
Cool video. Your video is insanely washed out though and your keying is really rough. I think you're shooting in RAW or something.
@letsgetto1millwithoutvids
@letsgetto1millwithoutvids Год назад
3:28 thats not even a ui its just a poster
@lorenza2589
@lorenza2589 Год назад
Anyone elses Figmotion have all of the axis flipped....? My X in Figma = my Y in Figmotion. My Width in Figma = My Height in Figmotion wtf.
@sonoftroy8572
@sonoftroy8572 3 года назад
Yo! Where’s the 80’s intro
@DesignCourse
@DesignCourse 3 года назад
Next week will be a new episode
@chill_edits1924
@chill_edits1924 Год назад
Day one of being a rapper
@WebAnimations
@WebAnimations 3 года назад
Hello
@sonic_brx3667
@sonic_brx3667 2 года назад
Sugma
@namenl2205
@namenl2205 2 года назад
doesn't principle do this better
@Jayant0023
@Jayant0023 2 года назад
won'ful!
@fal2981
@fal2981 Год назад
year to see if I could give that type of tNice tutorialng a shot again. Long story short...I have depression and anxiety disorder and it hasn't been
@world_changers
@world_changers 3 года назад
First!
@webdecodedwithfahad4414
@webdecodedwithfahad4414 3 года назад
Which plugin you use for your hairs😂
@sashadalponte
@sashadalponte 3 года назад
Yeap, still doesn't beat AE 😁
@hosseinghahari3557
@hosseinghahari3557 2 года назад
i have such a huge problem with importing my UI from Figma to After effect , I don't how can I do it without problem
@ferkatskyrim
@ferkatskyrim 2 года назад
guys, just learn Ae)
@patlecat
@patlecat 3 года назад
Good tutorial, thanks. But please don't do courses as your 80s character, it's annoying for more than 5 seconds, it's just fun for intros ans such formats.
@harshkirar4264
@harshkirar4264 2 года назад
You are so confused bro
Далее
Website Animations Using ONLY Figma
15:21
Просмотров 279 тыс.
Creating Lottie animations in Figma
6:45
Просмотров 37 тыс.
Only I get to bully my sister 😤
00:27
Просмотров 28 млн
C’est qui le plus fort 😂
00:18
Просмотров 9 млн
Секрет фокусника! #shorts
00:15
Просмотров 32 млн
From Figma to Lottie - UI/UX Animations Made Easy
13:41
How To Animate Like After Effects in Figma
10:27
Просмотров 50 тыс.
How To Create Animation In Figma - Figmotion Tutorial
24:28
STOP doing DROPDOWNS like this - Figma variables 2023
15:35
Creative Figma animations
26:49
Просмотров 17 тыс.
Micro animations in Figma
8:05
Просмотров 141 тыс.
Reacting to 21 Design Portfolios in 22 Minutes
22:41
Просмотров 568 тыс.
Figma to After Effects with AEUX
14:35
Просмотров 51 тыс.
Only I get to bully my sister 😤
00:27
Просмотров 28 млн