Low/mid-fidelity wireframe for the Ombelle home page. This wireframe also defines the Phase 1 / interim website structure. Sections are designed for reuse across the full website.
Phase 1 / InterimBuild Once → Reuse → Expand
Page Pacing
01 Immersive
02 Quiet
03 Immersive
04 Editorial
05 Immersive
06 Visual
07 Quiet
08 Conversion
Deliberate variation in section height and composition. The page alternates immersive media moments with quiet editorial passages, ending in a focused conversion sequence.
Desktop WireframeDesktop-first · 12-column grid
Virtual TourCall SalesInquire☰
Component: Global HeaderPhase 1Minimal. Primary nav → Virtual Tour → Conversion. Menu icon opens full-screen nav.
Contextual VisualTransitions on hover/focus of nav destination
ResidencesAmenitiesNeighborhoodGalleryAbout
Virtual TourCall SalesInquire
News & PressBuyer ResourcesContact
Component: Full-Screen NavigationPhase 1Desktop: left contextual visual transitions on hover. Right: minimal nav → featured → conversion → secondary.
Cinematic Media — Video / Architectural Rendering / PhotographyFull-viewport height · Architectural · Fort Lauderdale · Arrival
Now Selling & Now Building
Ombelle
A statement of beauty in downtown Fort Lauderdale.
Full-screen navigation — contextual visual transitions on hover/focus of primary destinations
Text CTA / Wave — subtle wave underline opacity shift on hover, focus-visible outline
Collection media — gentle crossfade between collection imagery on interaction
Amenity preview — large media transitions when selecting environment
Gallery — horizontal scroll or controlled image sequence with slow movement
Scroll reveals — subtle fade/translate, slow and controlled, respects prefers-reduced-motion
Motion should feel slow, controlled, architectural, and cinematic. No bounce, excessive parallax, or constant movement. All motion must respect prefers-reduced-motion.