Goodreads

Redefining the Reading Experience

Background

During my bootcamp, for my redesign challenge, I chose to tackle a prominent reading app tracker that faces significant usability issues and has received low ratings despite being the largest platform in the market.

Role

Visual Design
Prototyping
UI Design

Team

just me!

UX Research
UX Design
Information architecture

Timeline

5 Days

Introduction

Goodreads, a social media platform for book lovers, allows users to create virtual bookshelves, track reading progress, write reviews, and interact with others.

Despite its 3-star rating, I chose to redesign the app and conducted research for informed design choices

Competitor Analysis

Goal:

Conducting a comprehensive analysis of competitors' apps by testing them as a user to evaluate their strengths and limitations.

Heuristic evaluation

To define the problem, I used heuristic evaluation to focus on the critical flow. Evaluating Nilsen's 10 Heuristic Principles helped me become familiar with social media reading apps and refine my analysis for usability issues. As a beginner, it's practical to select a few principles to practice and analyze your chosen products.

Style tile

Mid-fi Prototype

Home

HI-fidelity prototype

Home

I added a new 'Currently Reading' section to the app's page, reminding users to update their progress. This feature provides easy access to track and update their current reads, prioritizing the book tracking function.

To prioritize the main function of book tracking and improve user experience, I have deprioritized the 'Add to friends' feature. Instead, I enhanced the 'Suggested for you' feature for book discovery and retained the option to view friends' activities.

These updates aim to improve the overall usability of the app and make it more user-friendly for tracking and discovering books.

Add your book to your shelf

On this screen, there are two shades of green, one for the highlighted text and one for the reading button. While they are slightly different, they lack sufficient visual contrast to be perceived as distinct entities. Also the reading button’s color doesn’t is not repeated in any other part of the app.

To improve usability, I used the darker green from the palette as the main color and reorganized key functions.

The outdated blurred book cover background was also removed.

Add to my books

This page didn’t really have a matching UI with the other pages. The red button used to remove books didn’t correspond to the overall UI of the app, and it was hard to recognize it as a button. In general, I found the screen flat and is too simplistic and boring.

My profile

I decided to make a hierarchy between the elements in your profile, the reading challenge wasn’t highlighted enough. There were two buttons to see the currently reading page, but you could access both of them from the same page with one click, which it was repetitive and unnecessary.

About the reading activities, I decided to leave the same structure but to uniform the UI to the rest of the page.

Currently reading

I added the progress bar in the books, so the user can see directly how much is missing after updating the reading progress. I decided to keep the structure with book’s title, author, number of pages as it was already showed in the app.

Outcomes & Learnings

  • Improve the friend’s section experience

    I would like to improve the friend’s page more, it could include a section where you and your friends can compare reviews and opinions on common books.

  • Measure, monitor, and conduct further research.

    I would like to improve and optimize this redesign by conducting more testing and working more on the detail of each element.

Here’s the prototype I used to validate my design solutions.

Do you want to know more? Check my case study on Medium

Indietro
Indietro

Peace out Paradise

Avanti
Avanti

Mind the gap!