I took Soft Rotate and gave it a full-scene upgrade. The oversized cards still rotate in 3D as yo...I took Soft Rotate and gave it a full-scene upgrade. The oversized cards still rotate in 3D as yo...
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
I took Soft Rotate and gave it a full-scene upgrade.
The oversized cards still rotate in 3D as you scroll—but now every image can bring its own full-screen background with it. The card and scene transition together, making the gallery feel less like a stack of images and more like one continuous cinematic sequence.
It supports separate desktop, tablet, and phone scenes, fade or cut transitions, viewport-wide backgrounds, responsive card sizing and positioning, plus controls for depth, spread, perspective, vignette, marquee, shadows, and blend modes.
Built entirely in Framer with React + CSS transforms. No Three.js.
The full-screen image transitions you've created transform a gallery from static to cinematic. The way the 3D card rotation carries momentum through scroll is really compelling—did you find viewport-wide backgrounds worked better for engagement than contained card views?
It is an immersive, video-led website where six paintings and one film come together as a single story about the hour when the light begins to leave.
The aim was to make a website feel like a film rather than a page. The experience opens with a looping cinematic sequence framed in letterbox, then moves through six full-screen chapters that stack over one another as you scroll. Typography is part of the motion too: titles rise out of a soft blur, and lines of text come into focus word by word.
What went into it:
• Art direction built from a single palette of dusk violet, coral and deep navy
• A full-bleed opening film, encoded for smooth web playback, with a separate crop for mobile
• Sticky “curtain” chapter transitions and scroll-triggered text reveals
• Editorial typography pairing Boska and General Sans
• Fully responsive layouts for desktop, tablet and mobile
• A subtle film-grain overlay and cinematic shading to keep every scene consistent
Built in Framer. The walkthrough above is a 30-second capture of the live site, with original motion graphics and score.
What if one animation could tell three completely different brand stories — without rebuilding it from scratch?
Introducing ONE KICK, my third entry for the SVGator Animation Template Challenge on Contra. 🚀
The idea was simple: Build once. Design to change.
I created a football-inspired animated template that transforms across three distinct brand identities while keeping the same core motion, timing, and animation structure.
🟠 FIZZA — Bright, playful, and full of personality.
🟢 STRYKA — Bold, energetic, and performance-driven.
🔵 MATCHDAY+ — Dynamic, modern, and built for matchday excitement.
What's behind the concept?
One reusable animation system featuring seven scenes, adaptable branding, customizable text, colors, logos, and visual assets — designed to make brand personalization faster and easier.
From the opening kick to the final branded call-to-action, the goal was to show that great motion design doesn't have to be created from zero every time.
Where it shines: Sports campaigns, promotional ads, social media content, product launches, and animated brand storytelling. The template is designed for creators who want polished motion while keeping the freedom to make it their own.
The challenge I set myself: Could one animation feel like it was custom-made for three completely different brands?
The showcase is my answer.
3 BRANDS. 1 TEMPLATE. 0 REDRAWS.
Built with SVGator. Designed for reuse. Made to work again.
Would love to hear which identity you think works best! 👀
Brilliant concept! ⚽🔥 This is a great example of how reusable animation systems can save time while still giving each brand its own personality. The balance between consistency and customization is what makes this approach so powerful!