Get the cloneable for this project (affiliate link) webflow.grsm.i... Join my Webflow Wizards Community / timothyricks Spline file at app.spline.des...
This video was a real work of art! You managed to pack so much content into just 5 minutes. I would love to see more of these shorter videos from you. Keep up the great work.
Thanks a lot for all the information on this tutorial! I always wanted build something like this, but I never knewd how to start without be a great developer! No-code tools are the bridge in these days.
Spline/Webflow would be cool if you could output raw html/css/java, this dependencies bullcrap is out of hand; it's like every website is built like a house of cards.
Awesome video and very easy to follow along! I've never used spline and I noticed that to remove the logo it's a monthly subscription, if I only want to use it once for a specific website is there an option to purchase the file or something?
Hey Tim could you make a video about how to set lottie animations as a full-width background with other elements on top and make it scale the same way an image does when set to "cover" please? I could not figure it out after spending the whole day searching online although there's many people with the same issue, I'd really appreciate it, thanks!
Good tutorial) But how to make scroll animation duration not in pixels but in % of page or vh? Now you have to make individual animations with different durations for different width of screen, right?
We can use the page or the canvas as the start trigger, but the end offset can only be set in PX currently. Hopefully, Spline adds other unit types in the future. From what I tested though, the px offset seemed to work well for most screen sizes.
I heard that webflow working on a feature where you can upload 3 object files that you can then animate with interactions, that would be 1000% better, but we always appreciate the content Timothy 🔥 @@timothyricks
Amazing tutorial as usual, do you have any suggestions for optimizing this for Safari? Spline behaves really poor there, sometimes it doesn't load the scene at all, sometimes lags insanely
Hi Timothy, was wondering when bringing the spline object to webflow, what's the advantage of using this route instead of used spline - scene native component, to animate?
Hi, this tutorial was made before Webflow released the spline element natively. The Spline element offers more control by allowing us to animate the element using Webflow interactions.
Thank you for the tutorial. I want to clarify something. I'm currently using the free plan on Webflow for learning purposes. I plan to create a portfolio for my website using Webflow, which will require embedding some code that requires a paid plan. Once I've paid for the plan and successfully built my website, do I need to keep paying for the plan to ensure my website continues to function with the embedded code, or will it still work even after my plan has expired? Thanks in advance
I think once the code is in the site, it will stay there even after the plan ends. You just can’t edit it anymore. I could be wrong about that, but I know when cloning a cloneable with custom code in it, the custom code still runs on the free plan
How about responsivity? I insterted the embed in Webflow and it looks fine on desktop, but on smaller devices it does not scale like an image. I've tried to set the camera to Perspective and size to Responsive in Spline, did not help either:( Anyone know if it's possible to make it responsive in Webflow?
This video was a real work of art! You managed to pack so much content into just 5 minutes. I would love to see more of these shorter videos from you. Keep up the great work.
this video is not beginner friendly💀 but its a 5mins tutorial so its justifiable
Finally found a video talking about scroll trigger for Spline x Webflow instead of Framer. Love it so much, thank you 🥰
So glad to hear this! Thank you!
and I can't find the framer version
based TRicks your videos are always so clear and concise. thank you again!
Thanks so much! I’m really glad these help
Thanks a lot for all the information on this tutorial! I always wanted build something like this, but I never knewd how to start without be a great developer! No-code tools are the bridge in these days.
It’s amazing how easy no code makes this!
Spline/Webflow would be cool if you could output raw html/css/java, this dependencies bullcrap is out of hand; it's like every website is built like a house of cards.
Oh my god, I was looking for this for a long time, thank you
Simple, short, on point tutorial, Thanks 🫡👍🏻🙌
amazing tutorial as usual
Thanks Timothy!
Amazing Timothy !
Thanks so much!
Incredible! How did you learn to use spline so fast!? It looks amazing!
Thank you! I’ve been watching their official tutorials which really help. The learning curve isn’t huge
Great as always!!!
Damn that was cool 👏
Awesome video and very easy to follow along! I've never used spline and I noticed that to remove the logo it's a monthly subscription, if I only want to use it once for a specific website is there an option to purchase the file or something?
Hey Tim could you make a video about how to set lottie animations as a full-width background with other elements on top and make it scale the same way an image does when set to "cover" please? I could not figure it out after spending the whole day searching online although there's many people with the same issue, I'd really appreciate it, thanks!
This absolute content man! Are able to do something like this with the same embed file on figma?
Good tutorial) But how to make scroll animation duration not in pixels but in % of page or vh? Now you have to make individual animations with different durations for different width of screen, right?
We can use the page or the canvas as the start trigger, but the end offset can only be set in PX currently. Hopefully, Spline adds other unit types in the future. From what I tested though, the px offset seemed to work well for most screen sizes.
I heard that webflow working on a feature where you can upload 3 object files that you can then animate with interactions, that would be 1000% better, but we always appreciate the content Timothy 🔥 @@timothyricks
How about change to state 3 after 500px ? :) I mean : how to map page scroll position to different _STATES_ so they change accordingly ? :)
@Timothy Ricks ? How do you learn these things ? Why do you know all the Background information about these Programms.
I watched some of Spline's own tutorials which helped a lot, did some research on Google, and a bit of testing things on my own.
Amazing tutorial as usual, do you have any suggestions for optimizing this for Safari? Spline behaves really poor there, sometimes it doesn't load the scene at all, sometimes lags insanely
Hi Timothy, was wondering when bringing the spline object to webflow, what's the advantage of using this route instead of used spline - scene native component, to animate?
Hi, this tutorial was made before Webflow released the spline element natively. The Spline element offers more control by allowing us to animate the element using Webflow interactions.
@@timothyricks ahh I see, OK then . Thank you 🙌🏼
I need some help, how did you manage to have the text float above the spline scene?
that's really good, but that 3d element weights a lot
I need help hiding the background colour it still showing black when i put it onto webflow?
Is it possible to remove the "built with Spline" watermark? I have the most expensive version (Teams) so..
we need this in framer
can the samething be done in squarespace? Please help :)!!!
Niceee
Thank you for the tutorial.
I want to clarify something. I'm currently using the free plan on Webflow for learning purposes. I plan to create a portfolio for my website using Webflow, which will require embedding some code that requires a paid plan.
Once I've paid for the plan and successfully built my website, do I need to keep paying for the plan to ensure my website continues to function with the embedded code, or will it still work even after my plan has expired?
Thanks in advance
I think once the code is in the site, it will stay there even after the plan ends. You just can’t edit it anymore. I could be wrong about that, but I know when cloning a cloneable with custom code in it, the custom code still runs on the free plan
@@timothyricks Thank you!
How about responsivity? I insterted the embed in Webflow and it looks fine on desktop, but on smaller devices it does not scale like an image.
I've tried to set the camera to Perspective and size to Responsive in Spline, did not help either:(
Anyone know if it's possible to make it responsive in Webflow?
Good question! Under events, Spline has a resize event where we can adjust the camera for each breakpoint.
@@timothyricks Didn't know about this one. Thanks!
@@blasty3661 did it work? I wasnt able to do it with the laptop from Spline library.
😮