Goodreads Redesign
Goodreads Redesign
PROBLEM
Goodreads has had a number of complaints made about its outdated app design for many years. This project works to improve the UI/UX of Goodreads in order to make the user experience more enjoyable and efficient.
PROBLEM
Goodreads has had a number of complaints made about its outdated app design for many years. This project works to improve the UI/UX of Goodreads in order to make the user experience more enjoyable and efficient.
GOAL
Reorganize/reduce features in the current app, guided by user research to highlight the impact good design can make on the use experience.
Timeline: 2 weeks
Skills: UI, UX, User Research, Wireframing, App Design, Prototyping
Role: Sole researcher and designer
GOAL
Reorganize/reduce features in the current app, guided by user research to highlight the impact good design can make on the use experience.
Timeline: 2 weeks
Skills: UI, UX, User Research, Wireframing, App Design, Prototyping
Role: Sole researcher and designer
GOAL
Reorganize/reduce features in the current app, guided by user research to highlight the impact good design can make on the use experience.
Timeline: 2 weeks
Skills: UI, UX, User Research, Wireframing, App Design, Prototyping
Role: Sole researcher and designer
OVERVIEW
Goodreads is a social cataloguing platform mainly for books. Its features include a search, reading lists, quotes, surveys, polls, blogs, and reviews which it is predominantly known for. It is considered one of the largest sites for book reviews and recommendations with them reporting 26 million book reviews and 300 million ratings in 2023 as well as a user base of 125 million.
APP ANALYSIS
I then conducted a heuristic evaluation and task flow map on Miro to highlight the key problems of the UI design and its impact on the experience. The full map can be viewed here: https://miro.com/app/board/uXjVJP7kz7o=/?share_link_id=335060973051
Here is a closer view at the hamburger menu which was the key feature that needed to be changed due to its poor navigation as well as redundant and disorganized features.
Click to enlarge:
OVERVIEW
Goodreads is a social cataloguing platform mainly for books. Its features include a search, reading lists, quotes, surveys, polls, blogs, and reviews which it is predominantly known for. It is considered one of the largest sites for book reviews and recommendations with them reporting 26 million book reviews and 300 million ratings in 2023 as well as a user base of 125 million.
APP ANALYSIS
I conducted a heuristic evaluation and task flow map on Miro to highlight the key problems of the UI and UX design and its impact on the experience. The full map can be viewed here: https://miro.com/app/board/uXjVJP7kz7o=/?share_link_id=335060973051
Here is a closer view at the hamburger menu which was the key feature that needed to be changed due to its poor navigation as well as redundant and disorganized features.
Click to enlarge:
OVERVIEW
Goodreads is a social cataloguing platform mainly for books. Its features include a search, reading lists, quotes, surveys, polls, blogs, and reviews which it is predominantly known for. It is considered one of the largest sites for book reviews and recommendations with them reporting 26 million book reviews and 300 million ratings in 2023 as well as a user base of 125 million.
APP ANALYSIS
I conducted a heuristic evaluation and task flow map on Miro to highlight the key problems of the UI and UX design and its impact on the experience. The full map can be viewed here: https://miro.com/app/board/uXjVJP7kz7o=/?share_link_id=335060973051
Here is a closer view at the hamburger menu which was the key feature that needed to be changed due to its poor navigation as well as redundant and disorganized features.
Click to enlarge:
Other key changes that needed to be added which were recognized through the map were:
Updated design look
Highlighting key features
Organizing features
Reducing click fatigue
Other key changes that needed to be added which were recognized through the map were:
Updated design look
Highlighting key features
Organizing features
Reducing click fatigue
COMPARATIVE ANALYSIS
After analyzing Goodreads I took a look at similar apps to understand the market and understand what changes would be beneficial to Goodreads, what should be avoided and what gaps my redesign can fill. This analysis included their number one competitor StoryGraph, a newer and popular book cataloguing app as well as Letterboxd, a similar cataloguing and review platform but for movies.
COMPARATIVE ANALYSIS
After analyzing Goodreads I took a look at similar apps to understand the market and understand what changes would be beneficial to Goodreads, what should be avoided and what gaps my redesign can fill. This analysis included their number one competitor StoryGraph, a newer and popular book cataloguing app as well as Letterboxd, a similar cataloguing and review platform but for movies.
Pros of the two apps included visualizations of data, clean and simple interfaces and neatly organized and categorized features. Cons included an incredibly simple and sometimes boring UI and constant back and forth screen navigating when expanding on information. This analysis led me to focus my redesign on Goodreads personal user features as well as emphasizing their review options as it gave them an edge against Storygraph.
Pros of the two apps included visualizations of data, clean and simple interfaces and neatly organized and categorized features. Cons included an incredibly simple and sometimes boring UI and constant back and forth screen navigating when expanding on information. This analysis led me to focus my redesign on Goodreads personal user features as well as emphasizing their review options as it gave them an edge against Storygraph.
USER RESEARCH
From here I read user reviews to look into issues others found with the app and found the most recurring complaints were:
Outdated and clunky design
Hard to navigate
Inaccessible and lacklustre features
USER RESEARCH
From here I read user reviews to look into issues others found with the app and found the most recurring complaints were:
Outdated and clunky design
Hard to navigate
Inaccessible and lacklustre features
After my market research and user insights I interviewed a Goodreads user to understand the target audience for the app and what to consider when designing for them. I chose a millennial female as they are the largest audience base for Goodreads as reported by Quantcast in 2017.
After my market research and user insights I interviewed a Goodreads user to understand the target audience for the app and what to consider when designing for them. I chose a millennial female as they are the largest audience base for Goodreads as reported by Quantcast in 2017.
I also created an empathy map to break down the different interactions she has personally while using the app.
I also created an empathy map to break down the different interactions she has personally while using the app.
BRAINSTORMING
With my research complete I began to sketch wireframes and brainstorm on possible redesign options. My main focus in this process was breaking the hamburger menu into a reworked navigation bar, reorganizing features and making a simplified layout. I decided to change the navigation bar to be only four tabs with all the features contained within them.
BRAINSTORMING
With my research complete I began to sketch wireframes and brainstorm on possible redesign options. My main focus in this process was breaking the hamburger menu into a reworked navigation bar, reorganizing features and making a simplified layout. I decided to change the navigation bar to be only four tabs with all the features contained within them.
I jotted down where to move features and how to reorganize the layout as well as ideas to keep in mind when I moved on to the wireframes.
I jotted down where to move features and how to reorganize the layout as well as ideas to keep in mind when I moved on to the wireframes.
From this I learned some pages only needed a revamping of their colours and layout, while functionality could stay the same. The "community" and "my books" tabs would need the most amount of changes while "profile" and "home" needed features moved around and readjusted with overall design improved.
From this I learned some pages only needed a revamping of their colours and layout, while functionality could stay the same. The "community" and "my books" tabs would need the most amount of changes while "profile" and "home" needed features moved around and readjusted with overall design improved.
WIREFRAMES
With the use of my sketches I created my low fidelity wireframes:
WIREFRAMES
With the use of my sketches I created my low fidelity wireframes:
USABILITY TESTING
I conducted testing using the low fidelity mockups and found a couple of changes that had to be made., mainly with the bookshelf page. The page became incredibly crammed with the book covers next to each other and I went back to the original vertical layout which was easier on the eyes and adjusted the text and spacing to add more hierarchy in the design.
USABILITY TESTING
I conducted testing using the low fidelity mockups and found a couple of changes that had to be made., mainly with the bookshelf page. The page became incredibly crammed with the book covers next to each other and I went back to the original vertical layout which was easier on the eyes and adjusted the text and spacing to add more hierarchy in the design.
I also removed next page icons as the testers intuitively understood that they could swipe on the books and click on the title to expand it and they didn't have to use an icon.
For the final design I increased visual elements such as icons and removed the star ratings when searching for books as well as a group banner due to the fact I couldn't add new features in the problem brief.
I also removed next page icons as the testers intuitively understood that they could swipe on the books and click on the title to expand it and they didn't have to use an icon.
For the final design I increased visual elements such as icons and removed the star ratings when searching for books as well as a group banner due to the fact I couldn't add new features in the problem brief.
FINAL
FINAL
REFLECTION
This project allowed me to learn a lot about app design and the importance of good designing. I'm proud of the creativity I showed in aspects of my redesign and the improved aesthetics and flow. I do regret not exploring more colour and font options before redesigning. I believe if I had spent more time on brainstorming that I could have made the app design stand out more visually and create even more visual hierarchy with a variety of font styles and colours.
REFLECTION
This project allowed me to learn a lot about app design and the importance of good designing. I'm proud of the creativity I showed in aspects of my redesign and the improved aesthetics and flow. I do regret not exploring more colour and font options before redesigning. I believe if I had spent more time on brainstorming that I could have made the app design stand out more visually and create even more visual hierarchy with a variety of font styles and colours.
NEXT STEPS
If I were to continue this project I would expand beyond the problem brief and explore working on adding new features. This would allow me to grow this project past designing and go deeper into functionality and interactions. I would also like to explore a re-branding and complete overhaul of the current branding and design schemes of Goodreads.
NEXT STEPS
If I were to continue this project I would expand beyond the problem brief and explore working on adding new features. This would allow me to grow this project past designing and go deeper into functionality and interactions. I would also like to explore a re-branding and complete overhaul of the current branding and design schemes of Goodreads.