Improve Work Smart Enjoy Life's e-commerce website.
E-commerce sites for baby items often lack important product information that parents need. How might we organize WSEL's product information so users can easily locate and understand key product information?
We conducted user interviews with 10 participants, 5 moms and 5 dads, all of whom were recent parents and had at least one child under the age of 5. We noticed major behavioral differences between moms and dads when shopping for baby products. As a result, we broke down our insights into two distinct groups: moms and dads.
We conducted a heuristic evaluation using the Abby method to identify usability problems in Work Smart Enjoy Life's current website. The website scored significantly low on two principles: clarity and usefulness.
The website's product descriptions are long and wordy, making it hard for users to want to read. In addition, the font size is too small, making it even more difficult for users to read. It lacks key product details that are important to the value of the product.
Under the product page's description and customer reviews, there is a blue list of the product's key features. Although this information is important and highlights the key functionalities of the product, the descriptions are verbose and difficult to visualize.
We created a persona of a mom to embody the insights we discovered from our user interviews. All of the moms we interviewed said they wanted a full visual understanding of the product and were involved in parenting communities. As a result, we decided to embody a mom rather than a dad because moms are more involved than dads in purchasing baby products.
Next we created a journey map to depict Marg's experience shopping for baby products online. Creating Marg's journey helped us find areas of her experience on WSEL's website that we could improve.
Marg wants to see pictures, videos, recordings, and reviews of the product. When ideating the design for this page, we knew we had a lot of information to fit on a small, mobile screen. Initially, we created an accordion menu for the Features, Dimensions, and Material. But during our design studio for the website design, we created with a better solution: a toggle switch of the product image with important information about the features, dimensions, and material.
One of Marg's greatest needs when online shopping for baby products is detailed information — product material, dimensions, and the different ways the product can be used. For the Product Page, we came up with a toggle function that shows the different product details (Features, Details) on one product image.
When conducting usability tests with participants, we found the following:
Overall, the Features and Dimensions toggle function was a success because users were able to find it, play around with it, and understand the information that it displayed.
A site's online shopper is typically the same person that uses the site's products. For Work Smart Enjoy Life, a diaper bag shop for dad, we found that this was not the case; dads rarely did the research and shopping for baby products. By basing our design ideas on a mom shopping for her husband, my team created a detail and concise website design that provides the information that moms need to make a purchase.