Background
PYRAMID planned to expand their online product offerings by up to 80 percent in Q1 2022 through a merchandise partnership with Printful. Merch is a novel product category for PYRAMID â having only sold the occasional T-shirt in person previously â which would additional space in navigation to accommodate it.
Coincidentally, our product roadmap contained a major website update, Ochre 3.0, scheduled to release in late December. This update added support for Shopify's Online Store 2.0, boasting improvements in speed, customization and accessibility. It also brought the site into full compliance with Ochre, PYRAMID's design system.
Ochre 3.0 centers around building foundations to compete in a future of hybrid fitness services. Information Architecture is incredible important we categorize, label, and arrange our pages and products determines how easily customers can complete their jobs to be done.
The previous navigation arrangement was the result of an open card sorting study that I had conducted in 2018. Due to membership churn and new product introductions, those findings were no longer valid and new research needed to be done.
Planning
To definine the problem space, I ran a stakeholder workshop to define:
-
Business goals relevant to the project,
-
Learning objectives - information that would help to achieve those goals.
From there, I converted those methods into testable research questions.
Before selecting a method, I wanted to take advantage of the opportunity explore Information Architecture research methods. I read this article from UX Matters on IA methods, and selected chapters from Peter Morville and Louis Rosenfeld's book on IA for the web. Initially, I expected to approach these research quesitons with a tree test, followed by a generative method in the event of disagreement. Instead, I found the approach of using a hybrid card sorting method to be a more efficent way of answering generative and evaluative questions at once.
Before executing research, I shared a Notion document with my stakeholders containing a brief background, a kanban board of research methods to indicate progress, and a section for scripts and deliverables. My goal when writing research plan is to provide stakeholders a skim-able overview of what I'm doing and why I'm doing it. More depth can be saved for the reporting process.
Methodology
To reach a correlation coefficient of 0.95 in a card sorting exercise, I followed Tullis and Wood's recommend sample size of 30 participants â all members who had visited PYRAMID's website in the past month. Taking advantage of my location, I recruited participants as they entered for their workouts, having them complete the study when they finished in the club's lounge.
Participants were presented a two-column FigJam space, pictured below. Participants dragged cards representing products from the left column into the appropriate row representing its navigation category. If participants felt that a card did not match any category, they could place the card into a miscellaneous category at the bottom of the column, where they could suggest a better navigation label.
The navigation element Karate was omitted as a row from this exercise to evaluate whether participants placed Keystone Karate Memberships in Sports or Memberships. A consensus among participants would warrant us removing Karate as a navigation category, given its relatively narrow scope.
On average, each participant took about five minutes to complete the exercise. When they finished, I gave participants the option to explain any choices or share anything that they found confusing. Importantly, such feedback led to our offering participants a mouse in later exercises, after a participant shared that they struggled to use a trackpad.
Synthesis & Analysis
To understand the relationship between arrangements, I placed each product on the first column of an Google Sheet, and each product category on the first row. I calculated the frequency of each product appeared in each category, and calculated its relative frequency. When evaluating the relative frequencies, products that lacked a 0.7 frequency in one category were considered to be out-of-place. From there, I was able extrapolate a few relationships about the previous navigation structure:
-
Sports is too broad of a category to offer a strong information scent. The previous navigation structure used Sports as a catchall for Sports Rentals, Sports Training, and Sports Camps. Participants disagreed on whether to place Sports Training into Sports or Training, suggesting that Sports as a category lacks information scent.
-
Users do not classify Karate as a sport. Without a self-titled parent category, participants disagreed with one another over whether to place Karate as a sports product or as a membership. This, on top of our Karate program being offered by an outside company, suggests that Karate should occupy its own category.
-
The final word in a product title determines its placement. Items with the strongest information scent included Individual Fitness Memberships and Family Fitness Memberships, located in the Memberships category.
Ideation
Before determining how navigation elements would be placed, I created an affinity diagram to categorize products in line with new findings. Since the amount of categories warrented a two-tiered navigation bar, I worked with stakeholders to identify which categories belonged in primary vs. secondary navigation.
I envisioned a static secondary navigation sat on top of a sticky primary navbar. Hierarchy would also be expressed with color/contrast and font size.
Final Product
I developed the final product using Liquid and pure CSS for performance. The final product shipped in Ochre 3.0 on December 31st, 2021.