navigate_before
navigate_next
Header Image for emotQuest: iPhone Mockups. Soap & Prose Title Image Header Image for Urban Warrior: iPhone Mockups.
arrow_back

Soap & Prose

Book-Inspired Handmade Soap Shop // Conceptual Project

Duration
  • 6 weeks
Platform
  • Responsive
Tools
  • Adobe XD // Photoshop
My Role
  • UX Designer // Project Lead
Soap & Prose Title Image

Project overview

Soap & Prose is a fictional e-commerce platform that offers handmade soaps with fragrances inspired by books. We aim to make our products’ purchasing experience as enjoyable as the products themselves.

We prioritize beauty and simplicity and cater to customers who appreciate books and novelty.

Soap & Prose Logo
Product Screen Mockups for Soap and Prose on Desktop and Mobile

The Problem

Limited Scent Experience //
  • Customers hesitate to order bath products online as they cannot test aromas beforehand.
  • The absence of a sensory-rich experience hinders customers from discovering new and captivating scents, limiting their potential engagement and excitement with the products.
Online Purchase Apprehension //
  • Customers are hesitant about return and refund policies, worrying about losing money and feeling let down.
  • Customers need more information about handmade soaps to make informed purchases, including scent profiles and ingredient details.

The Goal

Create a sensory-rich environment for online shoppers to explore fragrances that match their literary loves. Offer a transparent return and refund policy for risk-free shopping.​

Log In Screen Mockups of Soap and Prose on Desktop and Mobile
My Responsibilities
  • UX/UI Design
  • UX strategy
  • UX Researcher
  • Art Direction
2
WKS of Research
1
WK of User Testing & synthesizing
4
WKS of Prototyping

Understanding the User

I interviewed five individuals to gain a better understanding of my users. All of them shared an interest in bath products and enjoyed reading. Three had yet to try ordering bath products online; the other two were busy professionals.

After analyzing the data, I concluded that the target audience for my handcrafted novelty bath products is new customers who value a visually appealing purchasing experience.

Pain Points

Online Ordering //
  • Customers want to feel comfortable purchasing fragrant bath products online without smelling them in person first.
Transparency //
  • Ingredient transparency is desired for quality and feature assessment.
SUPPORT //
  • Customers want the ability to have their questions answered in a timely manner.

User Persona 1

User Persona Picture, Sami

Sami Al-Mansouri

After long hours in the lab, I enjoy relaxing with a book and a fragrant bath. However, I prefer to test scents before buying and wish there was an easier way to discover new fragrances.

AGE 31 // MS Biochemistry // Boulder, CO // Forensic Scientist

Sami works long hours as a forensic scientist. However, at the end of the day, she likes to unwind by reading and taking long baths. She enjoys experimenting with new bath products, especially those in themed packages. She is interested in purchasing bath products online but is apprehensive about the experience and process.

Goals //
  • To discover unique scents.
  • To buy confidently and know that her money won't be wasted if she doesn't like a scent.
  • To receive products on time and in perfect shape.
Frustrations //
  • To have to pay for shipping.
  • When there is a no-refund policy.
  • Lost orders or inaccurate tracking.

User Persona 2

User Persona Picture, Barnaby

Barnaby Wiggins

I crave refined indulgence to immerse myself in cherished literature. A bath with scents that evoke classic tales would be a true pleasure. I seek handcrafted luxuries that align with my taste and bring back memories of literary masterpieces.

AGE 62 // PhD English Literature // Oban, Scotland // Retired University Professor

Barnaby Wiggins is a retired University Professor and a lover of literature. In his free time, he enjoys relaxing and escaping into the world of his favorite books. Bathing is his way to pamper himself and unwind, but he has been disappointed by the lack of bath products with scents that match his tastes. He values unique and handcrafted luxuries and is searching for bath products that offer a touch of regal elegance.

Goals //
  • To indulge in a pampering bath experience for relaxation during retirement.
  • To find exquisite and evocative scents.
  • To support artisanal craftsmanship and unique products.
Frustrations //
  • Limited Time for Self-Indulgence.
  • Difficulty in Finding Plesant Scents.
  • Commercial brands flood the market in brick-and-mortar stores.

The competitive audit

I conducted a thorough competitive analysis of the online body-care industry, focusing on three direct and one indirect competitor. I evaluated several vital factors to determine how they impact my strategic goals and decision-making. Based on my research, I identified six key elements that will guide my project's development and unique positioning in the market.

Lush //

Returns

Free Shipping

Samples

Handmade

Eco-Friendly

Niche Scents

Bath &
Body Works //

Returns

Free Shipping

Samples

Handmade

Eco-Friendly

Niche Scents

The Body Shop //

Returns

Free Shipping

Samples

Handmade

Eco-Friendly

Niche Scents

Ulta //

Returns

Free Shipping

Samples

Handmade

Eco-Friendly

Niche Scents

The Results //

After conducting a competitive audit, I discovered a few significant findings. Firstly, all of my competitors have a liberal return policy, which suggests that my customers will probably expect the same.

I noticed that half of my competitors did not offer free shipping, which could add a significant cost to customers’ orders. This could make online shopping more expensive, as the cost of shipping could be equivalent to the price of another product or more. Moreover, my competitors did not utilize free samples to customers. On the other hand, I will focus on allowing customers to explore all the available scents of my soaps.

In addition, my analysis revealed that while various competitors used Eco-friendly packaging, only one provided additional environmental initiatives, such as recycling incentives.

In conclusion, only one competitor provided handmade soap and unique scents, contributing to their success and widespread appeal. These findings offer valuable insights that will aid in making strategic decisions for the future, allowing me to leverage my strengths and improve upon any weaknesses.

Defining the problem

Body care enthusiasts need a convenient and pleasant way to discover unique artisan soaps without the risk of losing money on a disappointing scent they didn’t get to smell in person because the soap options available at brick-and-mortar stores can be generic and bland.

Ideate

Soap and Prose Paper Wireframes Mockup
Soap and Prose Lo-Fi Wireframe of the product page mockup
Soap and Prose Lo-Fi Essential Screen Shots

Prototype

Low-Fidelity Prototype

I developed a basic prototype using the digital wireframes I had previously made. The objective of this prototype was to simplify the purchase flow, making it easy for users to navigate. To obtain valuable feedback and insights regarding its usability, I conducted a simple usability test.

Test

Usability Studies

I performed multiple usability studies to enhance the design, using a user-centered approach to achieve ongoing optimization.

ROUND 1 Findings //
  • Users want to be able to remove items from their carts easily.
  • Users wanted to be able to go back and forth between all pages quickly, not just the checkout pages.
Round 2 Findings //
  • Users expressed the desire to have more information visible above-the-fold.
  • Users felt they needed more labels for products on other screens.

Round 1 refinements

In response to user feedback, I improved the page navigation to make it more accessible and not dependent on the navigation bar. I also added the option to remove items or save them for later from the cart page.

BEFORE ROUND 1

Pre-usability Study Screenshot of the Cart page without back navigation and the option to remove items

Missing back button.

Missing "remove"
option.

After ROUND 1

Post-usability Study Screenshot of the Cart page with the back navigation and the option to remove items

Back button is present.

"Remove" option
is present.

Round 2 refinements

Based on user feedback in the second round of testing, I made some changes to improve the web design. Specifically, I shortened the hero images to ensure more information is visible above the fold. Additionally, I added a hover feature that displays the name of a product when a user hovers their mouse over it. These changes were made to maintain a clean and aesthetic design for our desktop users.

BEFORE ROUND 2

Post-usability Study Screenshot of the Home page with the hero image covering the whole screen.

The hero image
takes up the entire screen.

After ROUND 2

Post-usability Study 2 Animated Screenshot of the Home page with the hero image reduced size and hovering effects for product titles over product images.

Reduced size
of hero image.

Product name revealed
during hover.

High-Fidelity, post usability study 2 mobile screenshots of key screens: home, shop, product, cart, and checkout.

High-Fidelity Prototype

After the second usability study, the high-fidelity prototype presented a visually attractive and engaging process for purchasing products.

Considerations & Takeaways

Sweet, they let you schedule online. That’s my favorite thing to do because I hate talking to people. You can attend virtually too? That's awesome.

Accessibility Considerations
  • made the website easy to navigate for those who use screen readers by using clear fonts and font sizes.
  • Created a highlighting function when hovering over or clicking on linked images and form fields.
  • Utilized the Stark plug-in to ensure contrasts adhere to WCAG guidelines.
Impact
  • Based on the feedback from the usability studies, the website's visual design is appealing and complements the overall Soap & Prose branding.
What I learned
  • I learned how to balance users' desires and business goals while developing this app. It taught me about user-centered design and creating a product that connects with its target market.

Next Steps

Focus on refining the design, particularly the checkout process, and include a chat feature.

Consider conducting another usability study to identify potential new issues.

Conduct a usability study that primarily includes users who have disabilities that require alternative interaction methods in the study.

Thank you!

Header Image for emotQuest: iPhone Mockups. Header Image for Urban Warrior: iPhone Mockups.