The Waterstones virtual book club app provides the escapism we all need.
A UX/UI Case Study
This was a concept project I did in team of 4, designing a book club app for Waterstones. In light of the challenges encountered in retail during the COVID lockdown, Waterstones saw an opportunity in extending their offerings by providing virtual spaces for book lovers to come together!
UX Techniques used:
- Competitive analysis
- User Research
- user flow
- digital wireframes
- clickable prototype
My role was focused on user research, persona, sitemap, and user flow.
Meet the team
Our team was tasked with creating an app that allows users to create private book clubs, invite their friends, set up new meetings, and choose a book. Waterstones imagined that it would be as part of their existing app, but were open to direction on that matter.
Abraham Lincoln once stated
“My best friend is someone who will give me a book I have not read”
We thought this quote really encapsulated our research findings since it became apparent early on in the research phase that book lovers value community and recommendations from friends very highly.
To begin this research, we carried out some competitive analysis, comparing four other existing book club apps. We put our research findings into this table to highlight areas of opportunity for Waterstones.
Key areas of opportunity exposed by competitive analysis:
- A feature that tracks progress in the book would be a unique selling point for Waterstones.
- Ability to facilitate the book club meeting within the app (especially since you often have to pay for external video platforms such as Zoom).
- Including a polling option to choose the book.
We then decided to do some user research to understand the needs and desires of book lovers. First, we created a screener survey on google forms to collate some expansive quantitative data that would filter out all the book worms that we needed for our user interviews.
We screened 75 people, majority aged between 18 and 35 years old:
After analysing these survey results we interviewed 15 book lovers to dig deeper into their relationships with books and their thoughts on book clubs.
I put the data into an affinity map to find patterns within, and colour-coded similar points made by different people to expose widely shared opinions.
The relevant findings from these themes were:
- People value recommendations very highly and rely on them for book inspiration.
- Those who’ve been in a book club expressed the need for structure in order for it to work, otherwise, conversations with friends can go off-topic
- You need a facilitator for the meeting, but not a dictator
- lockdown initially increased the desire for virtual chatting with friends, but the motivation for this is now waning.
The need for the recommendation was the predominant theme we saw in our users, and we began to think about how we could incorporate this into the book club app.
The insights also lead us to believe that a book voting feature in the app would be highly regarded by users. We hypothesised that it would introduce some structure to the process and increase motivation by allowing each person to be involved in the choice. It would also inspire recommendations by bringing to light everyone’s different preferences. This was something we looked forward to testing further down the line.
Moving onto the define phase, I took on the task of synthesising our findings from the user survey and interviews into a persona. A persona is a fictional character that encapsulates the primary needs, goals, and pain points of the users.
Below you can see 24-year-old Chelsea, who has been doing a lot of lonely reading in lockdown. She represents the target user of the Waterstones book club app. I thought this photograph portrays both her loneliness and her enthralment, whilst the detail of her phone hints at a potential book club meeting too.
Key points from the Persona are that she needs a virtual experience that is fun and engaging because it can be difficult keeping her friends interested and motivated online.
Some quotes to expand on her pain points are:
“I’ve tried book club on zoom but it feels detached so we get easily distracted. The book barely gets discussed”
“Lockdown can get lonely, and I miss that sense of community and comfort that book club provided”
Experience Map and Storyboard
From there, a teammate and I drew out an experience map to plot Chelsea’s past experiences, pinpointing exactly where her pain points manifest themselves. As shown in the persona, Chelsea has attempted unsatisfactory book club meetings over zoom, which is reflected in the experience map.
This experience map is presented as a storyboard. It not only pin points the problem but portrays a possible solution outcome.
The peak of her frustration occurs during the zoom meeting, due to the unsuccessful choice of book and her friends’ lack of interest. The root of this problem is the backend organisation prior to the meeting. If we could solve this problem, then the meeting would be much more successful.
In order to distill those pain points into a specific problem, I summarised it into one statement as follows:
Chelsea needs a way to keep her book club members engaged because she feels its difficult to maintain motivation during lockdown
We then moved onto the development phase, which is all about finding solutions for the problems we’ve identified for Chelsea. In order to help us do this, we created a list of How Might We (HMW) statements, which are a UX technique to help you focus on solving the problems at hand. We made a list of 10 HMW’s and then narrowed this down to two for our design studio.
I facilitated a design studio with the team, where we collaboratively ideated solutions to the problem statement. We based the session around the following two How Might We Statements:
How might we connect Chelsea with people to get book recommendations?
How might we incentivise the club members to stay focused in their meetings?
Below are some of the sketches from the design studio:
The key features discussed in the Design Studio were:
- A feature that suggests books to you depending on your interests
- A feature that recommends people for you to follow depending on your interests
- Location-based suggestions of books related to those nearby are reading.
- AI that steers conversation if it’s going off-topic
- Gamifying elements
- Manually setting up topics and times adding topics/suggestions wand timers
As you can probably tell, we were heavily focused on features that provide recommendations for book lovers.
We realised that our app idea had become much more than just a book club, it was also a haven of recommendations and a forum to connect people with other users and even celebrities. So, we decided to create a stand-alone app, since there were many features we wanted to include.
I drew out an app map to show how the user would travel through the features that we intended to include.
The Suggest Books page on the bottom row is where users will also vote for a book, as you will see below in the user flow.
Now with a solid visual understanding of the app’s taxonomy, I drew out a user flow that has three sections:
- Creating a new club
- Voting on a book
- Joining a video chat
These three paths would be taken by the users at different times.
In the first flow, Chelsea can
- create a new club
- invite friends
- add a meeting date to the calendar
- suggest a book for the meeting
The second flow is perhaps a week later, all the friends have suggested a book for the meeting, and they decide to vote on it.
The third is perhaps a month later, the friends have now read the chosen book, and it’s time to do the book club meeting itself.
Designing, testing, and Iterating
It was now time to get our ideas down on paper wireframes and test them on users. We tested once on paper but rapidly moved up to mid-fidelity (mid-fi) wireframes using Figma.
Fidelity refers to the level of detail on a prototype.
Book Club Overview page
User test feedback was that users found the word Rooms confusing. Our team had initially hypothesised that the word “rooms” was cosy and denoted a library-like atmosphere. However, users thought it might lead them to a zoom video chat, so we clarified it with My book clubs
Users also did not think it was clear where the plus button led, so we made this clearer with the words Create a New Club
Finally, user’s thought the page seemed a little bare and unexciting, so we added detail of a profile image as well as how many members belonged to each club.
Book club homepage
Users found the sliding menu too long and overwhelming. So, we rearranged elements of the page. We moved the bio at the top to create space below, and removed some of the menu tabs, surfacing them below instead. Eg, the meeting tab you can now access from Add new Meeting at the bottom of the page.
Creating a Meeting Page
We removed the word agenda as users thought it seemed boring and rigid, and this was not in keeping with our book club brand.
Suggesting a book page
Users loved the voting feature and thought it seemed integral to a book club app. However, it was not obvious how to swipe to add the book, so we clarified this. We also made this a double confirmation to avoid issues with users accidentally swiping on different books.
Finally, it wasn’t clear to users where the Call to Action button (CTA) lead to, or how to get back to the overview, so we clarified this on the CTA.
For the final high fidelity product, we added colours very on-brand for Waterstones, so that even though it was a stand-alone app it was still clearly a Waterstones product. Take a look at our prototype walk-through below!
Similar to my user flow, I will show you the prototype walkthrough in three sections:
Creating a new book club and setting up a meeting
Suggesting a book for the next meeting
Voting for a book, joining a book club meeting
This was such a fun and interesting project to work on, and as a book lover myself with my own book club, it was fascinating and inspiring to discover the thoughts and needs of other book lovers out there.
I learnt that having a strong interest in the subject you are researching can also be challenging since you need to detach yourself from your own opinions and unconscious bias. This proved to be a brilliant exercise in restraining myself from making any assumptions based on personal experiences when I was interviewing users.
During this project, I also surprised myself with my ability to facilitate the design studio and to delegate my work to my team members. I would like to nurture my leadership potential in all projects from here on out.
Look forwards, the next steps for the Waterstones book club app would be to:
- Adjust the bottom navigation to bring it to more high fidelity
- Allow for further functionality for eBook Synchronisation
- Add more games and activities for users to do in their book club meetings