Carewell
Redesign, New Feature, Graphic Design
Project Overview
Carewell has contacted me to expand and redesign their checkout process capabilities on their website. Carewell is an e-commerce company focused on selling caregiving products and home health supplies in the U.S. They want to launch a new feature that allows customers to reorder seamlessly without needing to go through the formal checkout process. The goal of this initiative is to increase customer and revenue retention
Role
UI Designer
Tools
Sketch
Figma
Miro
Marvel
Timeline
2 Weeks
Challenges
  • Design a new simplified reorder feature that embeds with the current website and emails
  • Redesign Carewell's checkout flow to minimize steps and increase efficiency
  • Redesign Carewell's confirmation page once the order has been placed
Solutions
  • Design a reorder email template with graphics that Carewell will send to previous customers
  • Use Carewell's current branding to redesign their checkout flow  

Design Process

1. Research

The focus of research is to gain a better understanding of Carewell's target market and empathize with the consumers to create an easy reorder and checkout process.

I started by writing a research plan and listing the goals/questions that should be answered:

1. Who are Carewell's competitors?
2. How do Carewell's competitors reorder email look like?
3.  Who's Carewell's target demographic?
4. When choosing products, what impacts users decisions?
5.  What factors influence a users decision to choose where to shop for incontinence products?

Market Research

I began by doing secondary research about the market and how Carewell's competitors have solved and implemented their reorder emails and checkout flow. Then, I created a competitor analysis to list what's currently available to customers and gain insights about industry trends.

The competitors make the reorder function simple with minimal steps to increase efficiency. They send out emails reminding customers to reorder items that are placed in their bag for checkout. Then, the user can checkout fast because all the information from their previous order has been saved. When interviewing Carewell users and the Carewell team, these insights helped me ask relevant questions about reordering products and the checkout process.

User Research

I interviewed 7 participants who fit the target customer to gain an understanding of the users experience reordering and checking out using the Carewell site.

The goal of this research was to find users pains and gains while going through the checkout process. To empathize with the target user, I also researched the user group demographics to design a usable flow specifically for them. Since 80% of users are not tech savvy, it was extremely vital to design a simple and easy user interface.

User Persona

Based on research and insights, I created a user persona of Carewell's key audience to address the major needs and pain points of the user group.

Since the user knows what product they like, and need the product every so often, adding the email and reorder function was imperative.

Here is Nancy who is an embodiment of Carewell's target user. She is a caregiver for her husband and herself. She needs an easy reorder reminder message to efficiently order products but doesn't want to start autoship because of her limited home space. She wants her shipments to arrive at her home on time and likes having emails notifying her when they are arriving. Having Nancy as my persona helped me hone on my target audience's needs to find solutions to their problems.

Key Takeaways

During the research phase, I learned about caregivers and the frustrations they face when finding products for their loved one. When it comes to incontinence, everyone has their product preference. Caregivers must efficiently be able to reorder previous products. In order to effectively implement the reorder email and checkout flow, I researched the competitors. I was able to get inspiration by viewing different email templates for reorders and checkout flows. Then, I interviewed users to uncover any pain points when reordering or checking out on the site. This led to creating the user persona that forced me to think like a caregiver.

2. Define

During the define phase, I synthesized all the data I have collected during the research phase to define the core problems that were identified up to this point to find a solution.

Task Flow

I created two task flows to show how a user could go through the reorder and checkout process.

The first task flow describes the user receiving the reorder email and going through a one-step checkout flow. The second task flow shows the user receiving the email and wanting to edit the cart.

This allowed me to create a one-step checkout where all the user information would be shown, while the full checkout would show all the full steps the user would go through when checking out. This would help Carewell update their checkout flow completely.

Key Takeaways

During the define phase, I used the insights found in the research phase to create the task flows. The first task flow is the process of reordering directly from the email all the way to checkout. The second task flow is adding those objects to your cart and editing your checkout information. This assisted me in prioritizing the pages that must be designed.

3. Design

After the define phase, I integrated my findings and designed wireframes based on the task flows.

Wireframes

I created multiple wireframes and worked closely with the Carewell team to make iterations. I made the email look somewhat like a Carewell receipt with the CTA below. I added all the information that the user would need to know before checkout such as the products, quantity, payment, and billing information.

For the one step checkout flow, I listed all the information that was needed for the user autofilled from their previous order. I created visual hierarchy by increasing the labels of each box of information. Therefore, the user can quickly see the label and information inside before checking out. I tried to keep all information organized and simple with only relevant information to not overwhelm the users.

For the full checkout flow, I kept it clean and simple. I used drawers where once users input information the drawer closes showing the information. Once the drawer closes, the next drawer opens and so on.

Key Takeaways

During the design phase, I used Carewell's email template and checkout flow to sketch the new flow. I sketched many ideas of each page in the task flow and sent them to the Carewell team for feedback. Once I received feedback, I designed mid-fidelity wireframes to create the prototype for testing.

4. Test

Prototype

After designing the wireframes, I used Marvel to develop the prototype for testing.

Usability Test Plan

I interviewed 4 participants who fit Carewell's target audience to find insights and pain points to improve the usability of the design.
Insights:
  • The users went through the prototype with no errors
  • The users mentioned it was a simple and efficient checkout process
Next Steps:
  • Iterate last details for the design

Final UI Design

I incorporated all my findings from the usability test and affinity map to iterate and finalize the UI design. If I were to continue, I would try to increase usability by performing additional tests.

Key Takeaways

During the testing phase, I was able to test the design for its usability. The tests allowed me to watch the user go through the design flow to find any errors that were made that could be fixed. I created an affinity map, based on the feedback I received from the usability tests and Carewell team. Then, I prioritized any pain points the users had and list the next steps to further improve the design.

Conclusion

Working with Carewell’s existing website allowed me to understand the choices they made, and build onto that process in an additive way. Throughout the case study, it was challenging to keep in mind Carewell's existing brand guidelines and goals while redesigning. I had to make sure everything flowed well with their current emails, graphics, and website. I enjoyed working closely with the marketing and engineering team because we were able to give each other valuable insights and feedback that enhanced our final work. Although I learned an immense amount working with the Carewell team, I faced many challenges throughout the decision process. Having a boss led to changing my design even if our opinions differed. It taught me the benefits and difficulties I may come across when working with teams. Overall, I was able to enhance my communication skills and practice working with others to create an ideal user interface for Carewell's customers.
Preview of Prototype