Nextbook Online Bookstore
Responsive Web Design
UX / UI Case Study
About Project
Product
Nextbook is an online bookstore that combines the replication of an in-store experience with online social capabilities. Their selling point is to help users discover new books to read based on their interests and preferences.
Problem
Many bookstore websites have cluttered designs, a lack of filters, and many book suggestions that do not tailor to each user.
Solution
Create an intuitive, responsive website for users to sign up, create recommendation lists, and purchase new books to read.
Goal
Create a user-friendly interface that will help users quickly find books they want to read
My role
User research, wireframing, prototyping, visual design, low and high fidelity user testing
Duration
January 2022 - May 2022
5 months
At the start of the research phase, I conducted user interviews with 4 participants. I asked about their experience on their current go-to websites for purchasing books. I wanted to understand their habits, how they incorporated reading into their routine, the difficulties they were encountering, and features they would like to see added.
From there, I discovered that many users find bookstore websites overfilled with content causing stress in finding what they need. In addition, most of the displayed information was irrelevant to the users, and they wished for a simplified version.
On the flip side, research also revealed that many users like it when they are recommended similar books and from the same authors but wish for additional filtering. In addition, many target users also voiced that they like to go in-store to check out the books and wished online bookstores could replicate the same experience.
User research: pain points
Design
Current websites are too cluttered. It contains too much information that users do not care for. Many users want a digestible amount of content to speed up their ordering process.
Experience
The lack of an engaging experience makes it hard to keep users on the website for long.
Outsource
Users have to rely on other websites to seek suggestions and read reviews.
Details
Users become frustrated when there is a lack of description, synopsis, and a book preview.
Usability study: Findings
After conducting a series of ideation, I tested my design with 5 participants. I ran an unmoderated usability study to determine which areas of my design needed clarification or change. The insights I gathered were extremely valuable because the next step was to create a high-fidelity mockup with the data I had synthesized.
According to my findings, there were four areas for improvement.
Filters
Based on the insights, I added additional questions to understand further what books the users are looking for. Initially, it only asked about the genre and author. Since then, I have added the options to find recommendations based on their reading history, a specific book, mood, and storyline. Based on their selection, there would be more in-depth questions to dive deeper into their search. The goal is to provide the most relevant recommendations based on their interests. I have also split the questionnaire into multiple pages and removed the navigation to keep the user focused on their task.
Rating system
The thumbs up/thumbs down feature have confused the users. To eliminate the confusion, I have replaced the icons with a ‘not interested’ and an ‘add to bookshelf’ option to clarify the initial intentions. If users have read the book before, they can rate it after clicking on ‘add to bookshelf.’ I have also set the recommendations to show one by one to simplify the experience and not overwhelm the user with choices. They have an option to view all at once versus one by one.
Navigation
“My Corner” is home to all user activities, including the recommendation lists they have created, but users weren’t aware of this. To make this edit, I have included links on the confirmation page to guide them to the right places, leading to My Corner.
Excessive text
With the homepage containing too much information and clutter, I have simplified the home page and moved the rest of the content under their respective sections - shop and explore.
In addition, users have mentioned that the product pages are too long, so I removed author details and video reviews. To find the details, users can hover over the author’s name to see more information. Lastly, I transformed the product details into icons for quick viewing.
Impact
Our target users shared a positive experience navigating the website, specifically mentioning its simple and clean design.
What I learned
Throughout the project, I made many small changes to the design. I realized and accepted that the user-centered design process is never linear. There were many areas I didn’t consider until I was further into the process and had wished to consider before. The main takeaway is to focus on the user’s needs at every step.