Curved Split Fashion Hero | Redesignee

Project description

A high-end, editorial hero section designed specifically for luxury fashion brands, modern e-commerce landing pages, and creative lookbooks. It reimagines the classic split-screen layout by introducing a beautiful, fluidly curved dividing line that responds dynamically to user hover states. The Design Concept Split-screen layouts are incredibly popular for showcasing dual collections (like Menswear vs. Womenswear), but they usually rely on a harsh, static vertical line down the center. We wanted to design an interface that feels much more organic, flowing, and human. By softening the split with an elegant, asymmetrical curve, the two halves of the screen look beautifully connected. When a user hovers over either side, the curve fluidly expands, shifting the layout canvas to give the focused image more real estate. It turns a standard navigation choice into an interactive, tactile experience. Key Design Features Fluid Curved Partitioning: Breaks away from rigid box grids using an elegant, custom-shaped curve that adds immediate artistic value above the fold. Interactive Canvas Expansion: Smoothly expands and shifts image focus based on hover coordinates, inviting users to play with the interface before clicking through. Optimized Performance Physics: Built entirely as a lightweight cloud component, allowing the complex curved layout transitions to animate smoothly at 60fps without heavy canvas rendering or site lag. Tools & Tech Stack Design & Layout: Figma Front-End: HTML5 / CSS3 (SVG Masking & Transitions) / Vanilla JavaScript Platform: Redesignee Cloud Components