Hoka

Enhancing HOKA's product comparison experience through user research, workshops, and usability testing to improve decision-making for footwear shoppers.
Project Overview
HOKA is a premium athletic footwear brand under Deckers, dedicated to empowering athletes with high-performance shoes for running, walking, and hiking. Their mission is to create footwear that inspires confidence and helps athletes "fly over the earth" with innovative design and technology.

In this project*, we reimagined HOKA's product comparison experience, addressing user challenges through a blend of research-driven insights and design solutions. By improving the Shoe Finder quiz, comparison tools, and product pages, we created an intuitive, interactive platform that enhances decision-making for novice and experienced runners.
*Done in collaboration with Purdue University
Role
UI/ UX Design
User Research
Design Direction
Year
2023- 2024
Sector
E-commerce

Who is Hoka?

HOKA, a premium footwear brand under Deckers, is dedicated to producing high-performance shoes that cater to athletes of all levels, from casual walkers to professional runners. Known for their signature oversized midsoles and lightweight designs, HOKA’s products emphasize comfort, support, and durability. Their innovative approach to footwear design has propelled the brand to become a leader in the industry, celebrated for its commitment to empowering athletes to achieve their best.

The brand’s mission, “fly over the earth,” reflects its vision of creating shoes that inspire confidence, enhance performance, and adapt to diverse terrains. With a growing global community of enthusiasts, HOKA continues to redefine the standards of athletic footwear, focusing on innovation, quality, and inclusivity. By prioritizing user needs and delivering exceptional products, the company has earned a reputation as a trusted name for athletes seeking footwear that performs as well as it inspires.

"Innovation is the Hoka brand’s top priority, continuing to develop groundbreaking products that energize consumers around the world."
— Dave Powers,
CEO of Deckers Brands

The Challenges

HOKA’s platform faced significant challenges in delivering a seamless and intuitive experience for its users. Key tools, such as the Shoe Finder quiz and product comparison feature, were underutilized due to low visibility and poor design. Ambiguities in the quiz and limited functionality of the comparison tool hindered users from confidently making informed footwear decisions.

Navigation issues further complicated the user journey, with essential features difficult to locate, which negatively impacted usability and satisfaction. The platform’s user interface lacked intuitiveness, particularly for novice runners, while experienced runners found limited value in the available tools. These challenges underscored the need for design improvements to enhance discoverability, interactivity, and overall user experience.

Low Discoverability of Features
HOKA's product comparison tool suffered from low visibility, with 80% of users overlooking it during initial browsing. This lack of discoverability prevented users from fully utilizing the platform's capabilities, reducing its effectiveness in helping them make informed decisions.
Ambiguity in Shoe Finder Quiz
The Shoe Finder quiz contained ambiguously worded questions, which led to confusion among users. Many participants expressed doubts about the accuracy of results, especially when selecting “not sure” for multiple questions. This undermined trust in the tool, particularly for new users.
Poor Usability of Comparison Tool
The comparison tool was hindered by design flaws, such as a bulky dialog box that obstructed the view of other products. Additionally, the tool lacked explanations for technical terminology and did not allow users to modify their comparison lists, leading to frustration.
Ineffective Navigation and User Interface
Navigating the HOKA platform was cumbersome, with users struggling to locate essential features like reports or sizing guides. The overall interface lacked intuitiveness, failing to provide a seamless experience for both novice and experienced runners. This highlighted the need for a more user-centered design approach.

Project Research

We conducted project research by analyzing data from Mintel and Reddit to understand user preferences and behavior. Additionally, we performed a competitor analysis to identify strengths and weaknesses in similar platforms. By synthesizing these insights, we categorized the findings into distinct user groups, allowing us to better address the needs of novice and experienced runners. This approach provided a comprehensive foundation for enhancing HOKA’s product comparison experience.

Data from Reddit and Mintel

To understand sneaker wearers and their preferences, we analyzed data from Mintel and Reddit. This research provided insights into HOKA’s target audience and broader sneaker trends. Users prioritize comfort, price, and style when selecting sneakers, with additional factors like running type, brand loyalty, and durability influencing their decisions. Social media platforms, forums, and athletic communities were identified as primary sources of inspiration for sneakers. Many users favored competitors' websites over HOKA due to better usability, enhanced visual design, and intuitive navigation. These findings revealed opportunities for HOKA to improve its online experience and better align with users’ needs and expectations.

This data was collected through Reddit surveys and user responses, providing valuable insights into user preferences and behaviors.

The Mintel data study offered comprehensive insights into sneaker trends, user preferences, purchasing behavior, and factors influencing brand choices.

Competitor Analysis and Identifying User Groups

We conducted an extensive competitor analysis to understand existing tools for comparing shoes and products. Evaluating brands like OnCloud, Nike, Brooks, and New Balance, alongside platforms like Run Repeat and Amazon, we analyzed navigation, filtering, shoe finder tools, and product information layouts. This research highlighted best practices and user-friendly features.

Using this data, we identified user groups by assessing browsing behavior, terminology comprehension, and decision-making criteria. Insights from shoe brand and comparison tool competitors revealed essential improvements for HOKA’s platform, guiding design enhancements tailored to novice and experienced runners' needs.

Identifying and studying similar players in this market

Studied competitor features and identified target user groups

UX Audit

We conducted a comprehensive UX audit to enhance HOKA's platform. This included workshops and co-design sessions with novice and experienced runners to understand their needs and behaviors. A heuristic evaluation of the current app with users highlighted navigation issues, poor discoverability, and design inconsistencies. These insights shaped actionable strategies to improve usability and overall user experience.

Exploring Novice Runners (Workshop 1)

We conducted a workshop with six novice runners aged 18-22 to explore their shoe-shopping habits and decision-making processes. The session included three activities: drawing their ideal running shoe, ranking factors influencing their purchases, and mapping their journey from discovery to post-purchase. Participants prioritized support, price, and durability, with peers and research heavily influencing the early stages of their journey. Insights from this workshop provided valuable understanding of novice runners' needs and behaviors, informing design solutions tailored to their preferences. The findings emphasized the importance of comfort, appearance, and price throughout the shopping process, aiding us in crafting user-centric improvements.

Participants drew their ideal running shoe and ranked factors like support, price, and durability to understand their purchasing priorities.

We organized the participants’ ranked factors into the 5 E’s framework and created a graph to visualize their importance throughout.

Understanding Experienced Runners (Workshop 2)

We conducted a workshop with six experienced runners to understand their shoe-shopping habits, priorities, and comparison processes. Activities included journey mapping based on the 5 E’s (Discover, Explore, Engage, Purchase, Extend), comparing HOKA shoes with competitors, and ranking factors like fit, stability, and running type. Insights revealed experienced runners valued fit and feel most, prioritized quality over price, and relied on peer recommendations and reviews during decision-making. Participants preferred HOKA’s content layout but favored OnCloud for specific needs. This workshop, combined with novice runners’ insights, provided a comprehensive understanding of differences and similarities between user groups in shoe shopping behavior.

We conducted journey mapping using the 5 E’s framework and compared HOKA with competitors, analyzing participants’ decision-making criteria and preferences.

We created a graph mapping factors across the 5 E’s and analyzed workshop insights, visualizing overlaps in a Venn diagram.

User Interviews and Heuristic Evaluation

We conducted in-depth user interviews and heuristic evaluations to identify usability issues and opportunities for the HOKA platform. Participants included novice and experienced runners who evaluated features like the Shoe Finder quiz, comparison tools, and product pages. Key pain points included ambiguous wording, low discoverability of comparison tools, and insufficient terminology explanations. Insights highlighted opportunities for visual clarity, interactive elements, and peer influence integration. These findings guided design improvements, focusing on novice runners’ needs while enhancing usability and decision-making processes across the platform. The heuristic evaluation provided actionable insights into navigation, consistency, and user control to optimize the overall experience.

We conducted a heuristic evaluation of the website, categorizing participant feedback into key headings for targeted analysis and improvements.

Ideate and Sketch Sprints

We transformed research insights into actionable design recommendations by conducting team sketching sessions, starting with "Crazy 8s" exercises. Each team member sketched eight ideas based on findings, focusing on improving HOKA’s website usability. Sketches addressed key themes like enhancing tool discoverability, visualizing shoe strengths, and explaining terminology. We grouped similar ideas into categories such as comparison tool layout, shoe finder modifications, and filter additions.

With limited time, the team voted on the most impactful solutions for novice runners, refining and iterating upon these ideas. The selected designs served as the foundation for wireframes and mockups.

During Crazy 8s sketching, we rapidly brainstormed creative solutions, generating eight innovative ideas per participant to enhance HOKA’s user experience

Final Design Recommendations

We transformed the home page experience by integrating a dynamic Shoe Finder Tool, ensuring users can easily discover their ideal footwear right from the home or search page. The comparison tool underwent a complete overhaul, delivering an intuitive interface for seamless product comparisons. On the Product Details Page, we incorporated the revamped comparison tool and added clear explanations for terms, enhancing clarity and decision-making for users. Additionally, the Shoe Finder Quiz was redesigned to be more engaging and visual, utilizing interactive elements and imagery to make the process both fun and efficient. These updates collectively improved user engagement, streamlined navigation, and elevated the overall shopping experience, aligning functionality with customer expectations.

Landing Page and Search

We redesigned the landing page experience to enhance usability and visibility. The Shoe Finder Tool was added as a prominent CTA in the hero section, reducing page length for better navigation. Additional entry points, like a mid-page banner and a persistent footer presence across pages, increased accessibility. Visibility was further enhanced by incorporating the tool into the search page, ensuring users could easily discover and use it.

Current Experience
The current home page experience is overly lengthy, with the Shoe Finder Tool placed at the bottom, causing users to miss it. Additionally, unnecessary clutter hampers navigation and usability.
Revamped Experience
The revamped experience prioritizes user engagement by featuring a Shoe Finder CTA prominently in the hero section. The page was streamlined to reduce length, with an additional Shoe Finder banner mid-page and a persistent presence in the footer across all pages. To further enhance visibility, the tool was also integrated into the search page.

Product Listing and Comparison Tool

The redesign process involved identifying usability pain points through user research, such as missed features and limited functionality. Iterative design sessions focused on enhancing button visibility for "Add to Cart" and "Compare," introducing a search feature for the comparison tool, and refining its layout. User testing validated these improvements.

Current Experience
The current product listing and comparison tool experience lacks usability. Users often miss the comparison tool, there's no add to cart button on the listing page, and no functionality to add or remove items from the comparison tool seamlessly.
Revamped Experience
The revamped product listing and comparison tool experience enhances usability significantly. We prominently added "Add to Cart" and "Compare" buttons on the listing page, making them more accessible. Users can now search for products directly to add them to the comparison tool, streamlining the process. Additionally, the comparison tool layout was redesigned for better clarity, improving navigation and facilitating more informed decision-making for users.

Product Detail Page

We redesigned the Product Detail Page by simplifying its layout, adding a comparison feature, providing clear explanations for technical terms via info icons, and organizing content intuitively, ensuring an engaging, user-friendly experience for better decision-making.

Current Experience
The current Product Detail Page is lengthy, lacks a comparison feature, uses technical jargon without clear explanations, and has a cluttered layout, making it challenging for users to navigate and understand.
Revamped Experience
We revamped the Product Detail Page by introducing a comparison feature, enabling users to evaluate options side-by-side. To simplify technical jargon, we added info icons with detailed explanations, ensuring clarity and accessibility. Additionally, we decluttered the layout, organizing information into easily consumable sections. These enhancements improved user experience, making the page more intuitive and user-friendly.