Booknook
A responsive web app that makes online book shopping just as enjoyable as in-store.
Platform
Responsive Web App
Industry
E-commerce
My Roles
🎨 Product Designer
Tools Used
Figma
🔍 UX Researcher
Overview
Problem
Most online bookstores’ UI is crowded, outdated, and overwhelming to users. As many people buy books online these days, it makes their experience frustrating and unenjoyable.
crowded
outdated
overwhelming
Solution
Update the UI already used in online bookstores and take inspiration from other well-developed e-commerce sites, so that the book shopping is as enjoyable online as it is in stores.
clean
modern
engaging
Competitive Analysis
Brand Guidelines
User Flows
Low-Fidelity Wireframes
Desktop
Landing Page & Search Results
Mobile
Landing Page & Search Results
Mid-Fidelity Wireframes
Desktop
Landing Page & Search Results
Mobile
Landing Page & Search Results
Mobile
Search Results
Landing Page
User Testing
3 participants across diverse age groups & life stages
Retired librarian
Stay-at-home mom
Recent college grad
Task
As a new customer, I want to access the inventory without having to register, so that I can make sure this store has what I’m looking for before having to create an account. I am looking for cookbooks. Once I find them, I want to return to the home page.
“Was unclear on where to click to get back to the home page.”
“Squares are reminiscent of music albums instead of books.”
“Not enough ways to find a specific item.”
To fix
Create a back arrow
Change squares to rectangles
Incorporate drop down and/or hamburger menu for categories
Final Designs & Mockups
Desktop Home Screen
Mobile Screens
Splash & Home Screen
Search Bar Results & Open Hamburger Menu
Genre Results & Open Book