7 ай бұрын
8 ай бұрын
10 ай бұрын
Жыл бұрын
Жыл бұрын
Пікірлер
@hakuna7268 14 күн бұрын
thanks for your share, that very useful for me~
@hoangnghiep-x8g 17 күн бұрын
Great, can you make a video tutorial from scratch? how do i open the input mouth panel at 1:25
@rlsimmons1214 Ай бұрын
i cant find the button where you get to phote shop but i dont see it and plz make a tut for this is 2024
@nikolas4749 Ай бұрын
Great work Jeff Do you know how we can simulate a 3d effect with rive ? like this cat turning his head kzbin.info/www/bejne/d3bTYYKOgrGcn8kfeature=shared&t=38
@musicluver1979 2 ай бұрын
pretty amazing. thanks!
@gregschwartz5828 2 ай бұрын
Any clue how to add transform affects on a sloid objects? I dont seem to have that setting when selecting an onbject that has no stroke.
@ciedazibao331 2 ай бұрын
My first try with Character Animator : kzbin.info/www/bejne/j6eumJt7mrZ-qLM
@EchoesofAmar 2 ай бұрын
bad method because when you save it gang it doesnt keep the animations u have to remake for every new project
@Oleksandr-snk 2 ай бұрын
need in depth tutorial on this one!
@UserTenNumbers 2 ай бұрын
Very nice example. Is there a version of this that crops in on the background depending on the viewport size and keeps everything centred. Like Seeing the same element on multiple sized devices.
@wadepvenga 3 ай бұрын
Is it possible to use that to realtime lip sync for a chat support?
@jeffamcavoy 3 ай бұрын
@@wadepvenga yeah, it is possible to implement with some runtime code. I’ve been keeping an eye out for an existing library that can convert audio input to phonemes in real time so they can be synced.
@gretarthorgudjonsson965 3 ай бұрын
This is high quality content, Loved it
@tasiakarapetian 4 ай бұрын
thank you so much for the video! i am trying to do the same in readymag, but having trouble with the sizing. the size changes when i preview the website and is smaller when in editing mode. but the bigger issue is that the smaller the animation is the worse is the quality. do you happen to know how to fix that? the canvas is 5 times smaller than my original artboard but the quality is terrible
@JustFeelingsCrafts 4 ай бұрын
Can I move timelines between nested artboards? Thanks
@jeffamcavoy 4 ай бұрын
@@JustFeelingsCrafts you can copy and paste certain keys (like scale, rotation, and position properties) from one element to another and from one timeline to another. That might help accomplish what you’re looking for.
@ameenbadri9696 4 ай бұрын
My jaw dropped in after you change the offset to 2% and what took from me more than 15 min jop you did it in one min. Absolutely brilliant insights on animation! Your creativity shines through, making the art form accessible and delightful. Keep sharing your magic!
@jeffamcavoy 4 ай бұрын
@@ameenbadri9696 I’m so glad it was useful! It’s one of my favorite tricks!
@dmytro_korolkov 4 ай бұрын
Another great tutorial!
@jeffamcavoy 4 ай бұрын
Glad you think so!
@dmytro_korolkov 4 ай бұрын
That's a great sample! Is it possible to share a codepen or something similar (interesting about code aspects of this sample ) and of course I'm sure hundreds of people will be happy to see detailed tutorial. Subscribing to get more interesting videos :)
@jeffamcavoy 4 ай бұрын
Yes, definitely! I just added it to the video description. Thanks for suggesting it!
@dmytro_korolkov 2 ай бұрын
@@jeffamcavoy Thank you! Reviewed your wonderful video once again. Actually it's only the frame changing it's size (and the illustration inside) accordingly to viewport size->inputs :) It's some kind of cheat as I understand, as the Artboard actually doesn't change it's size :)
@jeffamcavoy 2 ай бұрын
@@dmytro_korolkov That's right! The canvas element itself must stay at a fixed size and the js code updates the number inputs for the x and y width, which controls the size of the art within the Rive canvas.
@dmytro_korolkov 2 ай бұрын
@@jeffamcavoy thanks, clear!
@Xandercorp 4 ай бұрын
Noice! Thanks for this Jeff!
@jeffamcavoy 4 ай бұрын
You bet!
@Xandercorp 4 ай бұрын
No sir, I don't gamble!
@ameenbadri9696 4 ай бұрын
@@Xandercorp lol
@geeEmGee 4 ай бұрын
Nice solution. Need to solve a similar challenge in Rive but with a with a UI based design, this should be helpful.
@jeffamcavoy 4 ай бұрын
Glad it helped!
@artistevivien 4 ай бұрын
This is wild
@SamMunsayac 5 ай бұрын
fast explain and direct to the point😃 thanks i learn new
@DerKaia7 5 ай бұрын
could you please share a project file for this ?
@jeffamcavoy 4 ай бұрын
Just found your comment! Yeah, I can share for sure. Easiest way to share the Rive is through the community here: rive.app/community/files/11946-22775-color-adjustable-art/. Let me know if you have any other questions!
@DerKaia7 4 ай бұрын
@@jeffamcavoy hey, thank you so much.
@uwemisrael5836 2 ай бұрын
@@jeffamcavoy Thank you!!!!!
@dickyjiang 5 ай бұрын
Hi Jeff, I was wondering why not you just placed the script on webflow custom code section?
@jeffamcavoy 5 ай бұрын
@@dickyjiang I just really love the functionality of Slater and have a bunch of code snippets saved there. But you definitely could paste the code into the custom code section.
@dickyjiang 5 ай бұрын
@@jeffamcavoy awesome, thanks for explaining 👌
@Bestfunnyvdeo06 5 ай бұрын
Good
@groove_bureau 5 ай бұрын
Hey! Great video! I'm a noobie in coding and I use Webflow. How to make links work inside of the Webflow. What's Artboard? What's State Machine? I have just the from the client and I don't know how to make Webflow's link block work because the is controlling all the events. Also the Rive is not responsive, so when I put the (width: 100%, height: 100%) inside of the link block and try to control the sizes - nothing works. Can you please help me to solve this issue? Thanks
@jeffamcavoy 4 ай бұрын
I didn't find this comment until now. Sorry for the delayed response! Artboards and State Machines are the properties in Rive that you need to name in the JS code to make the advanced integrations work. You won't be able to do an advanced integration with the itself. To really get this to work you'll need the .riv file to use the runtime to access its properties.
@danimaticos 5 ай бұрын
Great explanation, shame you didn't included the head wiggle as example of how it's triggered, awesome animation, thanks for sharing
@lorcanpreston4643 Ай бұрын
agreed
@ameenbadri9696 6 ай бұрын
Smart approach.
@contentmajesties 6 ай бұрын
Diamond 💎
@AraafSyafii 6 ай бұрын
Hi Jeff, thank you for the tutorial. I have had similar client visemes projects before. I have a few question: 1. I want to ask about the number input on the nested artboard; last time, the developer asked me to make the input into the main artboard instead of making it on the nested artboard because they can not access it into runtime; any advice on how to overcome with it? 2. Is there any specific reason why you didn't connect the trasisition between neutral timeline with any state in state machine? Glad if you're able to answer. Thank you in advance!
@jeffamcavoy 5 ай бұрын
@@AraafSyafii thanks for the questions and sorry for the long response time! In a recent update the nested artboard inputs are now accessible at runtime. So, it is possible to just use a number input on the main board, but not if you want to key the values on a timeline. You’ll need a nested artboard for that. I don’t think I understand the second question. I’ll try rewatching the video and see if I can figure it out for you. Thanks!
@alexandremaye1221 6 ай бұрын
Hey! Thank you so much for your tutorial. But now with the "Event - Open URL" in Rive, you do not need to use this JS Runtime? Because I have created this Event and it's "fire" on my Rive animation. Thank you for your help and answer 🙂
@jeffamcavoy 6 ай бұрын
Great question! The Open URL event is awesome and does help to simplify the code a bit, but you do still need to use the JS Runtime. The link won't just open on its own. I just made a video about that here: kzbin.info/www/bejne/opmqY6eEjdeefrM
@nito8066 6 ай бұрын
just came here to tell you that that tile is not telling me that this is a porggraming tutorial
@jeffamcavoy 6 ай бұрын
Appreciate the feedback! I’ll try to update the image to make it more clear.
@lezgoverci 7 ай бұрын
How does it know which viseme to play? did you manually set the viseme in the audio track? how can this be automated or programmed to play a specific viseme depending on the words from the audio?
@jeffamcavoy 7 ай бұрын
Awesome questions! In this case, I did manually key the visemes to match the audio. It took quite a bit of trial and error. I've been looking into speech and phoneme libraries to find a way to auto-sync it. I believe it's possible, but haven't figured out the best way yet.
@srtamaiteguadalupe 7 ай бұрын
Hello Jeff ! Thanks for your video. I still have a doubt that seems impossible to find.... How would you add a link in your "eclipse button"? I tried to simply add a link box, then pasting the embed code inside it, but it won't let the actual "button" be played since the embed code kind of numbs the link box (you can only clic on outside areas and its so frustrating). Do you know how to make your eclipse button becomes an actual clickable button with a link in webflow ?
@jeffamcavoy 7 ай бұрын
I actually have a video about that here: kzbin.info/www/bejne/eF7ZdoVojdWDjLMsi=fWasCQPGazhHqDlJ I’m planning to update it soon, but for now it should give you a sense of how it works. Hope it helps!
@jenkisg 7 ай бұрын
Great presentation! Do you happen to know if this will work under the free (2-page) Web Flow plan?
@jeffamcavoy 7 ай бұрын
Thanks! I don’t think you’re able to add custom code under the free webflow plans. But I’m not certain.
@ШкекЖижоидна 7 ай бұрын
Very good guide. Thx
@jeffamcavoy 4 ай бұрын
Glad it helped!
@Papaboi226 7 ай бұрын
can you make a long form video? please
@Papaboi226 7 ай бұрын
how did you fill up the half circle after you cut it?
@FilledStacks 8 ай бұрын
This is an awesome video. I'm actually exploring this for building mobile UI's. I haven't checked on your channel, but I hope there's a more detailed version of this, otherwise I'll have to figure out myself using the guides in this video to do this as well.
@jeffamcavoy 8 ай бұрын
Oh yeah, I just saw the walkthrough you posted to discord. Looks amazing! I haven't posted any more detail about this particular method yet, but I may someday. It could be very useful for app UI.
@FilledStacks 8 ай бұрын
@@jeffamcavoy it definitely would be. I couldn't figure out how to make my UI adjust in this way 😆
@gabrielsaunders4642 8 ай бұрын
Are there any ways to do this more scalably? For example , one color for multiple objects (not just paths?)
@jeffamcavoy 8 ай бұрын
You can use the same fill and blend mode on multiple shapes. Then key their values on the timelines as shown and the number inputs will update all of them at once.
@gabrielsaunders4642 8 ай бұрын
Smart approach
@kadekeqw23 8 ай бұрын
Fantastic demo! Thank you!
@uo2265 8 ай бұрын
You saving life !! But how about the body please 🥹 now we only have head 🥹
@frankyang1988 8 ай бұрын
It really helps for a newbie.
@dianafridabtmfrid923 8 ай бұрын
THANK YOU SO MUCHH
@thinguyenhoang5004 9 ай бұрын
Love it Jeff! ❤🎉
@jeffamcavoy 9 ай бұрын
Thanks!
@sounds-man 9 ай бұрын
Thank you!!
@SonWasTaken 9 ай бұрын
Do i need pro for this?
@mornbann 9 ай бұрын
This is so cool.
@jeffamcavoy 9 ай бұрын
🙏 I was pretty happy when I figured it out!
@JWMD_ 10 ай бұрын
Brillant! 🎉
@jeffamcavoy 10 ай бұрын
Ay, thanks!
@jfernandez08 10 ай бұрын
Is there correct code to scale your embed for different devices? I’m having trouble when scaling my images for mobile as the image is 500x500 and still too large for mobile. It won’t scale down.
@jeffamcavoy 10 ай бұрын
Yeah, you can set your canvas to 100% x 100% so that it fills its parent container. Then make sure to set the dimensions of the embed element as you like for each break point.