Responsive Mobile & Web . Branding

HOKA Membership

My Role:

Product Designer & Creative Designer
Collaborated with UX, Creative, and Marketing teams
Led UX research, strategy, wireframing, UI design, and testing


Project overview

Project Background
HOKA’s membership program was launched as Phase 1 of a broader customer engagement strategy. The goal was to build long-term loyalty by offering a membership experience that felt intuitive, rewarding, and seamlessly integrated into the HOKA ecosystem.

I saw this project as more than just a loyalty program. It was an opportunity to redefine customer relationships with HOKA. Instead of simply offering a points-based system, I envisioned an experience that resonated emotionally with users by creating a sense of belonging, a space where every member feels genuinely valued, understood, and part of a community that shares common interests and passions. A successful membership, then, is not merely about earning discounts; it’s about fostering an environment where customers become core members of a like-minded family.

Problem Statement
HOKA had a strong customer base, but there was no structured way to keep them engaged beyond their initial purchase.

  • No clear differentiation between members and non-members

  • Unclear value proposition: users didn’t immediately see why membership mattered

  • Friction in sign-ups: complicated onboarding led to drop-offs


Research

Competitor Analysis

I started with an in-depth analysis of successful membership programs from brands like Nike, Adidas, On Running, and Salomon. I wanted to understand what made their programs engaging and how we could bring those elements into HOKA’s experience.

Key Findings & How I Used Them:

  • Nike Run Club → Engagement through community-driven experiences

    • Solution: Integrated challenges and events to encourage member participation.

  • Adidas Creators Club → Tiered structures create long-term investment

    • Solution: Designed membership tiers to grow with user engagement.

  • On Running’s Grant Program → Experiences matter more than discounts

    • Solution: Prioritized exclusive perks like early product access and coaching.

  • Salomon → Personalized member benefits enhance connection

    • Solution: Developed custom member landing pages and targeted product offerings.

Through this research, it became clear that customers want more than just points. They want experiences and community-driven incentives. These insights shaped every aspect of my design process.

  • Salomon.com

    • Offers early access to sales similar to UGG Closet.

    • Uses email communications for member-exclusive events.

    • Provides opportunities to personalize membership landing pages.

  • On-running.com

    • Utilizes community-centric language and imagery.

    • Highlights "Grant" as an outlet for engagement.

    • Features clear FAQs for enhanced user experience.

  • Nike.com

    • Provides a "Stylitics" feature for styling purchases.

    • Uses targeted emails showcasing products and styling options.

    • Distinguishes between membership and account entities.

    • Clearly communicates value propositions through iconography on site and in emails.

    • Offers a personalized member shop for tailored experiences.

  • Philosophy.com

    • Maintains a clean and straightforward landing page for clarity.

  • Adidas.com

    • Includes a member-exclusive Product Listing Page (PLP).

    • Hosts members-only sales during designated "Members Week."

    • Prominently features value propositions at the beginning of activation emails.

User Journey Mapping: Understanding the Pain Points

I conducted user journey mapping to ensure that every touchpoint, whether online or in-storefelt effortless and rewarding.

  • Touchpoints: Where users interact with HOKA membership (website, emails, in-store, checkout, etc.).

  • Pain Points: Where engagement dropped and friction was highest (confusing sign-ups, unclear benefits).

  • Opportunities: Ways to improve the experience (simplified sign-ups, clearer value communication, better engagement incentives).

By addressing these elements, I crafted a seamless and enjoyable membership experience.


Touchpoints Map

Through collaborative workshops and a concerted effort, we achieved alignment and clarity across all teams, facilitated by this document.

The FigJam board serves as a central hub for participants, project leads, implementers, and viewers. It aims to serve as a source of truth for user flows, project briefs, deliverables, and responsible teams; provide clarity on essential messaging requirements; and function as a delivery board with previews of upcoming milestones and outputs.

Identity & Branding Strategy

Creating the HOKA Membership identity required a strategic balance between exclusivity, brand trust, and ease of recognition. My approach focused on color psychology, typography, and visual simplicity, ensuring the branding felt premium, inviting, and aligned with HOKA’s core values.

Logo & Color Psychology

A successful membership brand should strike the perfect balance between exclusivity and approachability. For the HOKA Membership identity, I developed a minimalist, high-contrast design with a strategically curated color palette, enhancing performance, trust, and long-term engagement. By fine-tuning contrasts, material choices, and branding clarity, I crafted a visual identity that embodies the premium essence of HOKA while remaining effortlessly engaging.

Key Design Elements:

  • Custom HOKA Black: A subtle blue-tinted black that conveys trust and high performance.

  • Refined White: A gently warmed white, softening harsh contrasts to create a premium yet inviting aesthetic that feels sophisticated rather than clinical.

  • Minimalist Typography: Modern, clean, and highly readable across all platforms.

A/B Testing & User Insights:

  • 22% reduction in eye strain with softened white backgrounds, improving readability across digital and print materials.

  • Increased brand trust with black-blue undertones compared to pure black, reinforcing HOKA’s reputation for high-performance athletic gear.

  • Enhanced logo adaptability through simplified typography and optimized spacing, ensuring seamless integration across various touchpoints.

Coming to life…

A strong visual identity is essential for building brand recognition, trust, and engagement, which is why the HOKA Membership logo was designed for seamless integration across digital and physical experiences. To maintain consistency across all customer touchpoints, the design follows key principles: Consistency, with a standardized lockup featuring precise proportions and spacing for instant recognition across platforms; Accessibility, ensuring ADA compliance for readability in various environments; and Scalability, optimizing the logo for different placements, from digital screens to in-store signage. This approach reinforces brand cohesion while enhancing user experience across all interactions.

Implementation Across Digital & In-Store Touchpoints

As the sole designer for the landing page and branding, I ensured seamless integration across every customer interaction.

  • Online Presence: Developed and designed the membership landing page and integrated membership dashboards, banners, and emails.

  • In-Store Branding: Designed checkout screens, product tags, and store mirrors for brand consistency.

  • Marketing Channels: Created visual assets for SMS campaigns, promotional emails, and event promotions.

In-Store Signage Research & Touchpoints

To enhance membership engagement in retail stores, I conducted a competitive analysis of in-store loyalty sign-ups from other competitors to identify best practices and opportunities for improvement. The goal was to implement strategic signage placements that drive conversions while maintaining a seamless and intuitive shopping experience. By combining passive touchpoints (signage) and active touchpoints (staff-driven interactions), we created a multi-layered engagement strategy that captured customer attention at key decision-making moments without disrupting their shopping flow.

In-Store Engagement Strategy:

To maximize in-store membership sign-ups, I studied approaches from Nike, Sephora, and Foot Locker and implemented the following strategies:

  • QR Code Integration: Placed in high-traffic areas like checkout counters and display shelves.

  • Associate-Led Engagement: Store employees wore scannable lanyards for easy onboarding.

  • Mirror Clings & Digital Screens: Encouraged sign-ups while customers tried on products.

Nike – High-Impact Digital & Print Signage

  • Entrance & Exit Signage – Reinforces membership visibility upon entry and exit.

  • In-Store Digital Screens – Captures attention during browsing.

  • Checkout Signage & QR Codes – Encourages a final conversion opportunity before purchase.

HOKA Strategy:

  • Mirrored digital displays and checkout signage to create a natural discovery flow.

  • QR codes embedded in key touchpoints to allow for seamless, mobile-first sign-ups.

Sephora – Personalized, Staff-Driven Engagement

  • Entrance Promotional Boards – Establishes awareness upon store entry.

  • Checkout Staff Conversations – Employees actively promote the membership program.

  • On-Shelf & In-Store Promotions – Encourages sign-ups at decision-making points.

HOKA Strategy:

  • Lanyards with scannable QR codes for store associates, allowing for casual, personalized onboarding conversations.

  • Checkout POS screen prompts to reinforce membership perks before purchase completion.

Foot Locker – Multi-Touchpoint Membership Visibility

  • Storefront Window Signage – Captures attention from outside the store.

  • In-Store Posters & Shelf Displays – Educates customers as they browse.

  • Sales Associate Assistance – Encourages face-to-face engagement for memberships.

HOKA Strategy:

  • Freestanding promotional signage at store entrances for immediate impact.

  • Strategic product display QR codes, linking directly to the sign-up page.

  • Mirror clings in fitting rooms to encourage membership while customers try on products.

Proposed Ideas

Prototyping

Based on my research findings, competitive analysis, and user journey mapping, I developed high-fidelity wireframes and prototypes to bring the HOKA Membership experience to life. My goal was to ensure that every interaction felt seamless, rewarding, and aligned with user expectations. The prototype focused on refining the user flow, optimizing content hierarchy, and reinforcing the emotional engagement elements identified in earlier stages.

  • Homepage & Pop-ups: Designed for clear, engaging sign-ups.

  • Product Pages: Integrated membership benefits within the shopping experience.

  • Email & Social Media Campaigns: Reinforced value through ongoing engagement.

Usability Test

To measure the effectiveness of the membership experience, I tracked key performance indicators (KPIs) using Google Analytics, CRM data, and heatmap analysis. I monitored sign-up rates, engagement levels, and conversion improvements, analyzing how users interacted with the new membership flow. Feedback from real users provided critical insights into areas that required enhancement, such as simplifying the onboarding process, making membership benefits more prominent, and ensuring accessibility across different devices.

Key usability testing methods included:

  • A/B Testing: Compared different versions of the membership sign-up page to determine which design elements drove the most conversions.

  • Session Recordings & Heatmaps: Identified drop-off points and areas where users hesitated or abandoned the process.

  • User Surveys & Feedback: Collected qualitative insights from real users to understand their motivations and frustrations.

The test results demonstrated strong initial engagement and conversion improvements, including:

  • 56% of CRM database signed up for membership.

  • 70% of total traffic to the membership site came from CRM channels.

  • 51% increase in traffic to the Shoe Finder tool after the membership layout update.

  • 16% increase in conversion rate after emphasizing "Free Membership" in sign-up messaging.

Reflections

One of the most surprising takeaways from this project was the impact of language. Through A/B testing, session recordings, and user feedback, I discovered that users were hesitant to complete the membership sign-up process. Heatmap analysis revealed that many users hovered over the sign-up button but didn’t proceed. Surveys indicated that some were unsure whether the membership had a cost.

To address this, I tested variations of the sign-up messaging. When we explicitly added the word "free" to highlight that membership required no payment, conversions significantly increased. This simple yet strategic change reinforced the importance of:

  • Clear, direct communication.

  • Reducing friction in sign-ups.

  • Making users feel like they’re getting something valuable at no cost.

This experience reinforced my understanding of how small wording adjustments can drive significant user behavior changes.

Next
Next

HOKA Design System | Design System . Style Guide. Tutorials