Bhuku
End-to-End Application Design for Mobile Experience
Scope and Focus
Bhuku is an app for book lovers that will help users track everything they own, books they have read, what they will read next, and everything they have loved.
Bhuku has started collecting data on popular books. Inspired by goodreads.com, Bhuku wants to give a more user-centric approach to their app, adding features and flows that make it delightful for people to use. They want to use the full potential that a mobile app has, such as utilizing the camera to register books in a more automated way via optical character recognition (OCR), sending notifications to users to keep them engaged, tracking their progress on reads (potential gamification), etc.
There are a number of book cataloging, library, and reading apps available out there, but there has not been an app that does it all. Having an app where users can keep track of their books, read reviews, then being able to check out and read directly from one place, creates a more engaging user experience. Bhuku wants to have its app out on the mobile platform and its brand and logo defined.
Users & Audience
The target users of Bhuku are mainly targeted to book readers. People of all ages can use this app.
Team & Role
This was the final capstone project in Designlab UX Bootcamp. I took on this project on my own as the end-to-end UX/UI designer with feedback and guidance from my mentor, Noah Pan.
The Process
1. Research
Who are Bhuku’s competitors? What could they improve? What did they do well?
1:1 interviews with 6 different people who are readers were conducted to get a better understanding of their reading habits, how they share books, and how they store/keep track of books they’ve read.
2. Define
Persona
Based on the research debrief, a persona was created as a representation of our key audience segment.
Empathy Map
Being able to visualize user attitudes and behaviors helps to gain a deeper understanding of the users. Additionally, it helps create a shared understating of users’ needs, which aid in decision-making down the road.
Storyboard
Using the persona and empathy map, a scenario was created to show how Bhuku is used in someone’s life. Since stories are generally more memorable and engaging, a storyboard was used to convey that.
Site Map
A site map was created to show the relationship between the content on the site.
User Flow
To understand the user’s decision points and how the flow will go, a user flow was created. This helps to layout and think about the flow in order to start the design process.
3. Design
Style Tile
Using Pinterest, I was able to quickly create a mood board and define the look and feel of Bhuku’s app and brand. This was used to create the Logo and Brand Style Tile going forward.
Sketches & Wireframes
Rough sketches were done to help me get an idea of where to plan the placement of different elements in each screen when going into the wireframes.
HiFi Design
As I’m more of a visual person, I started to work on the Hifi visual design and continued to build out different screens for the app. I made sure to build out enough screens to prepare for a smooth prototype going into testing. The Hifi designs were iterated several times with feedback from my mentor to get to this point.
4. Prototype
Keeping in mind the different use cases that a user will encounter, elements were linked to different screens for the prototype. I wanted to make sure that there were enough screens built out to ensure a smooth prototype experience during the user testings.
Below, you can find a quick animation of what the prototype looks like and the link to access it.
5. Test
After the prototype was in good working order, it was time to move on to usability testing. In order for me to validate or disprove all of the design decisions made so far, I recruited 6 people to help me out in testing the Bhuku app. As this was a mobile prototype, I decided to conduct a live in-person user test so I could be able to set up a camera to record the user’s interaction on the mobile device.
A test plan of the usability test was created to give focus and structure to the testing. The main goals were to evaluate the usability of the app, and identify sticking points.
Participants were presented different tasks to accomplish:
A total of 6 people were recruited to perform user testing on this app. All the participants were able to easily navigate to, and find what they were looking for. Overall, it was a simple and straightforward process interacting with the app. Although the Figma prototype was buggy at times, the participants were not affected by it and all explained what they expected to happen.
Some findings that came up were:
After user testing and summarizing all of the findings, patterns emerged, and was able to identify places that needed to be revised for a better user experience. 2 groups were created: Priority 1 Revisions (must have, quick to change), and Priority 2 Revisions (nice to have, takes more time). As time was limited, I focused on making the Priority 1 changes.
Below are some examples of the Priority 1 revisions:
Next Steps
The next steps for this would be to iterate on the Hifi designs and incorporate all the P1 and P2 revisions. A new set of participants will be recruited to perform usability tests on the revised prototype. This process of prototyping, testing, and iteration would continue until stakeholders were satisfied with the results enough to put the design into production.