R3: Online Book Library Concept

(App+Website)

Vibhuti Gupta
10 min readJul 21, 2021

--

What is R3 (Rent.Read.Repeat)❓

R3 is a book lending/online library concept where people can register themselves and set a reading cycle. They will get books of the genre they have already selected in a cycle or can personalize their book packs too.

The users can choose to read in a circle of friends & family or can even select to exchange books with random, unknown users and have pen friends while growing a community. R3 aims to provide a library experience even while sitting remotely.

READ BORROWED BOOKS AT CHEAPEST PRICE!

Defining Goal & Vision 🎯

Product Goal: To build online library where people can build their packs, borrow books as per subscription plans for a time period & build their own community to read in groups or even individually.

Vision: Create a user friendly online library experience where books are available at the cheapest price & best quality.

Target Audience 👨‍👩‍👧‍👦

School Students | College Students | Reading Enthusiasts | Teachers

Let’s make a quick check list 📋

I made a to-do list. This helped to organize my work by marking steps within the whole process.

  1. User Research
  2. Analyzing Stats
  3. Affinity Mapping
  4. Identifying Problems
  5. Mapping Stakeholders Relationship
  6. User Persona creation
  7. Empathy Mapping
  8. Scenario Storyboarding
  9. Experience Mapping
  10. Competitors Analysis + Heuristic Evaluation
  11. Defining Goal & Vision
  12. Open Card Sorting
  13. User Work Flow
  14. Information Architecture
  15. Wireframing
  16. User Interface (UI) Design
  17. User Testing
  18. Outcome + SWOT Analysis

User Research 👥

I conducted surveys with 40–50 potential users and tried to collect data through personal interviews and understand their choices and experiences.

Data Type : Qual & Quant (both)
The targeted people for this research were majority students and working professionals.

I used Google Form to float a Survey. These are the responses collected. The research was very basic to understand the targeted audience and their behavior.

Stats & Figures 📈

I wanted to analyze the stats and figures to understand the problem, demographics and practices of a user. I collected this data from various sources by conducting secondary research.

Affinity Mapping 😃😞

To get started with affinity mapping, I gathered information about the potential users through surveys and collecting feedback. Once garnered, I wrote out each finding on sticky notes and with the help of the user tried to connect the findings and grouped it accordingly. This was open ended and done in a real environment with a user to understand the pain & gain points.

Sorry if it looks messy 😅
I used Invision to arrange the sticky notes in a more organized way

Insights & Problem Statement 👀

In this technological era, new services/products of book reading concept are coming up but still the love of tangible book finds it roots deep within because we are all humans, drifted by emotions. The look & feel of a book adds a special experience and memory that remains untouched by online mode. Yet, I cannot deny the fact that it is easy, convenient and cheap to find books online.

The following problems were chosen to be addressed:

  1. CONVENIENCE
    Book finding offline, library visiting and issuing books may not be as convenient as to finding books online
  2. HEALTH
    The health of the user is of prime importance. Too much screen time, prolonged usage of devices specifically for longer reading hours may lead to weaker eye sight, migraine & other health issues
  3. EMOTIONAL CONNECT
    While curating any services we cannot forget humans are driven by emotions. In online reading according to my research and analysis, users do not gain a satisfaction of accomplishment and often are not able to connect with the books or author & unable to finish the task due to lack of motivation. Here, tangibility (physical form of book), experience and interaction plays a major role

Stakeholders relationship ✨

Developing mutually beneficial connections with groups and individuals that have a “stake” in common interest.

This diagram that I conceptualized helped me to understand various touchpoints between different stakeholders in a ecosystem. It answered my questions like where and how can I eliminate a step? Why is one specific component a part of flow? If I add/subtract something, how will it affect the system as a whole?

User Persona Creation 🎨

I created the persona of a user with whom I conducted the affinity mapping and empathy mapping exercises.

Empathy Mapping 🤯

Empathy Map really helped me realize what the user is feeling, thinking, what is she looking for, her motivations and thus reduce the gap between her expectations and final product.

I used a pre-made template in Invision to make this activity a bit fun with the user. Ps: got to know interesting things here

Storyboarding 🎭

Scenarios where the app might be helpful. These are two but obviously many more different cases are possible.

Covid-19 cases are rising, situation is at its worst. Restrictions are imposed on opening of Library. People are confused between offline & online reading. Users are frustrated as they can’t visit libraries to lend books because the books they want are not available online.
A teacher wants to conduct reading and test sessions with book reading activities. He is searching for a service where community reading can be done sitting at a distance because children use phones too much and he wants to reduce that hours otherwise he could have given online books to read. He wants his students to read books in a cycle.

Experience Mapping 📍

To understand the user journey when he/she wants to read a book. What all steps are taken, what motivates them, touch-points and recommendations.

Competitors Analysis + Heuristic Evaluation ✔️

Competitive analysis helped me to understand what are the different services rendered by other companies trying to do something similar. This opened my eyes to various components that are an important part of the flow.

For testing usability of my competitors service, I used Jakob Nielsen’s 10 general principles for interaction design as metrics. They are called “heuristics” because they are broad rules of thumb and not specific usability guidelines. (I wanted to understand what are the UX and UI problems with other services so that I could plan and design something better)

Y: Yes; N: No

Basic Task Flow 📖

The basic flow of this app will be like any other app. The distinctive features will be visible according to the users subscription of : Basic/ Standard/ Premium advantages of the app. There will be difference in how many people can be added in a group to number of books available and extension of reading cycle as per subscription package.

A basic task flow to show the subscription cycle

Card Sorting 📌

A basic task flow was made to understand what all components are required in the flow and after having a fair idea an open card sorting exercise was done with the user to evaluate and design Information Architecture(IA).

The original card sorting was done on sticky notes and then I made a final draft in Invision

User Work Flow ✍️

Information Architecture 🔨

The goal was to segregate various features, pages and sections in a way that they are easily discoverable by users giving them the opportunity to learn and use the product with ease. This was paired with study of some of the best apps in the market and analyzing their IA to construct something that is easily navigable and would follow consistency and standards thus making it easily recognizable, reducing cognitive load. Taking into account the mental model of users is equally important in the process of designing the IA.

A mental model is an explanation of someone’s thought process about how something works in the real world. It is a representation of the surrounding world, the relationships between its various parts and a person’s intuitive perception about his or her own acts and their consequences.

Wireframing 👷‍♀️

I let my inner designer unleash and after a number of rough sketched iterations, I was able to decide upon the final wireframes with the help of the user. I consider testing my process with the users at each stage as vital because that really gives me a clear understanding of what they are expecting and how they apprehend my design ideas.

Sorry for the dark ones! Ps: Don’t mind my rough sketching and fast writing

User Interface (UI) Design 👩‍🎨

Website screens for Desktop. For more you can watch here- https://vimeo.com/534639022

User Testing 🧪️

The following steps were taken to ensure that I get the maximum inputs and honest feedbacks from the users.

Method

Step 1: A working prototype as detailed as possible to give the user a close to real experience of the app, was developed on Adobe XD, prototyped on Protopie.
Step 2: A scenario defining the circumstances under which the user will use the app, was created. They were told that use this app to scroll through pages as a user who wants to buy a book pack.
Step 3: A task was curated with the intention to test whether the users will be able to associate with the keywords used, presume the app flow correctly, etc.
Step 4: The scenario, the task details , a basic introduction to the app(without defining the process to perform the tasks) and the link to the prototype were sent to the user for testing.

Task Statement

Kindly click on the link provide and use this Prototype and answer few questions below :
( Login > Navigate through various pages > Sign out )
Note your experiences and fill in the survey and answer few questions and rate accordingly.

They were asked to be as honest as possible.

I got 12 beta testers aged between 10-50

(Kindly excuse for the images being unclear) I used goggle form to collect responses
Analysis- Ability to perform the task

Using think-aloud protocol

Due to pandemic the major chunk of testing was done online by floating form and asking to video call while using the prototype. Few users with whom I could meet physically, I asked them to use the prototype and some of the users suggestions were noted.

  1. I would say add little bit more details about the books on the homepage too
  2. Scrolling isn’t working(At some places scrolling was an issue. It was difficult to swipe left to right. So scrolling had to be made easy)
  3. Reviews of books and reviews posted or recommended by celebrities of intellect. Eg. Post the books recommend by naval ravikant, jordan b Peterson, bret Weinstein, bill gates, elon musk etc.
  4. When a user reaches a certain no of followers you can add batches and give them discount on books.(So a user suggested kind of gamification)
  5. Branding was less visible

Outcome/Inferences 🤔

  1. The exact time for each task could not be evaluated because of the lag cause by the prototype while browsing through screens
  2. The prototype didn’t had the feature of deselecting a genre (because the prototype was not fully functional)
  3. At some places scrolling was an issue. It was difficult to swipe left to right (I used the drag feature by mistake instead of fling in prototype and that caused issue because users had to push one screen in order to move to other)
  4. Users were unable to switch subscription as that was not included in the prototype but they wanted to see the features that they might get in the final version

Some of issues had to fixed in terms of both UX & UI for better results, Iteration for designers is a never ending process and for reasons should be because it is like I am regularly striving to make it better and philosophically speaking, I wake up daily to make an impact, build something, improving upon it and myself as a learner and a human. Well it’s life :)

It is not about building the perfect product maybe but the right product! 💯

SWOT Analysis 📝

Assessing the strengths, weaknesses, opportunities and threats that impact the user experience of a product.

It will help me to build on what works well, to address what’s lacking, to minimize risks, and to take the greatest possible advantage of chances for success.

My Learnings ✌️

Well to be honest, I learned so many new UX tools and came across many laws and principles that I wasn’t familiar with earlier. I am a UX Designer and I will speak about my experience here- It was a project where I tested my assumptions, was confused, read a lot, analyzed, got inspired, tried new things like interviewing. Overall it was a learning experience with useful insights that would help me design better solutions in future.

© Vibhuti Gupta | 2021

--

--

Vibhuti Gupta

Saw you trip over my design stories ;) Hi guys, I am Vibhuti (Product Designer@Rapido) https://www.linkedin.com/in/vibhutigupta2310/