top of page
header1.png

About

The Last Bookstore is the largest new and used bookstore in LA. They are proud to be a part of their dynamic communities. Their customers are varied — ranging from local residents to other small businesses.

​

Current website: https://www.lastbookstorela.com/

Role

Researcher, designer

Time

July 2024

Methodology

User interviews, Usability Tests, Plus & Deltas, Cart Sorting

Problem

Business Request and Goals

  • Enhance the website to boost conversion rates.

​

  • Focus on quality with a curated inventory.

​

  • Retain "small shop" appeal while showcasing products.​​

Problem Statement

Customers struggle to locate books and categories on The Last Bookstore's website due to confusing navigation and overwhelming information, leading to a poor browsing experience.

(Based on user insights)

pearl-3 (5).png

HMW and Solutions

HMW

How might we ensure users feel confident in locating some new reads they are interested in?

Implemented a simple, scannable navigation bar

Simplified overwhelming information

Established a straightforward shopping process

Final Design

Click to see the prototype

Sicence fiction listing.png
Book info.png
Cart.png
Checkout.png

Design Process

Discover
Define
Ideate
Design

Competitive Research

 

Usability Test

​

User Interview​

Persona

​

Card Sorting

​

Site Map​​

Sketches​

​

Wireframe

​

​Design System

Usability Test

​​​

Mi-fi

​

Hi-fi

Discover Phase

Competitive Research

To get more inspiration on the standard features of an online bookstore, I analyzed three mainstream bookshop websites: Amazon, Barnes & Noble, and Bookoutlet. The analysis helped me recognize gaps in The Last Bookstore's offerings compared to its competitors. 

Plus & Delta
amazon.png
yes.png
no.png

Clear category

Overwhelming navigation

b&n.png
yes.png
no.png

Summary of reviews

Lack of consistency

bookoutlet.png
yes.png
no.png

Minimalist navigation

Limited formats of books

Understand the Users

I decided to conduct usability tests with five first-time users to better understand their experience and potential improvements to the website at the beginning stage.

Usability Test

Do I click here?

The landing page is kind of confused

There is tons of information!

pearl-3 (9).png
pearl-3 (8).png
pearl-3 (6).png

Why is there a completely different aesthetic design?

pearl-3 (10).png

I can't find the category I am looking for...

pearl-3 (7).png

Define Phase

Who are our users?

In the UX design process it is important to always keep the users at the forefront of all design decisions. So, after an initial scope, I conducted five interviews with people who usually shop for books online. Based on the characteristics of my participants, I bring up the persona Mia.

Persona 
Mia Gloss

Age

25

Female

Status

Single

Gender

Fashion Portrait

"Sometimes, I feel like I’m scrolling forever without finding something I really want."

Mia is a 25 year old data analyst living in a quiet suburban neighborhood of Seattle, WA. Mia enjoys the convenience and portability of digital books.

  1. An easy-to-navigate website with a clean, minimalist design.

  2. A clean, minimalist design.

  3. Other users' review 

Needs

  1. Felt confused about finding the section or book category she was interested in.

  2. Spend time searching for the book she is looking for.

  3. Overwhelmed by the amount of information

Frustrations

Reorganize the Navigation

According to the usability tests, to address the issue of "hard to find a specific category," I conducted several closed card-sorting sessions to improve findability for users based on their understanding of various categories, resulting in the following site map. 

Card Sorting &
Site Map
WX20241111-193441_2x.png

Ideate Phase

Ideas​

After gathering all the data from the research stage, I developed an initial idea and visualized the solution through sketches. The primary user flow I focused on was: "Mia, as a first-time user, wants to browse the bookstore to find a new science fiction book to read."

Sketches​
GA_P2_Sketches_1.png

Bring up to Mi-fi

Before I came to the mid-fi wireframe with colors and typefaces, I created a basic design system inspired by the physical bookstore’s interior to keep consistency across the site and enhance its brand identity.

Design System
WX20241111-174033_2x.png

Design Phase

Landing Page

Problem
Solution

  1. Confusing navigation

  2. Overwhelming information

  3. Lack of aesthictic

  1. Scannable Navigation

  2. Clean layout

  3. Brand identity

image.png
Home bookstore.png

Book Listing Page

Problem
Solution

  1. Inconsistency with landing page

  2. Lack of visibility

  3. Take several steps

  1. New design system

  2. Breadcrumbs

  3. Streamline the process

image.png
Sicence fiction listing.png

Product Detail Page

Problem
Solution

  1. Long Description

  2. Complex information

  1. Quick summary

  2. Good hierarchy​

image.png
image.png
Book infos.png

Conlcusion

What's next?

For the next step, it's crucial to enhance our book recommendations by aligning them more closely with user preferences and providing richer details, such as sample chapters. This approach will streamline the discovery process for avid readers, allowing them to explore new books more efficiently.

Next Step

What I learn?

​Overall, this solo project was a challenging yet enriching educational experience for me. As my second UX research project, it presented a relatively heavy workload within a two-week timeline, but it also offered significant insights into the general flow of conducting research for me. Additionally, I gained a deeper understanding of the importance of time management. Moreover, the project allowed me to explore various research methods, enhancing my ability to comprehend user needs from different perspectives.

bottom of page