The Challenge
The existing website captured Interlunar's creative identity but wasn't built to scale. As the agency expanded its offerings, both the marketing website and client portal needed a more flexible foundation that improved usability, simplified content management, and supported future growth.
Key Challenges
- Limited responsiveness across tablet and mobile devices
- Inconsistent navigation and visual hierarchy
- No scalable architecture for content, memberships, or future features
- A cluttered Webflow project with redundant classes and unused components
Project Goals
- Design a fully responsive experience across all breakpoints
- Build a scalable CMS for Zines, Blog, Ambassadors, and Events
- Integrate Memberstack to support tiered memberships and credit-based access
- Simplify navigation to improve discoverability and accessibility
- Optimize performance, SEO, animations, and analytics implementation
The landing page evolved from a visually expressive, retro-inspired aesthetic into a cleaner, more modern experience that better reflects the agency's identity. The comparison below highlights how the redesign improved hierarchy, clarity, and responsiveness while maintaining INTERLUNAR's creative personality.
Pre-revamp (Landing Page)
Pre-revamp (Landing Page)
Designing a Scalable System
The redesign wasn't just about creating a new visual language: it was about building a system that could evolve with the agency. Every decision, from layout and typography to CMS architecture and membership flows, was designed to balance creative expression with long-term scalability.
Working in Figma, I developed a modular library of reusable components that translated directly into Webflow, creating a seamless workflow from design to development. This system allowed the team to publish everything from zines and case studies to events and member-exclusive content while maintaining a consistent experience across the site.
Working in Figma, I developed a modular library of reusable components that translated directly into Webflow, creating a seamless workflow from design to development. This system allowed the team to publish everything from zines and case studies to events and member-exclusive content while maintaining a consistent experience across the site.
Design Principles
Editorial Clarity
A structured grid, intentional white space, and a clear visual hierarchy create an experience that's both engaging and easy to navigate.
Scalable Systems
Reusable components, a modular CMS, and consistent design patterns ensure the platform can grow without sacrificing cohesion.
Percise Motion
Thoughtful interactions and subtle animations enhance the user experience, guiding attention while preserving performance and accessibility.
UX architecture and modular component system in Figma (V1)
UX framework for tiered memberships and credit logic (V1)
Designing a Flexible Membership System
Beyond the marketing website, I designed and developed a gated client experience powered by Memberstack. The challenge was creating a system that could support multiple membership tiers while keeping the experience intuitive for both new and returning clients.
The portal allowed members to manage their accounts, access exclusive content, and track available credits through a clear, scalable interface. By integrating Memberstack with Webflow, the experience balanced flexible business rules with a seamless user journey, making it easy for the team to expand offerings without redesigning the platform.
The portal allowed members to manage their accounts, access exclusive content, and track available credits through a clear, scalable interface. By integrating Memberstack with Webflow, the experience balanced flexible business rules with a seamless user journey, making it easy for the team to expand offerings without redesigning the platform.
Product System Principles
Tiered Access
Content and features dynamically changed based on each user's membership level without maintaining separate interfaces.
Credit Tracking
A clear dashboard allowed members to monitor available credits, usage, and remaining balance at a glance.
Gated Content
Exclusive resources and experiences were unlocked automatically based on permissions, creating a seamless member journey.
Member dashboard landing experience
Credit tracking interface and member resources
Memberstack Integration
- Built the authentication flow, including custom login and sign-up modals in Webflow.
- Configured Memberstack attributes to dynamically control content visibility based on membership status.
- Designed a modular dashboard to support credit tracking, membership tiers, and CozyCal scheduling.
- Structured the platform for future integrations with ClickUp and Zapier to automate client onboarding and credit management.
Reflection
This project reinforced that successful digital products are built as systems, not just interfaces. Designing across strategy, UX, development, and CMS architecture required every decision to balance usability with long-term scalability. By bridging design and implementation, I created a platform that not only reflected Interlunar's creative identity but also gave the team a flexible foundation they could confidently build on as the agency evolved.
