top of page


The Alabama Booksmith is a brick-and-mortar bookstore that is looking to renovate its e-commerce process. They got their start in 1990 when their owner, Jake Reiss, took advantage of the fact that there was no Barnes and Noble in Birmingham. But that advantage has since become less significant in the age of online shopping. Using design tools such as Figma, I redesigned their website to give as hospitable of an experience as the store in Birmingham itself.


UX Designer, Web Designer


2 Weeks


State of the old website

+ Large variety of their books upfront, being the first thing the customer sees

- All pictures of the books are unclickable and disappear quickly

Group 22 (1).png

No way to know where you are in the checkout process

Screen Shot 2021-05-06 at 1.53.55 PM.png
Screen Shot 2021-05-06 at 1.53.38 PM.png

When it comes to the Alabama Booksmith, we are targeting the careful critic

- Cares about quality

- Reads reviews and comments

- Wants to be able to compare items


The careful critic needs to know the quality of their item so they won't regret their purchase


Group 22.png

- Competitors take advantage of the star rating system to give the user a chance to compare books

- Comments were very present for the user to gain more insight from other opinions

- All competitors had visual system to show where you are in the checkout process


How Might We

Give the customer enough information on a book without being dull?

Show where the customer is in the process in a concise and cautious way?




From the sketches, I was able to create and finalize a user flow that would be best suitable for our design and target user

Screen Shot 2021-05-06 at 4.15.35 PM.png


I turned my sketches into wireframes using Figma. I wanted to have every page give the user a chance to review and feel comfortable in their shopping process.

home page 4.png
all time top seller 1.png


- It is important to keep the books more prominent than any text to show the variety Alabama Booksmith has to offer.

mock up 1.png

- Every book listed has a star rating along with the title and author

- Next to the image, the book has a concise summary about the book. Long enough to have the information, short enough to stay interesting

Group 21.png

- Every one of our competitors had an About the Author section

- Suggested books to keep our careful critic on our website to compare to other books

Group 21 (1).png

- Comment box to leave reviews, followed by previous comments to understand the value

Group 21 (2).png

- Numerical system, to know exactly where our user is in the process of checking out

- Always keeping an order summary on the right

Group 21 (3).png


The Task

Buy the top rated book of all time

Group 47 (3).png
Group 47 (3).png
Group 47 (3).png
Group 47 (3).png
Group 47 (3).png
Group 46.png

100% of users completed the task with relative ease

add to cart.png

67% stalled mulling over whether they wanted paperback or hardcover

Group 20.png

"The ratings make the books seem popular." - User #1



What stood out the most to me during the tests was that the price would disappear once the customer scrolled down to look at reviews. The way to solve this problem is to keep the side cart as a floating header that always stays visible in the top right.

Group 21 (4).png
bottom of page