Bhuku Hero Image V2.png

Bhuku

Bhuku Hero Image V2.png
 

Bhuku

OVERVIEW
Inspired by Goodreads, Bhuku is an app for book lovers that helps users track books they have read, what they will read next, and also everything they have loved so far. They've started collecting data on popular books and want to tap into the full potential that a mobile app has.

OBJECTIVE
Design a mobile book cataloging and recommendations app on iOS

COURSE
Designlab UX Academy

ROLE
User Research, Interaction Design, UI Design, Prototyping, Usability Testing

TIMELINE
Feb - Mar 2018

TOOLS
Sketch, InVision, Pen + Paper


Empathizing with Readers

With the rise of e-readers and audiobooks, readers have so many more ways to find and read books how they want. To understand how Bhuku could fit into readers' lifestyles, I first needed to learn about their needs, goals, and habits for reading.

My research goals were to uncover:

  • How do people discover new books to read?
  • What do people consider when choosing books to read?
  • How do people keep track of the books they've read and/or want to read?

Competitive Analysis

The book cataloging and recommendations space is primarily dominated by Goodreads, so that's where I started my research. I conducted a competitive analysis on Goodreads and other similar competitors including Libib, Readfeed, and Bookout to learn about what features currently exist in these apps. Common features included reading lists, options to update reading status, and tracking reading progress.

Bhuku Competitor Analysis.png
Bhuku Competitor Screenshots.png

User Interviews

Following my competitive analysis, I interviewed three avid readers to learn more about their reading habits, preferences, and patterns. This allowed me to get a better picture of readers' sources of book recommendations, organizational methods for their books, and experiences with book apps in general.

Bhuku User Quotes.png

The key takeaways I got from my user interviews were: 

  • Most participants who've used Goodreads felt their book recommendations didn't match their interests. 
  • All participants referred to curated lists from media sources (e.g. The New Yorker, Entertainment Weekly, etc.) because they valued editors' opinions for book recommendations.
  • Most participants set reading goals for themselves and use apps to track their progress.

I created a primary persona (Amanda) and empathy map to focus on the main goals, needs, and frustrations uncovered during my interviews. Amanda is an avid reader who needs an easy solution to find curated book recommendations and keep track of her reading progress.


Exploring Reading Solutions

Using my interview findings from the research phase, I framed them into these How Might We (HMW) questions to think through potential solutions that could address Amanda's goals, needs, and frustrations. 

Bhuku HMW.png

A common trend from my interviews was participants referred to book lists from various media for recommendations. These media sources ranged from magazines like Entertainment Weekly to online media such as The New Yorker and Refinery29. This insight inspired the idea to feature Editors' Picks and Influencers' Picks sections in Bhuku. Through these sections, Amanda can find curated book recommendations from her favorite media and add them to her own lists, all within the app.

Another surprising finding was how participants used book cataloging apps. Those who use Goodreads mostly use it to track the books they've read so they can see their overall progress. One participant said "My biggest goal is to seeing the number of books I've read in a year." Having a Reading Goals section in Bhuku would allow Amanda to keep track of her progress, including how many books she's read for the year and books read per month.

Now that I had some initial solutions in mind, I created an application map to visually outline the app's navigation and overall information architecture of Bhuku.

Bhuku App Map V2.png

Defining the Reader's Journey

User Flow

After defining the information architecture of Bhuku, I created a user flow map to show how Amanda might navigate through the app. I outlined two scenarios for Amanda in the user flow: 1) Amanda is looking for new books to read via Editors' Picks and 2) Amanda wants to track her reading progress under My Books.

Wireframes

I started by sketching out low-fidelity wireframes for Bhuku's key screens. This allowed me think through how the screens should be structured before moving into Sketch.

After creating a visual base with my sketches, I turned them into digital wireframes in Sketch and designed additional screens to support the user flows I defined previously. When designing these wireframes, I referred to existing design patterns in other book apps to decide how to visually organize the content.

Bhuku Lo-Fi Wireframes.png

Designing Bhuku's Brand

I wanted to create a vibrant and friendly brand for Bhuku through bright colors and imagery. Keeping in mind that the books should stand out within the app, I designed a clean and minimal interface with subtle pops of color in the UI elements. For the logo, I wanted to convey that Bhuku is an app for books with a simple but common representation of books.


Testing and Iterating

After designing high-fidelity wireframes, I conducted six usability tests, both in-person and remote, on my InVision prototype to evaluate its ease of use and identify any areas of confusion. The main tasks for the usability tests were to find a curated book list from The New York Times, add a book to your "Want to Read" list, and update a book status to "Complete." 

Testing objectives included:

  • How easily can users find and navigate to a curated book list from The NYT?
  • Does the current location of the Editors' Picks section make sense for users?
  • Is there enough visual distinction between Editors' Picks and other sections? 

Key Findings

  • 50% of participants preferred having editors' names shown on the list covers ("They could be from anywhere, not The New York Times.")
  • 30% of participants were unsure what's included in the Editors' Picks ("I wasn't sure if The New York Times was considered an editor.")
  • 30% of participants thought the editors' names weren't noticeable enough ("The titles didn't stand out to me.")

From my usability tests, most users had difficulties with finding a book list on the Editors' Picks screens so I focused my revisions on improving that process.

Priority Revisions

  • Display the editors first in Editors' Picks section
  • Add a screen showing editor's lists after clicking on an editor
  • Include the editors' logos alongside the list titles on the cover images
  • Increase the text size underneath lists for greater readability

Half of the users had difficulties figuring out where to find book recommendations from The NYT as one of my tasks. While they were able to locate the Editors' Picks section, users felt that the editors' names underneath the lists weren't noticeable enough. Some users also didn't immediately know to click on Editors' Picks to see all the lists categorized by editors. As a result, I decided to make the editors the main focus on the cover images, instead of featuring individual lists as before. This will allow users to easily identify and access book recommendations from top media sources.

After redesigning the Editors' Picks section, I also had to think about what would the following screen look like after the user clicked on an editor (The NYT, for instance). By clicking on The NYT, the user will be able to browse through all the curated lists from The NYT specifically. Lists are displayed at a larger size to make them the primary focus of this screen. From my user feedback, I included the editors' logos on list covers so it's clear to users where each list came from.

Final Designs

Learnings Recap

Coming from content marketing, this project reiterated the importance of content and how it's visualized and presented to users. During my usability tests, the most common issue that users encountered was in part due to how the content was visually prioritized. It was a clear reminder of how content and UX go hand in hand. Clear and effective content can support the user's understanding of navigation and enhance their overall experience with your design.

Next Steps

  • Design the sign up/onboarding process for new users. During onboarding, users would select their favorite books, authors, genres, and editors. This allows Bhuku to generate personalized book recommendations based on users' literary interests.
  • Consider adding a "Save List" option so users can save entire book lists from editors and influencers. Currently, if a user wants to add all the books from a curated list to their "Want to Read" list, they have to add each book individually. Saving lists could also help users easily find and access the lists that matter to them most.
  • Integrate notifications to users when a saved list is updated with new book recommendations.
  • Conduct additional testing for revised designs, collect feedback, and iterate as necessary.