PROSE & POETRY
Opening up the pages of opportunity
Prose and Poetry is a fictitious bookshop on the beautiful streets of Highgate. Having recently created their first desktop website as a result of the pandemic, they have had a high level of visitors. The problem however being that the majority of which are unable to fulfill their transactions. They’re also unhappy with their website as it currently stands.
In a hurry? Click Go to Solution to see my final product and key learnings.
DESKTOP REDESIGN | 2 WEEKS
THE BRIEF
To research, create, test and prototype an eCommerce desktop website where users can efficiently browse, select and purchase books.
DELIVERABLES
-
User & Competitor Research
-
Problem Statements
-
Personas
-
User Flows
-
Site Map
-
Grayscale Wireframes
-
Hi-fi Prototype
The Opportunity
Prose and Poetry's unique selling point is their hand-picked quality over quantity. They believe their local bookshop feel and top customer service stands them out from the crowd.
DISCOVER
I conducted competitive analysis with Waterstones, Amazon and Foyles. As leading book retailers, they are a great opportunity for Prose and Poetry to look at to understand what they do well and not so well. I carried out a feature inventory and learnt that that Foyles and Waterstones don’t offer a “buy now” button and as for Amazon, they don’t currently offer a loyalty points system.
To gain further insights, I sent out a survey screener, receiving 31 responses.
SURVEY STATISTICS
The below insights were useful to take forward in my user interviews for me to find out why users buy from Amazon as well as independent bookshops and understand what place independent bookshops like Prose & Poetry hold in users’ book browsing and buying journey.
48%
buy books second-hand or in local independent shops
83%
buy their books from two or more different establishments
65%
of the 83% buy books from Amazon
USER INTERVIEWS
From this and my network, I carried out five semi-structured interviews on book readers aged from 24 to 38. Here are some of the key insights:
Speed and Convenience are key factors for users in:
-
Creating an account
-
Delivery
-
Fulfilling purchases quickly
Online and in-store are both important and play different roles in the user book buying journey. Lot of emphasis on importance of the in-store book experience.
Reviews and recommendations hold a lot of value in the decision-making process.
"It's like a movie. Most people would like to watch a movie to distract them from their life and problems."
"The physical experience is miles ahead. You just can't compare it."
"With Amazon, there is more of an assurance of what you see is what you get"
Participants
DEFINE
Persona
Having collected these useful insights, I created Adele - the Book Lover, who is age 29. Having previously worked in different jobs, Adele is currently retraining in UX design. She is studious, creative and introverted. She needs good quality books and good recommendations. It’s important for her that her books are delivered quickly. She is often frustrated by bad search functionality, having to repeatedly enter her details on new websites and when books are out of stock.
Problem Statement & How Might Wes?
Adele needs to be able to quickly find, purchase and receive a book.
How might we make it easier for Adele to search for and buy the books she wants?
How might we tailor recommendations to Adele?
How might we offer the "bookshop experience" online to Adele?
Sketches
DEVELOP
Iterating the User Flow
After having completed my first round of usability testing on my paper prototype, the feedback showed that the ‘Surprise Me’ path led users into a bit of a “loop” and was quite “random.” I therefore simplified the user flow. The flow changed from being spontaneously assigned a random book’s product page in a bit of a loop, to being presented with three books, with the option to change these recommendations to your taste.
Before
After
Key Iterations from Mid Fidelity to Hi-Fidelity
More visible feedback on checkout
“I would have expected to see a popup or something that comes out”
On the left hand side here, you have the add to cart flow in the first mid-fidelity wireframe, the second is from the iterations. It was clear from the usability testing that the small addition of books was not clear enough that they had added something to their basket. I iterated this to add feedback in the form of colour and shape to allow it to be more accessible and easy to view.
Option to pay as guest
“I’d rather not register for an account just because then you get so many emails. I mean the only reason you’d want to put your email address in, is just to track it.”
Users expressed that they did not automatically want to create an account, as they may be doing a one-off purchase, therefore I added an option to pay as guest.
Improving clarity of checkout process
“So, cart could be maybe that I would like to go back to my cart page, if I suddenly decided, I don’t want them delivered here.”
When testing the first round of wireframes, it was not clear to users that this was not clickable and telling them where they were in their checkout journey. I iterated this further giving the box sharper corners to demonstrate it isn’t a button, using arrows and using bold in the hi-fi prototype (right). After this iteration, I realised work could be done further to make this look even clearer, such as perhaps removing the boxes or making the checkout journey view horizontal rather than vertical.
DELIVER
SOLUTION
The solution here meets the brief as it has simplified the checkout journey, making it easier for users like Adele who want to find a book to relax and/or learn more and fulfill their transactions. Adele can either take advantage of the different buttons on the homepage, such as or she can choose one of the available options on the navigation bar.
-
Taking the “Surprise me!” path, Adele can experience a mimicked version of the “bookshop experience”, where one tumbles upon random books you may not necessarily pick in, with the option to change the books you see.
-
Her frustrations can be eased knowing there are ‘10+ books in stock’.
-
Adele can easily add books to her cart, and pay using PayPal, Apple Pay or Google Pay so she does not need to keep entering her details.
NEXT STEPS
-
A/B Colour testing palette
-
Developing live chat and search feature
-
Build recommendation page
-
Add a customer loyalty feature
KEY LEARNINGS
-
This was my first attempt at creating a colour scheme and it certainly won't be my last! I’m particularly interested in learning more about colour schemes from the point of view of accessibility.
-
When you are conducting interviews or usability tests, if you think you’ve dug deep enough, dig that one step further.