2022
Twinkle
UX, UI, Product Design
UX/UI Designer
Bookzone aims to provide users with personalized recommendations based on their reading preferences and interests. The app will feature a user-friendly interface and will be compatible with both iOS and Android devices. The app will allow users to create a profile, where they can provide information about their reading habits, favorite genres, authors, and books. Users can also connect with their friends and other book lovers to see their bookshelves, follow their reading progress, and get recommendations from them.
Book readers are frustrated with the current products they use to find and share books that fit their preferences. While there are multiple apps to solve this problem, none successfully provide users with all the features they want to make a confident decision in one seamless experience.
The first step in creating a successful book discovery and recommendation app is to conduct user research. By understanding the specific pain points and needs of Millennial book readers, I will conduct surveys, user interviews, or focus groups to gather this information.
UX research, UI design, brand identity
To gain a better understanding of the competing apps on the market, I made a feature comparison survey of Goodreads, along with three book recommendation apps with similar features to what I would like to accomplish with mine, also conducted a survey in order to identify focus areas.
What products exist to find, save and share books?
How do users interact with existing products?
What are users current pain points with existing products?
Which features are essential to find and share books?
A survey was conducted on 40 participants to identify which products and features people are currently using and determine which feature are essential to find a book.
A series of in-depth interviews were then conducted on 5 participants to further identify pain points, frustrations, needs, and desires with existing products to determine how Bookzone could improve this experience.
Social features, such as book clubs, discussion forums, and author Q&As, are somewhat important to participants, suggesting that social connections are valued in the reading experience, but not as much as personalized recommendations.
The majority of participants find it important to receive personalized book recommendations based on their reading habits and preferences, indicating that personalization is a key factor in user satisfaction.
Social features, such as reading challenges, book reviews, are important to participants, suggesting that users value not only personalized recommendations but also social engagement and the ability to track their reading progress and share their thoughts on books with others.
To gain a better understanding of the competing apps on the market, I made a feature comparison survey of Goodreads, along with three book apps with similar features to what I would like to accomplish with mine. My landscape analysis of Goodreads, Litsy, Bookly, and Audible led me to identify some key insights and opportunities for how to approach.
After conducting user interviews, all the participants responses were synthesized to identity themes, opportunities, and features that Bookzone could focus and improve upon.
An affinity map was created to identify high level themes and group similar insights gained from the user interviews.
It involves identifying and ranking the most important features based on user interviews and business goals.
A persona was built based on the data collected to help drive decision making and keep the product focused on solving users pain points, frustrations, and goals.
.png)
To kick-off the design process, quick sketches helped me get ideas on paper to establish which elements were necessary for each screen. A low fidelity prototype was then created for initial user testing.
I made a list of product requirements (not shown) based on my research and used this list to map out all the features and categories that the Bookzone app should offer, considering common app organizational patterns and hierarchy.I initially conceived of four main pages (Search, Library, Discover, and Profile) that include all the various subcategories. However, in an attempt to further simplify the interface, I combined the Profile and Library pages, and folded the Discover page features into the Search page, as this seemed an obvious home for that functionality.
Bookzone's simple information structure makes it easy to navigate and move through tasks.
Rough sketches were done to get my initial thoughts on paper and brainstorm new ideas for specific UI elements.
Using the feedback and insights gained from research, analysis and sketching, a mid-fidelity prototype was created to begin user testing.
A usability study was conducted to determine where improvements could be made and identify new ideas to satisfy user expectations, needs, and desires.
Click to view testing plan
Book challenge was unclear
Book reviews are extremely long, it should not longer then 5-6 lines
Grid and List icons are not clear
Adding a commenting feature would increase engagement rate
Remove multi-step process to find social icons and make immediately visible
Add suggestions as different levels of dots to indicate alignment with books
The style tile below shows the basis for my UI. Following my wireframe inspiration from the Medium and VSCO apps, I went for a minimal color palette of charcoals and grays, with the idea that book cover images will provide the color and visual interest.
Bookzone makes the process of finding a book, saving it for later, and sharing it with friends simple and engaging. It connects people to a social network of fellow book lovers and only suggests books that match up with each user's preferences and positively reviewed and rated reading experiences.
Intro screen and onboarding, These three screens below the sign-in and account creation screens I created for the app. They take much inspiration from the Medium app.
.png)
These screens below ended up not straying too far from the wireframe layouts once the font and color styles were added, but I'm particularly happy with how the book covers create a great deal of visual interest, while the color palette and minimal UI make room for the book covers.
The design of the action sheets in these three screens below changed notably from the earlier wireframe versions with an eye to accessibility and readability. Font sizes were increased, lines were added under text to delineate between the clickable options and create a guide for the eye to follow to the checkmark on the chosen option. The close button was moved from a button at the bottom to an icon at the top right.
It allows users to share their thoughts and opinions about a book, as well as read feedback from other readers. This feature provides valuable insights into the quality and appeal of a book, helping users make informed decisions about what to read next.
Users can follow friends and read their reviews or write a review and share book of their own reading experiences
Users can edit their profile image and change preferences.
.png)
Bookzone recommends books based on a users preferences, friends, saved books, and their positive posts and reviews.
Integrates all needs into one streamlined experience
Suggests more personalized book recommendations
Supports social connection and engagement
Saves favorites for quick reference later
Gives users more flexibility to create specialized lists for book lovers
Provides a source of reputable reviews from trusted friends and community
.jpg)
