This is a question to @Duncan: I like the Sparkleapp homepage very much and it shows a lot of features used (and I guess it’s designed with Sparkle 
). So - would it be possible that you share the .sparkle file to the community (just talking about the homepage / landing page). This might also be an excellent tutorial?
I’m happy to walk you through the things you are curious about, but we won’t be releasing the project.
I understand. Well, it’s basically the animations that go along with scrolling e.g. the opening laptop, the rotating safe-dial and the animation at the bottom of the page.
The laptop opening is a video with the new “Play while scrolling” option in Sparkle 4, it’s just a checkbox. The video itself was built with https://rotato.app – it’s not always easy to find a video that works well this way. The built-in Mindful+ template also has a video with Play while scrolling (the brain), so you can check that.
The safe dial is the Animate while scrolling option that was already available in Sparkle 3, applied to a square image containing a dial, it rotates around its center so it creates the effect of a rotating dial.
At the bottom of the page you mean the Apple logo fading in? It also has Animate while scrolling effects, both scale and opacity.
1 Like
Well, there’s still an issue, I can’t find a solution for: boxes which contain pictures can be fixed. Boxes cannot contain videos and videos itself cannot be fixed in position while scrolling. So how is that achieved?
Thanks for your help @duncan !
Sure, that is achieved by placing the video inside a group, and the group is set to stick to top.
The stick to top group has the “last one pushes previous” mode set. The trick is a second stick to top group further down on the page (also with push mode) pushes away the first one, and tuning the distance makes it work reasonably well.
Makes sense. Thanks Duncan!
@duncan My compliments for the new website, it looks great! On mobile, however, the hyperlinks on the What’s New page are displayed too small.
Thanks, it’s fixed now.
It’s a great opening page. Really like it. I think with version 3 @duncan did a video going over the different aspects and additions. It was very informative. Perhaps Duncan will do that for v4 when time allows down the road.
There’s some great effects on the opening Sparkle page. Great for reference.
2 Likes