Mobile App Design

Byte

Overview

I worked on a freelance project that aimed to develop an app allowing users to keep track of books they've read or wish to read, as well as share their reviews and reactions with friends and followers. In this project, my tasks involved identifying the target audience, doing competitive research, defining the jobs to be done, determining the app's core flow, defining its personality, creating mockups, iterating on concepts, and building prototypes for testing and demo purposes.

Audience:

An enthusiastic reader seeking out new books with the assurance that he will enjoy or appreciate them.

Must haves:

  • Library with read books and bookmarked books

  • Data base with books and reviews for users to search

  • Recommendations based on reactions and people user follows

Nice to haves:

  • Goal tracker/challenges

  • Friends Feed

  • Book clubs

Jobs to be done:

  • Find a book you would like to read

  • Share your thoughts on books

  • Keep track of books you have read

  • Keep track of books you want to read

  • See what your friends are reading, reviewing and reacting to

Wireframes

Initially, I developed wireframes for the essential screens required for users to complete their jobs to be done. Initially the rating system I wanted to implement was based on stars (1-5); however, upon further reflection, I realized that it was challenging to comprehend another user's opinion of a book based solely on a 5-star rating. As a result, I made the decision to use emojis as they allow users to express their feelings towards a book more accurately.

Style

After researching some of the competitors, I selected two that embodied the atmosphere I wished to convey.

GoodReads offered a warm and familiar feel akin to conversing with a librarian when searching for a book. However, it also appeared somewhat outdated.

In contrast, Literal felt modern with its clean, minimalist design. However, it lacked the human interaction reminiscent of consulting a librarian.

Thus, my aim was to create an app that strikes a balance between the two. I wanted it to be welcoming, cozy, and familiar while also appearing contemporary and sleek.

Moodboard

Visual Language

I began experimenting with various color schemes, fonts, and layouts to generate several possible directions. From there, I narrowed down my options and further developed them. Here are a few examples of the experiments I conducted, which also aimed to strike a balance between playfulness and seriousness.

After playing around with the screens shown below, I aimed to develop something that was both slightly retro and edgy, yet still clean and approachable. As a result, I designed the screens below.

Although I really liked the solid drop shadow and the retro vibe it gave the design, I realized that it would be challenging to maintain during updates and could lead to unnecessary complications. Therefore, I eliminated the drop shadow while retaining the blocky aesthetic.

During the iterative process, I also decided to remove the emoji reactions since their style did not align with the overall design. After considering creating my own emojis, I ultimately opted against it, as it would not be as universal as emojis making it more complicated and less accessible.

I decided to follow an simpler way of reacting to the books you have read, using reactions we universally know very well and have used multiple times:

  • Thumbs-down for books that were not for the user

  • Thumbs-up for books that the user liked

  • Heart for books that the user loved

User Flows

After deciding on the style and rating method, and finalizing the core screens, I proceeded to develop the flow for each action and created the corresponding screens. The resulting flows and screens were then used to build a prototype on Protopie. Below are the details of the created flows and screens.

The app places a significant emphasis on what a user's friends are bookmarking, reacting to, and reviewing. This approach is intentional, as the app is not designed to showcase popular books or bestsellers in general. Instead, it aims to provide a personalized experience to the user so that they can trust they will enjoy the books they find.

The user has the ability to search for book titles, authors, and other users.

There are two methods available for users to review a book. The first option is to express their reaction through a set of predefined responses such as "not for me", "like", or "dislike". Alternatively, they can provide a written review, which can be edited or deleted at a later time. Users have the flexibility to mark their reaction to the book without necessarily having to leave a written review. Later on, they can choose to add a review if they so desire.