NimbleNotes
An application through which students can search, buy and read notes in a cheaper way for their curriculum studies.
With time, internet has taken over every part of our life. Now, information and knowledge is also available in a much easy way. As a result, students from across the world have now adapted to various ways of finding and using study material.
Problem Domain
Even so technology has become a good medium for unlimited access to information, we often see college students struggling with finding good study material. As students, most of us have often felt the need to have good study resources available at a decent price. From teachers, friends and seniors, students try to find books and resources most useful to them. Also, when the semester ends, students want to get rid of the books that are not very useful to them.
So, I wanted to figure out
How can I help students in the whole process of searching, buying, reading and discarding books after they are no longer useful?
Users & Audience
I decided to focus on college students and their problems related to college curriculum books only (and not any other type of books).
Roles & Responsibilities
For this project, I worked as
-
UX Researcher
-
Market Researcher
-
Information Architect
-
UX Designer
-
And of course! UI Designer
My process
Emapthizing with the users: The Research
Secondary Research
I began by searching for articles, research papers and news about the usage of libraries and the reading habits of students in general. I found out these few thing from them:
​
-
Most of the tier-3 universities don't have a computerized system for libraries, making it difficult to search and find books.
-
Conditions of libraries in reputed colleges are a lot better than tier-3 category colleges. They have a yearly budget for libraries.
-
Number of public libraries as well as students using them is decreasing. Studies show that only 37% of the rural public libraries have more than 500 registered users followed by 24.8 % libraries having users only between 1-100 registered users.
-
Printed vs e-books? Research shows that more than 50% of students still prefer printed books rather than ebooks, the main reason being that they simply prefer print over digital.
Competitors' Analysis
To understand what current solutions are available in markets for books, I created a chart of the competitors in this sector, which provide students with both new and second hand books.
Quantitative Research: User Surveys
To find quantitative patterns about the reading habits of students, I reached out to my contacts and sent them a screener survey. I used Google Forms for the same.
These surveys not only helped me get quantitative information, but also in shortlisting candidates for user interviews. I contacted students who:
​
-
Have recently graduated or are still in college.
-
Have used both new as well as second hand books at some point.
-
Have read e-book at least once.
Qualitative Research: User Interviews
In order to understand the main pain points that my users feel when buying and reading books, I conducted user interviews. Through the interviews, I wanted to figure out:
-
Which type of books do students prefer(e.g. e-books, printed, new, second hand etc.)?
-
What might be the major reasons for that?
-
What problems do they face when reading all types of books?
-
Have they ever come across online book renting platforms?
Discoveries from my research
Affinity Map
To collect and keep a record of all the things that my users said, felt and did, I took notes from my user interviews, listed them on post-its, and created an affinity map out of it, by grouping similar concerns/privileges.
Main highlights from interviews:
User Personas
After I created an affinity map, I found out what my users said, felt and did. And so, I created empathy maps for the 2 types of users that I came across. Based out of those empathy maps, I created 2 personas.
Primary Persona
Secondary Persona
Outcomes: The "How Might We?"
Next, to break down the problems that my primary users face, I came up with the "How Might We" questions. These are basically the main problems Dev faces, broken down in a set of statement. It helped me to get a broad-level understanding of the pain points of my users. Because of a lot of differences between Dev and Naveera, I decided to focus on the pain points of Dev, because majority of my user interviews were users with similar pains as him, and also Dev is a bit explorative, who might be the most willing to try out any new solutions.
I came up with the problem statements or "How might we" based on Dev.
-
How might we help them Study easily and effectively?
-
How might we Reduce their efforts to find study material?
-
How might we help them Study in a cheaper way?
-
How might we Provide them books only for the required time?
Coming up with solutions: The Ideation phase
User Journey Map
To start getting ideas, I first created a user journey map for my primary persona based on my research, mapping out all the things he is currently doing, what issues he is facing and what emotions he is feeling. I fitted my broad-level HMWs in the journey map as a design opportunity so that I could get a clear understanding of the pain points at every step, and come up with good ideas.
Out of so many ideas, I found these ideas to be most relevant with Dev's Personality
-
Provide digital notes by teachers to students according to their university-in a mobile friendly way.
-
Share the content with other friends to save cost.
-
Subscription model: less days means less cost.
-
Easily search for study material
​
Even though I started with finding solutions related to books, my research led me to consider other alternates, like studying using notes.
​
User Stories
Next I created user stories, which helped me to decide on the features that my app will have, and also prioritize them to create a Minimum Viable Product.
A few of my user stories:
​
-
As a university student, I want to easily search for notes as per my university and course so that I can buy them.
-
As a student, I want to easily search for the notes related to a topic so that I can buy them.
-
As a user, I want to easily filter out results as per my degree and university so that the search gets easy.
-
As a student, I want to easily see the details about the notes so that I can decide on buying them.
-
As a student, I want to access a few pages first so that I can decide on whether I want to buy or not.
-
As a student, I want to buy for a limited time so that I easily get rid of it after my sem.
-
As a student who is low on budget, I want to share the notes easily with my friends so that I can save money.
-
As a student, I want to split the subscription amount when paying for multiple account access so that splitting becomes easy.
-
As a user, I want to easily register on the portal.
-
As a student, I want to read notes in a mobile friendly way, so that I can study easily and effectively.
Structure of the app: Information Architecture
After User stories, I created a basic information architecture based on the idea of what features my app will have. This helped me get a basic structure of pages. I also re-iterated it once I went through my user-flows.
.jpg)
Defining flow: User flows
I started with creating simple task flows for my user stories. Out of those, I created detailed user flows for the most important routes of my app.
.png)
User flow for signup/login
This helped me get an organised structure of pages, information and a proper hierarchy of my app.
Low-fidelity Prototypes and Guerilla testing
I started with creating low-fidelity sketches for my red routes, showing how my app should look like.
I also wanted to get a simple understanding of whether the app is usable or not, and so I conducted Guerilla Usability testing, to find out any major flaws in the app.
By testing, I got a good idea of the problems in my app at an early stage, a few of which were:
-
The notes button on the reading page does not give users indication about what it is for.
-
Users are unable to understand in which part of the page they are adding a note. They want to be able to add notes on a word/line and not on the whole page.
-
Users feel insecure and controlled when they split the billing amount with their friend, because they are not able to access notes until he/she does not complete their end of the payment.
Next Step: Creating Wireframes & Wireflows
Keeping in mind the results from my testing, I created wireframes, which showed the basic structure of the screens of my app My wireframes were medium-fidelity as I had still not chosen the color, typography & visual elements.
Visual Design & High-Fidelity Mockups
Now that I had the wireframes, I started working on deciding the Color scheme for my app. For Primary & Secodary colors, I decided to go with shades of blue, as they give a feeling of calm, comfort and trust. Then I created a basic logo which will represent my brand.
I chose the Split complementary shades as accent colors. I also chose indicator colors as well as a few shades of grey.
I chose to go with Nunito, a sans serif font for the app, because it gives a modern and fun feel, and also easily readable.
High Fidelity Mockups & Prototypes
I used Figma to create my High-Fidelity Designs for my red-routes.
Describe your image
Describe your image
Describe your image
Prototyping & Usability Testing
Next, I prototyped my screens so that I could conduct usability testing.
For this, I gave them a few tasks to complete, such as: “You are a student of B. E. Computer Science, currently in Sem 3 at Doon university. Search for the notes for your curriculum.”
I conducted 2 rounds, with a total of 10 users (5 for each round).
First Round
​
I conducted 1st round with 5 participants.
Issues found from first round of testing:
​
-
Content on the home screen does not clearly describe what app does.
-
Users were unable to understand what ‘Search notes by course’ means, a few of them mistook it as subject and also none of them used it to search.
-
Use of word ‘Invite’ on subscription page misleading, thought that it is about inviting friends to sign up on the app.
-
Two Users felt that cancellation policy is complicated to understand.
-
One of the users wanted to see who she sent an invite to for subscribed notes.
​
Out of these issues, I decided to not change a few minor issues (such as the 4th and 5th) and further test them to see if any other user faces same issue.
Second Round
​
I conducted 1st round with 5 participants.
Issues found from second round of testing:
​
-
Content on the home screen appears clickable. Reason, similar shadows with clickable elements.
-
Users got confused by the word annotation on the notes page, when trying to add extra notes.
-
When searching by dgeree and university, users tend to select universiy before degree, because they want to confirm whether their university's notes are available or not.
-
The word subscribe is not clear, and so, users added notes in cart instead of directly buying.
-
A few users were also confused by the number of days and accounts dropdown on the notes description page. So, I decided to set default value
-
One user suggested that renew and send access should be different types of buttons.
​
Final Designs
Due to time restrain, I decided to not go ahead with any more rounds of testing. Based on feedback from second round of testing, I made final changes to my prototypes.
Learning Outcomes
Working on this project helped a lot in learning about what UX Design is. I became more focused on user-centered design and started to think from a user’s perspective.
A few things I learned:
​
-
Fundamentals of user research and testing, I started with a broad problem area related to course-books, but my user research gave me multiple scopes to consider.
-
The various steps in UX process are all interlinked with one-another and the answers mostly lie in the connecting dots.
-
The whole process of working on defining a style guide and how to use elements like color and typography.