PDP & Ecomm
An ecommerce site redesign to make product discovery more efficient and elegant — Journey-driven design / Visual design / Ecommerce site / Food & beverage / Content design
Overview & Goals /
Building a place for community, storytelling, and external discovery
Focusing on the first-time context, we wanted to reach beyond early adopters and learn how different framings influence reception and choices around food. We understood the barriers to entry and the challenges around not being able to taste the food. Strengthening the brand to build emotional connection, we began to invest further in content development which would also aim to boost SEO and organic traffic.
Individual contribution—
Subsite design system / Expanded design language / Module library / Cross-platform template design
The journey-driven approach to a site redesign was anchored by PDP explorations—a content-rich page which had been long forgotten for experimentation and evolution.
User Background /
Using a new and different strategy to demonstrate brand and product value
DH was really great about collecting and interpreting data on a regular cadence. It was through these regular touch points with the data team that we learned the importance of “getting it right” the first time. Orders one through four proved precious as the churn rate was especially high during this early LTV phase. Often, people would order once then never come back, swearing that they didn’t like the food or that they couldn’t see the value. However, it was more likely that people just weren’t choosing the right food to begin with—a shortcoming of a product that didn’t provide enough valuable information or guidance to discovery.
Top / A menu and navigation approach which includes new positioning and editorial concepts Bottom / A macro view of all high-fidelity templates to understand overall evolution.
Process /
Setting up a strong foundation for longer-term content development
Based on our engineering capacity, the PDP would be the first thing to be designed and built. It was always thought of, though, as one part of a larger journey of discovery within the conversion funnel and marketing site. There were two parts to be tackled to make the PDP effective—the first opportunity existing on the product overview page and the second being the content of the PDP itself. These two parts would work in concert to ensure that the right content would be discoverable at the right moments.
Top / Content strategy concepts which lean into users’ top-ranked decision makers. Bottom / Ecomm concepts which would dial up transactional moments within an editorialized layout.
Business & Design Challenges /
Mismatched priorities leading to difficulties in approval and launch
The business and design challenges for this project were all internal. Teams working in silos. Long and arduous approval processes. Interdependencies which prevented design and product from moving forward. In comparison, the visual design and content strategy problems were easily solved. The collaboration with brand and creative and subsequent approvals by those teams were considerable feats. An added unfortunate outcome is that these internal struggles would push out our data and feedback collection quarter by quarter. In the meantime, design was able to experiment with new design and visual treatments which would push the brand.
Nutrition highlights create a design and typography moment for data that is normally buried.
Solutions & Outcomes /
Turning the focus to other priorities to better align with business initiatives
Over multiple quarters of work and collaboration, design was able to propose a new approach to PDPs as part of the larger multi-step browse and checkout experience. As part of our rollout, we planned to launch an A/B test across screen sizes which would give us signals of the influence of PDP content in relation to the ultimate goal of transaction.
Top / A concept for a How It works page to address subscription confusion. Middle / A concept for an All Collections page. Bottom / A concept for a single Collections page.