Overview:
As learning exercise in General Assembly we were tasked with redesigning the e-commerce experience for a real local Chicago business. I choice a place I frequent as a costumer and consignment seller ,Quimby's Alternative Book store. With only my recently acquired UX knowledge, a mock persona , and two weeks, I got work on a mid-fi mock up for a new e-commerce site for a place they sell books about witchcraft.
Team:
Team of one
Duration:
a 2-week design sprint.
Tools/ Methods:
-Competitive
-Comparative analysis
-Feature analysis
-Card Sort
-Figma
-Personas
Problem:
The current site has sparse and somewhat confusing navigation; it does little to highlight the unique products and events Quimby’s has to offer.
Solution:
Improve the current sitemap with a redesign that brings attention to what makes Qumiby’s unique shopping experience, and improves the intuitiveness of the user experience.
Pain Points
1. The site masthead takes up too much real estate until .
2. “New stuff this week” is the only section and it’s used in two different places.
3. The user experience is text heavy.
4. The site leaves the page too often to compete flows.
5.There are dead links.
Persona
Influencer : Ernest Jankin
What matters most:
Uniqueness
-Hunts for items that are quirky, original, or on-trend
-Returns 30% of items purchased
-Prefers to complete their purchases in person
-Wants to attend unique events
-Shares favorite finds and experiences, and reviews their purchases, on social media
Research
You’ll notice from this chart that bigger competitors like ComiXology ,Amazon, and Barnes and noble lack events and indie artist support. These are the feature that should be highlighted on the Quimby’s site.
We can see most of these examples follow the faceted sort model for their products.
Challengers prominently advertises it’s upcoming events.
None feature both events and independent publications as prominently as Quimby’s
Open Card Sort
I asked 4 people to do an initial open card sort to get an Idea of how someone with no experience of the site would sort it’s pages. most people arranged the shop section similarly to the original site but sections on zines where often placed together.
The entire original FAQ section, which featured the most articles, was it’s piece spread across the site
Closed Card Sort
I came up with new headers, well I kept what worked like “shop, shipping/returns”, but introduced a “Zine 101” and got rid of “FAQ”. With these new labels I asked two new participants to do a Closed Sort to see if they worked. 3 Users responded well to the New Page si.
Insights
People don’t know what a Zine is.
Affinity Mapping and Card Sorting revealed that Zine’s, the main product of Quimby’s, was a foreign concept to most people. That information on the site needed its own section.
Though the Competitive Analysis showed that Zines and Related Community Events are exactly what makes Quimby’s worth going to, over say Amazon or even brick and mortar stores like Barnes and Noble.
What those other sites had, was an easy to navigate shop that featured a faceted sort and prominent placement of their major features.
Building The Wire frame/Prototype
Sitemap
I used the closed sort results to build a new site map.
Userflows
Three basic user flows where developed. Helping me focus what parts of the wire frame needed to be prioritized.
Prototype One
The store section was given more visual emphasis. It also added a more easily readable faceted sort.
I created a universal article layout with side nav for each specific subject so it was more easily found by the user. I purposely left the text and pages general to get a better since of user expectations from the layout itself during usability testing.
A module was introduced for Zine/Book descriptions and check out forms.
The module uses progressive disclosure to keep the user on a single page.
A confirmation page that gave the users some reassurance was important.
Usability Test!
Usability testing with 4 users revealed 3 major issues with my initial prototype.
1.The text was too small and hard to read
2. My overuse of the article page for filler was a little confusing.
3. People wanted to know when there book was arriving.
Prototype the Squeakquel
Addressing insights from the usability test,a more specific sample article pages was added to certain flows.
The text in the drop down, body text, and product labels were increased in size and given a more legible font.
Users also expected a specific page for each shop category, so I built a page.
Final Design
Results and Reflections
-While the final site is fine, I think the Visual Design Still needs improving.
-I feel like I should’ve done more user research on the current site design
-More user interviews with Quimby’s customers to get a firmer idea of what is needed.
