Turning a New Page for Goodreads

Improving the way readers track their books

Revised Goodreads IA

After analyzing the existing architectures, I restructured the app’s IA, adding the missing information from the desktop site, removing redundant areas and putting together related sections.

Revised IA

Existing Goodreads IA

INFORMATION ARCHITECTURE

To be able to perform the redesign with enhanced organization, I drafted out the information structure of the existing app and website.

Existing IA

TARGET USERS

Goodreads has recorded a significant average of 111.4 million visitors from March to May this year, spanning both the website and mobile app. The demographic predominantly ranged from 25 to 34 years old with a slight female majority at 51.83%, mostly desktop users.

Users primarily show interest in Science, Education, Universities, Colleges, News, Programming, and Technology. They have also visited websites including wikipedia.org, amazon.com, reddit.com, twitter.com, and imdb.com aligning with their interest in education, news, shopping and books.

Updating reading progress is cumbersome
Book recommendations are scattered and limited
Some features on the website doesn’t exist on the mobile app
Able to rate a book even without reading it
Organizing books in the bookshelves is limited
Reading progress is more useful for physical book readers

Returning Users

Lacks clear guidance and intuitive cues, leading to uncertainty in what action to do
The feature to search for groups to join, and authors to follow are not clear and accessible

New Users

Pain Points

DEFINING THE PROBLEM

To gain an idea of Goodreads users' perspectives and the potential issues they might have, I looked through app store reviews and web discussions by its users. I also solicited personal insights from several individuals to enrich my understanding based on their first-hand experiences with the app.

Some of the valuable insights I’ve gathered from the interviews and usability tests are as follows:

Needs

(for both new and returning users)

A dashboard for a quick access to progress updates and reading archives
Accessible features in mobile app
More attractive and intuitive interface
Ability to sync progress from Kindle device
Less time navigating, more time for reading

Insights

Active users prefer to visit the website as some features don't exist on the app
The app is unwieldy, hence some features are not easily accessible

I made the decision to redesign the mobile application as it can be utilized more conveniently in various settings, whether users have access to physical or digital books.

4 Past Searches_iphone13progold_portrait.png

5 Search Results with indicators_iphone13progold_portrait.png

6 Add to Bookshelf_iphone13progold_portrait.png

7 Add to Bookshelf_iphone13progold_portrait.png

8 Prompt - Book Added_iphone13progold_portrait.png

Some of the improvements:

Display of "Recent Searches" to avoid repeating steps when making the same item search
Different font colour on items (books) that have been visited before
An indicator for books that are already in the shelf
CTA with a clearer and more recognizable label
An option that allows users to change the book edition
A more casual tone for the default shelves labels
An option to select multiple custom shelves for a more personalized organization
A more visible prompt for the update made

One of the most important and used features of Goodreads, mobile app in particular, is the tracking of books and updating reading progress. The original design of the app prioritized the community and social aspects, requiring users to take an additional action to view their bookshelf.

In this redesign, aside from improving the interface aesthetically, the user flow has been simplified to enhance efficiency and ease of use which allows users to conveniently access and update their books.

HIGH FIDELITY MOCK-UPS

Scenario:

You want to save a book by Brandon Sanderson to read later but forgot its title.

User Flow 1

Search and logging a book to the bookshelf

LEARNINGS

In the process of discovering the problems, I found out that the Goodreads app has quite a number of usability issues that every designer, like myself, will be very keen to fix. It offers a lot of features and the system is a bit clunky which makes it seem daunting to fix. The redesign required a deep understanding of its affordances and what matters most to the users.

At first, my mistake was that I thought of fixing almost all the problems that exist in the app. At some point, I got confused and wasn’t able to identify precisely the problem/s I was trying to fix. So I reorganized my method and plotted the problems in user flows.

I’m aware that in a real world scenario, it is not viable to address all the problems all at once especially for an established product such as Goodreads. These problems are usually broken down in different phases, and prioritized according to severity. However, in this case study, I intended to practice my skills by adopting the principles in UI design to improve the app’s user experience as a whole. Hence, I decided to cover several user flows but focusing on the app’s most valuable features for the users — search, discover and track books.

PROTOTYPE

Try out the functional prototype below:

Foodle

Goodreads

Goodreads

Client

Personal Case Study (2023)

My Role

Sole designer

Disclaimer: I am not affiliated with Goodreads or Amazon in any capacity.

2 Update Reading_iphone13progold_portrait.png

3 Update Reading_iphone13progold_portrait.png

4 Prompt Update Reading_iphone13progold_portrait.png

5 Prompt Finished Reading_iphone13progold_portrait.png

Some of the improvements:

A dashboard that displays important reading updates, activities and books saved in the bookshelf
Allows a quick access to update reading progress
Sync with Kindle options for Kindle readers to eliminate manual updating
Automatic percentage display when user enters the page of the book
Provided option to change book edition
Allows user to update the date of reading in a single screen
More recognizable CTAs and input boxes
Allows user to change the "Date of finished" immediately after setting the book to "Finished reading"
Only allows users who have read the book to give ratings to make it more reliable
A more visible prompt for the update made

Scenario 2

Scenario 1

Scenario 1:

Scenario 2:

You've read a few pages of The Murder of Roger Ackroyd and you want to log your progress in the app.

User Flow 3

Checking and updating reading progress

You've finished Sleeping Murder and you want to log it in the app.

One key aspect of the app's main feature, in relation to the first user flow, is enabling users to track and update their reading progress. Currently, the app presents a cumbersome process, particularly when users need to update multiple books consecutively.

With the implementation of a dashboard in the redesigned interface, the important features and information in the app are more visible and accessible to the user. This eliminates the need for users to constantly remember the required actions and their respective locations, reducing the cognitive load.

OVERVIEW

Goodreads, since its establishment in 2006, has become a key player in the global reading community. It is best known for keeping track of book lists, recommending books, and offering access to a variety of book clubs. Furthermore, it creates an interactive space for readers to follow authors and influencers, connect with friends, stay up to date on trending books, and set personalized reading goals.

However, Goodreads' complex design and multiple sections can occasionally pose usability issues, making navigation quite a challenge. As a relatively new user (of the mobile app in particular), I've directly experienced these issues, prompting me to do this redesign project to improve its overall user experience.

1 Book Page - Read Later_iphone13progold_portrait.png

2 Manage Book - unmodified_iphone13progold_portrait.png

3 Manage Book - Reading Now (with partially completed)_iphone13progold_portrait.png

4 Prompt - Update Successful_iphone13progold_portrait.png

5 Book Page - Reading Now_iphone13progold_portrait.png

Some of the improvements:

A faster and more accessible bookshelf through the dashboard
A more recognizable CTA
Added "Partially Completed" as one of the default shelves, allowing users to still keep the books they don't like and don't intend to finish. This can also help refine the book recommendation results.
The modal screen title is relevant to the action intended to perform.
A more visible prompt for the update made

The current organization of books in the app limits users from placing books marked as "Currently Reading," "Read," or "Want to Read" into custom shelves they create for personal organization or categorization. Additionally, there is no available option to dislike books for reference.

In the redesigned interface, users are provided with greater freedom in organizing their books. Four default or main shelves, namely "Reading Now," "Read Later," "Finished," and "Partially Completed," are implemented. Users can choose one of these shelves for each book and also have the option to add books to multiple custom shelves. Furthermore, the "Partially Completed" shelf is introduced to accommodate unfinished books. This enhancement provides users with more control over categorization and personalization.

Scenario:

You want to start reading Murder on the Orient Express that is saved on your bookshelf and you want to make an update in the app.

User Flow 4

Managing books

OBJECTIVE

Redesign the Goodreads app interface for an improved navigation, intuitive interaction, and a streamlined display of information.

IDEATION AND WIREFRAME

When devising the solution, I carefully considered the features that users find most valuable when using the current Goodreads app. To facilitate this process, I began by sketching, creating a simple visualization that captures the screen elements and their affordances.

Based on the usability issues gathered prioritizing those with high severity, I first added a dashboard that provides quick access to valuable information to the user providing a more user-centric experience. I also removed the unnecessary/irrelevant information, reorganized them, and created a clearer visual hierarchy ensuring an intuitive experience and a more efficient flow in completing user tasks.

USER FLOW AND HEURISTIC EVALUATION

To gain deeper insights and identify specific usability issues, I set out on outlining the app's key user flows for different scenarios. By mapping out these user journeys, I was able to evaluate the screens within these scenarios to uncover areas that require improvement.

3 Book Page - About_iphone13progold_portrait.png

4 Book Page - About_iphone13progold_portrait.png

10 Add to Bookshelf_iphone13progold_portrait.png

11 Prompt - Book Added_iphone13progold_portrait.png

12 Book Page - in Bookshelf_iphone13progold_portrait.png

Some of the improvements:

Personalized recommendations based on user preference
More visibility and easier access to books from different lists/category
A more visible prompt for the update made

Another interesting feature of the Goodreads app is its ability to offer book recommendations. However, the current implementation lacks personalization, forcing users to navigate through various lists and resulting in time wasted.

To address this, the redesign provides personalized categories based on the user's genre preferences and favorite books. By presenting books in a carousel-style menu, users can swiftly discover books of interest without the need for repetitive back-and-forth actions. This improvement aims to optimize the user experience and enhance the efficiency of finding relevant recommendations.

Scenario:

You want to get an idea on the best mystery books to read next.

User Flow 2

Discover and log book to the bookshelf