Company
Kinship/Wisdom Panel
Year
2022
Type
Web UX Design
Wisdom Panel Store
Wisdom Panel is a DNA test for dogs and cats. Upon joining the team, I leveraged my skills in marketing design to design ongoing additions to the DTC site. These site updates continued on a rolling basis, evolving based on product additions, site tests, and user feedback.
Role
In my role as the lead designer for the Wisdom Panel DTC store, I analyzed the conversion data and site activity map, collaborating closely with the marketing team to gain a comprehensive understanding of user behavior on the store's website. Based on these insights, and in close consultation with the marketing team, I utilized various usability techniques to create a fresh, new card style for the product wall.
Goals
Emphasize "Premium" product. Improve mobile conversion. Revitalize the product wall. Include new module to offer bundles/multipacks. Evolve UGC module. Make user reviews filterable. Add new SKU to product wall.
Mobile First
To make the shopping experience even better, we suggest expanding the selection of products and bundles that we offer to our users. Our top priority, however, is to ensure that our website is mobile-friendly, so that users can easily access and navigate it from their phones. By optimizing the mobile experience, we can create a more convenient and enjoyable shopping experience for our users.
Design System Update: Cards
Cards are information containers that can hold a single piece of info or a group of related info. They're great for organizing content and creating visual distinctions between different types of data. Plus, they make it super easy for users to quickly scan and understand information in an intuitive way. So, we use cards to make sure our users get the info they need in a snap!
Updated Product Wall Cards
New SKU Alert 📣
We successfully resurrected our breed-only product as a revenue-boosting strategy. It was an all-hands-on-deck effort that required extensive collaboration and coordination across multiple departments to add this product to our lineup.
Challenges
The project had a highly demanding timeline, frequently changing objectives and priorities, and required extensive collaboration with senior executives to achieve its objectives.
Goals
Increase revenue among product lineup, launch before amazon prime day.
Ideations
Incorporating a new SKU into our product line required us to balance the need for a comprehensive product description with limited space. We opted to use only the most critical language and investigate strategies to offset the visual impact of a new product card. Our testing showed that a carousel solution worked best for mobile users, while desktop testing encouraged us to experiment with our tab component and explore new ideas
Mobile Carousel
Tabbed product wall exploration 01
Adding tab component
Tabbed product wall exploration 03
Adding species pictogram
4-Up product wall exploration
Tabbed product wall exploration 02
Adding species icon
Even More Ideations
Solution 🥇
Following multiple rounds of testing and close collaboration with the marketing team on the product copy, we settled on a tab-based solution that would enable further evolution within our design system. As we added a fourth product to our lineup, a dog testing kit, I began exploring the possibility of categorizing our products by species with separate tabs for dog and cat items. This approach provided clearer differentiation between the products and allowed for connected dog products to be displayed together for easy comparison
Compare Products Page
An additional page requested from the marketing team was a refreshed compare products page. This gave me an opportunity to update our table component with new guidelines for typography and including iconography. For mobile, I explored a solution that would keep the products themselves sticky at the top for reference while scrolling and comparing the table below.
Additional Store Updates 😻
These updates to the store were a part of an ongoing evolution of the site. I closely collaborated with marketing on a weekly basis to understand new goals and ideate unique solutions.
Bundles / Multipacks
Solution for site module offering bundles/multipacks for discounted purchase.
Instagram Carousel
The previous version of our UGC Instagram carousel was lacking clarity (as revealed in user testing). To evolve, I looked at ways to modernize the carousel experience and include points for product purchases within the expanded overlay.
Original Design
Updated Design
User Reviews
Redesign for the home page user reviews. Added additional filters for sorting reviews (sort by: Average rating, time of review, etc..)
Key Learnings
Flexibility & Adaptability
The ongoing care and evolution of the DTC Store required consistent check-ins and collaboration with the marketing team. Adding a new SKU was a hot-ticket item that had a surprisingly short turnaround time to meet a sales-related deadline (amazon prime day).
Because of the urgency, communication streams between dependent departments needed to be clear and purpose-driven. All of this contributed to a refreshed sense of flexibility and adaptability to meet the goals of the invested stakeholders.