Vera Sanctuary — Designing a Dual-Theme Luxury Spa & Wellness Experience
An editorial, production-ready brand and web platform built for an exclusive thermal wellness retreat specializing in hydrotherapy, bespoke skin rituals, and meditative spaces.
Project overview
Vera Sanctuary was conceptualized and developed to bridge the gap between atmospheric luxury design and frictionless digital hospitality. Designed from the ground up, the platform targets high-end wellness travelers seeking an unhurried, serene digital journey before stepping foot into the physical sanctuary.
As the sole designer and Framer developer, I structured the hybrid visual system, dual-theme architecture, interactive booking workflows, and production deployment.
The challenge
Luxury wellness and hospitality websites face a unique UX challenge: balancing complex transactional features—such as multi-tier membership billing, real-time date and guest selectors, global currency conversion, and instant reservation modals—with an airy, serene, and uncluttered aesthetic.
The challenge was to engineer a hybrid visual system that alternates seamlessly between deep obsidian dark-mode sections and crisp, botanical light-mode containers without compromising loading speed, responsiveness, or emotional calm.
Research and exploration
The visual direction began by analyzing high-end hospitality layouts, thermal spa architecture, and balanced high-contrast UI patterns. I explored a refined color palette pairing deep charcoal/obsidian bases (#0B0D10) with warm champagne gold accents (#D4AF37) for evening/night sequences, transitioning into warm alabaster light containers (#FAF8F5) with sage green highlights (#7A8B7B) for daytime treatment directories.
A central focus was translating booking utilities and membership calculators into intuitive, elegant web components that feel bespoke rather than corporate.
The visual identity & web system
The resulting platform combines structured bento grids, glassmorphism containers, and custom micro-interactions to create a cohesive digital experience:
Hybrid Dark/Light Theme System: Fluid visual transitions alternating between immersive dark obsidian sections and clean botanical light-mode containers.
Cinematic Hero & Booking Engine: Immersive header integrated with a live availability check bar supporting flexible date selection, guest counts, and ritual filtering.
Curated Rituals Bento Grid: A light-mode 3-column interactive gallery featuring signature treatments complete with transparent pricing and modal reservation triggers.
Membership & Day Pass Engine: A sleek obsidian pricing architecture featuring an interactive billing toggle switch (Monthly, Annual, and VIP Day Passes) with dynamic discount calculations.
The Secret Botanical Key: An interactive engagement component near the footer that expands with a glowing gold particle effect upon interaction, unlocking a seasonal guest perk and redemption code.
2
65
Aetheria Haven — Designing an Immersive Luxury Hospitality & Reservation Experience
An editorial, high-end digital platform and booking ecosystem crafted for an exclusive cliffside boutique hotel and wellness retreat.
Project overview
Aetheria Haven was conceptualized and engineered to elevate digital hospitality branding, moving away from cluttered OTA (Online Travel Agency) templates toward an unhurried, opulent visual experience. Located along the Amalfi Coast, the 72-suite sanctuary required a digital interface that mirrored its physical ethos: serene, bespoke, and meticulously considered.
As the designer and developer, I built the entire web experience in Framer, integrating dynamic currency conversion, live suite modals, environmental estate metrics, and interactive reservation workflows.
The challenge
Luxury hospitality websites often struggle to balance heavy interactive utility such as booking engines, guest counters, and rate calculators with an airy, editorial atmosphere. The challenge was to design a light-mode aesthetic utilizing warm alabaster tones and champagne gold accents that felt exclusive and breathable, while packing high-density functional layers into every scroll.
Design & interactive features
The resulting platform combines cinematic media with subtle micro-interactions to create a frictionless user journey:
Cinematic Hero & Booking Engine: Features an immersive background video view paired with an integrated availability check bar supporting real-time date selectors, guest counts, and room type filtering.
Curated Suite Showcase: A 3-column interactive gallery highlighting exclusive accommodations—including the Executive Penthouse, Oceanfront Villa, and Garden Sanctuary—complete with detailed modal pop-ups displaying square footage, occupancy, and bespoke amenities like private plunge pools and butler service.
Estate Metrics & Bento Grid: High-density data modules showcasing live micro-climate indicators (Aetheria Cove temperature and local weather), Michelin accolades, and a 4:1 staff-to-guest ratio.
The VIP Secret Key (Interactive Surprise): An engagement-driven component placed near the footer. When tapped, it unlocks a glowing gold modal revealing an exclusive seasonal guest perk and reward code.
Global Currency Integration: A seamless multi-currency switcher in the floating header allowing instantaneous translation between USD, EUR, and GBP.
2
70
Satisfied Digital — Engineering a Modern High-Converting Web Studio
An editorial, production-ready brand and web platform built for a digital agency specializing in custom Framer builds, product design, and AI workflow integrations.
Project overview
Satisfied Digital was conceptualized and developed to bridge the gap between high-end aesthetic design and functional performance. Designed from the ground up, the platform targets tech startups, SaaS teams, and digital founders seeking a modern web presence without rigid templates or traditional development bloat.
As the sole designer and Framer developer, I structured the visual system, interaction architecture, responsive layouts, and production deployment.
The challenge
Modern agency websites often lean too heavily into generic dark mode SaaS tropes or over-engineered canvas animations that compromise site performance and mobile usability. The challenge was to create a dark-mode obsidian visual system that feels high-tech, responsive, and fluid across all devices, while maintaining sub-second loading speeds and high conversion mechanics.
Research and exploration
The visual direction began by analyzing editorial layouts, dark glassmorphism UI patterns, and modular grid architecture. I explored high-density typography pairing bold modern sans-serif headings with subtle, glowing emerald accents (#10B981) to anchor primary calls to action.
A central focus was translating hardware/software UI components—such as code viewports, terminal tabs, and analytics monitors—into accessible, interactive web elements.
The visual identity & web system
The resulting platform combines structured bento grids, glassmorphism containers, and custom micro-interactions to create a cohesive digital experience:
Interactive Hero Viewport: A dynamic mockup engine demonstrating real-time responsive switching between desktop, tablet, and mobile breakpoints.
Asymmetric Bento Feature System: Modular layout cards highlighting service capabilities, execution speed, and direct tool stack integrations.
Interactive Pricing Calculator: A flexible tier structure engineered with a functional monthly-to-annual toggle offering instant billing recalculation.
Fluid Scroll Dynamics: Spring-physics hover feedback, glow boundary states, and scroll-triggered entrance reveals engineered natively within Framer.
2
89
Satisfied Tool — High-Converting Dark SaaS Landing Page
Built from scratch in Framer for modern SaaS startups.
Key Highlights:
• Fully responsive layout optimized across Desktop, Tablet, and Mobile viewports.
• Clean dark-mode UI with custom micro-animations and smooth scroll interactions.
• High-converting hero layout, feature grid, and interactive pricing tier components.
• Optimized for ultra-fast loading speed and SEO performance.
Tooling: Framer, Figma, Web Design
2
130