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.