Animating in Rive for After Effects Users

Keyboard Shortcuts and Workflow Tips: www.jakeinmotion.com/rive-sho...
Beatgrid on Battle Axe Website: battleaxe.co/beatgrid
Intro featuring Joey Judkins' interactive avatar and Gergana Gergova's "Rive Vibe" text animation.
Joey Judkins on Rive: rive.app/@JoeyJudkins/
Gergana Gergova on Rive: rive.app/@gergana/
And check out ‪@JJMotionStudio‬ on KZbin for more Rive tutorials!
Rive has captured my attention and gotten me excited to animate in a way After Effects hasn't in a very long time. In this tutorial, I'm going to get you up to speed with working in Rive, navigating the workspace, designing elements, and putting them in motion with keyframes. As an After Effects user, it's extremely easy to pick up and start making motion design projects right away. Plus it's completely free to try out with a free Rive plan.
I'll walk you through your first Rive animation project, making connections between the After Effects workflow you're used to and how to work similarly in Rive.
I think you're really going to like Rive, especially once we get into some of the unique animation features it has over After Effects. Make sure you're subscribed and stay tuned for more Rive tutorials coming very soon.
Chapters
00:00 Intro
00:49 Artboard Setup
02:21 Building the Grid
04:39 Building the Vertical Line
06:03 How Rive Handles Frame Rates
07:49 Animating the Line
10:20 Reusing Components
11:37 Interpolation & Easing
13:15 Duplicating Components & Timing Offset
15:26 Looping a Work Area
16:06 Animating the Circle Square
20:08 Duplicating and Offsetting the Circle Square
22:51 Thanks For Watching!

[@JonathanWinbush]

Amazing! Rive is going to be a game changer in our industry moving forward Im calling it now 🤙🏿

[@sajjadzeidabadi]

Do you know about animation logo?

[@JonathanWinbush]

@@sajjadzeidabadi I don't

[@BryanSchultzitis]

Rive has been on my "to learn" list for a while now and it's downloaded/in my taskbar. Thank you for this great tutorial! I can't wait to follow along in a bit :)

[@RosemaryHansen-ij3yp]

THANK YOU JAKE! I have been trying to wrap my head around RIVE for a while, this is so helpful. Thank you!

[@reyesdelpech]

Love that we can see all the precomps/artboards at the same time.! Thanks for sharing!

[@sajjadzeidabadi]

Do you know about animation logo?

[@swaymolina-art]

Dude this was amazing. Followed each step. Can't wait for the rest of the tutorials!

[@doozybrat]

Thanks for the amazing tutorial, Jake! I was not sure how to start Rive and you just demolished that reluctance. Thanks!

[@puseletsomaraba1313]

thank you , It is useful and applicable content to the last minute, I highly appreciate the quality and thorough walkthrough presentation

[@CaseyMitsch]

A great breakdown from one of youtube's best motion design teachers! Rive is exciting and this video came at a great time.

[@nemesis5481]

_You are awesome; the best. No one comes close to your skill level in my very humble opinion._

[@BART-designbuero]

Sweet tutorials, as usually. Thanks for this.

[@TheRabidmilkman]

Man, will you ever stop teaching the world amazing stuff?!!?! :D You're the best, thank you!!!

[@SenorAlec]

​​JAKE!!! You are amazing. Can't wait for this. Got the notif set up

[@stonnedpopcorn]

Wohooo! My first Rive animation is readyyyy Great tutorial Jake! :D

[@leomazzei2176]

I've been using Rive for a while now and the possibilities are endless

[@NikDudukovic]

Really great stuff Jake! Would love to see more rive tutorials about interactive animations for web :)

[@axlcinema]

Thanks for the tutorial Jake

[@KalaMedia]

Nice one Jake, I recently started looking into this app so I'm looking forward to the video!

[@SirCaptainSteve]

Rive is amazing! Thanks for the video, Jake.

[@leftclot]

Was so tempted to buy a course to learn Rive, but now Mr Jake himself has dropped a tutorial. My bank says thanks.

[@oakhousemedia]

Love seeing this, thanks Jake!

[@hyrumtibbitts1660]

Jake you are the MAN! Thanks a ton

[@jz1244]

awesome stuff!! more rive tutorials!!!

[@PianoFAB95]

Hello Jake, thx for sharing ! I'm actually learning Rive from Motion Design School but your your approach is complementary. Can't wait for more… bell activated 😁🤙 yewwww !

[@SouthernShotty]

I chatted with the rive people, it's a super cool tool

[@zohaibmalik819]

Nice tutorial! Waiting for more Rive tutorials.

[@denomdemon]

Masterful instructor.

[@crazyfan12]

Man you’re the real one freestyler! 🎉

[@robertsweeney9808]

Thanks Jake!

[@rebekahnappa8302]

School of Motion Newsletter brought me here. Excited to see a Rive tutorial as I've heard a lot about it.

[@sajjadzeidabadi]

Do you know about animation logo?

[@konrTF]

Rive is really dope!

[@noodlecreative]

Pretty snazzy 😎

[@JJMotionStudio]

Thanks for the feature! What a great video Jake, bravo 🎉

[@bryangrunauer]

This is brilliant! Nice to see Rive training, here and it seems on the Rive app itself. I was checking it out but there were "only" community projects available, no proper training. Seems that even that is changing on the app, don't know if that's recent or not. Thanks anyway! Gotta learn a new tool :)

[@Oddernod]

Digging this, love that the State Machine in Animate Mode is a lot like how frame 0 is the place to design everything in Moho.

[@ELBOD2i]

Nice

[@DooDleZTv1]

Looking for more tutorials like character animation and stuff! looks good but can't understand what's the difference between rive and ae except that ae have more possibilities rn

[@chrismarano2135]

Animating in Rive is pretty intuitive. The state machine takes some getting used to. At least it does with my simple brain.

[@JakeInMotion]

Yep, it takes some time but is crazy powerful.

[@TeoLSC]

Lo logré, gracias

[@HanSong_or]

I'm an AE user from China. Thank you very much for your tutorial. I started to see your ultimate guide to AE text animation from today. It's really systematic. I got a lot of help. Thank you very much! ! ! Thank you for your systematic explanation. I decided to watch and study every video of your. You are my AE expert. I'm so excited, thanks again! !❤❤ (◦˙▽˙◦)

[@liteningstrike12]

Seems interesting! The workflow looks a bit difficult to wrap my head around, especially the number of steps it takes to duplicate and offset an element. I'd love a video on things Rive does easily that would be too complex, tedious, or impossible for after effects! Also seems like Rive, as opposed to After Effects, is designed for mostly interactive web animations a la the old Adobe Flash

[@leifnicole]

Please create a tutorial for 'animate on scroll' - thank you

[@KamleshBhopali-of9wi]

Looks promising! Its just monthly subscription thats bothering me!

[@TMC3000]

This is a very good alternative to after effects but it will be cool if they can port it as a native app on the iPad and makes it a one time payment…..I hate subscription model, that’s just me! Nice video though, kudos !

[@andrearusky]

It's not just you, trust me 😅 I hate subscriptions too and it's $24 per month. After Effects is $22.99 per month

[@fusios]

yes

[@user-uc5gy8nk4u]

waiting

[@TheLillianYoung]

So everything that we have licenses for is free now. The market's about to be oversaturated.

[@lubronnie0022]

When is it coming out

[@JoelHenleyMusic]

Very cool! Fingers crossed an Overlord-style tool between AE and Rive!

[@JakeInMotion]

Only time will tell 👀

[@UserTenNumbers]

Amazing pacing and presentation. I would love to know what the handoff to a web developer for integration looks like.

[@JakeInMotion]

It's surprisingly simple. I was able to get it working on my website today.

[@user-bi5bm5jq8p]

Will there be a recording?)

[@RajatBire.]

Just 3 files is a huge no for me when learning Rive, it's a hindrance to experiment with the software. Maybe 10 would've been fine? Or even more, because not everyone is learning it to use professionally, some just wanna learn it for what it is and play around with, lesser files really limits that. I wish they'd change that.

[@andrearusky]

How do you import illustrator files, videos, textures? Can you do compositing with Rive, it's gonna be very slow to load images/video since it's all online instead of local hard disk

[@JakeInMotion]

You can import SVG files and raster images. Rive is not a compositor.

[@wangelite5279]

Can you just paste the vector path from anywhere into Rive? And sort of like after effects, paste 2 different vector shapes in the timeline and have them morph?

[@MrDebranjandutta]

Kind of reminds me of Cavalry, which was promised to be a great Ae alternative, but sadly never took off.

[@JakeInMotion]

I think the reason there's so much buzz about Rive compared to Cavalry is due to the number of features Rive has that don't exist in AE at all. Cavalry can do a lot of things AE already does, just much more efficiently.

[@MarkoTakovac-MadBear]

Is it green or yellow? :D

[@chloelewis5603]

It's like bot village up in here...

[@BuzStringer]

Am I colorblind? That looks yellow, not green :(

[@yannc1975]

Is it like google web designer ?

[@NyoraiFidesTV]

is this going to be a tutorial series?

[@JakeInMotion]

Yes!

[@NyoraiFidesTV]

@@JakeInMotion Amazing Jake!!! I think this will definitely be the way to get me started with this tool🔥 Rive chose wisely😜

[@jordan2d]

I'm ready!

[@winstonsgmx]

RIVE is too expensive to buy Pro for individual, mostly on the export side. But still a great skill that cant be ignored. I still have to do my project in Ae and use Body moving to export to animated SVG

[@moneyshift8190]

Great tutorial but how is this easier than AE? It's the same but less features.

[@JakeInMotion]

This tutorial was the first in a series, and meant to introduce you to Rive and teach you how to do something you would normally do in After Effects. Besides the instant playback, Rive has a lot of unique features for animation and interactivity that I'll be showing off in the following tutorials.

[@naveenmallikarjuna8509]

How does it handle footage?

[@JakeInMotion]

At the moment, it doesn't. It's designed for interactivity, not exporting videos, but it's also being developed right now so there's still a possibility of video support.

[@handymads]

At 14:47 - Rive isn't allowing me to set the value to 100% on the new keyframe, it just jumps back down to 0% 🤔 Everything seems to be exactly the same, down to the last pixel. Any idea what the heck I'm doing wrong?

[@berendvaneerde]

Exact same problem here... did you manage to sort it out?

[@handymads]

@@berendvaneerde Funny enough, yes, I simply quit the project and came back a day later and it worked. 🙈

[@berendvaneerde]

@@handymads haha wow! Guess a good old restart the machine still works for modern apps ;-) Thanks for the tip! Got it working again too 🙂

[@buddyfx7026]

I'm so tired of subscriptions.. looks awesome though!

[@IFMstudio]

Yeah, looks like Rive is taking over by a small steps. But it's too expensive in my opinion (((

[@EduardNovohatsky]

very confusing logic compared to AE, but it definitely worth to train new muscle memory

[@sajjadzeidabadi]

Do you know about animation logo?

[@e11world]

I really wanted to like RIVE and thought of it as the rebirth of Flash but this whole going back and forth to the animation timeline vs state and also keyframes from the properties panel seems not very intuitive. I really like how fluid everything seems but this still doesn't feel like the answer.

[@SpaceGhostNZ]

Yeah it seems a bit clunky at the moment, like its cool that you can recreate the animation but it would be a LOT easier/quicker in AE. I'm sure fro a different project Rive would be superior but this example didn't show it off that well.

[@e11world]

@@SpaceGhostNZ I agree. If only some of these tools asked users like Jake for input early on, I think they would have much quicker adoption and success

[@somehannahperson]

Another monthly subscription? No thanks!

[@JakeInMotion]

Fair enough!

[@andrearusky]

yeah, and web based only :(

[@Xandercorp]

Is "relative" a new word for 'old-ish'? :D

[@rei18nov]

😂 they think we are made out of money 💸

[@sajjadzeidabadi]

Do you know about animation logo?

[@mclandeg1]

Man I know you got paid for that and it’s fine, but I bet you definitely agree it’s nothing like after effects 😢

[@JakeInMotion]

I hope my track record would convince you that I would never take a sponsorship and willingly endorse a product, app or tool that I didn't truly believe in. I'm thrilled Rive has sponsored my channel because it allows me to invest more time into freely-available training. But to answer your question, yes, Rive is nothing like After Effects; but in the best way possible. There are plenty of parallels, which is what I tried to communicate in this video, but Rive isn't attempting to replace AE by any means. I mean, it doesn't even have effects at this point. But it does approach animation in a totally different way than AE, and has some incredibly useful animation capabilities. And with the interactive component, motion designers will be able to market themselves to an even wider audience. Rive has gotten me excited about motion design in a way I haven't felt in years. You should really give it a try.

[@rano12321]

Subscribtion and web based lmao what were they smoking

[@frooqy]

Another subscription? No.

[@MrPondo17]

And remember kids, pirating Adobe products is a good thing (not sarcasm)

[@kshkalla]

Looks kind of google web designer