Shadows, blurs, glows
We plan to add effects like shadows, blurs, and glows once the Rive Renderer is implemented across our runtimes and editor. These effects are typically expensive to do at runtime. We want to allow creators to build amazing graphics with exceptional performance. So we want to only offer this feature once we have a very efficient way to do it. Our renderer gives us a performant way to implement these effects across runtimes.
will this happen in 2024?
Amazing to hear Guido. Curious if you have a tentative date?
If I correctly understand Rives runtime rules (defined by the Rive team), then you only add design properties if all supported platforms support these, right? So, is this FR something planned for an unspecific point in the future until all platforms start supporting shadows, blurs, and glows or is it actually planned to do that? E.g. as far as I know, Android understands background blurs only in a very limited way, because apps in Android do not know what happens outside their box. Means, they cannot blur another app they're living on top of. That might not be needed for Android app developer, because they're only working within one app (correct me, Android devs), but when building whole systems with Android Automotive OS or Android Open Source Project, it might be crucial.
Personally, I cannot wait to work with shadows, blurs, and glows natively in Rive. I miss them a lot. :)
Right now this is the last feature on our wish list in order to be able to use Rive in our primary workflow. Building our own shadows/glows/blurs into our image assets is one thing, but so much of our text requires being able to apply shadows and glows. Once that's in, it feels like Rive would be applicable to the vast majority of our projects.
Work is ongoing to get the new renderer integrated into the Rive Editor. That's the main blocker to this being implemented.
No this isn't related to the individual platforms' support – we built our own renderer to circumvent that, as well as many other reasons, which you can read about here https://rive.app/blog/rive-renderer-now-open-source-and-available-on-all-platforms
Thank you for the correction. Then I misunderstood the text on Rive's website: "Rive runs on many platforms. These platforms use different renderers with varying features. Making Rive visuals consistent and performant across all requires effort. It also means we can’t quickly implement highly requested features (like blurs and drop shadows) since not all renderers support them." (https://rive.app/renderer)
The wording of the highlighted part just confused me. I thought the implementation is related to the platform renderer, but it actually says that you need more development time to integrate that feature in your own renderer, right?
We can clarify that language. That paragraph is explaining why we needed to build our own renderer. If you read the rest of the text, it explains why the Rive Renderer solves that problem.
Do you have an ETA for this feature ? Much needed on my side too. Importing png assets from figma just to get the blur effect isn't a realistic workflow and is preventing my team to rely 100% on Rive unfortunately...
Same, this functionality is quiet essential for our project as well.
Same here, I have been paying for a Rive Pro for the past 9 months but not able to use Rive until you enable blurs and shadows 😭 I think I'll need to stop until you have this feature.
Wow, great news and a long journey!
So, if I understand that correctly you want to bring rive renderer to all the target platforms before you actually make this feature available.
As far as I can see here (https://rive.app/community/doc/overview/docD20dU9Rod), android, ios, react native and browsers with WebGL 2 are already done, only flutter and browsers with webgl/canvas left.
Do you plan to drop support for older browsers? Looks like 95+% of browsers support webgl 2 nowadays, so maybe it's just worth to use only this option? Also, what about flutter? Is it coming soon?
I'm at a loss here, how exactly are large organisations using rive without shadows? Is there a workaround.
So if I need a shadow below a box, I can't even bring it with an svg. Do I have to export a png to bring it?
I used png as background blur, but the result is not good on ios, and the file is quite large. I don't know if there is a solution for this, I just overlapped circle shape with radial gradient.
I am also struggling with the shadow side of things. Particularly with Opacity animations.
As a fix for the file size, Rive does recognise Webp as a format. It reduces the file size a lot.
Any news on this development?