I need an animation similar to the one on the Apple website. On the left side there should be a 3-D animation and on the right side there should always be a text with a heading.
when the animation starts there will be an entire house on the left. The house consists of a roof two floors and a foundation. Next to the house is a headline and a subheadline.
if you then scroll down further, the roof separates from the rest of the house and becomes the center of the viewport. The rest of the house slowly moves down and fades into the background. In addition, a new text with a new heading moves up on the right side. The text will appear very centrally right next to the roof.
as the user scrolls further, the top floor separates from the rest of the house and floats to the roof of the house to reconnect to the roof. Now the roof and the top floor are the focus of the viewport. the lowest floor and the foundation are still below in the background animation. next to the roof and the top floor another text with a heading appears. This should hover Verde Scrollens proportionally to the scroll movement.
if the customer scrolls further, the bottom floor will separate from the foundation and float to the roof and the upper floor. The foundation will still be down in the background. and in the center of the screen the roof, top floor and bottom floor will be connected.
on the right side a text with a heading proportional to the scrolling movement will slide up again.
should the viewer scroll further, the foundation will float up and reconnect with the rest of the house. Of course, a text with a new heading will slide up again and be displayed directly next to the house.
The background of the animation should be black. The text should be white. And the house should be shown in a classy 3-D rendering. I really want it to look very similar to Apple. So there should definitely be light reflections in the house and the house should be animated in a very high quality. This is very important to my customer. I could provide a template for the house if that would help.
From a technical point of view, the animation should be my Lotti animation. As far as I know, Apple uses these to create the effects.
Here you can see how it could work: [login to view URL]