The Last Bookstore Revamp

This case study highlights a three-week project completed as part of my UX Design bootcamp, where I identified and improved an existing website that fell short of accessibility standards. I chose The Last Bookstore’s website as the focus, conducting a detailed heuristic evaluation and accessibility audit to pinpoint areas needing improvement. Through this process, I gained a deeper understanding of the website's challenges and identified opportunities to enhance its design, ensuring a more inclusive and user-friendly experience.

Case Study Summary

🫡 My Role

UX/UI Designer, UX Researcher

⏰ Timeline

3 weeks
Continuous Iteration

🧑‍🤝‍🧑 Team

1 UX/UI Designer/Reseacher

📝 Methods

Primary research, Secondary research, Affinity mapping, Competitive analysis, Usability testing, Heuristic Evaluation, Accessibility Audit, Problem identification, Solutions design, Card sorting, Sitemaps

Table of Contents

1

Research

2

Design

3

Final Design

4

Reflection

01 Research

The Last Bookstore's website offers users the opportunity to purchase unique books and merchandise. While its name suggests it is solely a bookstore, The Last Bookstore is much more. It serves as a cultural hub, hosting art events and providing space for photo shoots and filming. However, despite its broad offerings to the community, the website falls short in meeting key accessibility standards. My goal is to help improve the site's accessibility to ensure it better serves all users.

Website Overview

To start this project, I conducted usability testing with five participants:

1. Engineer
2. Nurse
3. Salesperson
4. Teacher
5. Banker

All of these participants are tech-savvy, enjoy online shopping, and love reading. Despite their experience, they hated using this website.

Testing Process
Each participant was asked to complete the following tasks:

1. Purchase an article of clothing and a tote bag.
2. Buy a book.
3. Purchase a gift card for their mom.
4. Become a member.
5. Purchase the store's magazine.

The outcome? Most users struggled to complete the tasks efficiently, often taking extra, unnecessary steps or feeling confused, even when they succeeded.

Usability Testing

During competitive analysis, I discovered how far behind The Last Bookstore's website was compared to similar websites. Key issues included:

  • No search bar

  • Confusing navigation

  • Two separate shopping carts

  • Overwhelming number of images

  • Invisible "My Account" button

  • Non-working subscription/membership options

  • “Shop Books” link redirecting users to a secondary website

Competitive Analysis

Heuristics Evaluation & Accessibility Audit

After analyzing the website’s design, I conducted a heuristic evaluation and accessibility audit, revealing critical usability issues:

  • Tabs opening new websites

  • Items misplaced within tabs

  • Broken buttons

  • Invisible input text (white text on white background)

  • Hard-to-find objects

Problem/Solution

Problem: Users need a seamless checkout process but are left confused and frustrated due to the poorly organized and inconsistent design of the site.
Solution: I proposed a redesign with a streamlined checkout flow, consolidating everything within one platform, and improving navigation and accessibility.

02 Design

To address navigation issues, I conducted card sorting exercises with three participants. The results provided a clear structure for the new navigation system. Users sorted categories like Home, Gift Cards, TLB Merch, and Services into more logical groups.

Card Sorting

The original site’s navigation was disorganized, with products scattered across irrelevant tabs. The new structure organizes tabs in a user-friendly way, eliminating the need for ambiguous tabs like "More."

Sitemaps

In the early sketches, I aimed to simplify the homepage, using a few images from the original site to maintain brand identity. My main challenge was designing an intuitive filtering system for book searches. After comparing other book-selling websites, I implemented a dual search bar system:

  • One search bar for the entire website.

  • A second search bar specifically for the “Buy Books” section, allowing users to filter by genre, author, or ISBN.

The wireframes translated these sketches into detailed designs, including features like a wishlist button and an "Unavailable" button to notify users of out-of-stock items.

Sketching and Wireframes

03 Final Design

The final prototype addressed the critical issues with the existing checkout flow for purchasing books. Moving forward, I plan to conduct additional usability tests and continue improving the site’s accessibility across other sections.

The New “The Last Bookstore”

04 Reflection

This redesign focuses on solving key pain points for The Last Bookstore’s customers, improving their overall experience by providing clear navigation, a seamless checkout process, and enhanced accessibility. My next steps include further user testing and refinements to ensure the website meets all user needs. Certain aspects like the events page is not developed yet.