Create the Most AMAZING Animations with Rive - Crash Course
Вставка
- Опубліковано 10 лип 2024
- rive.app - Join Rive Today for FREE. Create & ship interactive animations to any platform.
I have to say, I'm thoroughly impressed with Rive. You're able to create designs within Rive, "rig them up" with bones, and create logic-based animation sequences for any platform. I've never seen a more robust animation platform in my life!
In this video, I'm going to outline the basics of Rive, and we'll create a rocket ship animation from scratch.
You can check it out here:
rive.app/community/1244-2396-...
(Click the "Trigger 2" button on the right multiple times to see the different state animations)
Check out other awesome Rive projects that the community has created:
rive.app/community/
0:00 - Introduction
1:57 - Interface Overview
3:19 - Design Basics
8:32 - Design Timelapse
8:48 - Finishing the Design
11:49 - Creating the Animations
25:30 - The State Machine
30:21 - Project Export Options
31:10 - A Challenge
31:45 - Outro
Let's get started!
#rive #animations #anyplatform
- - - - - - - - - - - - - - - - - - - - - -
Subscribe for NEW VIDEOS!
Learn UI/UX: designcourse.com
My personal FB account: logodesigner
Coursetro FB: coursetro
Coursetro's Twitter: / designcoursecom
Join my Discord! / discord
^-Chat with me and others
- - - - - - - - - - - - - - - - - - - - - -
Who is Gary Simon? Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network.
Now, I focus all of my time and energy on this channel and my website Designcourse.com.
Come to my discord server or add me on social media and say Hi! - Навчання та стиль
Do you want to see more Rive tutorials?
Yes
Absolutely
sure sure
yes
yyyyyyyyyyyyyyes
I will surely use this stuff soon! Again thank you for another great tutorial
this is one of the cooler channels i've found, thanks
This is cool. Always loved Rive
Thanks Gary! Going to watch the code implementation now
Awesome thanks for this tutorial 🙏
Awesome tool thanks for sharing 😀
We all really appreciate your videos! Thank you!
I'm glad this exists, I look forward to the return of Homestar Runner!
Awesome shirt Gary!
Thank you for this amazing video
It's supercool, next level animation,................. love it.
Thanks, Gary, love the elevator music!
Great tutorial
25:24 just had a thought, you could set a parent shape to be a circle or something so you could animate the ship but rotate the parent to get the smooth angled animation on the ship.
Quite rad animations....love it.
Some of the projects people've created in the community are awesome.
This tool is freeeekin siiiiccckkkk! Go create!
The hair! The shirt! Oh man, you're rocking it!
Youre the goat thank you for this
Thank you so much for sharing this tool! Wow, it looks amazing!
I wonder if there's any retrowave stuff I can use with your 80's theme design. Might be fun to make a full on retrowave app.
Wow the thumbnail is great :)
Thanks!
A moment to appreciate the slick hair from our favorite design/coding host!
For today and today only, he is Duff McKagan 🎸🔥
Really need those animations for web designs
@rive im actually glad u sponsored someone bc i feel like the are no tutorials for this and im a programmer... idk how to stuff like this
Thanks 👍
The TVs in the background in your studio look like my grandma and grandpa used to have in late 80s when I walked under the table
Awesome video as always. I had a question about the design course, is it free?
sooooo coooll....!!!!😘😘😘
Rive seems kinda like a modern-day version of Flash.
We have come full circle
Wait so you have the animation made. What is the output? Do you just embed it?
@@whatthefunction9140 I would think so
Flash is still on as Adobe Animate
Went to say the same, looks like the new Flash
i know this Rive since they had a name Flare for Flutter before then.
Grate video sir..
Please, can you create a full animation course video with a professional tool
Is the windows app better or designing in browser?
Plus can I import AE animations into the state machine?
can you implement this in a vue project?
7:13 For mac users, duplicate is Command-D.
ОТЛИЧНО!
I found the Rive very before but that we can not use for web
BUT now we can use on web also -> from today every project of mine will have rive animation init
I kinda found AFTER EFFECTS alternative 🎉🎉 😂😂 🎉🎉 🔥🔥
2 different purposes really. After Effects is great for video (though, the lottie plugin allows you to do similar stuff here).
@@DesignCourse true 😀
I love your hair. You look like a Greek god.
Cool, but can't export as lottie or convert so unsless with Webflow :( Do you know if there will be an option to get it convert to lottie anytime in the future? I would really love to design animation in it, since it's an easier interface than AE!
You can export your animations for use on web already with their run times. I will do a tutorial on it in the near future.
You can copy the code of the animation and put it in an embed in webflow.
I was waiting;
What us up every body gery simon here
it looks like a fish!😃
New to your channel.I just signed up for rive free account.Not sure how to use the program
If I send a .riv file to a developer, can they figure out on their own the Inputs/Listeners/StateMachines in the code?
👍👍👍
how do i fix last flame setting plz tell me ??
23:18 was just wondering if the flame should have been a child in the rocket 🚀
So what was the most amazing animation in this one regarding your title?
The Ae killer
What’s the device on top of the Marshall speaker?😍
A Kemper Profiler. Absolutely love it.
Too many cool tools I can't learn them all. My brain is full 😫 🧠
👍👍👍👍
The State machine system Is basically the same as in Unreal Engine
is the free version of rive enough ??
Did you have a serious fight with the barber? 🤣🤣🤣🤣🤣🤣🤣🤣
I didn't have a fight with a barber. I didn't even have a conversation with a barber, or walk into a barber shop at all. ;)
spaceX dropped their license after watching it.
nice animation btw 😀
the webcam head thing is annoying and covering the bottom part of the UI when you are in the animation module
It is pity rive isn’t adaptive for ipad. Zoom and some other actions dont work correctly
Thank you sir! QQ why should I switch from Adobe Animate to Rive ? Animate is way more robust?
nice hairstyle
What's the point of the interactivity? Is it something that can be integrated in apps like Animate does with html5?
Would be cool if you could expand more on the implementation side
well he got sloppy since the channel came crashing down on views
thanks, I am off to create some rule 34 animations now :-D
More web development please
I need a gif export support.
put a shape background on your video. I don't feel comfortable looking at a floating head. Anyhow,good stuff
better than framer and protopie???
Somebody please bring back homestar runner with this now that flash is dead!
Is size large?
For production
ahah nice shirt
Good tutorial. But please just move your head out of the way or do a voice only when animating 😂 can't see the important panels when you click
I used rive 1year ago.. now many improvements are there🤩 but, they are not offering mp4 or gif file format to download it's only for coders!!!
We have mp4 and png sequence exporting!
Go look at the current GIT documentation -- it's very easy to figure out.
Is it svg ?
Looks like the HTML5 version of Flash.
Tumult Hype will suffer from that app...
Are you the thumbs up kid?
👎 no??
Swear to me, do you Marvel in your skills?
First op
Faster than designCourse 🤣🤣
I constantly forget that Gary is hot.
Not very useful if you can't export it into a format for display on the web.
help.rive.app/editor/exporting
Lol, everybody wanted flash gone, now we have a new flash but its called rive. How long until websites will become a hellhole filled with animations everybody wants to skip.. because marketing ppl will be marketing ppl and spam you into oblivion…
Uhm because Flash created security issues? It had NOTHING to do with animations. 😂
Also, animations can be used to increase the average ux in various ways. Animations can have a purpose they aren't just for looks, lol.... At least in professional web development.
@@chrisea make an interactive design tool simple enough, and marketing people will feel like they are pros, and the web is inundated with animations from hell.
apple wanted flash dead bc of the danger it posed to their appstore business model, so they went on with the security issues that were real, but not the main cause. The web wanted to get rid of flash because of the super annoying animations on the web , because users were at the mercy of whoever designed that flash intro, the industry wanted to get rid of flash bc it never ran well on mobile and finally, the HTML5 crowd wanted it gone bc it was a thing of the past and it was proprietary. So yeah, this smells like "lets get back to flash"@@chrisea