INTERLUNAR Digital Ecosystem Build

Timeline: June – November 2025
Role: Lead Web Designer & Developer
Collaborators: Abby, Caitlyn
Tools: Webflow, Figma, Memberstack, Zapier

OVERVIEW
Interlunar is a boutique creative studio in Singapore transitioning from project-based collaborations to a scalable, membership-led ecosystem. The website rebuild transformed its digital presence into operational infrastructure: supporting community growth, client engagement, and strategic campaigns.

CONTRIBUTIONS

→ Repositioned the website as scalable digital infrastructure
→ Led UX strategy and visual system design
→ Developed custom Webflow build end-to-end
→ Designed dynamic CMS architecture
→ Integrated membership framework (Memberstack)
→ Built CRM and automation foundation

 
 
 

THE challenge

The previous site was expressive but structurally rigid. It lacked scalability, brand alignment, and operational clarity.

Key Issues

  • Weak responsiveness across tablet and mobile

  • Inconsistent visual hierarchy and navigation

  • No scalable structure for Zines, Ambassadors, or Membership tiers

  • Cluttered backend with redundant classes and unused sections

Core Objectives

  • Design a fully responsive, modular system across breakpoints

  • Architect a multi-layered CMS (Zines, Blog, Ambassadors, Events)

  • Integrate Memberstack for tiered memberships and credit logic

  • Rework navigation for clarity and accessibility

  • Optimize performance, animations, SEO, and GTM tracking

 
 

Pre-revamp (Landing Page)

Post-revamp (Landing Page)

 
 

DESIGN PROCESS

From the outset, the goal was clear: build a cinematic yet efficient platform — one that reflected Interlunar’s creative identity while remaining frictionless to manage.

Working in Figma, I designed a modular system of reusable components (hero blocks, feature grids, editorial layouts) each mapped directly to a corresponding Webflow CMS Collection for seamless design-to-development translation.

Design Pillars

→ Editorial Clarity — Structured grids balanced with intentional white space
→ Motion with Purpose — Subtle animations that guide interaction, not distract
→ System Thinking — Consistent rhythm in typography, spacing, and alignment
→ Scalable Membership Framework — UX flows designed to support tiered access, credit tracking, and gated content via Memberstack

Dynamic storytelling was embedded into the system: enabling the team to publish zines, events, case studies, and membership content with distinct visual personalities without breaking consistency.

 
 

UX architecture and modular component system in Figma (V1)

UX framework for tiered memberships and credit logic (V1)

 
 

DEVELOPMENT & WEBFLOW BUILD

System Architecture

→ Built multi-collection CMS (Zines, Blog, Ambassadors, Events, Case Studies
→ Established global utility classes for spacing, typography, and color tokens
→ Rebuilt scalable navbar and footer components

Responsive Framework

→ Implemented flexible grid system across all breakpoints
→ Tested across iPhone, Android, and iPad viewports
→ Defined device-based visibility rules for cleaner mobile UX

Interactions & Motion

→ Developed scroll-based reveals and fade transitions natively in Webflow
→ Engineered seamless infinite carousels (clients, awards)
→ Applied performance-optimized micro-interactions and hover states

Memberstack Integration

→ Built login/signup modal and dashboard shell within Webflow
→ Configured conditional visibility via custom attributes
→ Structured dashboard framework for tiers, credit balance, and scheduling