2021
2 Weeks
UX, UI, Product Design
UX/UI Designer
-min%201%20(1).png)
Due to the pain points in Octavia Books' website, my goal was to understand what motivated customers to purchase from independent bookstores over national retailers. Using those insights, I set out to enhance the purchase experience for users and boost online sales for the business.
The online shopping experience at Octavia books leaves customers overwhelmed and confused. Often they are unsure if they are even able to purchase books through the website. Loyal customers are interested in continuing to support their local bookshop over large national brands, but the inconvenience is often too great a barrier.
Display information on the website so that it simply and clearly communicates how to purchase books and support the store, and allow users to interact with the site in a way that mimics the experience that they love while browsing the stacks in a local bookshop.
UX research, UI design
My initial goal was to understand who the users for online bookstore websites are, and what their attitudes are towards purchasing books online. Once I identified the target user, I wanted to learn more about their behaviors purchasing books online, particularly from an independent bookstore website and how that may differ from the purchase experience at a national online retailer. Finally, I wanted to determine how users behave when purchasing on the Octavia Books website and observe possible pain points in the experience.
What type of consumer purchases books at local shops?
How do users interact with the existing website?
What are users current pain points with the existing website?
Which features are essential to purchase books?
I initially conducted a screener survey with 30 participants in order to gather information users who prefer to purchase books from local book retailers' websites.
I was able to interview six respondents about their experiences purchasing books from independent bookstores, their attitudes towards independent bookstore websites, and their motivations to choose local bookstores over national retailers.
Contextual inquiry participants disliked the long scroll to see the books on the bestsellers list or potentially gain information from the footer, where users felt it would be intuitive.
There was very little sense of visual hierarchy due to most of the text on the page being the same size, and these factors contributed to high cognitive load.
Some users became unsure if it was even possible to purchase books on this website due to difficulty finding information on the page. In addition, features like the cart were placed outside of their typical pattern, causing confusion.
Competitive analysis was conducted to identify competitor's strengths and weaknesses to inform Octavia Books' features and information architecture.
After conducting user interviews and contextual inquiry, all the participants responses were synthesized to identify themes, opportunities, and features that Octavia Books could focus and improve upon.
A persona was built based on the data collected to help drive decision making and keep the product focused on solving users pain points, frustrations, and goals.
.jpg)
To kick-off the design process, user flows were established to understand the ideal path to lead to conversion. Improved sitemaps were established to create information architecture in line with the product goals, and finally a low fidelity prototype was created for initial user testing.
The primary user flow is the process of searching for and purchasing a book.
I conducted an open card sort with 15 participants in order to gain insight into how best to group menu items and reduce text on the home page. This information was primarily useful in understanding what users considered a genre and what they considered.
Using the feedback and insights gained from research, analysis and sketching, a how-fidelity prototype was created to begin user testing. showcasing curated collections front and center on the homepage would convey the unique qualities that people love about Octavia Books while allowing them to discover titles that they might not have come to the site for. In addition, I made sure that upcoming events were featured prominently to highlight the community focused operations of the shop.
.png)
I set out to test the first iteration of my prototype in order to confirm that users found the basic functions of the site intuitive. Users were prompted to complete three tasks: find the most popular book in the store that week and purchase it, learn more about an upcoming book signing, and contact the store about an order.
Divergences from common UI patterns caused confusion in checkout process
Users expected a pop-up to denote that the book had been added to their cart, and in this iteration they were taken straight to the cart.
Some of users preferred paths were not yet prototyped in this iteration, such as the ability to browse by genre.
Further simplify landing page layout
Simplify checkout process
Change the layout of the book page to promote increased conversion
This redesign seeks to make the process of browsing local books, saving them for later, and purchasing them simple and engaging. It allows people to view curated categories specific to Octavia Books, recommends new books based on author, and streamlines the checkout process.
Homepage immediately highlights features that users were most interested in engaging with
.png)
Users can browse the various categories that make Octavia Books a unique local institution
Cleaned up checkout flow to make the shopping process clear and simple
Customers are able to engage with the store through book purchases as well as finding out about local events
Integrates all needs into one streamlined experience
Suggests new books to read in order to increase revenue
Supports community building and engagement
Highlights the unique local bookstore experience
Gives users more options to browse various categories
Provides a source of reputable recommendations from bookstore staff
While I believe that the current iteration solves many of the user problems presented in the research phase, the next iterations could improve upon this design in the following ways:
In this design process, I learned that there are times in which people want the online experience to reflect the things they love about going through their day. While tech giants are often seen as the gold standard in their field for efficiency and features, people who shop at independent bookstores are actively seeking an alternative to a more corporate feeling, and want their online shopping to reflect that. I'm interested in the ways that this could be applied more broadly to a wide variety of online experiences amid people's changing desires for connection and community.
.png)