Libra

An app for Book Lovers

Overview

A case study on an end-to-end app. designed for book lovers to easily track their personal library, share, and discover new books.

My role

User rsearch, IA, Interaction Design, Prototyping, Usability Testing, Branding, UI Design

Tools used

Sketch, Illustrator, Photoshop, Marvel

Timeline

4 weeks

Context

Student project
for UX Design Course

How might we help people track, find & share books

The challenge

Libra has started collecting data on popular books and wants to create a mobile app that will help book lovers to track books they own, have read, and want to read next. Inspired by Goodreads, Libra wants to give a more user-centric approach to their app, using the full potential that a mobile app has with features and flows that make it delightful for people to use.

The process

DEFINE

Building Persona

Who are we designing for? Meet Katie, the Avid Reader.

Based on the insights discovered during my primary research, I developed a user persona that represented the user's voices.

Information Architecture

Next, it is important to show how the user will interact with the app and how the entire product is laid out. This App map provides a blueprint for the type of pages, content, and interactions.

Userflow and Taskflow

From the above diagram for the App map, I made a visual representation of how the users may interact and the different paths they can take. This ensures that there are no dead-ends and the interaction is frictionless. The taskflow here shows how a user will discover a new book and add it to their “want to read” list.

DESIGN

Low-fidelity wireframes

With enough information gathered, I started to sketch wireframes by hand to generate as many ideas as possible. Moving to a digital process, I produced these low-fidelity wireframes, which are keys screens to complete the main user tasks and set up for the first usability testing.

User Interface Design (UI)

Style Tile and UI Kit

REFINE

Usability Testing

Using mid-fidelity wireframes, I conducted a round of usability testing with 5 participants, both in-person and remotely, to identify potential pain points, areas of frustration, and sources of error in the interaction design. I asked users to share feedback on the overall layout and basic interface design of the screens.

Affinity Map

After the usability testing, I synthesized the data by grouping their successes, pain points, and feedback based on the users. These data are further grouped to show a trend or common theme.

This allows me to pinpoint what improvements could be made and allow another round of iterations. These suggestions are listed from high priority to low priority:

The final design

This final design was based on feedback from participants in the Usability Test. It was clear that there were successes and some improvements that could be made. This gave me clear directions on what changes to make to improve this app. Recall the problem statement: “How might we help people track, find & share books.” Below are key mobile screens to show how a user can accomplish these goals.

What I've learned

Developing a new end-to-end app can be challenging, but conducting research in the early process proved important as it guided me with more confidence in what direction to go. I learned how to use low-fidelity prototypes to test the concepts and visualize the information. This project taught me to improve on the UX and Visual Design of the solution and always consider accessibility such as color choice and visibility.

What I learn

Next Steps:
This project will be redlined and ready for hand-off to developers.

From a business perspective, it would be important to follow up with metrics to measure success, such as App store reviews and the number of downloads.