Designing an app to discover, save and share books
Project Type | Mock
Role | UX/UI Designer
Tools | Sketch | Marvel App | LucidChart | Illustrator
COMPANY INFO AND OBJECTIVES
Bhuku is a mobile application for book lovers that will help users track everything they own, have read, will read, and loved.
Bhuku desires to give a more user-centric approach to their app, and add features and flows that make it delightful for people to use. They seek to:
- Design their mobile application which gives users the ability to add new books through a form or by taking pictures, rate books and add comments, set book statuses, and list all the books a user owns – to name a few.
- Bhuku doesn’t have a defined brand so they are also looking for a new branding.
Research revealed that most users use similar applications as a tracking tool to store their past, current, and future readings in one centralized location. Reading book reviews before purchasing one is an important step in determining if the book is worth reading unless it was recommended by close friends. Besides receiving recommendations from friends, users use applications similar to Bhuku to discover new books to add to their personal library.
Following design principles, I have designed a mobile application that allows users to find books which they can either add to their personal libraries or share with others. In addition, users can personalize their recommendations and read/leave book reviews.
I began my research phase by familiarizing myself with the project brief and gaining a deeper understanding of our target market, trends, and group. I have also conducted several interviews with avid book readers to uncover their goals, needs, frustrations as well as experiences with similar applications.
Knowing that there are several applications that offer similar services, I needed to further analyze their strategies and features to determine their strengths and weaknesses analogous to our own product. By looking back at the project brief, I identified key features which I have used as a guiding point for my direct competitor analysis.
Upon completing my first round of research, I prepared an interview guide containing the interview script and question set used to recruit and interview participants. A total of six participants were recruited, all of which were passionate book readers. Sequentially, I have synthesized my findings into an empathy map and user persona. These were used as a reference point throughout the project to keep me focused on our target user.
- All participants mainly read for fun, but occasionally borrow or buy books for work-related reasons.
- Most participants read book reviews before buying a book or adding it to their wishlist.
- Most participants like to indulge themselves in a mix of eBooks and audiobooks because of their accessibility and portability.
- Most participants find future reads through Amazon, Goodreads, Audible or personal recommendations from friends and family.
- Participants mostly use applications such as Goodreads to create reading lists and store their past, current and future reads as well as discover new books.
- Participants do not use any of the progress tracking features available in similar applications because their Kindle or Audible does it automatically.
Armed with valuable insights, I developed “Point of View Statements” and “How Might We…” questions, which helped me turn the insights into opportunities for design.
Upon brainstorming some design ideas, aligning the business and user goals, and developing a product roadmap, I composed an application map and a user flow to identify the structure of the app.
To understand the information architecture of the mobile app, I created an application map with all the essential links to connected screens.
From the application map, I developed a user flow which illustrates how Jack will navigate through the app and perform a specific task. It was important to me that the user flow reflects on one of the main goals of the user persona – which was determined through research. The green path shows the steps he would take to perform the task of finding a book, and adding it to a custom list.
Before diving into digital designs, I have sketched out some wireframes to play with various design ideas in a quick and efficient way. I focused my main attention on designing the screens needed for my user story such as screens for Login, browsing through book recommendations, reading book summaries, reviews etc.. Once I was comfortable with my sketches, I redesigned them using Sketch.
PROTOTYPE & TESTING
Using my mid-fidelity prototype (Marvel), I conducted in-person and remote usability testing with five participants: three males and two females. Each participant was briefed on the project, and was provided with a detailed scenario to help them understand and relate to our user persona, Jack. * Prototype represents the newest version with final iterations.
- Select a high rated book and add it your library.
- Add the book to a custom list called: Favorite Books.
- Go to your library and make sure the new book was successfully added to the right list.
- View your recommended books.
After gathering important observations and feedback from all the participants, I synthesized my discoveries into an affinity map to identify patterns and opportunities for improvements.
Overall, participants knew how to navigate the app, and were able to complete the tasks without assistance or and without experiencing major issues. Minor issues occurred due to the prototype’s inability to make every element functional such as the books on the “Discover” screen.
Based on my testing results, I designed my high-fidelity wireframes and made final iterations. These modifications included:
- Adding the title, author, and rating to every book listing on the browse page.
- Changing the “Add to Library” screen – removed the button like links and converted it to a list.
Since most users did not experience major difficulties, most improvements were visual re-touches (i.e. changing the look of certain UI elements, element re-positioning, etc.). It was important to make the application look as polished as possible while maintaining a clear hierarchy and usability.
USER INTERFACE DESIGN
A style tile and a UI Kit were created to communicate the essence of Bhuku’s visual language and brand. The style tile holds the logo in various sizes and colors which was first pencil sketched and then digitalized. The UI Kit is composed of UI elements used on the Bhuku app.
This is a set of high-fidelity wireframes, illustrating the six main screens that were used during usability testing.
I have always been a passionate reader so working on this project was very rewarding. Having full control of this project gave me the opportunity to creatively explore and problem-solve through the various stages of UX/UI Design. I implemented distinctive techniques to uncover user insights, and designed a platform that not only fulfilled the business needs, but also our users’ needs.
The platform was designed to give avid readers a place where they could create their own virtual library, and help them manage their choice of literature. Through research, I discovered users’ frustrations and needs in order to formulate and shape the app’s design.
To ensure the newly-made iterations smoothly integrate with the rest of the application, and that user experience has dramatically improved since the prior designs, further usability testing would be necessary.