The King's English
Concept Project
Overview
The Problem
The King’s English is beloved bookstore located in the heart of downtown Salt Lake City. They aim to provide a unique book buying experience where authors and readers connect as a community.
Fans of the King’s English are shocked at how outdated and difficult to use their website is. Their expectation of the site was that it would provide the same quirky, seamless, and enjoyable experience that they have in store. They need a way to elevate the online experience to match the customer's expectation.
Goal
The goal was to address the current pain points with the site and create a redesign that would give the user the same sensation that they have in store. The main focus was to redesign the landing page, about section, and the checkout flow.
Role
UX Researcher & Designer
Tools
Figma, Maze, Optimal
Sprint
2 weeks
Research
My research objective was to discover the user’s pain points with using The King's English website specifically with the home page, about page, picking a product, and the check out process through a usability test. I tested 4 users who were familiar with the shop and gave them two tasks to complete then conducted an interview. The first task was to find a book and move through the checkout process. The second task was to visit the about page and learn about the stores background. I then took my findings and used an affinity map to synthesize the data.
.png)
"I want to feel special"
"I like a simple checkout process"
"I want to sort information easily"
Research Insights
-
Users noted that the Landing page wasn’t inviting and were not sure about the purpose of the site
-
Navigation was hard to follow and users weren’t able to differentiate when they had been brought to a new page
-
The checkout process had excess sections that were confusing to users
-
Users stated that they about page was bland and had little information.
​
Overall users want to have the same unique experience online as they do in store. They also wanted clear information and an easy way to accomplish their goal.
Competitor & Comparator Analysis
I chose to do a task analysis of Barnes & Noble to see how they’ve organized their navigation. The task was to find a children’s Christmas book and review checkout process.
I chose to do an element analysis to learn what features other companies use on their sites. I picked Gap because their user experience was mentioned in my user interview, Anthropology because their website has the same feeling as it does in store, and Society 6 because they have large variety of product that needs to be organized for navigation.
Competitor Insights
Comparator Insights
-
The Navigations are easy to use because they are well labeled.
-
Product options were well displayed and easy to use.
-
Checkout process was divided into 4 sections which made it so the user isn’t overwhelmed with information.
-
All three websites follow the same primary navigation & secondary navigation menu formula and keep it as a header throughout the process until checkout.
-
Anthropology has a great example of a checkout section with clear signifiers of where the user is at in the process while having it chopped up in digestible sections.
-
Society had a stellar about page with video and short blurbs about them
-
All home pages were inviting and had product collections ready to be browsed.
Persona
.png)
Meet Eugene!
He's a middle aged father of four who values quality over quantity.
-
His goal is to have the same elevated shopping experience online as he does in store
-
He gets frustrated when he can't quickly find the information he needs
-
He will always try to shop local whenever possible
Problem Statement & How Might We's
Eugene needs a way to purchase books so that he can gift them to his family and friends.
How might we support the Eugene in finding the right book?
How might we provide a special experience for the Eugene?
How might we provide a simple way to purchase the book?
Wireframes
The designs for the wire frames were inspired by my findings in my research. Choices were made based on current E-commerce industry standards found in my C & C analysis.
The about page has been designed to be more inviting for the user to learn about the shop.
The landing page was designed to be more inviting by providing a way to view product and events. The primary navigation is formatted for easy use.
The results page offers facet navigation for users to filter books.
The checkout process has been divided into smaller sections so the user and focus on each task. The excess sections have been formatted into dropdown menus for the user to elect to use.
Mid-Fi Usability Testing Goals
A usability test was created to gain insight into the new design. The test included two tasks. The first was to use the new navigation of the site to find a book and move through the checkout process. The second task was to visit the "about". The goal for first task was that user's would be able to navigate and purchase a book with ease. The second goal was for user's to visit the "about" page and be able to learn one new thing about the shop with ease. The main metric was to receive qualitative data about the user's experience.
Testing Results
Qualitative Navigation Data
Positives:
-
Clean Design
-
Easy to use
-
Straight forward navigation
​
Frustrations:
-
Scrolling function didn't work on the filter page
-
The ship and pick up buttons were not clear. Users thought they were on the pick up form when they were actually on the shipping form.
-
wanted an “are you ready to checkout” section
Positives:
-
Simple
-
Inviting
-
Inutitive and easy to use
​
Frustrations:
-
had to scroll a long ways to get to the info
-
want to know more about why they started the store
Qualitative "About" Page Data
Hifi Prototype
Next Steps
​Research the best way to organize all the book genres by conducting a card sort and applying my findings to build out the navigation.
What I learned
It’s important to always ask “why” throughout each step because that will give deeper insight into what the user is experiencing and gives background for the design decisions being made.
I learned how to create navigation systems and I feel the weight of how important it is to get them right. They provide the way for a user to complete a task but they can also be responsible for giving the user an elevated and positive experience.
Timing is everything! I have a better sense of how much time is needed to accomplish each phase and know where to focus my attention for future projects.