Animation
Animated 3D Illustration in Framer
About the resource
The 3D illustration is built using frames with 3D transforms. 3D transforms can project any layer into 3D space. So, we can build these little boxes and put them next to each other to set up any scene we like.
I created every object needed for the animation, then wrapped the whole thing in a component. I need the component because it allows me to create different variants, where I can change the position of the boxes, and connect the variants with interactions to make it interactive.
About the resource
The 3D illustration is built using frames with 3D transforms. 3D transforms can project any layer into 3D space. So, we can build these little boxes and put them next to each other to set up any scene we like.
I created every object needed for the animation, then wrapped the whole thing in a component. I need the component because it allows me to create different variants, where I can change the position of the boxes, and connect the variants with interactions to make it interactive.
About the resource
The 3D illustration is built using frames with 3D transforms. 3D transforms can project any layer into 3D space. So, we can build these little boxes and put them next to each other to set up any scene we like.
I created every object needed for the animation, then wrapped the whole thing in a component. I need the component because it allows me to create different variants, where I can change the position of the boxes, and connect the variants with interactions to make it interactive.
3D illustration framer component variants.
3D illustration framer component variants.
3D illustration framer component variants.
If you want to learn more about 3D transforms so you can also build similar 3D experiences on your websites, watch this free 30-minute crash course.
If you want to learn more about 3D transforms so you can also build similar 3D experiences on your websites, watch this free 30-minute crash course.
If you want to learn more about 3D transforms so you can also build similar 3D experiences on your websites, watch this free 30-minute crash course.
