Bookstores.com

This project was part UX rescue mission, part design overhaul. Bookstores.com was the first site of many that we planned to move out of our legacy codebase and update it with modern a framework and better design. The developers had already started moving the site to a new framework and publishing changes, but without any UX input. I jumped in to make sure the new site didn’t just look better, but that it worked better too. My goal was to take what was already in progress, refocus it around real user needs, and create a smoother, more enjoyable experience for book lovers of all kinds.

Roles

UX Researcher
UI/UX Designer

Responsibilities

UX Research, UI/UX Design, Wireframing, Prototyping, SEO

Tools Used

Figma, Adobe XD, Microsoft Clarity, Debugbear

Understanding the Problem

The site needed to serve a wide audience—casual readers, students, book club members—and help them find and compare book prices with minimal friction. At the same time, the internal dev team was moving fast and changes were being pushed live without UX guidance. I needed to get up to speed quickly, assess the pain points, and design a clearer, more user-friendly experience.

Who We Designed For

Our target audience included a broad range of readers:

  • Casual readers looking for something new
  • Students searching for affordable textbooks
  • Bargain hunters comparing offers from different sellers
  • Book lovers who browse by topic or genre
Sample user persona used for Bookstores.com
One of the user personas used for Bookstores.com

The UX Process

To get clarity on what users needed, I started with:

  • User Research – reviewing behavior patterns using Microsoft Clarity
  • Competitive Analysis – comparing similar websites for best practices
  • Personas & Flows – outlining who we’re designing for and how they might move through the site
  • Wireframes & Prototypes – iterating and refining in Figma
Sitemap of the Bookstores.com website
Visual sitemap for the updated website.

Design Highlights

Product Page

The product page that the developers initially created was not optimized for mobile devices and had a lot of placeholders in place of missing data.

Screenshot of developer designed product page
Before: product page created by the developers

I redesigned the product page to feel more organized and information-rich without being overwhelming.

Buyers can now:

  • Quickly scan key book info
  • Easily compare prices and seller ratings
  • Effortlessly explore related titles
Screenshot of the Bookstores.com product page after UX updates.
After: product page wireframe with UX updates

While wireframing the product page, I made sure that the layout was responsive so that users on any device can easily find the information they need.

Screenshot of the responsive product page wireframes
Responsive product page wireframes

Home Page

As with the product page, the home page made by the developers was lacking content and a clear direction, and the site was also missing navigation.

Screenshot of the old home page
Before: bare bones home page created by the devs

I designed the home page to be seasonal and flexible, with the ability to highlight different books and subjects throughout the year. I wanted to make sure the page was constantly changing and up-to-date, which would help with SEO and encourage customers to browse through the site.

Updated home page wireframes
After: home page wireframes showing a modular layout for easy content updates

Results (kind of)

Unfortunately, I was laid off before all of my updates could be implemented and the site officially launched, but I left behind my designs and documentation to keep things moving. Even without seeing it go live, this project was a great example of how thoughtful UX can bring clarity and direction to fast-paced development.