the company.
From the vision of livable luxury, Kashwere emerged. Their signature Chenilla™ yarn, utilized as the foundation for blankets and apparel, has become synonymous with superior quality and unmatched softness. Over the past two decades, the company has experienced substantial growth, establishing extensive distribution channels, notably in Japan. Renowned for their luxury bedding, Kashwere products are sold in boutiques, spas, and hotels worldwide.
the project.
During the project, I served as the Senior UX/UI Designer, collaborating with a Senior Product Manager, a Software Developer, and our Product intern. This case study delves into the redesign and revamp of the product detail page, covering the entire design process. My responsibilities encompassed the end-to-end process, including ideation, user research, usability tests, and UI design.
​
Explore, Define, Ideate, Deliver
goal - cart /checkout redesign.
The primary goal was to boost the sales conversion rate by providing customers with comprehensive information on the product detail page, facilitating informed purchase decisions. Additionally, the aim was to enhance website user engagement through the implementation of a modern, clean UI aesthetic. This design approach aimed to make it easier for users to delve into the brand and gather relevant information seamlessly.
the problem.
After noting a decline in Product Views to Add to Cart rates (ATC/PV) and Add to Cart to Checkout Start rates (CO/ATC) on our website, and having previously revamped our Cart & Checkout process, we opted to focus on addressing the diminishing ATC/PV trend. This approach allowed us to gather more data on the performance of our checkout before further adjustments.
tools.
the outcome.
The redesigned product detail page features a clean and modern layout, presenting all pertinent product details such as color options, sizing chart, price, ratings, and reviews. The content was curated collaboratively by the head of design in conjunction with the data team. To meet user preferences for more visual information, multiple photos of the product, showcasing different views and lifestyle settings, were incorporated. This approach aimed to offer a comprehensive and visually appealing experience to potential customers.
The updated product detail page with improved product photos, sizing charts and a clear path to the Shopping Cart.
The CTA "Proceed to Checkout" button opens the shopping cart overlay where users can see the product details, add a gift note and apply discounts to the purchase, while the rest of the page is darkened.
why did we update the detail page?
With an overhaul of the entire website in 2020, we had increased sales but still felt that the product detail page was missing important features and information. We conducted an audit and did user testing to ask users what they thought about the page when they were about to purchase an item. To address the declining ATC/PV trend we then decided to do a revamp of our Product Details Page and Add to Cart Notification for our new PWA websites to optimize the user experience and thus encourage more users to add our products to their carts.
original product detail page.
The original product detail page with very minimal information about the product and not within the Kashwere branding standards. We changed the layout and added a more modern feel to the page as well as important CTA buttons and banners.
how might we?
-
Make the product detail more clear to the user?
-
Provide enough info about the product so that the customer can make an informed decision to buy?
-
Show more lifestyle photos and possibly videos?​
​jobs to be done.
-
Job: Increase conversion rate
-
Related Job: Provide content about the product
-
Functional: Information / accessibility
-
Emotional: Buying comport for your family
-
Personal: Create an emotional connection to our products
-
Social: Sharable links, build traffic to the site
user research.
Interviews were conducted remotely via Zoom, with interviewees consisting of a wide range of Kashwere customers selected by loyalty tier type (i.e. avg spend with us), age group, and location/primary website used to get a wide diversity and a good representation of our main + future strategic users.
​
Interviewees were given different scenarios, with the main task involving making a purchase from Kashwere by going through the website, particularly the Product Details Page and voicing out their thoughts as they went through their onsite user journey. A set of questions were also asked towards the end of the interview, relating to the general Product Details Page feedback.
affinity mapping.
findings.
user persona.
journey mapping.
competitor websites.
We started out with competitive analysis for our research. Our problem statement for this part of the research process was to observe competitors’ UX best practices to understand the differences between our PDP experience and theirs, thus learning the possible reasons for why users might be dropping off from our Product Details Page, and to gain inspiration for new ideas we might like to test within our own PDP enhancements.We researched the 2 most popular luxury spa websites, Barefoot Dreams and Sunday Citizen. We analyzed the product detail pages on both sites to see how they were using the information architecture and Heuristic Evaluation.
findings.
barefoot dreams
-
Add to Cart notification pops up all the way at the top of the screen, making system status visibility of having added a product to cart difficult for the user
-
A lot of scrolling is required to see relevant Product Information needed to make a purchase
-
Delivery & Returns policies are difficult to find, as well as the check in store availability feature
-
Image takes up close to 80% of the screen space — showcasing a non-efficient use of space
-
Product zoom feature is not very intuitive, users have to change from scrolling horizontally to vertically
sunday citizen
-
Clear details’ sections allow for a more structured Product Details Page viewing experience
-
Easy,visual color and size selection options could allow users to make less mistakes when adding products to cart
-
Shipping & Returns policies that could be viewed directly on PDP would help make the process of finding this information more efficient
-
Loyalty Benefits information directly on PDP might lead more users to convert
-
“Complete the Look” & “Recommended Products” blocks allow for added CR
-
Product Reviews help to build trust and allow users to gauge sizes better
-
Fit Module could assist in addressing sizing & fit concerns
sketches.
Sketches were done in the Crazy 8s technique to brainstorm and generate ideas quickly. For this exercise, I selected the “product detail page” and "shopping cart" overlay screens. This screen needs to have all of the information a user needs to make a decision to buy so it is very important to have it be accessible and responsive with a large CTA button that is easy to navigate.
​
wireframes.
From there on, we started to create the wireframes that would meet the requirements of the changes we wanted to make. This step was a collaborative effort to ensure we have the best layout in mind based on our findings.
ui design.
visual icons.
The info icons were created to originally sit on the product detail page but were moved to the main page. We tried several options of care instruction icons before landing on these that were Kashwere brand appropriate.
kashwere website.
After we have settled on the final designs, it was finally time for implementation! During this step, a lot of collaborative effort was also required to ensure the developed solution functioned well, and met design requirements. Below is a snapshot of our current live website with our new designs implemented.
Click to visit Kashwere.com.
e-commerce Amazon store.
After redesigning the checkout experience on Kashwere.com, we shifted our focus to optimizing the Kashwere Amazon Store. Our goal was to ensure that customers can easily find and purchase the products they are interested in.
Click to visit Kashwere's Amazon Store.
gift card at checkout.
Adding a gift card a checkout was added to ensure that the customers can now give the gift of Kashwere to anyone at anytime.
usability testing.
test & validate
I interviewed 6 users who have purchased on Kashwere.com within the last year. We met virtually for 15 minutes intervals. I asked the participants to share their screen as they clicked through the new product detail page prototype. I wanted to see how they navigated through specific tasks and ultimately purchased something through that page. Participants had 3 user flows that they were tasked with.
findings & discovery.
-
4/6 Users liked the updates, they felt it was easy to checkout and liked the overlay of the shopping cart screen.
-
3/6 Users either wanted to see videos or 3D views of the products to be added to the product detail page, as that would help to see all angles of the item.
-
6/6 Users easily made a purchase within the 15 minute interview, including adding shipping and credit card info to the site.
outcome.
press.
Getting press is always fun, Kashwere is featured on lots of amazing platforms including Opera's Favorite Things, Bazaar, Refinery 29, etc...
reflection.
In retrospect, key improvements could involve conducting additional rounds of user testing for enhanced design decisions, balancing it with team capacity, project deadlines, and budgets. It's crucial to establish robust data tracking metrics before implementing UX changes, ensuring a confident evaluation of the impact on various aspects, including clickthrough rates, task completion, qualitative feedback, and conversion rates.
Despite these considerations, I'm pleased with the project's outcome and anticipate valuable feedback and trends, providing opportunities for further enhancements.